change (preview panel → div)

lib/views/layout-growi/widget/comments.html

@@ -20,6 +20,34 @@
 
     {% if page and not page.isDeleted() %}
     <div id="page-comment-write"></div>
+    {# transplanted to PageComments React component -- 2018.05.22 Yuki Takei
+    <form class="form page-comment-form" id="page-comment-form" onsubmit="return false;">
+      <div class="comment-form">
+        <div class="comment-form-user">
+            <img src="{{ user|picture }}" class="picture img-circle" width="25" alt="{{ user.name }}" title="{{ user.name }}" />
+        </div>
+        <div class="comment-form-main">
+          <div class="comment-write" id="comment-write">
+            <textarea class="comment-form-comment form-control" id="comment-form-comment" name="commentForm[comment]"
+                required placeholder="Write comments here..." {% if not user %}disabled{% endif %}></textarea>
+          </div>
+          <div class="comment-submit">
+            <input type="hidden" name="_csrf" value="{{ csrf() }}">
+            <input type="hidden" name="commentForm[page_id]" value="{{ page._id.toString() }}">
+            <input type="hidden" name="commentForm[revision_id]" value="{{ revision._id.toString() }}">
+            <div class="pull-right">
+              <span class="text-danger" id="comment-form-message"></span>
+              <button type="submit" id="comment-form-button" class="fcbtn btn btn-sm btn-outline btn-rounded btn-primary btn-1b" {% if not user %}disabled{% endif %}>
+                Comment
+              </button>
+            </div>
+            <div class="clearfix"></div>
+          </div>
+        </div>
+      </div>
+    </form>
+    <div id="page-comment-form-behavior"></div>
+    #}
     {% endif %}
 
   </div>

resource/js/components/PageComment/CommentForm.js

@@ -79,15 +79,13 @@ export default class CommentForm extends React.Component {
               <textarea className="comment-form-comment form-control" id="comment-form-comment" name="comment" required placeholder="Write comments here..." value={this.state.comment} onChange={this.updateState} >
               </textarea>
               <div className="form-check">
-              {/* <input type="checkbox" className="form-check-input" id="checkbox-markdown" checked={this.state.isMarkdown} value="1" onChange={this.updateState} />
-              <label className="form-check-label" htmlFor="checkbox-markdown">Markdown</label> */}
               <input type="checkbox" id="comment-form-is-markdown" name="isMarkdown" checked={this.state.isMarkdown} value="1" onChange={this.updateState} /> Markdown<br />
               </div>
           </Tab>
               <Tab eventKey={2} title="Prevrew">
-                <Panel className="comment-form-preview">
-                  Preview
-                </Panel>
+               <div className="comment-form-prevew">
+               preview
+               </div>
               </Tab>
             </Tabs>
             </div>