博客编辑及发布页改造，博客模型增加title，使用editor.md代替Markdown和Flask-PageDown

app/main/forms.py

@@ -18,12 +18,14 @@ class NameForm(FlaskForm):
     name = StringField('What is your name?', validators=[DataRequired()])
     submit = SubmitField('Submit')
 
+
 class EditProfileForm(FlaskForm):
     name = StringField('Real name', validators=[Length(0, 64)])
     location = StringField('Location', validators=[Length(0, 64)])
     about_me = TextAreaField('About me')
     submit = SubmitField('Submit')
 
+
 class EditProfileAdminForm(FlaskForm):
     username = StringField('Username', validators=[
         DataRequired(), Length(1, 64),
@@ -53,9 +55,12 @@ class EditProfileAdminForm(FlaskForm):
                 User.query.filter_by(username=field.data).first():
             raise ValidationError('Username already in use.')
 
+
 class PostForm(FlaskForm):
-    body = PageDownField("What's on your mind?", validators=[input_required()])
-    submit = SubmitField('Submit')
+    title = StringField("标题")
+    body = TextAreaField("What's on your mind?", validators=[input_required()])
+    submit = SubmitField('发布博客')
+
 
 class CommentForm(FlaskForm):
     body = StringField('', validators=[DataRequired()])

app/main/views.py

@@ -132,6 +132,19 @@ def post(id):
     return render_template('post.html', posts=[post], form=form,
                            comments=comments, pagination=pagination)
 
+@main.route('/add/post', methods=['GET', 'POST'])
+@login_required
+def add_post():
+    form = PostForm()
+    if current_user.can(Permission.WRITE) and form.validate_on_submit():
+        post = Post(body=form.body.data,
+                    author=current_user._get_current_object(),
+                    title=form.body.data.split('\n')[0].replace("# ", ""))
+        db.session.add(post)
+        db.session.commit()
+        flash('发布成功')
+        return redirect(url_for('.index'))
+    return render_template('add_post.html', form=form)
 
 @main.route('/edit/<int:id>', methods=['GET', 'POST'])
 @login_required
@@ -143,6 +156,7 @@ def edit(id):
     form = PostForm()
     if form.validate_on_submit():
         post.body = form.body.data
+        post.title = form.body.data.split('\n')[0].replace("# ", "")
         db.session.add(post)
         db.session.commit()
         flash('The post has been updated.')

app/models.py

@@ -90,6 +90,7 @@ class Role(db.Model):
 class Post(db.Model):
     __tablename__ = 'posts'
     id = db.Column(db.Integer, primary_key=True)
+    title = db.Column(db.String)
     body = db.Column(db.Text)
     body_html = db.Column(db.Text)
     timestamp = db.Column(db.DateTime, index=True, default=datetime.utcnow)
@@ -108,6 +109,7 @@ class Post(db.Model):
     def to_json(self):
         json_post = {
             'url': url_for('api.get_post', id=self.id),
+            'title': self.title,
             'body': self.body,
             'body_html': self.body_html,
             'timestamp': self.timestamp,

app/templates/_posts.html

@@ -2,22 +2,23 @@
     {% for post in posts %}
     <li class="post">
         <div class="profile-thumbnail">
-            <a href="{{ url_for('.user', username=post.author.username) }}">
-                {{ post.author.username }}
+            {% if current_user == post.author %}
+            <a href="{{ url_for('.edit', id=post.id) }}">
+                {{ post.title }}
             </a>
+            {% else %}
+                {{ post.title }}
+            {% endif %}
         </div>
-        <div class="post-date">{{ moment(post.timestamp).fromNow() }}</div>
         <div class="post-author">
             <a href="{{ url_for('.user', username=post.author.username) }}">
                 {{ post.author.username }}
             </a>
         </div>
+        <div class="post-date">{{ moment(post.timestamp).fromNow() }}</div>
+
         <div class="post-body">
-            {% if post.body_html %}
-            {{ post.body_html | safe }}
-            {% else %}
             {{ post.body }}
-            {% endif %}
 
         </div>
         <div class="post-footer">

app/templates/add_post.html

+{% extends "base.html" %}
+{% import "bootstrap/wtf.html" as wtf %}
+
+{% block title %}Add Post{% endblock %}
+
+{% block page_content %}
+<div>
+    <form method="post">
+        {{ form.hidden_tag() }}
+     <div id="test-editormd">
+        {{ form.body }}
+     </div>
+        {{ form.submit(id="submit", class="btn btn-lg btn-primary btn-block") }}
+    </form>
+
+</div>
+{% endblock %}
+
+{% block scripts %}
+{{ super() }}
+{{ pagedown.include_pagedown() }}
+{% endblock %}

app/templates/base.html

@@ -7,6 +7,7 @@
 <link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}" type="image/x-icon">
 <link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}" type="image/x-icon">
 <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='styles.css') }}">
+<link rel="stylesheet" href="{{ url_for('static',filename='editormd/css/editormd.css') }}"/>
 {% endblock %}
 
 {% block navbar %}
@@ -67,5 +68,24 @@
 {% block scripts %}
 {{ super() }}
 {{ moment.include_moment() }}
+<script src="{{ url_for('static',filename='js/jquery.min.js') }}"></script>
+<script src="{{ url_for('static',filename='editormd/editormd.min.js') }}"></script>
+<script type="text/javascript">
+    var testEditor;
+
+    $(function () {
+        testEditor = editormd("test-editormd", {
+            width: "90%",
+            height: 640,
+            syncScrolling: "single",
+            path: "{{ url_for('static',filename='editormd/lib/') }}",
+            // 上传图片
+            imageUpload : true,
+            imageFormats : [ "jpg", "jpeg", "gif", "png", "bmp", "webp" ],
+            // 上传图片时指定调用后台的视图函数
+            // homepage是蓝图 uploads是访问url
+        });
+    });
+</script>
 {% endblock %}
 

app/templates/edit_post.html

 {% extends "base.html" %}
 {% import "bootstrap/wtf.html" as wtf %}
 
-{% block title %}Flasky - Edit Post{% endblock %}
+{% block title %}Edit Post{% endblock %}
 
 {% block page_content %}
-<div class="page-header">
-    <h1>Edit Post</h1>
-</div>
 <div>
-    {{ wtf.quick_form(form) }}
+    <form method="post">
+        {{ form.hidden_tag() }}
+     <div id="test-editormd">
+        {{ form.body }}
+     </div>
+        {{ form.submit(id="submit", class="btn btn-lg btn-primary btn-block") }}
+    </form>
+
 </div>
 {% endblock %}
 

app/templates/index.html

@@ -18,12 +18,9 @@
     {% else %}
     <p>Happy to see you again!</p>
     {% endif %}
-</div>
-<div>
     {% if current_user.can(Permission.WRITE) %}
-    {{ wtf.quick_form(form) }}
+    <button type="button" class="btn btn-default"><a href="{{ url_for('main.add_post') }}">添加博客</a></button>
     {% endif %}
-
 </div>
 {% include '_posts.html' %}
 <div class="pagination">