Flask-WTF的“PageDown”markdown编辑器的实现。
项目描述
Flask-PageDown
为Flask和Flask-WTF实现StackOverflow的“PageDown”markdown编辑器。
什么是PageDown?
PageDown 是Stack Overflow上使用的Markdown预览器,它也被用于Stack Overflow和Stack Exchange网络上的所有其他问答网站。
Flask-PageDown提供了一个PageDownField
类,它扩展了Flask-WTF
,并添加了一个专门的文本区域字段,该字段可以在您输入Markdown文本的同时实时渲染HTML预览。
安装
$ pip install flask-pagedown
示例
示例胜过千言万语。以下是如何定义一个简单的Flask-WTF表单,其中包含PageDown字段的示例
from flask_wtf import Form
from flask_pagedown.fields import PageDownField
from wtforms.fields import SubmitField
class PageDownFormExample(Form):
pagedown = PageDownField('Enter your markdown')
submit = SubmitField('Submit')
PageDownField
的工作方式与TextAreaField
完全相同(实际上它是它的子类)。视图函数中的处理也是一样的。例如
@app.route('/', methods = ['GET', 'POST'])
def index():
form = PageDownFormExample()
if form.validate_on_submit():
text = form.pagedown.data
# do something interesting with the Markdown text
return render_template('index.html', form = form)
在可以使用之前,需要在通常的方式下初始化扩展
from flask_pagedown import PageDown
app = Flask(__name__)
pagedown = PageDown(app)
最后,需要在页面的某个位置调用pagedown.include_pagedown()
以添加支持JavaScript代码
<html>
<head>
{{ pagedown.include_pagedown() }}
</head>
<body>
<form method="POST">
{{ form.hidden_tag() }}
{{ form.pagedown(rows=10) }}
{{ form.submit }}
</form>
</body>
</html>
JavaScript类是从CDN导入的,没有需要由应用程序提供服务的静态文件。如果请求是安全的,那么JavaScript文件将从https:// URL导入以匹配。
如果您希望使用自己的JavaScript源文件,可以直接在HTML页面中包含您的转换器和清理器文件,而不是调用pagedown.include_pagedown()
<html>
<head>
<script type="text/javascript" src="https://mycdn/path/to/converter.min.js"></script>
<script type="text/javascript" src="https://mycdn/path/to/sanitizer.min.js"></script>
</head>
<body>
<form method="POST">
{{ form.hidden_tag() }}
{{ form.pagedown(rows=10) }}
{{ form.submit }}
</form>
</body>
</html>
为了帮助添加特定的CSS样式,<textarea>
元素有类名flask-pagedown-input
,预览<div>
有类名flask-pagedown-preview
。
使用上述模板,预览区域由扩展程序直接位于输入文本区域下方创建。为了更好地控制,还可以在页面的不同部分渲染输入和预览区域。以下示例展示了如何在上面的输入区域渲染预览区域。
<html>
<head>
{{ pagedown.include_pagedown() }}
</head>
<body>
<form method="POST">
{{ form.pagedown(only_preview=True) }}
{{ form.pagedown(only_input=True, rows=10) }}
{{ form.submit }}
</form>
</body>
</html>
注意,在所有情况下,提交的文本都将为原始Markdown文本。渲染的HTML仅用于预览,如果您需要在服务器上渲染为HTML,则请使用服务器端Markdown渲染器,如Flask-Markdown。
另外,当前版本不包括Stack Overflow使用的工具栏。
资源
项目详情
Flask-PageDown-0.4.0.tar.gz的哈希值
算法 | 哈希摘要 | |
---|---|---|
SHA256 | 10f3836f9d9b82210169af499241b7510a352491bee7a305eca7c783f15292d0 |
|
MD5 | 53117998799b216b8fa9a4972812371a |
|
BLAKE2b-256 | bc17b35144e53a200308581d886e8f3d6f95ecfafe97a226b786b138088e73f3 |
Flask_PageDown-0.4.0-py3-none-any.whl的哈希值
算法 | 哈希摘要 | |
---|---|---|
SHA256 | aa6f938b5e809b6ef6889d28fef7096f20a0700de01082b0342764a5058225d2 |
|
MD5 | 3123f32e08d386260395dd138d9c4ac2 |
|
BLAKE2b-256 | c43a03e9948b3e1942e471b7ebfe3138c4e5b6f06419cc68e0000a158d97052c |