Bug 1501596 - Fix year popup control buttons for minimonth. r=Paenglab,MakeMyDay
☠☠ backed out by 7e28b9f45b19 ☠ ☠
authorArshad Khan <arshdkhn1@gmail.com>
Mon, 12 Nov 2018 18:18:01 +0530
changeset 33708 36660399182d0001dff1a21410a3aaa39b565e26
parent 33707 d7bd220d248670a6f85c74656aaa2b7ff228d835
child 33709 6d676a4a8ef9983a0cd87d3c3bc7410c487a14a4
push id388
push userclokep@gmail.com
push dateMon, 28 Jan 2019 20:54:56 +0000
reviewersPaenglab, MakeMyDay
bugs1501596
Bug 1501596 - Fix year popup control buttons for minimonth. r=Paenglab,MakeMyDay
calendar/base/content/widgets/minimonth.xml
calendar/lightning/themes/linux/lightning.css
calendar/lightning/themes/windows/lightning.css
--- a/calendar/base/content/widgets/minimonth.xml
+++ b/calendar/base/content/widgets/minimonth.xml
@@ -105,31 +105,33 @@
           <xul:menuitem class="minimonth-list" oncommand="onMonthsPopupCommand(this)" label="&month.9.name;"  index="8"/>
           <xul:menuitem class="minimonth-list" oncommand="onMonthsPopupCommand(this)" label="&month.10.name;" index="9"/>
           <xul:menuitem class="minimonth-list" oncommand="onMonthsPopupCommand(this)" label="&month.11.name;" index="10"/>
           <xul:menuitem class="minimonth-list" oncommand="onMonthsPopupCommand(this)" label="&month.12.name;" index="11"/>
         </xul:menupopup>
         <xul:menupopup anonid="years-popup" position="after_start"
                        onpopupshowing="moveYears('reset', 0); event.stopPropagation();"
                        onpopuphidden="firePopupListHidden();">
-          <xul:autorepeatbutton class="autorepeatbutton-up"
-                                orient="vertical"
-                                oncommand="moveYears('up', 1);"/>
+          <xul:toolbarbutton class="scrollbutton-up"
+                             orient="vertical"
+                             onmouseenter="startScroll('up', 1);"
+                             onmouseout="stopScroll();"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
           <xul:menuitem class="minimonth-list" oncommand="onYearsPopupCommand(this)"/>
-          <xul:autorepeatbutton class="autorepeatbutton-down"
-                                orient="vertical"
-                                oncommand="moveYears('down', 1);"/>
+          <xul:toolbarbutton class="scrollbutton-down"
+                             orient="vertical"
+                             onmouseenter="startScroll('down', 1);"
+                             onmouseout="stopScroll();"/>
         </xul:menupopup>
       </xul:popupset>
     </content>
     <implementation>
       <field name="kMinimonth">null</field>
       <field name="mPopup">null</field>
       <field name="mScrollYearsHandler">null</field>
       <field name="mPixelScrollDelta">0</field>
@@ -264,16 +266,32 @@
 
                     event.stopPropagation();
                     event.preventDefault();
                 }
             }
         ]]></body>
       </method>
 
+      <method name="startScroll">
+        <parameter name="direction"/>
+        <parameter name="scrollOffset"/>
+        <body><![CDATA[
+            this.scrollInterval = setInterval(() => {
+                this.moveYears(direction, scrollOffset);
+            }, 50);
+        ]]></body>
+      </method>
+
+      <method name="stopScroll">
+        <body><![CDATA[
+            clearInterval(this.scrollInterval);
+        ]]></body>
+      </method>
+
       <method name="moveYears">
         <parameter name="direction"/>
         <parameter name="scrollOffset"/>
         <body><![CDATA[
             // Update the year popup
             let years = document.getAnonymousElementByAttribute(this, "anonid", "years-popup").childNodes;
             let current = this.getAttribute("year");
             let offset;
@@ -301,17 +319,17 @@
             years[0].disabled = parseInt(years[1].getAttribute("label"), 10) + offset < 2;
 
             if (!offset) {
                 // No need to loop through when the offset is zero.
                 return;
             }
 
             // Go through all visible years and set the new value. Be sure to
-            // skip the autorepeatbuttons.
+            // skip the scrollbuttons.
             for (let i = 1; i < years.length - 1; i++) {
                 let value = parseInt(years[i].getAttribute("label"), 10) + offset;
                 years[i].setAttribute("label", value);
                 years[i].setAttribute("current", value == current ? "true" : "false");
             }
         ]]></body>
       </method>
     </implementation>
--- a/calendar/lightning/themes/linux/lightning.css
+++ b/calendar/lightning/themes/linux/lightning.css
@@ -106,8 +106,15 @@
 
 #imip-view-toolbar > .toolbarbutton-1.msgHeaderView-button:not([type="menu-button"]):hover:active,
 #imip-view-toolbar > .toolbarbutton-1.msgHeaderView-button[type="menu-button"] >
   .toolbarbutton-menubutton-button:hover:active,
 #imip-view-toolbar > .toolbarbutton-1.msgHeaderView-button[open="true"] >
   .toolbarbutton-menubutton-dropmarker {
   background: rgb(154, 154, 154) linear-gradient(rgba(255, 255, 255, .7), rgba(255, 255, 255, .4));
 }
+
+menupopup[anonid="years-popup"] .scrollbutton-up,
+menupopup[anonid="years-popup"] .scrollbutton-down {
+  -moz-appearance: none;
+  border: 1px solid ThreeDShadow;
+  padding: 0;
+}
--- a/calendar/lightning/themes/windows/lightning.css
+++ b/calendar/lightning/themes/windows/lightning.css
@@ -120,8 +120,25 @@
   #imip-view-toolbar > .toolbarbutton-1.msgHeaderView-button[type="menu-button"] >
     .toolbarbutton-menubutton-button:hover:active,
   #imip-view-toolbar > .toolbarbutton-1.msgHeaderView-button[open="true"] >
     .toolbarbutton-menubutton-dropmarker {
     background-image: linear-gradient(rgba(0, 0, 0, .15), rgba(0, 0, 0, .15)),
                       linear-gradient(-moz-dialog, -moz-dialog);
   }
 }
+
+menupopup[anonid="years-popup"] .scrollbutton-up,
+menupopup[anonid="years-popup"] .scrollbutton-down {
+  -moz-appearance: none;
+  border: 1px solid transparent;
+  padding: 1px;
+}
+
+menupopup[anonid="years-popup"] .scrollbutton-up:not([disabled="true"]):hover,
+menupopup[anonid="years-popup"] .scrollbutton-down:not([disabled="true"]):hover {
+  margin: 1px;
+  border: 1px inset ThreeDFace;
+  padding-top: 2px;
+  padding-bottom: 1px;
+  padding-inline-start: 2px;
+  padding-inline-end: 1px;
+}