Bug 1586371 - remove grid usage from calendarCreation.xul. r=pmorris DONTBUILD
☠☠ backed out by 0393c0d6beda ☠ ☠
authorKhushil Mistry <khushil324@gmail.com>
Sat, 05 Oct 2019 13:27:00 +0200
changeset 27897 69a2aa5bd636aef0d8b5ec9fa6661e1a63b92079
parent 27896 6e70a26375b60350d133559ddcd4924d8917379c
child 27898 d7b26f4d5ea17e94a0faee54f64783538bd6e0da
push id16542
push usermozilla@jorgk.com
push dateFri, 11 Oct 2019 08:26:39 +0000
treeherdercomm-central@69a2aa5bd636 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerspmorris
bugs1586371
Bug 1586371 - remove grid usage from calendarCreation.xul. r=pmorris DONTBUILD
calendar/base/themes/common/calendar-creation-wizard.css
calendar/lightning/content/lightning-calendar-creation.xul
calendar/lightning/jar.mn
calendar/providers/caldav/content/caldav-lightning-calendar-creation.xul
calendar/resources/content/calendarCreation.js
calendar/resources/content/calendarCreation.xul
calendar/test/modules/CalendarUtils.jsm
--- a/calendar/base/themes/common/calendar-creation-wizard.css
+++ b/calendar/base/themes/common/calendar-creation-wizard.css
@@ -1,13 +1,25 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-#customize-rows > row {
+@namespace html url("http://www.w3.org/1999/xhtml");
+
+td {
+  width: 100%;
+}
+
+th {
+  font-weight: normal;
+  text-align: start;
+}
+
+#customize-table td,
+#customize-table th {
   min-height: 26px;
 }
 
 .checkbox-no-label > .checkbox-label-box {
   display: none;
 }
 
 #calendar-uri > .textbox-input-box > .textbox-search-icons {
deleted file mode 100644
--- a/calendar/lightning/content/lightning-calendar-creation.xul
+++ /dev/null
@@ -1,33 +0,0 @@
-<?xml version="1.0"?>
-<!-- This Source Code Form is subject to the terms of the Mozilla Public
-   - License, v. 2.0. If a copy of the MPL was not distributed with this
-   - file, You can obtain one at http://mozilla.org/MPL/2.0/.
--->
-
-<?xml-stylesheet href="chrome://messenger/content/notification.css" type="text/css"?>
-
-<!DOCTYPE overlay SYSTEM "chrome://lightning/locale/lightning.dtd">
-
-<overlay id="ltnCalendarCreationOverlay"
-         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml">
-
-  <script src="chrome://calendar/content/calendar-ui-utils.js"/>
-  <script src="chrome://lightning/content/lightning-utils.js"/>
-  <script src="chrome://lightning/content/lightning-calendar-creation.js"/>
-
-  <rows id="customize-rows">
-    <hbox id="no-identity-notification" class="notification-inline" flex="1">
-      <!-- notificationbox will be added here lazily. -->
-    </hbox>
-    <row id="calendar-email-identity-row"
-         align="center"
-         insertafter="no-identity-notification">
-      <label value="&lightning.calendarproperties.email.label;"
-             control="email-identity-menulist"/>
-      <menulist id="email-identity-menulist"
-                oncommand="onChangeIdentity(event)">
-        <menupopup id="email-identity-menupopup"/>
-      </menulist>
-    </row>
-  </rows>
-</overlay>
--- a/calendar/lightning/jar.mn
+++ b/calendar/lightning/jar.mn
@@ -26,17 +26,16 @@ lightning.jar:
 % overlay chrome://lightning/content/lightning-calendar-creation.xul chrome://lightning/content/caldav-lightning-calendar-creation.xul
 % override chrome://lightning-common/skin/accountCentral.css chrome://lightning-common/skin/suite-accountCentral.css application={92650c4d-4b8e-4d2a-b7eb-24ecf4f6b63a}
 % content lightning %content/
     content/html-item-editing/lightning-item-iframe.html   (content/html-item-editing/lightning-item-iframe.html)
     content/html-item-editing/react-code.js                (content/html-item-editing/react-code.js)
     content/imip-bar.js                                    (content/imip-bar.js)
     content/imip-bar-overlay.xul                           (content/imip-bar-overlay.xul)
     content/lightning-calendar-creation.js                 (content/lightning-calendar-creation.js)
-    content/lightning-calendar-creation.xul                (content/lightning-calendar-creation.xul)
     content/lightning-calendar-properties.js               (content/lightning-calendar-properties.js)
     content/lightning-invitation.xhtml                     (content/lightning-invitation.xhtml)
     content/lightning-item-toolbar.xul                     (content/lightning-item-toolbar.xul)
     content/lightning-item-panel.xul                       (content/lightning-item-panel.xul)
     content/lightning-item-panel.js                        (content/lightning-item-panel.js)
     content/lightning-item-iframe.xul                      (content/lightning-item-iframe.xul)
     content/lightning-item-iframe.js                       (content/lightning-item-iframe.js)
     content/lightning-menus.xul                            (content/lightning-menus.xul)
@@ -51,17 +50,16 @@ lightning.jar:
 *   content/messenger-overlay-preferences.xul              (content/messenger-overlay-preferences.xul)
 #ifdef MOZ_SUITE
     content/suite-overlay-addons.xul                       (content/suite-overlay-addons.xul)
     content/suite-overlay-preferences.xul                  (content/suite-overlay-preferences.xul)
     content/suite-overlay-sidebar.js                       (content/suite-overlay-sidebar.js)
     content/suite-overlay-sidebar.xul                      (content/suite-overlay-sidebar.xul)
 #endif
     content/caldav-lightning-calendar-creation.js          (../providers/caldav/content/caldav-lightning-calendar-creation.js)
-    content/caldav-lightning-calendar-creation.xul         (../providers/caldav/content/caldav-lightning-calendar-creation.xul)
     content/caldav-lightning-calendar-properties.js        (../providers/caldav/content/caldav-lightning-calendar-properties.js)
     content/caldav-lightning-utils.js                      (../providers/caldav/content/caldav-lightning-utils.js)
 
 % skin lightning classic/1.0 %skin/linux/
 % skin lightning classic/1.0 %skin/osx/ os=Darwin
 % skin lightning classic/1.0 %skin/windows/ os=WINNT
 % skin lightning-common classic/1.0 %skin/lightning-common/
 % style chrome://messenger/content/messageWindow.xul chrome://lightning/skin/lightning.css
deleted file mode 100644
--- a/calendar/providers/caldav/content/caldav-lightning-calendar-creation.xul
+++ /dev/null
@@ -1,30 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<!-- This Source Code Form is subject to the terms of the Mozilla Public
-   - License, v. 2.0. If a copy of the MPL was not distributed with this
-   - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
-
-<!DOCTYPE overlay SYSTEM "chrome://lightning/locale/lightning.dtd">
-
-<overlay id="ltnCalendarCreationOverlay"
-         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml">
-
-  <script src="chrome://lightning/content/caldav-lightning-utils.js"/>
-  <script src="chrome://lightning/content/caldav-lightning-calendar-creation.js"/>
-
-  <rows id="customize-rows">
-    <row id="calendar-force-email-scheduling-row"
-         align="center"
-         insertafter="calendar-email-identity-row">
-      <spacer/>
-      <!-- The capability to enforce email scheduling wouldn't be enabled in the calendar wizard
-           atm because we would have to check the server capabilities with an OPTIONS request to
-           find out whether this server advertises server-side scheduling. We would need to rework
-           the wizard for that - fixing bug 306495 would probably prepare this. So for now, we just
-           let the user that he can enable this subsequently if applicable -->
-      <checkbox id="force-email-scheduling"
-                label="&lightning.calendarproperties.forceEmailScheduling.label;"
-                disable-with-calendar="true"
-                tooltiptext="&lightning.calendarproperties.forceEmailScheduling.tooltiptext1;"/>
-    </row>
-  </rows>
-</overlay>
--- a/calendar/resources/content/calendarCreation.js
+++ b/calendar/resources/content/calendarCreation.js
@@ -70,18 +70,20 @@ function initLocationPage() {
 /**
  * Initialize the customize page
  */
 function initCustomizePage() {
   initNameFromURI();
   checkRequired();
 
   let suppressAlarmsRow = document.getElementById("customize-suppressAlarms-row");
-  suppressAlarmsRow.hidden =
-    gCalendar && gCalendar.getProperty("capabilities.alarms.popup.supported") === false;
+  suppressAlarmsRow.toggleAttribute(
+    "hidden",
+    gCalendar && gCalendar.getProperty("capabilities.alarms.popup.supported") === false
+  );
   document.getElementById("calendar-color").value = "#A8C2E1";
 }
 
 /**
  * Sets up notifications for the location page. On aReason == SUCCESS, all
  * notifications are removed. Otherwise, the respective notification is added to
  * the notification box. Only one notification per reason will be shown.
  *
@@ -117,19 +119,22 @@ function onSelectProvider(type) {
   let cache = document.getElementById("cache");
   let tempCal;
   try {
     tempCal = Cc["@mozilla.org/calendar/calendar;1?type=" + type].createInstance(Ci.calICalendar);
   } catch (e) {
     // keep tempCal undefined if the calendar can not be created
   }
 
-  document.getElementById("calendar-username-row").hidden = !(
-    tempCal && tempCal.getProperty("capabilities.username.supported") === true
-  );
+  document
+    .getElementById("calendar-username-row")
+    .toggleAttribute(
+      "hidden",
+      !(tempCal && tempCal.getProperty("capabilities.username.supported") === true)
+    );
 
   if (tempCal && tempCal.getProperty("cache.always")) {
     cache.oldValue = cache.checked;
     cache.checked = true;
     cache.disabled = true;
   } else {
     if (cache.oldValue !== undefined) {
       cache.checked = cache.oldValue;
--- a/calendar/resources/content/calendarCreation.xul
+++ b/calendar/resources/content/calendarCreation.xul
@@ -6,29 +6,35 @@
 <?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
 <?xml-stylesheet href="chrome://messenger/content/notification.css" type="text/css"?>
 <?xml-stylesheet href="chrome://calendar-common/skin/calendar-creation-wizard.css" type="text/css"?>
 <?xml-stylesheet type="text/css" href="chrome://messenger/skin/input-fields.css"?>
 
 <!DOCTYPE dialog [
   <!ENTITY % dtd1 SYSTEM "chrome://calendar/locale/calendarCreation.dtd" > %dtd1;
   <!ENTITY % dtd2 SYSTEM "chrome://calendar/locale/calendar.dtd" > %dtd2;
+  <!ENTITY % dtd3 SYSTEM "chrome://lightning/locale/lightning.dtd"> %dtd3;
 ]>
 
 <wizard id="calendar-wizard"
         title="&wizard.title;"
         windowtype="Calendar:NewCalendarWizard"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
         xmlns:html="http://www.w3.org/1999/xhtml"
         onload="onLoad()"
         persist="screenX screenY">
 
   <script src="chrome://global/content/globalOverlay.js"/>
   <script src="chrome://global/content/editMenuOverlay.js"/>
   <script src="chrome://calendar/content/calendarCreation.js"/>
+  <script src="chrome://calendar/content/calendar-ui-utils.js"/>
+  <script src="chrome://lightning/content/lightning-utils.js"/>
+  <script src="chrome://lightning/content/lightning-calendar-creation.js"/>
+  <script src="chrome://lightning/content/caldav-lightning-utils.js"/>
+  <script src="chrome://lightning/content/caldav-lightning-calendar-creation.js"/>
 
   <wizardpage id="initialPage"
               pageid="initialPage"
               next="locationPage"
               label="&wizard.label;"
               description="&wizard.description;">
     <description>&initialpage.description;</description>
     <radiogroup id="calendar-type">
@@ -38,94 +44,144 @@
   </wizardpage>
 
   <wizardpage id="locationPage"
               pageid="locationPage"
               next="customizePage"
               label="&wizard.label;"
               description="&wizard.description;">
     <description>&locationpage.description;</description>
-    <grid>
-      <columns>
-        <column/>
-        <column flex="1"/>
-      </columns>
-      <rows>
-        <row>
+    <html:table>
+      <html:tr>
+        <html:th valign="top">
           <label value="&calendarproperties.format.label;" control="calendar-format"/>
+        </html:th>
+        <html:td>
           <radiogroup id="calendar-format" onselect="onSelectProvider(this.value)">
             <radio value="ics" label="&calendarproperties.webdav.label;" selected="true" />
             <radio value="caldav" label="&calendarproperties.caldav.label;"/>
             <radio id="wcap-radio" value="wcap" label="&calendarproperties.wcap.label;"/>
           </radiogroup>
-        </row>
-        <row id="calendar-username-row" align="center">
+        </html:td>
+      </html:tr>
+      <html:tr id="calendar-username-row">
+        <html:th>
           <label id="calendar-username-label"
                  value="&locationpage.username.label;"
                  control="calendar-username"/>
-          <html:input id="calendar-username" type="text" class="input-inline"
-                      aria-labelledby="calendar-username-label"/>
-        </row>
-        <row id="calendar-location-row" align="center">
+        </html:th>
+        <html:td>
+          <hbox flex="1" class="input-container">
+            <html:input id="calendar-username" type="text" class="input-inline"
+                        aria-labelledby="calendar-username-label"/>
+          </hbox>
+        </html:td>
+      </html:tr>
+      <html:tr id="calendar-location-row">
+        <html:th>
           <label id="calendar-uri-label" value="&calendarproperties.location.label;" control="calendar-uri"/>
-          <html:input id="calendar-uri" type="url" class="input-inline"
-                      required="required"
-                      aria-labelledby="calendar-uri-label"
-                      oninput="checkRequired();"/>
-        </row>
-        <row>
-          <label/>
+        </html:th>
+        <html:td id="calendar-uri-td">
+          <hbox flex="1" class="input-container">
+            <html:input id="calendar-uri" type="url" class="input-inline"
+                        required="required"
+                        aria-labelledby="calendar-uri-label"
+                        oninput="checkRequired();"/>
+          </hbox>
+        </html:td>
+      </html:tr>
+      <html:tr>
+        <html:th></html:th>
+        <html:td>
           <checkbox id="cache"
                     checked="true"
                     label="&calendarproperties.cache3.label;"/>
-        </row>
-        <hbox id="calendar-notification-location"
-              class="notification-inline"
-              flex="1">
-          <!-- notificationbox will be added here lazily. -->
-        </hbox>
-      </rows>
-    </grid>
+        </html:td>
+      </html:tr>
+    </html:table>
+    <hbox id="calendar-notification-location"
+          class="notification-inline"
+          flex="1">
+      <!-- notificationbox will be added here lazily. -->
+    </hbox>
   </wizardpage>
 
   <wizardpage id="customizePage"
               pageid="customizePage"
               description="&custompage.shortdescription;"
               label="&wizard.label;"
               next="finishPage">
+    <vbox id="no-identity-notification" class="notification-inline">
+      <!-- notificationbox will be added here lazily. -->
+    </vbox>
     <description>&custompage.longdescription;</description>
-    <grid>
-      <columns>
-        <column/>
-        <column flex="1"/>
-      </columns>
-      <rows id="customize-rows">
-        <row id="customize-name-row" align="center">
+    <html:table id="customize-table">
+      <html:tr id="customize-name-row">
+        <html:th>
           <label id="calendar-name-label" value="&calendarproperties.name.label;" control="calendar-name"/>
-          <html:input id="calendar-name"
-                      type="text"
-                      required="required"
-                      class="input-inline"
-                      aria-labelledby="calendar-name-label"
-                      oninput="checkRequired();"/>
-        </row>
-        <row id="customize-color-row" align="center">
+        </html:th>
+        <html:td>
+          <hbox flex="1" class="input-container">
+            <html:input id="calendar-name"
+                        type="text"
+                        required="required"
+                        class="input-inline"
+                        aria-labelledby="calendar-name-label"
+                        oninput="checkRequired();"/>
+          </hbox>
+        </html:td>
+      </html:tr>
+      <html:tr id="customize-color-row">
+        <html:th>
           <label value="&calendarproperties.color.label;" control="calendar-color"/>
+        </html:th>
+        <html:td>
           <hbox align="center">
             <html:input id="calendar-color"
                         type="color"
                         palettename="standard"/>
           </hbox>
-        </row>
-        <row id="customize-suppressAlarms-row" align="center">
+        </html:td>
+      </html:tr>
+      <html:tr id="customize-suppressAlarms-row">
+        <html:th>
           <label value="&calendarproperties.firealarms.label;:" control="fire-alarms"/>
+        </html:th>
+        <html:td>
           <checkbox id="fire-alarms" checked="true" class="checkbox-no-label"/>
-        </row>
-      </rows>
-    </grid>
+        </html:td>
+      </html:tr>
+      <html:tr id="calendar-email-identity-row">
+        <html:th>
+          <label value="&lightning.calendarproperties.email.label;"
+                 control="email-identity-menulist"/>
+        </html:th>
+        <html:td>
+          <menulist id="email-identity-menulist"
+                    oncommand="onChangeIdentity(event)">
+            <menupopup id="email-identity-menupopup"/>
+          </menulist>
+        </html:td>
+      </html:tr>
+      <html:tr id="calendar-force-email-scheduling-row">
+        <html:th>
+        </html:th>
+        <html:td>
+          <!-- The capability to enforce email scheduling wouldn't be enabled in the calendar wizard
+               atm because we would have to check the server capabilities with an OPTIONS request to
+               find out whether this server advertises server-side scheduling. We would need to rework
+               the wizard for that - fixing bug 306495 would probably prepare this. So for now, we just
+               let the user that he can enable this subsequently if applicable -->
+          <checkbox id="force-email-scheduling"
+                    label="&lightning.calendarproperties.forceEmailScheduling.label;"
+                    disable-with-calendar="true"
+                    tooltiptext="&lightning.calendarproperties.forceEmailScheduling.tooltiptext1;"/>
+        </html:td>
+      </html:tr>
+    </html:table>
   </wizardpage>
 
   <wizardpage id="finishPage"
               pageid="finishPage"
               description="&finishpage.shortdescription;"
               label="&wizard.label;">
     <description>&finishpage.longdescription;</description>
   </wizardpage>
--- a/calendar/test/modules/CalendarUtils.jsm
+++ b/calendar/test/modules/CalendarUtils.jsm
@@ -559,17 +559,17 @@ function handleNewCalendarWizard(wizard,
       let calendarFile = Services.dirsvc.get("TmpD", Ci.nsIFile);
       calendarFile.append(name + ".ics");
       let fileURI = Services.io.newFileURI(calendarFile);
       data.network.location = fileURI.prePath + fileURI.pathQueryRef;
     }
     wizard.type(
       wizardlookup(`
             /id("calendar-wizard")/{"pageid":"locationPage"}/[1]/[1]/id("calendar-location-row")/
-            id("calendar-uri")
+            id("calendar-uri-td")/{"class":"input-container"}/id("calendar-uri")
         `),
       data.network.location
     );
 
     // Choose offline support.
     if (data.network.offline == undefined) {
       data.network.offline = true;
     }