Fix a couple of UI hiccups.

fixes #374
jobisoft · Aug 30, 2023 · 90655ab · 90655ab
1 parent e44dbb0
commit 90655ab
Show file tree

Hide file tree

Showing 7 changed files with 38 additions and 79 deletions.
diff --git a/chrome/content/modules/wzQuicktextGroup.jsm b/chrome/content/modules/wzQuicktextGroup.jsm
@@ -2,21 +2,20 @@ var EXPORTED_SYMBOLS = ["wzQuicktextGroup"];
 
 const kDebug        = true;
 
-function wzQuicktextGroup() {
-  this.mName = "";
-  this.mType = "";
-}
+class wzQuicktextGroup {
+  constructor() {
+    this.mName = "";
+    this.mType = "";
+  }
 
-wzQuicktextGroup.prototype = {
-  get name() { return this.mName; },
+  get name() { return this.mName; }
   set name(aName) { if (typeof aName != 'undefined') return this.mName = aName; }
-,
-  get type() { return this.mType; },
+
+  get type() { return this.mType; }
   set type(aType) { if (typeof aType != 'undefined') return this.mType = aType; }
-,
-  clone: function()
-  {
-    var newGroup = new wzQuicktextGroup();
+
+  clone() {
+    let newGroup = new wzQuicktextGroup();
     newGroup.name = this.mName;
     newGroup.type = this.mType;
 

diff --git a/chrome/content/quicktext.js b/chrome/content/quicktext.js
@@ -119,27 +119,14 @@ var quicktext = {
     this.mKeywords = {};
 
     // Update the toolbar
-    var toolbar = document.getElementById("quicktext-toolbar");
+    var toolbar = document.getElementById("quicktext-templates-toolbar");
     if (toolbar != null)
     {
 
-      //clear toolbar and store current "variables" and "other" menus (the two rightmost ones)
-      var toolbarbuttonVar = null;
-      var toolbarbuttonOther = null;
+      // Clear template toolbar.
       var length = toolbar.children.length;
-      for(var i = length-1; i >= 0; i--)
-      {
-        var element = toolbar.children[i];
-        switch(element.getAttribute("id"))
-        {
-          case 'quicktext-variables':
-            toolbarbuttonVar = element.cloneNode(true);
-            break;
-          case 'quicktext-other':
-            toolbarbuttonOther = element.cloneNode(true);
-            break;
-        }
-        toolbar.removeChild(element);
+      for(var i = length-1; i >= 0; i--) {
+        toolbar.removeChild(toolbar.children[i]);
       }
 
       //rebuild template groups (the leftmost entries)
@@ -211,16 +198,8 @@ var quicktext = {
         }
       }
 
-      //add a flex spacer to push the VAR and OTHER elements to the right 
-      var spacer = document.createXULElement("spacer");
-      spacer.setAttribute("flex", "1");
-      toolbar.appendChild(spacer);
-      toolbar.appendChild(toolbarbuttonVar);
-      toolbar.appendChild(toolbarbuttonOther);
-
-
-      // Update the toolbar inside the toolbarpalette and the drop-down menu - if used
-      let optionalUI = ["button-quicktext", "quicktext-popup"];
+      // Update the template menu inside the context menu - if used.
+      let optionalUI = ["quicktext-popup"];
       for (let a=0; a < optionalUI.length; a++) { 
         if (document.getElementById(optionalUI[a] + "-menupopup")) {
           let rootElement = document.getElementById(optionalUI[a] + "-menupopup");

diff --git a/chrome/content/scripts/messengercompose.js b/chrome/content/scripts/messengercompose.js
@@ -10,23 +10,28 @@ function onLoad(activatedWhileWindowOpen) {
 
   WL.injectCSS("resource://quicktext/skin/quicktext.css");
   WL.injectElements(`
-	<popup id="msgComposeContext">
-		<menuseparator id="quicktext-popupsep" hidden="true" insertafter="spellCheckSuggestionsSeparator"/>
-		<menu id="quicktext-popup" label="&quicktext.label;" hidden="true" insertafter="spellCheckSuggestionsSeparator"  class="menu-iconic quicktext-icon menuitem-iconic" >
-		  <menupopup id="quicktext-popup-menupopup"/>
-		</menu>
-	</popup>
+  <popup id="msgComposeContext">
+    <menuseparator id="quicktext-popupsep" hidden="true" insertafter="spellCheckSuggestionsSeparator" />
+    <menu id="quicktext-popup" label="&quicktext.label;" hidden="true" insertafter="spellCheckSuggestionsSeparator"
+      class="menu-iconic quicktext-icon menuitem-iconic">
+      <menupopup id="quicktext-popup-menupopup" />
+    </menu>
+  </popup>
 
   <menupopup id="menu_View_Popup">
-    <menuitem id="quicktext-view" type="checkbox" label="&quicktext.label;" oncommand="quicktext.toogleToolbar();"/>
+    <menuitem id="quicktext-view" type="checkbox" label="&quicktext.label;" oncommand="quicktext.toogleToolbar();" />
   </menupopup>
 
   <menupopup id="taskPopup">
-    <menuitem id="quicktext-settings" label="&quicktext.label;" oncommand="quicktext.openSettings();" insertafter="tasksMenuAddressBook" class="menu-iconic quicktext-icon menuitem-iconic" />
+    <menuitem id="quicktext-settings" label="&quicktext.label;" oncommand="quicktext.openSettings();"
+      insertafter="tasksMenuAddressBook" class="menu-iconic quicktext-icon menuitem-iconic" />
     <menuseparator insertafter="tasksMenuAddressBook" />
   </menupopup>
 
-  <toolbar id="quicktext-toolbar" insertbefore="messageEditor">
+  <hbox id="quicktext-toolbar" insertbefore="messageEditor">
+    <html:div id="quicktext-templates-toolbar" />
+    <spacer flex="1" />
+    <hbox>
       <button type="menu" id="quicktext-variables" label="&quicktext.variables.label;" tabindex="-1">
         <menupopup>
           <menu label="&quicktext.to.label;">
@@ -39,7 +44,8 @@ function onLoad(activatedWhileWindowOpen) {
               <menuitem label="&quicktext.email.label;" oncommand="quicktext.insertVariable('TO=email');" />
               <menuitem label="&quicktext.worknumber.label;" oncommand="quicktext.insertVariable('TO=workphone');" />
               <menuitem label="&quicktext.faxnumber.label;" oncommand="quicktext.insertVariable('TO=faxnumber');" />
-              <menuitem label="&quicktext.cellularnumber.label;" oncommand="quicktext.insertVariable('TO=cellularnumber');" />
+              <menuitem label="&quicktext.cellularnumber.label;"
+                oncommand="quicktext.insertVariable('TO=cellularnumber');" />
               <menuitem label="&quicktext.jobtitle.label;" oncommand="quicktext.insertVariable('TO=jobtitle');" />
               <menuitem label="&quicktext.custom1.label;" oncommand="quicktext.insertVariable('TO=custom1');" />
               <menuitem label="&quicktext.custom2.label;" oncommand="quicktext.insertVariable('TO=custom2');" />
@@ -57,7 +63,8 @@ function onLoad(activatedWhileWindowOpen) {
               <menuitem label="&quicktext.email.label;" oncommand="quicktext.insertVariable('FROM=email');" />
               <menuitem label="&quicktext.worknumber.label;" oncommand="quicktext.insertVariable('FROM=workphone');" />
               <menuitem label="&quicktext.faxnumber.label;" oncommand="quicktext.insertVariable('FROM=faxnumber');" />
-              <menuitem label="&quicktext.cellularnumber.label;" oncommand="quicktext.insertVariable('FROM=cellularnumber');" />
+              <menuitem label="&quicktext.cellularnumber.label;"
+                oncommand="quicktext.insertVariable('FROM=cellularnumber');" />
               <menuitem label="&quicktext.jobtitle.label;" oncommand="quicktext.insertVariable('FROM=jobtitle');" />
               <menuitem label="&quicktext.custom1.label;" oncommand="quicktext.insertVariable('FROM=custom1');" />
               <menuitem label="&quicktext.custom2.label;" oncommand="quicktext.insertVariable('FROM=custom2');" />
@@ -96,7 +103,8 @@ function onLoad(activatedWhileWindowOpen) {
           <menuitem label="&quicktext.insertTextFromFileAsHTML.label;" oncommand="quicktext.insertContentFromFile(1);" />
         </menupopup>
       </button>
-    </toolbar>`,
+    </hbox>
+  </hbox>`,
   ["chrome://quicktext/locale/quicktext.dtd"]);
 
   window.quicktext.load();

diff --git a/chrome/skin/button.large.png b/chrome/skin/button.large.png
diff --git a/chrome/skin/button.small.png b/chrome/skin/button.small.png
diff --git a/chrome/skin/logo.png b/chrome/skin/logo.png
diff --git a/chrome/skin/quicktext.css b/chrome/skin/quicktext.css
@@ -1,32 +1,5 @@
-#button-quicktext {
-  list-style-image: url("resource://quicktext/skin/button.large.png");
-  -moz-image-region: rect(0px 24px 24px 0px);
-}
-
-#button-quicktext:hover {
-  -moz-image-region: rect(24px 24px 48px 0px);
-}
-
-#button-quicktext[disabled] {
-  -moz-image-region: rect(48px 24px 72px 0px);
-}
-
-toolbar[iconsize="small"] #button-quicktext {
-  list-style-image: url("resource://quicktext/skin/button.small.png");
-  -moz-image-region: rect(0px 16px 16px 0px);
-}
-
-toolbar[iconsize="small"] #button-quicktext:hover {
-  -moz-image-region: rect(16px 16px 32px 0px);
-}
-
-toolbar[iconsize="small"] #button-quicktext[disabled] {
-  -moz-image-region: rect(32px 16px 48px 0px);
-}
-
 .quicktext-icon {
-  list-style-image: url("resource://quicktext/skin/button.small.png");
-  -moz-image-region: rect(16px 16px 32px 0px);
+  list-style-image: url("resource://quicktext/skin/icon16.png");
 }
 
 dialog[OS=WINNT] legend.insideTab {