Bug 1561096 - Adapt Priority and Progress sub-menus to the new appmenu. r=mkmelin
authorPaul Morris <paul@paulwmorris.com>
Tue, 02 Jul 2019 00:05:51 +0200
changeset 36011 9d7a0c93a3b1aaf72df2acabe83215fcf82fe0ab
parent 36010 099f40c736f06cbc1975c5be79a62f53f9356418
child 36012 d530d815c2968fdd3003569226a3aaae5916e9c0
push id392
push userclokep@gmail.com
push dateMon, 02 Sep 2019 20:17:19 +0000
reviewersmkmelin
bugs1561096
Bug 1561096 - Adapt Priority and Progress sub-menus to the new appmenu. r=mkmelin
calendar/base/content/calendar-chrome-startup.js
calendar/base/content/calendar-menus.js
calendar/lightning/content/lightning-menus.xul
--- a/calendar/base/content/calendar-chrome-startup.js
+++ b/calendar/base/content/calendar-chrome-startup.js
@@ -180,16 +180,28 @@ function setUpCalendarAppMenuButtons() {
 }
 
 /**
  * Event listener used to refresh the "Events and Tasks" menu/view in the appmenu.
  */
 function refreshEventsAndTasksMenu(event) {
     changeMenuForTask(event);
     setupDeleteMenuitem("appmenu_ltnDeleteSelectedCalendar");
+
+    // Refresh the "disabled" property of the Progress and Priority menu items. Needed because if
+    // the menu items (toolbarbuttons) are given a "command" or "observes" attribute that is set to
+    // their respective commands, then their "oncommand" attribute is automatically overwritten
+    // (because the commands have an oncommand attribute).  And then the sub-menus will not open.
+    setBooleanAttribute("appmenu_ltnTaskActionsPriorityMenuitem",
+        "disabled",
+        document.getElementById("calendar_general-priority_command").hasAttribute("disabled"));
+
+    setBooleanAttribute("appmenu_ltnTaskActionsProgressMenuitem",
+        "disabled",
+        document.getElementById("calendar_general-progress_command").hasAttribute("disabled"));
 }
 
 /**
  * Set up calendar menu items that are in the appmenu. (Needed because there is no "onpopupshowing"
  * event for appmenu menus/views.)
  */
 function setUpCalendarAppMenuItems() {
     // Refresh the "Events and Tasks" menu when it is shown.
--- a/calendar/base/content/calendar-menus.js
+++ b/calendar/base/content/calendar-menus.js
@@ -55,18 +55,19 @@
             const command = document.getElementById(commandName);
             if (command) {
                 command.setAttribute("checked", "true");
             }
         }
     };
 
     /**
-     * A menu for changing the "progress" (percent complete) status for a task or tasks. It
+     * A menupopup for changing the "progress" (percent complete) status for a task or tasks. It
      * indicates the current status by displaying a checkmark next to the menu item for that status.
+     *
      * @extends MozElements.MozMenuPopup
      */
     class CalendarTaskProgressMenupopup extends MozElements.MozMenuPopup {
         connectedCallback() {
             if (this.delayConnectedCallback() || this.hasConnected) {
                 return;
             }
             // this.hasConnected is set to true in super.connectedCallback
@@ -112,18 +113,19 @@
                 updateMenuItemsState.bind(null, scrollbox, "percentComplete"), true);
         }
     }
 
     customElements.define("calendar-task-progress-menupopup",
         CalendarTaskProgressMenupopup, { "extends": "menupopup" });
 
     /**
-     * A menu for changing the "priority" status for a task or tasks. It indicates the current
+     * A menupopup for changing the "priority" status for a task or tasks. It indicates the current
      * status by displaying a checkmark next to the menu item for that status.
+     *
      * @extends MozElements.MozMenuPopup
      */
     class CalendarTaskPriorityMenupopup extends MozElements.MozMenuPopup {
         connectedCallback() {
             if (this.delayConnectedCallback() || this.hasConnected) {
                 return;
             }
             // this.hasConnected is set to true in super.connectedCallback
@@ -161,9 +163,125 @@
 
             this.addEventListener("popupshowing",
                 updateMenuItemsState.bind(null, scrollbox, "priority"), true);
         }
     }
 
     customElements.define("calendar-task-priority-menupopup",
         CalendarTaskPriorityMenupopup, { "extends": "menupopup" });
+
+    /**
+     * A panelview for changing the "progress" (percent complete) status for a task or tasks. It
+     * indicates the current status by displaying a checkmark next to the menu item for that status.
+     * For use in the appmenu.
+     *
+     * @extends MozXULElement
+     */
+    class CalendarTaskProgressPanelview extends MozXULElement {
+        connectedCallback() {
+            if (this.delayConnectedCallback() || this.hasConnected) {
+                return;
+            }
+            this.hasConnected = true;
+
+            this.appendChild(MozXULElement.parseXULToFragment(`
+                <vbox class="panel-subview-body">
+                    <toolbarbutton class="percent-0-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&progress.level.0;"
+                                   accesskey="&progress.level.0.accesskey;"
+                                   observes="calendar_percentComplete-0_command"
+                                   command="calendar_percentComplete-0_command"/>
+                    <toolbarbutton class="percent-25-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&progress.level.25;"
+                                   accesskey="&progress.level.25.accesskey;"
+                                   observes="calendar_percentComplete-25_command"
+                                   command="calendar_percentComplete-25_command"/>
+                    <toolbarbutton class="percent-50-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&progress.level.50;"
+                                   accesskey="&progress.level.50.accesskey;"
+                                   observes="calendar_percentComplete-50_command"
+                                   command="calendar_percentComplete-50_command"/>
+                    <toolbarbutton class="percent-75-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&progress.level.75;"
+                                   accesskey="&progress.level.75.accesskey;"
+                                   observes="calendar_percentComplete-75_command"
+                                   command="calendar_percentComplete-75_command"/>
+                    <toolbarbutton class="percent-100-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&progress.level.100;"
+                                   accesskey="&progress.level.100.accesskey;"
+                                   observes="calendar_percentComplete-100_command"
+                                   command="calendar_percentComplete-100_command"/>
+                </vbox>
+                `,
+                ["chrome://calendar/locale/calendar.dtd"]
+            ));
+
+            const body = this.querySelector(".panel-subview-body");
+
+            this.addEventListener("ViewShowing",
+                updateMenuItemsState.bind(null, body, "percentComplete"), true);
+        }
+    }
+
+    customElements.define("calendar-task-progress-panelview",
+        CalendarTaskProgressPanelview, { "extends": "panelview" });
+
+    /**
+     * A panelview for changing the "priority" status for a task or tasks. It indicates the current
+     * status by displaying a checkmark next to the menu item for that status. For use in the
+     * appmenu.
+     *
+     * @extends MozXULElement
+     */
+    class CalendarTaskPriorityPanelview extends MozXULElement {
+        connectedCallback() {
+            if (this.delayConnectedCallback() || this.hasConnected) {
+                return;
+            }
+            this.hasConnected = true;
+
+            this.appendChild(MozXULElement.parseXULToFragment(`
+                <vbox class="panel-subview-body">
+                    <toolbarbutton class="priority-0-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&priority.level.none;"
+                                   accesskey="&priority.level.none.accesskey;"
+                                   command="calendar_priority-0_command"
+                                   observes="calendar_priority-0_command"/>
+                    <toolbarbutton class="priority-9-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&priority.level.low;"
+                                   accesskey="&priority.level.low.accesskey;"
+                                   command="calendar_priority-9_command"
+                                   observes="calendar_priority-9_command"/>
+                    <toolbarbutton class="priority-5-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&priority.level.normal;"
+                                   accesskey="&priority.level.normal.accesskey;"
+                                   command="calendar_priority-5_command"
+                                   observes="calendar_priority-5_command"/>
+                    <toolbarbutton class="priority-1-menuitem subviewbutton subviewbutton-iconic"
+                                   type="checkbox"
+                                   label="&priority.level.high;"
+                                   accesskey="&priority.level.high.accesskey;"
+                                   command="calendar_priority-1_command"
+                                   observes="calendar_priority-1_command"/>
+                </vbox>
+                `,
+                ["chrome://calendar/locale/calendar.dtd"]
+            ));
+
+            const body = this.querySelector(".panel-subview-body");
+
+            this.addEventListener("ViewShowing",
+                updateMenuItemsState.bind(null, body, "priority"), true);
+        }
+    }
+
+    customElements.define("calendar-task-priority-panelview",
+        CalendarTaskPriorityPanelview, { "extends": "panelview" });
 }
--- a/calendar/lightning/content/lightning-menus.xul
+++ b/calendar/lightning/content/lightning-menus.xul
@@ -660,25 +660,21 @@
                        class="subviewbutton subviewbutton-iconic"
                        type="checkbox"
                        label="&calendar.context.markcompleted.label;"
                        command="calendar_toggle_completed_command"
                        observes="calendar_toggle_completed_command"/>
         <toolbarbutton id="appmenu_ltnTaskActionsPriorityMenuitem"
                        class="subviewbutton subviewbutton-nav"
                        label="&calendar.context.priority.label;"
-                       command="calendar_general-priority_command"
-                       observes="calendar_general-priority_command"
                        closemenu="none"
                        oncommand="PanelUI.showSubView('appmenu_ltnTaskPriorityView', this)"/>
         <toolbarbutton id="appmenu_ltnTaskActionsProgressMenuitem"
                        class="subviewbutton subviewbutton-nav"
                        label="&calendar.context.progress.label;"
-                       command="calendar_general-progress_command"
-                       observes="calendar_general-progress_command"
                        closemenu="none"
                        oncommand="PanelUI.showSubView('appmenu_ltnTaskProgressView', this)"/>
         <toolbarbutton id="appmenu_ltnTaskActionsPostponeMenuitem"
                        class="subviewbutton subviewbutton-nav"
                        label="&calendar.context.postpone.label;"
                        observes="calendar_general-postpone_command"
                        closemenu="none"
                        oncommand="PanelUI.showSubView('appmenu_ltnTaskActionsPostponeView', this)"/>
@@ -695,23 +691,23 @@
                        class="subviewbutton subviewbutton-iconic"
                        insertafter="menu_properties"
                        label="&calendar.properties.label;"
                        command="calendar_edit_calendar_command"
                        observes="calendar_edit_calendar_command"/>
       </vbox>
     </panelview>
 
-    <!-- TODO: adapt these two custom elements for the new appmenu -->
-
     <!-- Events and Tasks / Priority -->
-    <!-- <menupopup id="appmenu_ltnTaskPriorityView" is="calendar-task-priority-menupopup"/> -->
+    <panelview is="calendar-task-priority-panelview" id="appmenu_ltnTaskPriorityView"
+               class="PanelUI-subView"/>
 
     <!-- Events and Tasks / Progress -->
-    <!-- <menupopup id="appmenu_ltnTaskProgressView" is="calendar-task-progress-menupopup"/> -->
+    <panelview is="calendar-task-progress-panelview" id="appmenu_ltnTaskProgressView"
+               class="PanelUI-subView"/>
 
     <!-- Events and Tasks / Postpone Task -->
     <panelview id="appmenu_ltnTaskActionsPostponeView"
                class="PanelUI-subView">
       <vbox class="panel-subview-body">
         <toolbarbutton id="ltnTaskActionsPostponeMenu-1hour"
                        class="subviewbutton subviewbutton-iconic"
                        label="&calendar.context.postpone.1hour.label;"