From: Michael Tremer <michael.tremer@ipfire.org>
Date: Tue, 27 Aug 2019 13:35:16 +0000 (+0100)
Subject: wiki: Add keyboard shortcuts to edit text
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=eea47e20cea75f7d577709afc7ebf9761c87342c;p=ipfire.org.git

wiki: Add keyboard shortcuts to edit text

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>
---

diff --git a/src/static/js/editor.js b/src/static/js/editor.js
index 39fac6b2..6311f870 100644
--- a/src/static/js/editor.js
+++ b/src/static/js/editor.js
@@ -19,6 +19,11 @@ class Editor {
 
         // Remember any selected text
         this.textarea.on("select keyup click", function(e) {
+            // Ignore any keyboard shortcuts
+            if (e.ctrlKey)
+                return;
+
+            // Save selected text
             editor.selection = {
                 start : this.selectionStart,
                 end   : this.selectionEnd,
@@ -29,6 +34,30 @@ class Editor {
             console.debug("Something got selected:");
             console.debug(editor.selection);
         })
+
+        // Bind keyboard shortcuts
+        this.textarea.on("keyup", function(e) {
+            // If Ctrl wasn't pressed this isn't for us
+            if (!e.ctrlKey)
+                return;
+
+            switch (e.which) {
+                // B - Bold
+                case 66:
+                    editor.bold();
+                    break;
+
+                // I - Italic
+                case 73:
+                    editor.italic();
+                    break;
+
+                // H - Headline
+                case 72:
+                    editor.headline();
+                    break;
+            }
+        });
     }
 
     bindKeys() {
diff --git a/src/templates/wiki/edit.html b/src/templates/wiki/edit.html
index 3e8cf270..16382515 100644
--- a/src/templates/wiki/edit.html
+++ b/src/templates/wiki/edit.html
@@ -23,27 +23,33 @@
 				<div class="form-group editor">
 					<div class="btn-toolbar mb-3" role="toolbar">
 						<div class="btn-group btn-group-sm mr-2" role="group">
-							<button type="button" class="btn btn-secondary" id="bold">
+							<button type="button" class="btn btn-secondary"
+									id="bold" title="{{ _("Bold") }} [{{ _("Ctrl") }}-B]">
 								<i class="fas fa-bold"></i>
 							</button>
-							<button type="button" class="btn btn-secondary" id="italic">
+							<button type="button" class="btn btn-secondary"
+									id="italic" title="{{ _("Italic") }} [{{ _("Ctrl") }}-I]">
 								<i class="fas fa-italic"></i>
 							</button>
 						</div>
 
 						<div class="btn-group btn-group-sm mr-2" role="group">
-							<button type="button" class="btn btn-secondary" id="headline-up">
+							<button type="button" class="btn btn-secondary"
+									id="headline-up" title="{{ _("Headline one level up") }}">
 								<i class="fas fa-chevron-left"></i>
 							</button>
-							<button type="button" class="btn btn-secondary" id="headline">
+							<button type="button" class="btn btn-secondary"
+									id="headline" title="{{ _("Headline") }} [{{ _("Ctrl") }}-H]">
 								<i class="fas fa-heading"></i>
 							</button>
-							<button type="button" class="btn btn-secondary" id="headline-down">
+							<button type="button" class="btn btn-secondary"
+									id="headline-down" title="{{ _("Headline one level down") }}">
 								<i class="fas fa-chevron-right"></i>
 							</button>
 						</div>
 
-						<a class="btn btn-sm btn-secondary" href="{{ path }}/_files" target="_blank">
+						<a class="btn btn-sm btn-secondary" href="{{ path }}/_files"
+								target="_blank" title="{{ _("Files") }}">
 							<i class="fas fa-images"></i>
 						</a>
 					</div>