add preview support for wiki editor when disable simpleMDE (#14757)

Signed-off-by: a1012112796 <1012112796@qq.com>

diff --git a/templates/repo/wiki/new.tmpl b/templates/repo/wiki/new.tmpl
index 06450a6ec49747beef95996dc4db0fcd4a8a3ae7..6de6ef9a201a866e4696613d9df874edb0633d1f 100644 (file)
--- a/templates/repo/wiki/new.tmpl
+++ b/templates/repo/wiki/new.tmpl
@@ -16,12 +16,14 @@
                        <div class="field {{if .Err_Title}}error{{end}}">
                                <input name="title" value="{{.title}}" autofocus required>
                        </div>
-                       <div class="ui top attached tabular menu previewtabs">
+                       <div class="ui top attached tabular menu previewtabs" data-write="write" data-preview="preview">
                                <a class="active item" data-tab="write">{{.i18n.Tr "write"}}</a>
-                               <a class="item" data-tab="preview">{{.i18n.Tr "preview"}}</a>
+                               <a class="item" data-tab="preview" data-url="{{$.Repository.APIURL}}/markdown" data-context="{{$.RepoLink}}">{{$.i18n.Tr "preview"}}</a>
                        </div>
-                       <div class="field">
-                               <textarea class="js-quick-submit" id="edit_area" name="content" data-id="wiki-{{.title}}" data-url="{{.Repository.APIURL}}/markdown" data-context="{{.RepoLink}}" required>{{if .PageIsWikiEdit}}{{.content}}{{else}}{{.i18n.Tr "repo.wiki.welcome"}}{{end}}</textarea>
+                       <div class="field content" data-loading="{{.i18n.Tr "loading"}}">
+                               <div class="ui bottom active tab" data-tab="write">
+                                       <textarea class="js-quick-submit" id="edit_area" name="content" data-id="wiki-{{.title}}" data-url="{{.Repository.APIURL}}/markdown" data-context="{{.RepoLink}}" required>{{if .PageIsWikiEdit}}{{.content}}{{else}}{{.i18n.Tr "repo.wiki.welcome"}}{{end}}</textarea>
+                               </div>
                        </div>
                        <div class="field">
                                <input name="message" placeholder="{{.i18n.Tr "repo.wiki.default_commit_message"}}">

diff --git a/web_src/js/index.js b/web_src/js/index.js
index 30af5dea15c22dc284532a994ff0d782d9fc8a05..7df170b930c52762201808e5d18efbcd5644831c 100644 (file)
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -1414,6 +1414,7 @@ function initWikiForm() {
   const $editArea = $('.repository.wiki textarea#edit_area');
   let sideBySideChanges = 0;
   let sideBySideTimeout = null;
+  let hasSimpleMDE = true;
   if ($editArea.length > 0) {
     const simplemde = new SimpleMDE({
       autoDownloadFontAwesome: false,
@@ -1510,6 +1511,12 @@ function initWikiForm() {
           name: 'revert-to-textarea',
           action(e) {
             e.toTextArea();
+            hasSimpleMDE = false;
+            const $form = $('.repository.wiki.new .ui.form');
+            const $root = $form.find('.field.content');
+            const loading = $root.data('loading');
+            $root.append(`<div class="ui bottom tab markdown" data-tab="preview">${loading}</div>`);
+            initCommentPreviewTab($form);
           },
           className: 'fa fa-file',
           title: 'Revert to simple textarea',
@@ -1524,15 +1531,26 @@ function initWikiForm() {
       const $toolbar = $('.editor-toolbar');
       const $bPreview = $('.editor-toolbar button.preview');
       const $bSideBySide = $('.editor-toolbar a.fa-columns');
-      $bEdit.on('click', () => {
+      $bEdit.on('click', (e) => {
+        if (!hasSimpleMDE) {
+          return false;
+        }
+        e.stopImmediatePropagation();
         if ($toolbar.hasClass('disabled-for-preview')) {
           $bPreview.trigger('click');
         }
+
+        return false;
       });
-      $bPrev.on('click', () => {
+      $bPrev.on('click', (e) => {
+        if (!hasSimpleMDE) {
+          return false;
+        }
+        e.stopImmediatePropagation();
         if (!$toolbar.hasClass('disabled-for-preview')) {
           $bPreview.trigger('click');
         }
+        return false;
       });
       $bPreview.on('click', () => {
         setTimeout(() => {
@@ -1552,6 +1570,8 @@ function initWikiForm() {
             }
           }
         }, 0);
+
+        return false;
       });
       $bSideBySide.on('click', () => {
         sideBySideChanges = 10;