Color dialog work, corrected checking in new images without -kb, r=mjudge

editor/ui/composer/content/EditorCommands.js

@@ -778,9 +778,15 @@ function EditorListProperties()
   contentWindow.focus();
 }
 
-function EditorPageProperties(startTab)
+function EditorPageProperties()
 {
-  window.openDialog("chrome://editor/content/EdPageProps.xul","_blank", "chrome,close,titlebar,modal", "", startTab);
+  window.openDialog("chrome://editor/content/EdPageProps.xul","_blank", "chrome,close,titlebar,modal", "");
+  contentWindow.focus();
+}
+
+function EditorColorProperties()
+{
+  window.openDialog("chrome://editor/content/EdColorProps.xul","_blank", "chrome,close,titlebar,modal", "");
   contentWindow.focus();
 }
 

editor/ui/composer/content/EditorContent.css

@@ -37,15 +37,15 @@ a[name] {
 div {
   /* TEMPORARY TO COMPENSATE FOR BUG */
   padding-left: 16px; 
-  background: url(chrome://editor/skin/images/div-in-doc.gif) no-repeat; 
-  background-position: center center;
+  background: url(chrome://editor/skin/images/div.gif) no-repeat; 
+/*  background-position: center center; */
 }
 
 span {
   /* TEMPORARY TO COMPENSATE FOR BUG */
   padding-left: 16px; 
-  background: url(chrome://editor/skin/images/span-in-doc.gif) no-repeat; 
-  background-position: center center;
+  background: url(chrome://editor/skin/images/span.gif) no-repeat; 
+/*  background-position: center center; */
 }
 
 table {

editor/ui/composer/content/editorOverlay.xul

@@ -534,10 +534,10 @@
             oncommand="EditorObjectProperties()"/>
   <menuitem id="pageProperties" value="&pageProperties.label;"
             accesskey="&pageproperties.accesskey;"
-            oncommand="EditorPageProperties('GeneralTab')"/>
+            oncommand="EditorPageProperties()"/>
   <menuitem id="colorsAndBackground" value="&colorsAndBackground.label;"
             accesskey="&colorsandbackground.accesskey;"
-            oncommand="EditorPageProperties('ColorTab')"/>
+            oncommand="EditorColorProperties()"/>
 
   <menu id="tableMenu" value="&tableMenu.label;" accesskey="&tablemenu.accesskey;">
   <menupopup>

editor/ui/composer/skin/MANIFEST

@@ -30,8 +30,8 @@ images:right.gif
 images:justify.gif
 images:anchor.gif
 images:anchor-in-doc.gif
-images:div-in-doc.gif
-images:span-in-doc.gif
+images:div.gif
+images:span.gif
 images:bullets.gif
 images:outdent.gif
 images:hline.gif

editor/ui/composer/skin/Makefile.in

@@ -48,8 +48,8 @@ EXPORT_RESOURCE_TOOLBAR = \
 		$(srcdir)/images/table.gif \
 		$(srcdir)/images/anchor.gif \
 		$(srcdir)/images/anchor-in-doc.gif \
-		$(srcdir)/images/div-in-doc.gif \
-		$(srcdir)/images/span-in-doc.gif \
+		$(srcdir)/images/div.gif \
+		$(srcdir)/images/span.gif \
 		$(srcdir)/images/underline.gif \
 		$(srcdir)/images/color.gif \
 		$(srcdir)/images/align.gif \

editor/ui/composer/skin/makefile.win

@@ -46,8 +46,8 @@ install:: $(DLL)
   $(MAKE_INSTALL) images\table.gif			$(DIST)\bin\chrome\editor\skin\default\images
   $(MAKE_INSTALL) images\anchor.gif         $(DIST)\bin\chrome\editor\skin\default\images
   $(MAKE_INSTALL) images\anchor-in-doc.gif  $(DIST)\bin\chrome\editor\skin\default\images
-  $(MAKE_INSTALL) images\div-in-doc.gif  $(DIST)\bin\chrome\editor\skin\default\images
-  $(MAKE_INSTALL) images\span-in-doc.gif  $(DIST)\bin\chrome\editor\skin\default\images
+  $(MAKE_INSTALL) images\div.gif  $(DIST)\bin\chrome\editor\skin\default\images
+  $(MAKE_INSTALL) images\span.gif  $(DIST)\bin\chrome\editor\skin\default\images
   $(MAKE_INSTALL) images\underline.gif	    $(DIST)\bin\chrome\editor\skin\default\images
   $(MAKE_INSTALL) images\color.gif     $(DIST)\bin\chrome\editor\skin\default\images
   $(MAKE_INSTALL) images\newfile.gif   $(DIST)\bin\chrome\editor\skin\default\images
@@ -93,8 +93,8 @@ clobber::
   rm -f $(DIST)\bin\chrome\editor\skin\default\images\table.gif			
   rm -f $(DIST)\bin\chrome\editor\skin\default\images\anchor.gif
   rm -f $(DIST)\bin\chrome\editor\skin\default\images\anchor-in-doc.gif
-  rm -f $(DIST)\bin\chrome\editor\skin\default\images\div-in-doc.gif
-  rm -f $(DIST)\bin\chrome\editor\skin\default\images\span-in-doc.gif
+  rm -f $(DIST)\bin\chrome\editor\skin\default\images\div.gif
+  rm -f $(DIST)\bin\chrome\editor\skin\default\images\span.gif
   rm -f $(DIST)\bin\chrome\editor\skin\default\images\underline.gif
   rm -f $(DIST)\bin\chrome\editor\skin\default\images\color.gif
   rm -f $(DIST)\bin\chrome\editor\skin\default\images\object-popup.gif			

editor/ui/dialogs/content/EdColorProps.js

@@ -27,49 +27,18 @@ function Startup()
   if (!InitEditorShell())
     return;
 
-  colorPage = new Object;
-  if (!colorPage)
+  dialog = new Object;
+  if (!dialog)
   {
-    dump("Failed to create colorPage object!!!\n");
+    dump("Failed to create dialog object!!!\n");
     window.close();
   }
 
-  colorPage.ColorPreview = document.getElementById("ColorPreview");
-  colorPage.NormalText = document.getElementById("NormalText");
-  colorPage.LinkText = document.getElementById("LinkText");
-  colorPage.ActiveLinkText = document.getElementById("ActiveLinkText");
-  colorPage.FollowedLinkText = document.getElementById("FollowedLinkText");
-
-//  colorPage. = documentgetElementById("");
-
-  tabPanel = document.getElementById("tabPanel");
-
-  // Set the starting Tab:
-  var tabName = window.arguments[1];
-  currentTab = document.getElementById(tabName);
-  if (!currentTab)
-    currentTab = document.getElementById("GeneralTab");
-
-  if (!tabPanel || !currentTab)
-  {
-    dump("Not all dialog controls were found!!!\n");
-    window.close;
-  }
-
-  // Trigger setting of style for the selected tab widget
-  currentTab.setAttribute("selected", "true");
-  // Activate the corresponding panel
-  var index = 0;
-  switch(tabName)
-  {
-    case "ColorTab":
-      index = 1;
-      break;
-    case "MetaTab":
-      index = 2;
-      break;
-  }
-  tabPanel.setAttribute("index",index);
+  dialog.ColorPreview = document.getElementById("ColorPreview");
+  dialog.NormalText = document.getElementById("NormalText");
+  dialog.LinkText = document.getElementById("LinkText");
+  dialog.ActiveLinkText = document.getElementById("ActiveLinkText");
+  dialog.FollowedLinkText = document.getElementById("FollowedLinkText");
 
   doSetOKCancel(onOK, null);
 
@@ -97,24 +66,24 @@ dump("GetColor, color="+color+"\n");
   switch( ColorPickerID )
   {
     case "textCP":
-      colorPage.textColor = color;
-      colorPage.NormalText.setAttribute("style",colorString);
+      dialog.textColor = color;
+      dialog.NormalText.setAttribute("style",colorString);
       break;
     case "linkCP":
-      colorPage.linkColor = color;
-      colorPage.LinkText.setAttribute("style",colorString);
+      dialog.linkColor = color;
+      dialog.LinkText.setAttribute("style",colorString);
       break;
     case "followedCP":
-      colorPage.followedLinkColor = color;
-      colorPage.FollowedLinkText.setAttribute("style",colorString);
+      dialog.followedLinkColor = color;
+      dialog.FollowedLinkText.setAttribute("style",colorString);
       break;
     case "activeCP":
-      colorPage.activeLinkColor = color;
-      colorPage.ActiveLinkText.setAttribute("style",colorString);
+      dialog.activeLinkColor = color;
+      dialog.ActiveLinkText.setAttribute("style",colorString);
       break;
     case "backgroundCP":
-      colorPage.backgroundColor = color;
-      colorPage.ColorPreview.setAttribute("bgcolor",color);
+      dialog.backgroundColor = color;
+      dialog.ColorPreview.setAttribute("bgcolor",color);
       break;
   }
 }

editor/ui/dialogs/content/EdColorProps.xul

@@ -36,188 +36,126 @@
     onload="Startup()"
     align="vertical">
 
-  <!-- Methods common to all editor dialogs -->
   <html:script language="JavaScript" src="chrome://editor/content/EdDialogCommon.js"/>
-  <html:script language="JavaScript" src="chrome://editor/content/EdColorProps.js"/>
+  <html:script language="JavaScript" src="chrome://editor/content/EdPageProps.js"/>
   <html:script language="JavaScript" src="chrome://global/content/dialogOverlay.js" />
 
   <broadcaster id="args" value=""/>
-  <keyset id="keyset"/>
-    <tabcontrol align="vertical">
-	    <tabbox align="horizontal" flex="100%">
-		    <tab id="GeneralTab">&generalTab.label;</tab>
-		    <tab id="ColorTab">&backgroundTab.label;</tab>
-		    <tab id="MetaTab">&metaTagsTab.label;</tab>
-	    </tabbox>
- 
-    	<tabpanel id="tabPanel" flex="100%">
-<!-- ***** general tab ***** -->
-    		<box id="panel1" align="vertical">
-          <html:table>
-            <html:tr>
-              <html:td>
-                &location.label;
-              </html:td>
-              <html:td id="location">
-                <!-- fill in URL at runtime -->
-              </html:td>
-            </html:tr>
-            <html:tr>
-              <html:td>
-                &lastModified.label;
-              </html:td>
-              <html:td id="lastModified">
-                <!-- fill in date at runtime -->
-              </html:td>
-            </html:tr>
-            <html:tr>
-              <html:td>
-                &titleInput.label;
-              </html:td>
-              <html:td id="titleInput">
-                <html:input type="text" id="titleInput"/>
-              </html:td>
-            </html:tr>
-            <html:tr>
-              <html:td>
-                &authorInput.label;
-              </html:td>
-              <html:td id="authorInput">
-                <html:input type="text" id="titleInput"/>
-              </html:td>
-            </html:tr>
-            <html:tr>
-              <html:td>
-                &descriptionInput.label;
-              </html:td>
-              <html:td id="title">
-                <html:input type="text" id="descriptionInput"/>
-              </html:td>
-            </html:tr>
-          </html:table>
-        </box>
-  
-<!-- **** colors/background tab **** -->
-    		<box id="panel2" align="vertical">
-          <html:fieldset><html:legend class = "dialog" align = "left">&pageColors.label;</html:legend>
-          <html:input type="radio" name="ColorMode" id="DefaultColorsRadio"/>
-          <html:label for="DefaultColorsRadio">&defaultColorsRadio.label;</html:label>
-          <html:br/>
-          <html:input type="radio" name="ColorMode" id="CustomColorsRadio"/>
-          <html:label for="CustomColorsRadio">&customColorsRadio.label;</html:label>
-          <html:br/>
-          <html:div>
-          <spring class="bigspacer"/>
-          <box flex="1">
-            <html:label> &colorScheme.label; 
-            <html:select id="ColorScheme" size="1" style="min-width: 10em">
-              <html:option> Black on White </html:option>
-              <html:option> Blue on White  </html:option>
-              <html:option> White on Black </html:option>
-            </html:select>
-            </html:label>
-          </box>
-          <!-- TODO: COLOR SCHEME SELECT LIST -->
-          </html:div>
-          <spring class="bigspacer"/>
-    	    <box align="horizontal">
-            <spring class="bigspacer"/>
-            <box align="vertical" flex="100%">
-              <box>
-                <html:label class="margin-both"> &normalText.label; </html:label>
-                <spring flex="100%"/>
-                <menu class="colorpicker">
-    	            <html:div id="textCW" class="color-well"/>
-    	            <titledbutton class="popup" align="right" flex="100%" onclick="GetColor('textCP','textCW');"/>
-    	            <menupopup id="normalMenuPopup">
-                    <colorpicker id="textCP" palettename="standard" onclick="GetColor('textCP','textCW');"/>
-                    <titledbutton class="push" value="&colorPicker.default.label;" onclick="GetColor('textCP','textCW');"/>
-    	            </menupopup>
-                </menu>
-              </box>
-              <spring class="spacer"/>
-              <box>
-                <html:label class="margin-both"> &linkText.label; </html:label>
-                <spring flex="100%"/>
-                <menu class="colorpicker">
-    	            <html:div id="linkCW" class="color-well"/>
-    	            <titledbutton class="popup" align="right" flex="100%"/>
-    	            <menupopup>
-                    <colorpicker id="linkCP" palettename="standard" onclick="GetColor('linkCP','linkCW');"/>
-                    <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('linkCW');"/>
-    	            </menupopup>
-                </menu>
-              </box>
-              <spring class="spacer"/>
-              <box>
-                <html:label class="margin-both"> &activeLinkText.label; </html:label>
-                <spring flex="100%"/>
-                <menu class="colorpicker">
-    	            <html:div id="activeCW" class="color-well"/>
-    	            <titledbutton class="popup" align="right" flex="100%"/>
-    	            <menupopup>
-                    <colorpicker id="activeCP" palettename="standard" onclick="GetColor('activeCP','activeCW');"/>
-                    <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('activeCW');"/>
-    	            </menupopup>
-                </menu>
-              </box>
-              <spring class="spacer"/>
-              <box>
-                <html:label class="margin-both"> &followedLinkText.label; </html:label>
-                <spring flex="100%"/>
-                <menu class="colorpicker">
-    	            <html:div id="followedCW" class="color-well"/>
-    	            <titledbutton class="popup" align="right" flex="100%"/>
-    	            <menupopup>
-                    <colorpicker id="followedCP" palettename="standard" onclick="GetColor('followedCP','followedCW');"/>
-                    <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('followedCW');"/>
-    	            </menupopup>
-                </menu>
-              </box>
-              <spring class="spacer"/>
-              <box>
-                <html:label class="margin-both"> &background.label; </html:label>
-                <spring flex="100%"/>
-                <menu class="colorpicker">
-    	            <html:div id="backgroundCW" class="color-well"/>
-    	            <titledbutton class="popup" align="right" flex="100%"/>
-    	            <menupopup>
-                    <colorpicker id="backgroundCP" palettename="standard" onclick="GetColor('backgroundCP','backgroundCW');"/>
-                    <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('backgroundCW');"/>
-    	            </menupopup>
-                </menu>
-              </box>
-            </box>
-            <spring class="bigspacer"/>
-            <box align="vertical" flex="100%" id="ColorPreview">
-               <!-- basestyle="min-height:50px; width: 100%; border: 1px inset #CCCCCC; padding: 5px; " style="min-height:50px; width: 100%; border: 1px inset #CCCCCC; padding: 5px; "-->
-              <html:div id="NormalText">&normalText.label;</html:div>
-              <spring class="spacer"/>
-              <html:div id="LinkText">&linkText.label;</html:div>
-              <spring class="spacer"/>
-              <html:div id="ActiveLinkText">&activeLinkText.label;</html:div>
-              <spring class="spacer"/>
-              <html:div id="FollowedLinkText">&followedLinkText.label;</html:div>
-            </box>
-          </box>
-          </html:fieldset>
-          <box align="horizontal">
-            <html:input type="checkbox" id="BackgroundImageCheckbox"/>
-            <html:label for="BackgroundImageCheckbox"> &backgroundImage.label; </html:label>
-          </box>
-          <box align="horizontal">
-            <html:input type="text" class="SizeToParent" id="BackgroundImageInput" size="20"/>
-            <spring class="spacer"/>
-            <!-- from EdDialogOverlay.xul -->
-            <titledbutton id="ChooseFile"/>
-          </box>
-        </box> <!-- end of colors tab -->
-
-<!-- **** meta tags tab **** -->
-    		<box id="panel3" align="vertical">
-        </box>
-    	</tabpanel> 
-    </tabcontrol>
-    <box id="okCancelButtons"/> 
-
+  <html:label>&pageColors.label;</html:label>
+  <box align="horizontal" class="margin-left-right">
+    <!-- must use div else box stretches radio button size -->
+    <html:div><html:input type="radio" name="ColorMode" id="DefaultColorsRadio"/></html:div>
+    <html:label for="DefaultColorsRadio">&defaultColorsRadio.label;</html:label>
+  </box>
+  <box align="horizontal" class="margin-left-right">
+    <html:div><html:input type="radio" name="ColorMode" id="CustomColorsRadio"/></html:div>
+    <html:label for="CustomColorsRadio">&customColorsRadio.label;</html:label>
+  </box>
+  <spring class="bigspacer"/>
+  <html:div>
+    <box flex="1">
+      <html:label for="ColorScheme"> &colorScheme.label;</html:label> 
+      <spring class="bigspacer"/>
+      <html:select id="ColorScheme" size="1" flex="1">
+        <html:option> Black on White </html:option>
+        <html:option> Blue on White  </html:option>
+        <html:option> White on Black </html:option>
+      </html:select>
+    </box>
+    <!-- TODO: COLOR SCHEME SELECT LIST -->
+  </html:div>
+  <spring class="bigspacer"/>
+  <box align="horizontal">
+    <spring class="bigspacer"/>
+    <box align="vertical" flex="100%">
+      <box>
+        <html:label class="margin-left-right"> &normalText.label; </html:label>
+        <spring flex="100%"/>
+        <menu class="colorpicker">
+    	    <html:div id="textCW" class="color-well"/>
+    	    <titledbutton class="popup" align="right" flex="100%" onclick="GetColor('textCP','textCW');"/>
+    	    <menupopup id="normalMenuPopup">
+            <colorpicker id="textCP" palettename="standard" onclick="GetColor('textCP','textCW');"/>
+            <titledbutton class="push" value="&colorPicker.default.label;" onclick="GetColor('textCP','textCW');"/>
+    	    </menupopup>
+        </menu>
+      </box>
+      <spring class="spacer"/>
+      <box>
+        <html:label class="margin-left-right"> &linkText.label; </html:label>
+        <spring flex="100%"/>
+        <menu class="colorpicker">
+    	    <html:div id="linkCW" class="color-well"/>
+    	    <titledbutton class="popup" align="right" flex="100%"/>
+    	    <menupopup>
+            <colorpicker id="linkCP" palettename="standard" onclick="GetColor('linkCP','linkCW');"/>
+            <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('linkCW');"/>
+    	    </menupopup>
+        </menu>
+      </box>
+      <spring class="spacer"/>
+      <box>
+        <html:label class="margin-left-right"> &activeLinkText.label; </html:label>
+        <spring flex="100%"/>
+        <menu class="colorpicker">
+    	    <html:div id="activeCW" class="color-well"/>
+    	    <titledbutton class="popup" align="right" flex="100%"/>
+    	    <menupopup>
+            <colorpicker id="activeCP" palettename="standard" onclick="GetColor('activeCP','activeCW');"/>
+            <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('activeCW');"/>
+    	    </menupopup>
+        </menu>
+      </box>
+      <spring class="spacer"/>
+      <box>
+        <html:label class="margin-left-right"> &followedLinkText.label; </html:label>
+        <spring flex="100%"/>
+        <menu class="colorpicker">
+    	    <html:div id="followedCW" class="color-well"/>
+    	    <titledbutton class="popup" align="right" flex="100%"/>
+    	    <menupopup>
+            <colorpicker id="followedCP" palettename="standard" onclick="GetColor('followedCP','followedCW');"/>
+            <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('followedCW');"/>
+    	    </menupopup>
+        </menu>
+      </box>
+      <spring class="spacer"/>
+      <box>
+        <html:label class="margin-left-right"> &background.label; </html:label>
+        <spring flex="100%"/>
+        <menu class="colorpicker">
+    	    <html:div id="backgroundCW" class="color-well"/>
+    	    <titledbutton class="popup" align="right" flex="100%"/>
+    	    <menupopup>
+            <colorpicker id="backgroundCP" palettename="standard" onclick="GetColor('backgroundCP','backgroundCW');"/>
+            <titledbutton class="push" value="&colorPicker.default.label;" onclick="RemoveColor('backgroundCW');"/>
+    	    </menupopup>
+        </menu>
+      </box>
+    </box>
+    <spring class="bigspacer"/>
+    <box align="vertical" flex="100%" id="ColorPreview">
+       <!-- basestyle="min-height:50px; width: 100%; border: 1px inset #CCCCCC; padding: 5px; " style="min-height:50px; width: 100%; border: 1px inset #CCCCCC; padding: 5px; "-->
+      <html:div id="NormalText">&normalText.label;</html:div>
+      <spring class="spacer"/>
+      <html:div id="LinkText">&linkText.label;</html:div>
+      <spring class="spacer"/>
+      <html:div id="ActiveLinkText">&activeLinkText.label;</html:div>
+      <spring class="spacer"/>
+      <html:div id="FollowedLinkText">&followedLinkText.label;</html:div>
+    </box>
+  </box>
+  <html:div class="separator" align="horizontal"/>
+  <box align="horizontal">
+    <html:div><html:input type="checkbox" id="BackgroundImageCheckbox"/></html:div>
+    <html:label for="BackgroundImageCheckbox"> &backgroundImage.label; </html:label>
+  </box>
+  <box align="horizontal">
+    <html:input type="text" class="SizeToParent" id="BackgroundImageInput" flex="1"/>
+    <spring class="spacer"/>
+    <!-- from EdDialogOverlay.xul -->
+    <titledbutton id="ChooseFile"/>
+  </box>
+  <html:div class="separator" align="horizontal"/>
+  <box id="okCancelButtons"/> 
 </window>

editor/ui/dialogs/locale/en-US/EditorColorProperties.dtd

@@ -21,23 +21,15 @@
   -->
 
 <!-- Window title -->
-<!ENTITY windowTitle.label "Page Properties">
-<!ENTITY generalTab.label "General">
-<!ENTITY backgroundTab.label "Colors and Background">
-<!ENTITY metaTagsTab.label "Meta Tags">
-<!ENTITY location.label "Location">
-<!ENTITY lastModified.label "Last Modified">
-<!ENTITY titleInput.label "Title">
-<!ENTITY authorInput.label "Author">
-<!ENTITY descriptionInput.label "Description">
-<!ENTITY pageColors.label "Page Colors">
+<!ENTITY windowTitle.label "Page Colors and Background">
+<!ENTITY pageColors.label "Page Colors: ">
 <!ENTITY defaultColorsRadio.label "Don't specify colors">
 <!ENTITY customColorsRadio.label "Use custom colors:">
-<!ENTITY colorScheme.label "Color Schemes:">
+<!ENTITY colorScheme.label "Color Schemes: ">
 <!ENTITY normalText.label "Normal text:">
 <!ENTITY linkText.label "Link text:">
 <!ENTITY activeLinkText.label "Active link text:">
 <!ENTITY followedLinkText.label "Followed link text:">
 <!ENTITY background.label "Background:">
-<!ENTITY backgroundImage.label "Background Image:">
+<!ENTITY backgroundImage.label "Background Image: ">
 <!ENTITY colorPicker.default.label "Don't Specify Color">

editor/ui/dialogs/skin/EditorDialog.css

@@ -59,7 +59,7 @@ div.middle-align {
   vertical-align: middle;
 }
 
-label.margin-both {
+.margin-left-right {
   margin-left:  10px;
   margin-right:  5px;
 }