From 68af0d86c3a941e185b34926fdbc57c457466e28 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 31 Aug 2019 11:51:31 -0400
Subject: Improve popup position for vertical text

---
 ext/bg/js/options.js  |  3 +++
 ext/bg/js/settings.js |  6 ++++++
 ext/bg/settings.html  | 19 +++++++++++++++++++
 3 files changed, 28 insertions(+)

(limited to 'ext/bg')

diff --git a/ext/bg/js/options.js b/ext/bg/js/options.js
index 29d8a215..c4a7e681 100644
--- a/ext/bg/js/options.js
+++ b/ext/bg/js/options.js
@@ -199,6 +199,9 @@ function optionsSetDefaults(options) {
             popupHeight: 250,
             popupHorizontalOffset: 0,
             popupVerticalOffset: 10,
+            popupHorizontalOffset2: 10,
+            popupVerticalOffset2: 0,
+            popupVerticalTextPosition: 'before',
             showGuide: true,
             compactTags: false,
             compactGlossaries: false,
diff --git a/ext/bg/js/settings.js b/ext/bg/js/settings.js
index cdcdae77..83a1c2f6 100644
--- a/ext/bg/js/settings.js
+++ b/ext/bg/js/settings.js
@@ -32,10 +32,13 @@ async function formRead() {
     optionsNew.general.showAdvanced = $('#show-advanced-options').prop('checked');
     optionsNew.general.maxResults = parseInt($('#max-displayed-results').val(), 10);
     optionsNew.general.popupDisplayMode = $('#popup-display-mode').val();
+    optionsNew.general.popupVerticalTextPosition = $('#popup-vertical-text-position').val();
     optionsNew.general.popupWidth = parseInt($('#popup-width').val(), 10);
     optionsNew.general.popupHeight = parseInt($('#popup-height').val(), 10);
     optionsNew.general.popupHorizontalOffset = parseInt($('#popup-horizontal-offset').val(), 0);
     optionsNew.general.popupVerticalOffset = parseInt($('#popup-vertical-offset').val(), 10);
+    optionsNew.general.popupHorizontalOffset2 = parseInt($('#popup-horizontal-offset2').val(), 0);
+    optionsNew.general.popupVerticalOffset2 = parseInt($('#popup-vertical-offset2').val(), 10);
     optionsNew.general.customPopupCss = $('#custom-popup-css').val();
 
     optionsNew.scanning.middleMouse = $('#middle-mouse-button-scan').prop('checked');
@@ -168,10 +171,13 @@ async function onReady() {
     $('#show-advanced-options').prop('checked', options.general.showAdvanced);
     $('#max-displayed-results').val(options.general.maxResults);
     $('#popup-display-mode').val(options.general.popupDisplayMode);
+    $('#popup-vertical-text-position').val(options.general.popupVerticalTextPosition);
     $('#popup-width').val(options.general.popupWidth);
     $('#popup-height').val(options.general.popupHeight);
     $('#popup-horizontal-offset').val(options.general.popupHorizontalOffset);
     $('#popup-vertical-offset').val(options.general.popupVerticalOffset);
+    $('#popup-horizontal-offset2').val(options.general.popupHorizontalOffset2);
+    $('#popup-vertical-offset2').val(options.general.popupVerticalOffset2);
     $('#custom-popup-css').val(options.general.customPopupCss);
 
     $('#middle-mouse-button-scan').prop('checked', options.scanning.middleMouse);
diff --git a/ext/bg/settings.html b/ext/bg/settings.html
index 0704140e..c6090c91 100644
--- a/ext/bg/settings.html
+++ b/ext/bg/settings.html
@@ -107,6 +107,17 @@
                     </select>
                 </div>
 
+                <div class="form-group">
+                    <label for="popup-display-mode">Popup position for vertical text</label>
+                    <select class="form-control" id="popup-vertical-text-position">
+                        <option value="default">Same as for horizontal text</option>
+                        <option value="before">Before text reading direction</option>
+                        <option value="after">After text reading direction</option>
+                        <option value="left">Left of text</option>
+                        <option value="right">Right of text</option>
+                    </select>
+                </div>
+
                 <div class="form-group options-advanced">
                     <label for="audio-playback-volume">Audio playback volume (percent)</label>
                     <input type="number" min="0" max="100" id="audio-playback-volume" class="form-control">
@@ -133,6 +144,14 @@
                     </div>
                 </div>
 
+                <div class="form-group options-advanced">
+                    <label>Popup offset for vertical text (horizontal, vertical; in pixels)</label>
+                    <div class="row">
+                        <div class="col-xs-6"><input type="number" min="0" id="popup-horizontal-offset2" class="form-control"></div>
+                        <div class="col-xs-6"><input type="number" min="0" id="popup-vertical-offset2" class="form-control"></div>
+                    </div>
+                </div>
+
                 <div class="form-group options-advanced">
                     <label for="custom-popup-css">Custom popup CSS</label>
                     <div><textarea autocomplete="off" spellcheck="false" wrap="soft" id="custom-popup-css" class="form-control"></textarea></div>
-- 
cgit v1.2.3