wiki - add 'write' 'preview' buttons to wiki edit like in issues (#7241)

* Add add 'write' 'preview' buttons to wiki edit like in issues

affects #6975

Signed-off-by: Michael Gnehr <michael@gnehr.de>

* update dark theme

Signed-off-by: Michael Gnehr <michael@gnehr.de>

* fix css lint warnings - missing spaces

Signed-off-by: Michael Gnehr <michael@gnehr.de>

* hide preview button on no fullscreen toolbar

Signed-off-by: Michael Gnehr <michael@gnehr.de>

1 files changed, 40 insertions, 0 deletions

diff --git a/web_src/js/index.js b/web_src/js/index.js
index 8ca46832d5..704647d9c4 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -1232,6 +1232,46 @@ function initWikiForm() {
         'clean-block', 'preview', 'fullscreen', 'side-by-side']
     });
     $(simplemde.codemirror.getInputField()).addClass('js-quick-submit');
+
+    setTimeout(() => {
+      const $bEdit = $('.repository.wiki.new .previewtabs a[data-tab="write"]');
+      const $bPrev = $('.repository.wiki.new .previewtabs a[data-tab="preview"]');
+      const $toolbar = $('.editor-toolbar');
+      const $bPreview = $('.editor-toolbar a.fa-eye');
+      const $bSideBySide = $('.editor-toolbar a.fa-columns');
+      $bEdit.on('click', () => {
+        if ($toolbar.hasClass('disabled-for-preview')) {
+          $bPreview.click();
+        }
+      });
+      $bPrev.on('click', () => {
+        if (!$toolbar.hasClass('disabled-for-preview')) {
+          $bPreview.click();
+        }
+      });
+      $bPreview.on('click', () => {
+        setTimeout(() => {
+          if ($toolbar.hasClass('disabled-for-preview')) {
+            if ($bEdit.hasClass('active')) {
+              $bEdit.removeClass('active');
+            }
+            if (!$bPrev.hasClass('active')) {
+              $bPrev.addClass('active');
+            }
+          } else {
+            if (!$bEdit.hasClass('active')) {
+              $bEdit.addClass('active');
+            }
+            if ($bPrev.hasClass('active')) {
+              $bPrev.removeClass('active');
+            }
+          }
+        }, 0);
+      });
+      $bSideBySide.on('click', () => {
+        sideBySideChanges = 10;
+      });
+    }, 0);
   }
 }