Composer dialog cleanup work (47213, 47701, 9754) r=sfraser

This commit is contained in:
cmanske%netscape.com 2000-09-12 00:35:42 +00:00
parent d9e2a3715e
commit 54bd31dd70
21 changed files with 821 additions and 735 deletions

View File

@ -148,3 +148,4 @@ RemoveLinks=Remove Links
StopLinks=Discontinue Link
RemoveLinksAccesskey=n
NoAltText=You should always supply alternative text for an image,\nbut you may use a space if you really don't want it.
NoAlignChar=No alignment character supppied.\nEnter a single character or\nselect a different alignment style.

View File

@ -8,7 +8,7 @@ function BuildCSSAttributeTable()
if(style == undefined || style == "")
{
dump("no style attributes to add\n");
return false;
return;
}
if(style.indexOf(";") == -1) {
if(style.indexOf(":") != -1) {
@ -17,7 +17,7 @@ function BuildCSSAttributeTable()
if ( !AddTreeItem( name, value, "CSSATree", CSSAttrs ) )
dump("Failed to add CSS attribute: " + i + "\n");
} else
return false;
return;
}
nvpairs = style.split(";");
for(i = 0; i < nvpairs.length; i++)
@ -46,7 +46,7 @@ function onAddCSSAttribute( which )
return;
if ( !CheckAttributeNameSimilarity( name, CSSAttrs ) )
return false;
return;
if ( AddTreeItem ( name, value, "CSSAList", CSSAttrs ) ) {
dialog.AddCSSAttributeNameInput.value = "";

View File

@ -7,6 +7,7 @@
function BuildHTMLAttributeTable()
{
var nodeMap = element.attributes;
var i;
if(nodeMap.length > 0) {
for(i = 0; i < nodeMap.length; i++)
{
@ -37,7 +38,7 @@ function onAddHTMLAttribute(which)
return;
if ( !CheckAttributeNameSimilarity( name, CSSAttrs ) )
return false;
return;
if ( AddTreeItem ( name, value, "HTMLAList", HTMLAttrs ) ) {
dialog.AddHTMLAttributeNameInput.value = "";
@ -49,6 +50,7 @@ function onAddHTMLAttribute(which)
// does enabling based on any user input.
function doHTMLEnabling( keycode )
{
dump("***doHTMLEnabling\n");
if(keycode == 13) {
onAddHTMLAttribute(document.getElementById("AddHTMLAttribute"));
return;
@ -66,18 +68,20 @@ function UpdateHTMLAttributes()
{
dump("===============[ Setting and Updating HTML ]===============\n");
var HTMLAList = document.getElementById("HTMLAList");
for(var i = 0; i < HTMLAList.childNodes.length; i++)
var name;
var i;
for( i = 0; i < HTMLAList.childNodes.length; i++)
{
var item = HTMLAList.childNodes[i];
var name = TrimString(item.firstChild.firstChild.getAttribute("value"));
name = TrimString(item.firstChild.firstChild.getAttribute("value"));
var value = TrimString(item.firstChild.lastChild.firstChild.value);
// set the attribute
element.setAttribute(name,value);
}
// remove removed attributes
for( var i = 0; i < HTMLRAttrs.length; i++ )
for( i = 0; i < HTMLRAttrs.length; i++ )
{
var name = HTMLRAttrs[i];
name = HTMLRAttrs[i];
if(element.getAttribute(name))
element.removeAttribute(name);
else continue; // doesn't exist, so don't bother removing it.

View File

@ -72,7 +72,8 @@ function UpdateJSEAttributes()
{
dump("===============[ Setting and Updating JSE ]===============\n");
var JSEAList = document.getElementById("JSEAList");
for(var i = 0; i < JSEAList.childNodes.length; i++)
var i;
for( i = 0; i < JSEAList.childNodes.length; i++)
{
var item = JSEAList.childNodes[i];
name = TrimString(item.firstChild.firstChild.getAttribute("value"));
@ -81,7 +82,7 @@ function UpdateJSEAttributes()
element.setAttribute(name,value);
}
// remove removed attributes
for( var i = 0; i < JSERAttrs.length; i++ )
for( i = 0; i < JSERAttrs.length; i++ )
{
var name = JSERAttrs[i];
if(element.getAttribute(name))

View File

@ -37,9 +37,8 @@ var HTMLAttrs = []; // html attributes
var CSSAttrs = []; // css attributes
var JSEAttrs = []; // js events
var HTMLRAttrs = []; // removed html attributes
var CSSRAttrs = []; // removed css attributes
var JSERAttrs = []; // removed js events
var gSelecting = false; // To prevent recursive selection
var dialog;
/************** INITIALISATION && SETUP **************/
@ -61,9 +60,6 @@ function Startup()
// initialise the ok and cancel buttons
doSetOKCancel(onOK, onCancel);
// load string bundle
bundle = srGetStrBundle("chrome://editor/locale/editor.properties");
// Element to edit is passed in
element = window.arguments[1];
if (!element || element == undefined) {
@ -168,81 +164,63 @@ function CheckAttributeNotRemoved( attName, attArray )
* returns : nothing
* desc. : removes an attribute or attributes from the tree
**/
// Note: now changing this to remove all selected ITEMS. this makes it easier.
function doRemoveAttribute( which )
function RemoveAttribute( treeId )
{
if(which.nodeName != "tree") {
var tree = which.parentNode;
while ( tree.nodeName != "tree" )
{
tree = tree.parentNode; // climb up the tree one notch
} // now we are pointing at the tree element
} else
tree = which;
var tree = document.getElementById(treeId);
if (!tree) return;
var kids = tree.lastChild; // treechildren element of tree
var selArray = [];
for ( var i = 0; i < tree.selectedItems.length; i++ )
var newIndex = tree.selectedIndex;
// We only allow 1 selected item
if (tree.selectedItems.length)
{
var item = tree.selectedItems[i];
// add to array of removed items for the particular panel that is displayed
var name = item.firstChild.firstChild;
var item = tree.selectedItems[0];
// Name is the value of the treecell
var name = item.firstChild.firstChild.getAttribute("value");
// remove the item from the attribute arrary
switch ( tree.id ) {
case "HTMLATree":
HTMLRAttrs[HTMLRAttrs.length] = TrimString(name.getAttribute("value"));
// dump("HTMLRAttrs[" + (HTMLRAttrs.length - 1) + "]: " + HTMLRAttrs[HTMLRAttrs.length-1] + "\n");
if (newIndex >= (HTMLAttrs.length-1))
newIndex--;
RemoveNameFromAttArray(HTMLAttrs, name);
break;
case "CSSATree":
CSSRAttrs[CSSRAttrs.length] = TrimString(name.getAttribute("value"));
if (newIndex >= (CSSAttrs.length-1))
newIndex--;
RemoveNameFromAttArray(CSSAttrs, name);
break;
case "JSEATree":
JSERAttrs[JSERAttrs.length] = TrimString(name.getAttribute("value"));
if (newIndex >= (JSEAttrs.length-1))
newIndex--;
RemoveNameFromAttArray(JSEAttrs, name);
break;
default: break;
}
selArray[i] = item;
}
// need to do this in a separate loop because selectedItems is NOT STATIC and
// this causes problems.
for ( var i = 0; i < selArray.length; i++ )
{
// remove the item
kids.removeChild ( selArray[i] );
}
}
/**
* function : void doAddAttribute( DOMElement which );
* parameters : DOMElement referring to element context-clicked
* returns : nothing
* desc. : focusses the add attribute "name" field in the current pane.
**/
function doAddAttribute(which)
// Remove the item from the tree
kids.removeChild (item);
// Reselect an item
tree.selectedIndex = newIndex;
SelectTreeItem(tree);
}
}
function RemoveNameFromAttArray(attArray, name)
{
if(which.nodeName != "tree") {
var tree = which.parentNode;
while ( tree.nodeName != "tree" )
for (var i=0; i < attArray.length; i++)
{
if (attArray[i] == name)
{
tree = tree.parentNode; // climb up the tree one notch
} // now we are pointing at the tree element
} else
tree = which;
switch(tree.id) {
case "HTMLATree":
SetTextfieldFocus(document.getElementById("AddHTMLAttributeNameInput"));
break;
case "CSSATree":
SetTextfieldFocus(document.getElementById("AddCSSAttributeNameInput"));
break;
case "JSEATree":
SetTextfieldFocus(document.getElementById("AddJSEAttributeNameInput"));
break;
default:
break;
// Remove 1 array item
attArray.splice(i,1);
break;
}
}
}
// NOT USED
/*
function doSelect(e)
{
if ( TEXT_WIDGETS_DONT_SUCK && PERFORMANCE_BOOSTS ) {
@ -264,23 +242,28 @@ function doSelect(e)
SetTextfieldFocus(input);
}
}
*/
// adds a generalised treeitem.
function AddTreeItem ( name, value, treekids, attArray, valueCaseFunc )
function AddTreeItem ( name, value, treekidsId, attArray, valueCaseFunc )
{
attArray[attArray.length] = name;
var treekids = document.getElementById ( treekids );
var treekids = document.getElementById ( treekidsId );
var treeitem = document.createElementNS ( XUL_NS, "treeitem" );
var treerow = document.createElementNS ( XUL_NS, "treerow" );
var attrcell = document.createElementNS ( XUL_NS, "treecell" );
attrcell.setAttribute( "class", "propertylist" );
attrcell.setAttribute( "value", name.toLowerCase() );
// Modify treerow selection to better show focus in textfield
treeitem.setAttribute( "class", "ae-selection");
treerow.appendChild ( attrcell );
if ( !valueCaseFunc ) {
// no handling function provided, create default cell.
var valcell = CreateCellWithField ( name, value);
treerow.appendChild ( valcell );
var valCell = CreateCellWithField ( name, value );
if (!valCell) return null;
treerow.appendChild ( valCell );
} else
valueCaseFunc(); // run user specified function for adding content
@ -293,16 +276,56 @@ function AddTreeItem ( name, value, treekids, attArray, valueCaseFunc )
// optional parameters for initial values.
function CreateCellWithField( name, value )
{
var valcell = document.createElementNS ( XUL_NS, "treecell" );
valcell.setAttribute ( "class", "value propertylist" );
valcell.setAttribute ( "allowevents", "true" );
var valCell = document.createElementNS ( XUL_NS, "treecell" );
if (!valCell) return null;
valCell.setAttribute ( "class", "value propertylist" );
valCell.setAttribute ( "allowevents", "true" );
var valField = document.createElementNS ( XUL_NS, "textfield" );
if ( name ) valField.setAttribute ( "id", name );
if (!valField) return null;
if ( value ) valField.setAttribute ( "value", value );
valField.setAttribute ( "flex", "1" );
valField.setAttribute ( "class", "plain" );
valcell.appendChild ( valField );
return valcell;
//XXX JS errors (can't tell where!) are preventing this from firing
valField.setAttribute ( "onfocus", "SelectItemWithTextfield("+name+")");
valCell.appendChild ( valField );
return valCell;
}
function SelectItemWithTextfield(id)
{
dump("*** SelectItemWithTextfield\n");
var textfield = document.getItemById(id);
if (textfield)
{
var treerow = textfield.parentNode.parentNode;
var tree = treeerow.parentNode.parentNode;
if (tree)
{
gSelecting = true;
tree.selectedItem = textfield.parentNode;
gSelecting = false;
}
}
}
// When a "name" treecell is selected, shift focus to the textfield
function SelectTreeItem(tree)
{
// Prevent infinite loop -- SetTextfieldFocusById triggers recursive call
if (gSelecting) return;
gSelecting = true;
if (tree && tree.selectedItems && tree.selectedItems.length)
{
// 2nd cell (value column) contains the textfield
var textfieldCell = tree.selectedItems[0].firstChild.firstChild.nextSibling;
if (textfieldCell)
{
// Select its contents and set focus
SetTextfieldFocusById(textfieldCell.firstChild.id);
}
}
gSelecting = false;
}
// todo: implement attribute parsing, e.g. colorpicker appending, etc.

View File

@ -41,6 +41,7 @@
orient="vertical">
<keyset id="keyset"/>
<popupset id="aTooltipSet" />
<!-- Methods common to all editor dialogs -->
<script language="JavaScript" src="chrome://editor/content/EdDialogCommon.js"/>
@ -54,13 +55,6 @@
<script language="JavaScript" src="chrome://global/content/dialogOverlay.js" />
<script language="javascript" src="chrome://global/content/strres.js" />
<popupset>
<popup id="attlistPopup">
<menuitem value="&context.RemoveAttribute.label;" oncommand="doRemoveAttribute(document.popupNode);"/>
<menuitem value="&context.AddAttribute.label;" oncommand="doAddAttribute(document.popupNode);"/>
</popup>
</popupset>
<broadcaster id="args" value=""/>
<box autostretch="never">
@ -80,108 +74,126 @@
<!-- ============================================================== -->
<!-- HTML Attributes -->
<!-- ============================================================== -->
<box flex="1" orient="vertical">
<tree id="HTMLATree"
class="AttributesTree inset"
flex="1"
context="attlistPopup">
<treecols>
<treecol flex="35" width="0"/>
<splitter class="tree-splitter"/>
<treecol flex="65" width="0"/>
</treecols>
<treehead>
<treerow>
<treecell class="treecell-inset-header" value="&tree.attributeHeader.label;"/>
<treecell class="treecell-inset-header" value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="HTMLAList" flex="1"/>
</tree>
<box orient="vertical">
<spring class="spacer"/>
<titledbox orient="vertical">
<title value="&AddHTMLAttributeLabel.label;"/>
<box autostretch="never">
<text class="label" for="AddHTMLAttributeNameInput" value="&AttName.label;"/>
<textfield flex="1" id="AddHTMLAttributeNameInput" onkeyup="doHTMLEnabling(event.keyCode)" onmouseup="doHTMLEnabling(event.which)"/>
<text class="label" for="AddHTMLAttributeValueInput" value="&AttValue.label;"/>
<textfield flex="1" id="AddHTMLAttributeValueInput" onkeyup="doHTMLEnabling(event.keyCode)"/>
<button class="dialog" id="AddHTMLAttribute" oncommand="onAddHTMLAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/>
</box>
</titledbox>
</box>
<box flex="1" orient="vertical">
<tree id="HTMLATree"
class="AttributesTree inset"
flex="1"
tooltip="aTooltip" tooltiptext="Click on item to edit value"
onselect="SelectTreeItem(this)">
<treecols>
<treecol flex="35" width="0"/>
<splitter class="tree-splitter"/>
<treecol flex="65" width="0"/>
</treecols>
<treehead>
<treerow>
<treecell class="treecell-header" value="&tree.attributeHeader.label;"
tooltip="aTooltip" tooltiptext="Click on item to edit value"/>
<treecell class="treecell-header" value="&tree.valueHeader.label;"
tooltip="aTooltip" tooltiptext="Click on item to edit value"/>
</treerow>
</treehead>
<treechildren id="HTMLAList" flex="1"/>
</tree>
<box valign="middle" autostretch="never" flex="1">
<text class="label" value="&editAttribute.label;"/>
<spring flex="1"/>
<button class="dialog" value="&removeAttribute.label;" oncommand="RemoveAttribute('HTMLATree')"/>
</box>
<box orient="vertical">
<spring class="spacer"/>
<titledbox orient="vertical">
<title value="&AddHTMLAttributeLabel.label;"/>
<box autostretch="never">
<text class="label" for="AddHTMLAttributeNameInput" value="&AttName.label;"/>
<textfield flex="1" id="AddHTMLAttributeNameInput" onkeyup="doHTMLEnabling(event.keyCode)" onmouseup="doHTMLEnabling(event.which)" onfocus="dump('foo\n')"/>
<text class="label" for="AddHTMLAttributeValueInput" value="&AttValue.label;"/>
<textfield flex="1" id="AddHTMLAttributeValueInput" onkeyup="doHTMLEnabling(event.keyCode)"/>
<button class="dialog" id="AddHTMLAttribute" oncommand="onAddHTMLAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/>
</box>
</titledbox>
</box>
</box>
<!-- ============================================================== -->
<!-- CSS Attributes -->
<!-- ============================================================== -->
<box flex="1" orient="vertical">
<tree id="CSSATree" class="AttributesTree inset" flex="1" context="attlistPopup">
<treecolgroup>
<treecol flex="35" width="0"/>
<splitter class="tree-splitter"/>
<treecol flex="65" width="0"/>
</treecolgroup>
<treehead>
<treerow>
<treecell class="treecell-inset-header" value="&tree.attributeHeader.label;"/>
<treecell class="treecell-inset-header" value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="CSSAList" flex="1"/>
</tree>
<box orient="vertical">
<spring class="spacer"/>
<titledbox orient="vertical">
<title value="&AddCSSAttributeLabel.label;"/>
<box autostretch="never">
<text class="label" for="AddCSSAttributeNameInput" value="&AttName.label;"/>
<textfield flex="1" id="AddCSSAttributeNameInput" onkeyup="doCSSEnabling(event.keyCode)" onmouseup="doHTMLEnabling(event.which)"/>
<text class="label" for="AddCSSAttributeValueInput" value="&AttValue.label;"/>
<textfield flex="1" id="AddCSSAttributeValueInput" onkeyup="doCSSEnabling(event.keyCode)"/>
<button class="dialog" id="AddCSSAttribute" oncommand="onAddCSSAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/>
</box>
</titledbox>
</box>
<box flex="1" orient="vertical">
<tree id="CSSATree" class="AttributesTree inset" flex="1"
onselect="SelectTreeItem(this)">
<treecolgroup>
<treecol flex="35" width="0"/>
<splitter class="tree-splitter"/>
<treecol flex="65" width="0"/>
</treecolgroup>
<treehead>
<treerow>
<treecell class="treecell-header" value="&tree.attributeHeader.label;"/>
<treecell class="treecell-header" value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="CSSAList" flex="1"/>
</tree>
<box valign="middle" autostretch="never" flex="1">
<text class="label" value="&editAttribute.label;"/>
<spring flex="1"/>
<button class="dialog" value="&removeAttribute.label;" oncommand="RemoveAttribute('CSSATree')"/>
</box>
<box orient="vertical">
<spring class="spacer"/>
<titledbox orient="vertical">
<title value="&AddCSSAttributeLabel.label;"/>
<box autostretch="never">
<text class="label" for="AddCSSAttributeNameInput" value="&AttName.label;"/>
<textfield flex="1" id="AddCSSAttributeNameInput" onkeyup="doCSSEnabling(event.keyCode)" onmouseup="doHTMLEnabling(event.which)"/>
<text class="label" for="AddCSSAttributeValueInput" value="&AttValue.label;"/>
<textfield flex="1" id="AddCSSAttributeValueInput" onkeyup="doCSSEnabling(event.keyCode)"/>
<button class="dialog" id="AddCSSAttribute" oncommand="onAddCSSAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/>
</box>
</titledbox>
</box>
</box>
<!-- ============================================================== -->
<!-- JavaScript Event Handlers -->
<!-- ============================================================== -->
<box flex="1" orient="vertical">
<tree id="JSEATree" class="AttributesTree inset" flex="1" context="attlistPopup">
<treecolgroup>
<treecol flex="35" width="0"/>
<splitter class="tree-splitter"/>
<treecol flex="65" wdith="0"/>
</treecolgroup>
<treehead>
<treerow>
<treecell class="treecell-inset-header" value="&tree.attributeHeader.label;"/>
<treecell class="treecell-inset-header" value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="JSEAList" flex="1"/>
</tree>
<box orient="vertical">
<spring class="spacer"/>
<titledbox orient="vertical">
<title value="&AddJSEAttributeLabel.label;"/>
<box autostretch="never">
<text class="label" for="AddJSEAttributeNameInput" value="&AttName.label;"/>
<textfield type="text" flex="1" id="AddJSEAttributeNameInput" onkeyup="doJSEEnabling(event.keyCode)" onmouseup="doHTMLEnabling(event.which)"/>
<text class="label" for="AddJSEAttributeValueInput" value="&AttValue.label;"/>
<textfield flex="1" id="AddJSEAttributeValueInput" onkeyup="doJSEEnabling(event.keyCode)"/>
<button class="dialog" id="AddJSEAttribute" oncommand="onAddJSEAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/>
</box>
</titledbox>
</box>
<box flex="1" orient="vertical">
<tree id="JSEATree" class="AttributesTree inset" flex="1"
onselect="SelectTreeItem(this)">
<treecolgroup>
<treecol flex="35" width="0"/>
<splitter class="tree-splitter"/>
<treecol flex="65" wdith="0"/>
</treecolgroup>
<treehead>
<treerow>
<treecell class="treecell-header" value="&tree.attributeHeader.label;"/>
<treecell class="treecell-header" value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="JSEAList" flex="1"/>
</tree>
<box valign="middle" autostretch="never" flex="1">
<text class="label" value="&editAttribute.label;"/>
<spring flex="1"/>
<button class="dialog" value="&removeAttribute.label;" oncommand="RemoveAttribute('JSEATree')"/>
</box>
<box orient="vertical">
<spring class="spacer"/>
<titledbox orient="vertical">
<title value="&AddJSEAttributeLabel.label;"/>
<box autostretch="never">
<text class="label" for="AddJSEAttributeNameInput" value="&AttName.label;"/>
<textfield type="text" flex="1" id="AddJSEAttributeNameInput" onkeyup="doJSEEnabling(event.keyCode)" onmouseup="doHTMLEnabling(event.which)"/>
<text class="label" for="AddJSEAttributeValueInput" value="&AttValue.label;"/>
<textfield flex="1" id="AddJSEAttributeValueInput" onkeyup="doJSEEnabling(event.keyCode)"/>
<button class="dialog" id="AddJSEAttribute" oncommand="onAddJSEAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/>
</box>
</titledbox>
</box>
</box>
<!-- ============================================================== -->
</tabpanel>
</tabcontrol>
<separator/>
<spring class="spacer"/>
<box id="okCancelButtonsRight"/>
</window>

View File

@ -88,7 +88,7 @@
style="margin-right:0px;" oncommand="RemoveColor()"/>
</box>
</box>
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
<!-- from global dialogOverlay -->
<box id="okCancelButtons"/>
</window>

View File

@ -149,6 +149,6 @@
</row>
</rows>
</grid>
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
<box id="okCancelButtons"/>
</window>

View File

@ -109,6 +109,11 @@ function ValidateNumberString(value, minValue, maxValue)
return "";
}
function SetTextfieldFocusById(id)
{
SetTextfieldFocus(document.getElementById(id));
}
function SetTextfieldFocus(textfield)
{
if (textfield)
@ -252,11 +257,13 @@ function SetClassEnabledById( elementID, doEnable )
// but elementInDoc is needed to find parent context in document
function GetAppropriatePercentString(elementForAtt, elementInDoc)
{
if (elementForAtt.nodeName == "TD" || elementForAtt.nodeName == "TH")
var name = elementForAtt.nodeName.toLowerCase();
if ( name == "td" || name == "th")
return GetString("PercentOfTable");
// Check if element is within a table cell
if(editorShell.GetElementOrParentByTagName("td",elementInDoc))
// Check if current selection anchor node is within a table cell
if (editorShell.GetElementOrParentByTagName("td", elementInDoc))
return GetString("PercentOfCell");
else
return GetString("PercentOfWindow");
@ -607,7 +614,7 @@ function getContainer ()
if (selection)
{
var focusN = selection.focusNode;
if (focusN.nodeName == "TD")
if (focusN.nodeName.toLowerCase == "td")
return focusN
else
{

View File

@ -35,7 +35,7 @@
<button class="dialog" id="AdvancedEditButton1" oncommand="onAdvancedEdit()" value="&AdvancedEditButton.label;"
tooltip="aTooltip" tooltiptext="&AdvancedEditButton.tooltip;"/>
</box>
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
</box>
<!-- Extra buttons to use when just button is needed

View File

@ -83,7 +83,7 @@
<spring flex="1"/>
<button id="AdvancedEditButton"/>
</box>
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
<!-- from global dialogOverlay -->
<box id="okCancelButtons"/>
</window>

View File

@ -27,6 +27,8 @@ var insertNew = true;
var insertNewIMap = true;
var wasEnableAll = false;
var oldSourceInt = 0;
var startingWidth = 0;
var startingHeight = 0;
var imageElement;
var imageMap = 0;
var canRemoveImageMap = false;
@ -34,11 +36,36 @@ var imageMapDisabled = false;
var dialog;
var globalMap;
var doAltTextError = true;
var actualWidth = "";
var actualHeight = "";
var previewImage;
var timeoutId = -1;
// msec between attempts to load image
var interval = 200;
var intervalSum = 0;
// After this many msec, give up trying to load image
var intervalLimit = 60000;
// These must correspond to values in EditorDialog.css for each theme
// (unfortunately, setting "style" attribute here doesn't work!)
var previewImageWidth = 80;
var previewImageHeight = 50;
var StartupCalled = false;
// dialog initialization code
function Startup()
{
//XXX Very weird! When calling this with an existing image,
// we get called twice. That causes dialog layout
// to explode to fullscreen!
if (StartupCalled)
{
dump("*** CALLING IMAGE DIALOG Startup() AGAIN! ***\n");
return;
}
StartupCalled = true;
if (!InitEditorShell())
return;
@ -53,8 +80,8 @@ function Startup()
dialog.AdvancedEditButton = document.getElementById( "AdvancedEditButton" );
dialog.AdvancedEditButton2 = document.getElementById( "AdvancedEditButton2" );
dialog.MoreSection = document.getElementById( "MoreSection" );
dialog.customsizeRadio = document.getElementById( "customsizeRadio" );
dialog.originalsizeRadio = document.getElementById( "originalsizeRadio" );
dialog.customSizeRadio = document.getElementById( "customSizeRadio" );
dialog.actualSizeRadio = document.getElementById( "actualSizeRadio" );
dialog.constrainCheckbox = document.getElementById( "constrainCheckbox" );
dialog.widthInput = document.getElementById( "widthInput" );
dialog.heightInput = document.getElementById( "heightInput" );
@ -68,10 +95,12 @@ function Startup()
dialog.alignText = document.getElementById( "alignText" );
dialog.editImageMap = document.getElementById( "editImageMap" );
dialog.removeImageMap = document.getElementById( "removeImageMap" );
dialog.doConstrain = false;
dialog.isCustomSize = false;
dialog.ImageHolder = document.getElementById( "preview-image-holder" );
dialog.PreviewBox = document.getElementById( "preview-image-box" );
dialog.PreviewWidth = document.getElementById( "PreviewWidth" );
dialog.PreviewHeight = document.getElementById( "PreviewHeight" );
dialog.PreviewSize = document.getElementById( "PreviewSize" );
// Get a single selected image element
var tagName = "img"
imageElement = editorShell.GetSelectedElement(tagName);
@ -80,6 +109,8 @@ function Startup()
{
// We found an element and don't need to insert one
insertNew = false;
actualWidth = imageElement.naturalWidth;
actualHeight = imageElement.naturalHeight;
}
else
{
@ -125,7 +156,6 @@ function Startup()
insertNewIMap = true;
globalMap = null;
}
InitDialog();
// Set SeeMore bool to the OPPOSITE of the current state,
@ -151,82 +181,81 @@ function InitDialog()
var str = globalElement.getAttribute("src");
if (str)
{
dialog.srcInput.value = str;
GetImageFromURL();
}
str = globalElement.getAttribute("alt");
if (str)
dialog.altTextInput.value = str;
// Check for image map
// setup the height and width widgets
var width = InitPixelOrPercentMenulist(globalElement,
insertNew ? null : imageElement,
"width", "widthUnitsMenulist", gPixel);
var height = InitPixelOrPercentMenulist(globalElement,
insertNew ? null : imageElement,
"height", "heightUnitsMenulist", gPixel);
// if ( SeeMore )
{
// setup the height and width widgets
dialog.widthInput.value = InitPixelOrPercentMenulist(globalElement, imageElement, "width", "widthUnitsMenulist", gPixel);
dialog.heightInput.value = InitPixelOrPercentMenulist(globalElement, imageElement, "height", "heightUnitsMenulist", gPixel);
// TODO: We need to get the actual image dimensions.
// If different from attribute dimensions, then "custom" is checked.
// For now, always check custom, so we don't trash existing values
if ( dialog.widthInput.value.length && dialog.heightInput.value.length
&& dialog.widthInput.value != "0" && dialog.heightInput.value != "0")
{
dialog.isCustomSize = true;
dialog.customsizeRadio.checked = true;
}
else
{
dialog.isCustomSize = false;
dialog.originalsizeRadio.checked = true;
}
// Set actual radio button if both set values are the same as actual
if (actualWidth && actualHeight)
dialog.actualSizeRadio.checked = (width == actualWidth) && (height == actualHeight);
else if ( !(width || height) )
dialog.actualSizeRadio.checked = true;
// set spacing editfields
dialog.imagelrInput.value = globalElement.getAttribute("hspace");
dialog.imagetbInput.value = globalElement.getAttribute("vspace");
dialog.border.value = globalElement.getAttribute("border");
if (!dialog.actualSizeRadio.checked)
dialog.customSizeRadio.checked = true;
dialog.widthInput.value = startingWidth = width ? width : (actualWidth ? actualWidth : "");
dialog.heightInput.value = startingHeight = height ? height : (actualHeight ? actualHeight : "");
// Get alignment setting
var align = globalElement.getAttribute("align");
if (align) {
align = align.toLowerCase();
}
var imgClass;
var textID;
switch ( align )
{
case "top":
dialog.alignTypeSelect.selectedIndex = 0;
imgClass = "img-align-top";
textID = "topText";
break;
case "center":
dialog.alignTypeSelect.selectedIndex = 1;
imgClass = "img-align-middle";
textID = "middleText";
break;
case "right":
// Note: this means the image is on the right
dialog.alignTypeSelect.selectedIndex = 3;
imgClass = "img-align-right";
textID = "rightText";
break;
case "left":
// Note: this means the image is on the left
dialog.alignTypeSelect.selectedIndex = 4;
imgClass = "img-align-left";
textID = "leftText";
break;
default: // Default or "bottom"
dialog.alignTypeSelect.selectedIndex = 2;
imgClass = "img-align-bottom";
textID = "bottomText";
break;
}
// Set the same image and text as used in the selected menuitem in the menulist
// Image url is CSS-driven based on class
dialog.alignImage.setAttribute("class", imgClass);
dialog.alignText.setAttribute("value", document.getElementById(textID).getAttribute("value"));
// set spacing editfields
dialog.imagelrInput.value = globalElement.getAttribute("hspace");
dialog.imagetbInput.value = globalElement.getAttribute("vspace");
dialog.border.value = globalElement.getAttribute("border");
// Get alignment setting
var align = globalElement.getAttribute("align");
if (align) {
align = align.toLowerCase();
}
var imgClass;
var textID;
switch ( align )
{
case "top":
dialog.alignTypeSelect.selectedIndex = 0;
imgClass = "img-align-top";
textID = "topText";
break;
case "center":
dialog.alignTypeSelect.selectedIndex = 1;
imgClass = "img-align-middle";
textID = "middleText";
break;
case "right":
// Note: this means the image is on the right
dialog.alignTypeSelect.selectedIndex = 3;
imgClass = "img-align-right";
textID = "rightText";
break;
case "left":
// Note: this means the image is on the left
dialog.alignTypeSelect.selectedIndex = 4;
imgClass = "img-align-left";
textID = "leftText";
break;
default: // Default or "bottom"
dialog.alignTypeSelect.selectedIndex = 2;
imgClass = "img-align-bottom";
textID = "bottomText";
break;
}
// Set the same image and text as used in the selected menuitem in the menulist
// Image url is CSS-driven based on class
dialog.alignImage.setAttribute("class", imgClass);
dialog.alignText.setAttribute("value", document.getElementById(textID).getAttribute("value"));
// we want to force an update so initialize "wasEnableAll" to be the opposite of what the actual state is
wasEnableAll = !IsValidImage(dialog.srcInput.value);
@ -238,89 +267,150 @@ function chooseFile()
{
// Get a local file, converted into URL format
var fileName = GetLocalFileURL("img");
if (fileName && fileName != "") {
if (fileName) {
dialog.srcInput.value = fileName;
doOverallEnabling();
}
GetImageFromURL();
// Put focus into the input field
SetTextfieldFocus(dialog.srcInput);
}
function SetGlobalElementToCurrentDialogSettings()
function GetImageFromURL()
{
// src
var str = dialog.srcInput.value.trimString();
globalElement.setAttribute("src", str);
dialog.PreviewSize.setAttribute("collapsed", "true");
// alt
str = dialog.altTextInput.value.trimString();
globalElement.setAttribute("alt", str);
var alignment;
//Note that the attributes "left" and "right" are opposite
// of what we use in the UI, which describes where the TEXT wraps,
// not the image location (which is what the HTML describes)
switch ( dialog.alignTypeSelect.selectedIndex )
// Remove existing preview image
// (other attempts to just change "src" fail;
// once we fail to load, further setting of src fail)
if (dialog.ImageHolder.firstChild)
{
case 0:
alignment = "top";
break;
case 1:
alignment = "center";
break;
case 3:
alignment = "right";
break;
case 4:
alignment = "left";
break;
default: // Default or "bottom" (2)
alignment = "";
break;
//previewImage.setAttribute("width", 0);
//previewImage.setAttribute("height", 0);
dialog.ImageHolder.removeChild(dialog.ImageHolder.firstChild);
}
var imageSrc = dialog.srcInput.value;
if (imageSrc) imageSrc = imageSrc.trimString();
if (!imageSrc) return;
if (IsValidImage(imageSrc))
{
if (!dialog.ImageHolder.firstChild)
{
// Append an image to the dialog to trigger image loading
// and also serves as a preview
previewImage = editorShell.CreateElementWithDefaults("img");
if (!previewImage) return;
dialog.ImageHolder.appendChild(previewImage);
}
previewImage.src = imageSrc;
// Get the origin width from the image or setup timer to get later
if (previewImage.complete)
GetActualSize();
else
{
// Start timer to poll until image is loaded
//dump("*** Starting timer to get natural image size...\n");
timeoutId = window.setInterval("GetActualSize()", interval);
intervalSum = 0;
}
}
}
function GetActualSize()
{
if (intervalSum > intervalLimit)
{
dump(" Timeout trying to load preview image\n");
CancelTimer();
return;
}
if ( alignment == "" )
globalElement.removeAttribute( "align" );
if (!previewImage)
{
CancelTimer();
}
else
globalElement.setAttribute( "align", alignment );
{
if (previewImage.complete)
{
// Image loading has completed -- we can get actual width
CancelTimer();
actualWidth = startingWidth = previewImage.naturalWidth;
actualHeight = startingHeight = previewImage.naturalHeight;
//dump("*** Setting previewImage to: "+previewImage.src+"\n");
//dump("actualWidth="+actualWidth+", actualHeight"+actualHeight+"\n");
if ( dialog.imagelrInput.value )
globalElement.setAttribute("hspace", dialog.imagelrInput.value);
else
globalElement.removeAttribute("hspace");
if ( dialog.imagetbInput.value )
globalElement.setAttribute("vspace", dialog.imagetbInput.value);
else
globalElement.removeAttribute("vspace");
if (actualWidth && actualHeight)
{
// Use actual size or scale to fit preview if either dimension is too large
var width = actualWidth;
var height = actualHeight;
if (actualWidth > previewImageWidth)
{
width = previewImageWidth;
height = actualHeight * (previewImageWidth / actualWidth);
}
if (height > previewImageHeight)
{
height = previewImageHeight;
width = actualWidth * (previewImageHeight / actualHeight);
}
if (actualWidth > previewImageWidth || actualHeight > previewImageHeight)
{
// Resize image to fit preview frame
previewImage.setAttribute("width", width);
previewImage.setAttribute("height", height);
}
if ( dialog.border.value )
globalElement.setAttribute("border", dialog.border.value);
else
globalElement.removeAttribute("border");
// width
str = dialog.widthInput.value;
if (dialog.widthUnitsMenulist.selectedIndex == 1)
str = str + "%";
globalElement.setAttribute("width", str);
dialog.PreviewWidth.setAttribute("value", actualWidth);
dialog.PreviewHeight.setAttribute("value", actualHeight);
// height
str = dialog.heightInput.value;
if (dialog.heightUnitsMenulist.selectedIndex == 1)
str = str + "%";
globalElement.setAttribute("height", str);
dialog.PreviewSize.setAttribute("collapsed", "false");
dialog.ImageHolder.setAttribute("collapsed", "false");
}
if (dialog.actualSizeRadio.checked)
SetActualSize();
}
else
{
//dump("*** Waiting for image loading...\n");
// Accumulate time so we don't do try this forever
intervalSum += interval;
}
}
}
function SetActualSize()
{
dialog.widthInput.value = actualWidth ? actualWidth : "";
dialog.heightInput.value = actualHeight ? actualHeight : "";
doDimensionEnabling();
}
function CancelTimer()
{
if (timeoutId != -1)
{
//dump("*** CancelTimer\n");
window.clearInterval(timeoutId);
timeoutId = -1;
}
intervalSum = 0;
}
function ChangeImageSrc()
{
GetImageFromURL();
doOverallEnabling();
}
function onMoreFewerImage()
{
if (SeeMore)
{
dialog.isCustomSize = dialog.customsizeRadio.checked;
dialog.doConstrain = dialog.constrainCheckbox.checked;
SetGlobalElementToCurrentDialogSettings();
dialog.MoreSection.setAttribute("collapsed","true");
dialog.MoreFewerButton.setAttribute("value", GetString("MoreProperties"));
dialog.MoreFewerButton.setAttribute("more","0");
@ -349,9 +439,9 @@ function onMoreFewerImage()
function doDimensionEnabling()
{
// Enabled only if "Custom" is checked
var enable = (dialog.customsizeRadio.checked);
var enable = (dialog.customSizeRadio.checked);
if ( !dialog.customsizeRadio.checked && !dialog.originalsizeRadio.checked)
if ( !dialog.customSizeRadio.checked && !dialog.actualSizeRadio.checked)
dump("BUG! neither radio button is checked!!!! \n");
SetElementEnabledById( "widthInput", enable );
@ -413,7 +503,13 @@ function constrainProportions( srcID, destID )
// src / dest ratio mantained
// newDest = (newSrc * oldDest / oldSrc)
if ( oldSourceInt == 0 )
if ( !oldSourceInt && startingWidth && startingHeight )
{
// Initialize with starting value
oldSourceInt = (srcID == "widthInput") ? startingWidth : startingHeight;
}
if ( !oldSourceInt )
destElement.value = srcElement.value;
else
destElement.value = Math.round( srcElement.value * destElement.value / oldSourceInt );
@ -484,45 +580,21 @@ function ValidateData()
}
globalElement.setAttribute("alt", alt);
//TODO: WE SHOULD ALWAYS SET WIDTH AND HEIGHT FOR FASTER IMAGE LAYOUT
// IF USER DOESN'T SET IT, WE NEED TO GET VALUE FROM ORIGINAL IMAGE
var width = "";
var height = "";
var isPercentWidth, isPercentHeight;
var maxLimitWidth, maxLimitHeight;
if ( SeeMore )
if (dialog.actualSizeRadio.checked)
{
dialog.isCustomSize = dialog.customsizeRadio.checked;
isPercentWidth = (dialog.widthUnitsMenulist.selectedIndex == 1);
isPercentHeight = (dialog.heightUnitsMenulist.selectedIndex == 1);
width = actualWidth ? actualWidth : "";
height = actualHeight ? actualHeight : "";
}
else /* can't SeeMore */
else
{
var tailindex;
width = globalElement.getAttribute( "width" );
tailindex = width.lastIndexOf("%");
isPercentWidth = ( tailindex > 0 );
if ( isPercentWidth )
width = width.substring(0, tailindex);
height = globalElement.getAttribute( "height" );
tailindex = height.lastIndexOf("%");
isPercentHeight = ( tailindex > 0 );
if ( isPercentHeight )
height = height.substring(0, tailindex);
}
isPercentWidth = (dialog.widthUnitsMenulist.selectedIndex == 1);
isPercentHeight = (dialog.heightUnitsMenulist.selectedIndex == 1);
if ( SeeMore && dialog.originalsizeRadio.checked )
{
// original size: don't do anything right now
}
else if ( (SeeMore && dialog.customsizeRadio.checked)
|| dialog.isCustomSize )
{
maxLimitWidth = isPercentWidth ? 100 : maxPixels; // Defined in EdDialogCommon.js
width = ValidateNumberString(dialog.widthInput.value, 1, maxLimitWidth);
if (width == "")
@ -547,84 +619,76 @@ function ValidateData()
if (isPercentHeight)
height = height + "%";
}
if ( !dialog.isCustomSize )
{
// for now (until we can get the actual image dimensions), clear the height/width attributes if not set
globalElement.removeAttribute( "width" );
globalElement.removeAttribute( "height" );
}
// We always set the width and height attributes, even if same as actual.
// This speeds up layout of pages since sizes are known before image is downloaded
// (But don't set if we couldn't obtain actual dimensions)
if (width)
globalElement.setAttribute("width", width);
else
{
if (width)
globalElement.setAttribute("width", width);
if (height)
globalElement.setAttribute("height", height);
}
globalElement.removeAttribute("width");
if (height)
globalElement.setAttribute("height", height);
else
globalElement.removeAttribute("height");
// spacing attributes
// All of these should use ValidateNumberString() to
// ensure value is within acceptable range
var amount;
if ( SeeMore )
{
dump("SeeMore spacing attribs\n");
if ( dialog.imagelrInput.value )
{
amount = ValidateNumberString(dialog.imagelrInput.value, 0, maxPixels);
if (amount == "")
return false;
globalElement.setAttribute( "hspace", amount );
}
else
globalElement.removeAttribute( "hspace" );
if ( dialog.imagelrInput.value )
{
amount = ValidateNumberString(dialog.imagelrInput.value, 0, maxPixels);
if (amount == "")
return false;
globalElement.setAttribute( "hspace", amount );
}
else
globalElement.removeAttribute( "hspace" );
if ( dialog.imagetbInput.value )
{
var vspace = ValidateNumberString(dialog.imagetbInput.value, 0, maxPixels);
if (vspace == "")
return false;
globalElement.setAttribute( "vspace", vspace );
}
else
globalElement.removeAttribute( "vspace" );
if ( dialog.imagetbInput.value )
{
var vspace = ValidateNumberString(dialog.imagetbInput.value, 0, maxPixels);
if (vspace == "")
return false;
globalElement.setAttribute( "vspace", vspace );
}
else
globalElement.removeAttribute( "vspace" );
// note this is deprecated and should be converted to stylesheets
if ( dialog.border.value )
{
var border = ValidateNumberString(dialog.border.value, 0, maxPixels);
if (border == "")
return false;
globalElement.setAttribute( "border", border );
}
else
globalElement.removeAttribute( "border" );
// Default or setting "bottom" means don't set the attribute
// Note that the attributes "left" and "right" are opposite
// of what we use in the UI, which describes where the TEXT wraps,
// not the image location (which is what the HTML describes)
var align = "";
switch ( dialog.alignTypeSelect.selectedIndex )
{
case 0:
align = "top";
break;
case 1:
align = "center";
break;
case 3:
align = "right";
break;
case 4:
align = "left";
break;
}
if (align == "")
globalElement.removeAttribute( "align" );
else
globalElement.setAttribute( "align", align );
}
if ( dialog.border.value )
{
var border = ValidateNumberString(dialog.border.value, 0, maxPixels);
if (border == "")
return false;
globalElement.setAttribute( "border", border );
}
else
globalElement.removeAttribute( "border" );
// Default or setting "bottom" means don't set the attribute
// Note that the attributes "left" and "right" are opposite
// of what we use in the UI, which describes where the TEXT wraps,
// not the image location (which is what the HTML describes)
var align = "";
switch ( dialog.alignTypeSelect.selectedIndex )
{
case 0:
align = "top";
break;
case 1:
align = "center";
break;
case 3:
align = "right";
break;
case 4:
align = "left";
break;
}
if (align == "")
globalElement.removeAttribute( "align" );
else
globalElement.setAttribute( "align", align );
return true;
}
@ -686,9 +750,14 @@ function onOK()
editorShell.InsertElementAtSelection(test, false);*/
SaveWindowLocation();
CancelTimer();
return true;
}
return false;
}
function onImageCancel()
{
CancelTimer();
onCancel();
}

View File

@ -64,12 +64,12 @@
for = "srcInput"
value = "&locationEditField.label;"
tooltip="aTooltip" tooltiptext="&locationEditField.tooltip;"
align = "right" />
/>
<textfield
id = "srcInput"
onkeyup = "doOverallEnabling()"
onmouseup = "doOverallEnabling()"
onchange = "doOverallEnabling()"
onchange = "ChangeImageSrc()"
style = "min-width : 20em"/>
<!-- from EdDialogOverlay.xul -->
<button id="ChooseFile" />
@ -90,7 +90,7 @@
<spring class="spacer"/>
</titledbox>
<spring class="spacer"/>
<box>
<box valign="middle" autostretch="never">
<button
class = "dialog"
id = "MoreFewerButton"
@ -98,11 +98,34 @@
oncommand = "onMoreFewerImage()"
tooltip = "aTooltip" tooltiptext = "&MoreFewerButton.tooltip;"
persist = "more"/>
<spring class="spacer"/>
<titledbox style="padding: 4px">
<box id="preview-image-box" valign="middle" autostretch="never">
<spring flex="1"/>
<html id="preview-image-holder"/>
<spring flex="1"/>
</box>
<box id="PreviewSize" orient="vertical" collapsed="true">
<spring flex="1"/>
<text class="label" value="&actualSize.label;"/>
<box orient="horizontal">
<text class="label" value="&widthEditField.label;"/>
<spring flex="1"/>
<text id="PreviewWidth" class="label"/>
</box>
<box orient="horizontal">
<text class="label" value="&heightEditField.label;"/>
<spring flex="1"/>
<text id="PreviewHeight" class="label"/>
</box>
<spring flex="1"/>
</box>
</titledbox>
<spring flex="1"/>
<!-- From EdDialogOverlay.xul -->
<button id="AdvancedEditButton"/>
</box>
<spring class="spacer"/>
<!-- Area that shows and hides via MoreFewerButton -->
<box id="MoreSection" orient="vertical" flex="1">
<box>
@ -114,13 +137,13 @@
<radiogroup id="imgSizeGroup" orient="vertical">
<radio
group = "imgSizeGroup"
id = "originalsizeRadio"
value = "&originalSizeRadio.label;"
tooltip = "aTooltip" tooltiptext="&originalSizeRadio.tooltip;"
oncommand = "doDimensionEnabling();"/>
id = "actualSizeRadio"
value = "&actualSizeRadio.label;"
tooltip = "aTooltip" tooltiptext="&actualSizeRadio.tooltip;"
oncommand = "SetActualSize()"/>
<radio
group = "imgSizeGroup"
id = "customsizeRadio"
id = "customSizeRadio"
value = "&customSizeRadio.label;"
tooltip = "aTooltip" tooltiptext="&customSizeRadio.tooltip;"
oncommand = "doDimensionEnabling();" />
@ -130,6 +153,7 @@
<spring flex="1"/>
<!--////// CONSTRAIN DIMENSIONS //////-->
<checkbox id="constrainCheckbox" value="&constrainCheckbox.label;"
oncommand="document.getElementById('widthInput').focus()"
tooltip="aTooltip" tooltiptext="&constrainCheckbox.tooltip;"/>
</box>
<spring flex="1"/>
@ -168,6 +192,7 @@
</row>
</rows>
</grid>
<spring flex="1"/>
</titledbox>
<!--////// IMAGE MAP BUTTONS //////-->
<titledbox orient="vertical" flex="1">
@ -300,8 +325,7 @@
<button id="AdvancedEditButton2"/>
</box>
</box> <!-- END OF MORE/FEWER SECTION -->
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
<!-- from global dialogOverlay -->
<box id="okCancelButtons"/>
</window>

View File

@ -58,7 +58,7 @@
<text class="bold" value="&exampleCloseTag.label;"/>
</box>
<spring class="spacer"/>
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
<!-- from global dialogOverlay -->
<box id="okCancelButtons"/>
</window>

View File

@ -66,7 +66,7 @@
</box>
</box>
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
<!-- from global dialogOverlay -->
<box id="okCancelButtons"/>
</window>

View File

@ -72,6 +72,6 @@
</grid>
<spring class="bigspacer"/>
<html class="wrap" flex="1">&EditHEADSource.label;</html>
<separator class="groove"/>
<separator class="groove-thin tb-margin"/>
<box id="okCancelButtons"/>
</window>

View File

@ -43,6 +43,8 @@ var defVAlign = "middle";
var topStr = "top";
var bottomStr = "bottom";
var bgcolor = "bgcolor";
var TableColor;
var CellColor;
var rowCount = 1;
var colCount = 1;
@ -123,18 +125,9 @@ function Startup()
dialog.CellHAlignList = document.getElementById("CellHAlignList");
dialog.CellAlignCharInput = document.getElementById("CellAlignCharInput");
dialog.CellVAlignList = document.getElementById("CellVAlignList");
dialog.CellStyleList = document.getElementById("CellStyleList");
dialog.TextWrapList = document.getElementById("TextWrapList");
dialog.CellInheritColor = document.getElementById("CellInheritColor");
dialog.CellHeightCheckbox = document.getElementById("CellHeightCheckbox");
dialog.CellWidthCheckbox = document.getElementById("CellWidthCheckbox");
dialog.RowSpanCheckbox = document.getElementById("RowSpanCheckbox");
dialog.ColSpanCheckbox = document.getElementById("ColSpanCheckbox");
dialog.CellHAlignCheckbox = document.getElementById("CellHAlignCheckbox");
dialog.CellVAlignCheckbox = document.getElementById("CellVAlignCheckbox");
dialog.CellStyleCheckbox = document.getElementById("CellStyleCheckbox");
dialog.TextWrapCheckbox = document.getElementById("TextWrapCheckbox");
dialog.HeaderCheck = document.getElementById("HeaderCheck");
dialog.NoWrapCheck = document.getElementById("NoWrapCheck");
TabPanel = document.getElementById("TabPanel");
var TableTab = document.getElementById("TableTab");
@ -271,7 +264,8 @@ function InitDialog()
}
dialog.TableCaptionList.selectedIndex = index;
SetColor("tableBackgroundCW", globalTableElement.bgColor);
TableColor = globalTableElement.bgColor;
SetColor("tableBackgroundCW", TableColor);
InitCellPanel(SelectedCellsType);
}
@ -316,9 +310,9 @@ function InitCellPanel()
{
dialog.CellAlignCharInput.value = alignChar;
dialog.CellHAlignList.selectedIndex = 4;
dialog.CellAlignCharInput.removeAttribute("collapsed");
} else {
}
else
{
// "char" align set but no alignment char value
dialog.CellHAlignList.selectedIndex = 0;
}
@ -328,14 +322,14 @@ function InitCellPanel()
break;
}
// Hide align char input if not that align type
dialog.CellHAlignList.selectedIndex != 4
dialog.CellAlignCharInput.setAttribute("collapsed","true");
// Hide align char input if not appropriate align type
dialog.CellHAlignList.selectedIndex == 4 ? "true" : "";
dialog.CellStyleList.selectedIndex = (globalCellElement.nodeName == "TH") ? 1 : 0;
dialog.TextWrapList.selectedIndex = globalCellElement.noWrap ? 1 : 0;
dialog.HeaderCheck.checked = globalCellElement.nodeName.toLowerCase() == "th";
dialog.NoWrapCheck.checked = globalCellElement.noWrap ? true : false;
SetColor("cellBackgroundCW", globalCellElement.bgColor);
CellColor = globalCellElement.bgColor;
SetColor("cellBackgroundCW", CellColor);
}
}
@ -390,24 +384,51 @@ function SelectCellTab()
function SelectCellHAlign()
{
if (dialog.CellHAlignList.selectedIndex == 4)
{
// Activate the textfield for the alignment character
dialog.CellAlignCharInput.removeAttribute("collapsed");
SetTextfieldFocus(dialog.CellAlignCharInput);
}
else
dialog.CellAlignCharInput.setAttribute("collapsed","true");
SetCheckbox("CellHAlignCheckbox");
}
function GetColorAndUpdate(ColorPickerID, ColorWellID, CheckboxID, popup)
function GetColorAndUpdate(ColorWellID)
{
// Close the colorpicker
popup.closePopup();
var color = null;
if (ColorPickerID)
color = getColor(ColorPickerID);
var colorWell = document.getElementById(ColorWellID);
if (!colorWell) return;
SetColor(ColorWellID, color);
SetCheckbox(CheckboxID);
var colorObj = new Object;
switch( ColorWellID )
{
case "tableBackgroundCW":
colorObj.Type = "Table";
colorObj.TableColor = TableColor;
break;
case "cellBackgroundCW":
colorObj.Type = "Cell";
colorObj.CellColor = CellColor;
break;
}
window.openDialog("chrome://editor/content/EdColorPicker.xul", "_blank", "chrome,close,titlebar,modal", "", colorObj);
// User canceled the dialog
if (colorObj.Cancel)
return;
switch( ColorWellID )
{
case "tableBackgroundCW":
TableColor = colorObj.BackgroundColor;
SetColor(ColorWellID, TableColor);
break;
case "cellBackgroundCW":
CellColor = colorObj.BackgroundColor;
SetColor(ColorWellID, CellColor);
break;
}
}
function SetColor(ColorWellID, color)
@ -478,7 +499,7 @@ function ChangeSelection(newType)
DoCellSelection();
SetSelectionButtons();
// Enable/Disable appropriate span checkboxes
// Enable/Disable appropriate span textfields
SetSpanEnable();
// Note: globalCellElement should still be a clone of CellElement
@ -624,7 +645,6 @@ dump("Moving selection -- apply attributes...\n");
{
dump("InitCellPanel should be called...\n");
InitCellPanel();
// Uncheck all the checkboxes used from last selection?
}
// Change the selection
@ -671,9 +691,9 @@ function SetSelectionButtons()
function SetSpanEnable()
{
// If entire row is selected, don't allow changing colspan...
dialog.RowSpanCheckbox.setAttribute("disabled", (SelectedCellsType == SELECT_COLUMN) ? "true" : "false");
dialog.RowSpanInput.setAttribute("disabled", (SelectedCellsType == SELECT_COLUMN) ? "true" : "false");
// ...and similarly:
dialog.ColSpanCheckbox.setAttribute("disabled", (SelectedCellsType == SELECT_ROW) ? "true" : "false");
dialog.ColSpanInput.setAttribute("disabled", (SelectedCellsType == SELECT_ROW) ? "true" : "false");
}
function SwitchPanel(newPanel)
@ -706,7 +726,7 @@ function ValidateNumber(inputWidgetID, listWidget, minVal, maxVal, element, attN
var isPercent = false;
var numString = inputWidget.value.trimString();
if (numString && numString != "")
if (numString)
{
if (listWidget)
isPercent = (listWidget.selectedIndex == 1);
@ -714,7 +734,7 @@ function ValidateNumber(inputWidgetID, listWidget, minVal, maxVal, element, attN
maxLimit = 100;
numString = ValidateNumberString(numString, minVal, maxLimit);
if(numString == "")
if(!numString)
{
dump("Error returned from ValidateNumberString\n");
@ -787,70 +807,63 @@ function ValidateCellData()
validatePanel = CellPanel;
if (dialog.CellHeightCheckbox.checked)
{
ValidateNumber("CellHeightInput", dialog.CellHeightUnits,
1, maxPixels, globalCellElement, "height");
if (error) return false;
}
ValidateNumber("CellHeightInput", dialog.CellHeightUnits,
1, maxPixels, globalCellElement, "height");
if (error) return false;
if (dialog.CellWidthCheckbox.checked)
{
ValidateNumber("CellWidthInput", dialog.CellWidthUnits,
1, maxPixels, globalCellElement, "width");
if (error) return false;
}
ValidateNumber("CellWidthInput", dialog.CellWidthUnits,
1, maxPixels, globalCellElement, "width");
if (error) return false;
if (dialog.RowSpanCheckbox.checked && dialog.RowSpanCheckbox.disabled != "true")
if (dialog.RowSpanInput.disabled != "true")
{
// Note that span = 0 is allowed and means "span entire row/col"
ValidateNumber("RowSpanInput", null,
0, rowCount, globalCellElement, "rowspan");
if (error) return false;
}
if (dialog.ColSpanCheckbox.checked && dialog.ColSpanCheckbox.getAttribute("disabled") != "true")
if (dialog.ColSpanInput.getAttribute("disabled") != "true")
{
ValidateNumber("ColSpanInput", null,
0, colCount, globalCellElement, "colspan");
if (error) return false;
}
if (dialog.CellHAlignCheckbox.checked)
{
// Vertical alignment is complicated by "char" type
var hAlign = dialog.CellHAlignList.selectedItem.data;
dump("Cell hAlign = "+hAlign+"\n");
// Vertical alignment is complicated by "char" type
var hAlign = dialog.CellHAlignList.selectedItem.data;
if (hAlign != charStr)
globalCellElement.removeAttribute(charStr);
if (hAlign == "left")
if (hAlign != charStr)
globalCellElement.removeAttribute(charStr);
if (hAlign == "left")
{
globalCellElement.removeAttribute("align");
}
else
{
if (hAlign == charStr)
{
globalCellElement.removeAttribute("align");
}
else
{
if (hAlign == charStr)
//Note: Is space a valid align character?
// Assume yes and don't use "trimString()"
var alignChar = dialog.CellAlignCharInput.value.charAt(0);
globalCellElement.setAttribute(charStr, alignChar);
if (!alignChar)
{
var alignChar = dialog.CellAlignCharInput.value.trimString().charAt(0);
globalCellElement.setAttribute(charStr, alignChar);
dump("Alignment char="+alignChar+"\n");
ShowInputErrorMessage(GetString("NoAlignChar"));
SetTextfieldFocus(dialog.CellAlignCharInput);
return false;
}
globalCellElement.setAttribute("align", hAlign);
}
globalCellElement.setAttribute("align", hAlign);
}
if (dialog.CellVAlignCheckbox.checked)
SetAlign("CellVAlignList", defVAlign, globalCellElement, "valign");
SetAlign("CellVAlignList", defVAlign, globalCellElement, "valign");
if (dialog.NoWrapCheck.checked)
globalCellElement.setAttribute("nowrap","true");
else
globalCellElement.removeAttribute("nowrap");
if (dialog.TextWrapCheckbox.checked)
{
if (dialog.TextWrapList.selectedIndex == 1)
globalCellElement.setAttribute("nowrap","true");
else
globalCellElement.removeAttribute("nowrap");
}
return true;
}
@ -884,26 +897,18 @@ function ValidateData()
return true;
}
// Call this when a textfield or menulist is changed
// so the checkbox is automatically set
function SetCheckbox(checkboxID)
{
if (checkboxID && checkboxID.length > 0)
{
// Set associated checkbox
document.getElementById(checkboxID).checked = true;
}
if (currentPanel == CellPanel)
CellDataChanged = true;
}
function ChangeIntTextfield(textfieldID, checkboxID)
function ChangeCellTextfield(textfieldID)
{
// Filter input for just integers
forceInteger(textfieldID);
// Set associated checkbox
SetCheckbox(checkboxID);
if (currentPanel == CellPanel)
CellDataChanged = true;
}
function ChangeCellData()
{
CellDataChanged = true;
}
function CloneAttribute(destElement, srcElement, attr)
@ -973,6 +978,8 @@ function ApplyTableAttributes()
}
var countDelta;
var foundcell;
var i;
// If user is deleting any cells and get confirmation
// (This is a global to the dialog and we ask only once per dialog session)
@ -1015,8 +1022,8 @@ function ApplyTableAttributes()
{
// Find first cell starting in first row we delete
var firstDeleteRow = rowCount + countDelta;
var foundCell = false;
for (var i = 0; i <= lastColIndex; i++)
foundCell = false;
for ( i = 0; i <= lastColIndex; i++)
{
if (!GetCellData(firstDeleteRow, i))
break; // We failed to find a cell
@ -1081,8 +1088,8 @@ function ApplyTableAttributes()
if (canDelete)
{
var firstDeleteCol = colCount + countDelta;
var foundCell = false;
for (var i = 0; i <= lastRowIndex; i++)
foundCell = false;
for ( i = 0; i <= lastRowIndex; i++)
{
// Find first cell starting in first column we delete
if (!GetCellData(i, firstDeleteCol))
@ -1138,44 +1145,27 @@ function ApplyCellAttributes()
function ApplyAttributesToOneCell(destElement)
{
if (dialog.CellHeightCheckbox.checked)
CloneAttribute(destElement, globalCellElement, "height");
CloneAttribute(destElement, globalCellElement, "height");
if (dialog.CellWidthCheckbox.checked)
CloneAttribute(destElement, globalCellElement, "width");
CloneAttribute(destElement, globalCellElement, "width");
if (dialog.RowSpanCheckbox.checked && dialog.RowSpanCheckbox.getAttribute("disabled") != "true")
CloneAttribute(destElement, globalCellElement, "rowspan");
if (dialog.RowSpanInput.getAttribute("disabled") != "true")
CloneAttribute(destElement, globalCellElement, "rowspan");
if (dialog.ColSpanCheckbox.checked && dialog.ColSpanCheckbox.getAttribute("disabled") != "true")
if (dialog.ColSpanInput.getAttribute("disabled") != "true")
CloneAttribute(destElement, globalCellElement, "colspan");
if (dialog.CellHAlignCheckbox.checked)
{
CloneAttribute(destElement, globalCellElement, "align");
CloneAttribute(destElement, globalCellElement, charStr);
}
if (dialog.CellVAlignCheckbox.checked)
CloneAttribute(destElement, globalCellElement, "valign");
if (dialog.TextWrapCheckbox.checked)
CloneAttribute(destElement, globalCellElement, "nowrap");
CloneAttribute(destElement, globalCellElement, "align");
CloneAttribute(destElement, globalCellElement, charStr);
CloneAttribute(destElement, globalCellElement, "valign");
CloneAttribute(destElement, globalCellElement, "nowrap");
CloneAttribute(destElement, globalCellElement, "bgcolor");
if (dialog.CellStyleCheckbox.checked)
if (dialog.HeaderCheck.checked == (destElement.nodeName.toLowerCase() == "td"))
{
var newStyleIndex = dialog.CellStyleList.selectedIndex;
var currentStyleIndex = (destElement.nodeName == "TH") ? 1 : 0;
if (newStyleIndex != currentStyleIndex)
{
// Switch cell types
// (replaces with new cell and copies attributes and contents)
destElement = editorShell.SwitchTableCellHeaderType(destElement);
CurrentStyleIndex = newStyleIndex;
}
// Switch cell types
// (replaces with new cell and copies attributes and contents)
destElement = editorShell.SwitchTableCellHeaderType(destElement);
}
}

View File

@ -60,12 +60,12 @@
<columns><column/><column/></columns>
<rows>
<row valign="middle">
<checkbox id="RowsCheckbox" value="&tableRows.label;"/>
<textfield class="narrow" id="TableRowsInput" onkeyup="ChangeIntTextfield(this.id,'RowsCheckbox');"/>
<text class="label" value="&tableRows.label;"/>
<textfield class="narrow" id="TableRowsInput" onkeyup="forceInteger(this.id);"/>
</row>
<row valign="middle">
<checkbox id="ColumnsCheckbox" value="&tableColumns.label;"/>
<textfield class="narrow" id="TableColumnsInput" onkeyup="ChangeIntTextfield(this.id,'ColumnsCheckbox');"/>
<text class="label" value="&tableColumns.label;"/>
<textfield class="narrow" id="TableColumnsInput" onkeyup="forceInteger(this.id);"/>
</row>
</rows>
</grid>
@ -74,90 +74,74 @@
<columns><column/><column/><column/></columns>
<rows>
<row valign="middle">
<checkbox id="TableHeightCheckbox" value="&tableHeight.label;"/>
<textfield class="narrow" id="TableHeightInput" onkeyup="ChangeIntTextfield(this.id,'TableHeightCheckbox');"/>
<menulist id="TableHeightUnits" oncommand="SetCheckbox('TableHeightCheckbox');"/>
<text class="label" value="&tableHeight.label;"/>
<textfield class="narrow" id="TableHeightInput" onkeyup="forceInteger(this.id);"/>
<menulist id="TableHeightUnits"/>
</row>
<row valign="middle">
<checkbox id="TableWidthCheckbox" value="&tableWidth.label;"/>
<textfield class="narrow" id="TableWidthInput" onkeyup="ChangeIntTextfield(this.id,'TableWidthCheckbox');"/>
<menulist id="TableWidthUnits" oncommand="SetCheckbox('TableWidthCheckbox');"/>
<text class="label" value="&tableWidth.label;"/>
<textfield class="narrow" id="TableWidthInput" onkeyup="forceInteger(this.id);"/>
<menulist id="TableWidthUnits"/>
</row>
</rows>
</grid>
</titledbox>
<box><!-- Border and Alignment -->
<titledbox orient="vertical"><title align="left" value="&tableBorderSpacing.label;"/>
<grid>
<columns><column/><column/><column/></columns>
<rows>
<row valign="middle">
<checkbox id="TableBorderCheckbox" value="&tableBorderWidth.label;"/>
<textfield class="narrow" id="BorderWidthInput" onkeyup="ChangeIntTextfield(this.id,'TableBorderCheckbox');"/>
<text class="label" align="left" value="&pixels.label;"/>
</row>
<row valign="middle">
<checkbox id="CellSpacingCheckbox" value="&tableSpacing.label;"/>
<textfield class="narrow" id="SpacingInput" onkeyup="ChangeIntTextfield(this.id,'CellSpacingCheckbox');"/>
<text class="label" value="&tablePxBetwCells.label;"/>
</row>
<row valign="middle" autostretch="never">
<checkbox id="CellPaddingCheckbox" value="&tablePadding.label;"/>
<textfield class="narrow" id="PaddingInput" onkeyup="ChangeIntTextfield(this.id,'CellPaddingCheckbox');"/>
<!-- Use HTML instead of TEXT to let it wrap -->
<html flex="1">&tablePxBetwBrdrCellContent.label;</html>
</row>
</rows>
</grid>
</titledbox>
<titledbox orient="vertical"><title align="left" value="&tableBorderSpacing.label;"/>
<grid>
<columns><column/><column/><column/></columns>
<rows>
<row valign="middle">
<text class="label" value="&tableBorderWidth.label;"/>
<textfield class="narrow" id="BorderWidthInput" onkeyup="forceInteger(this.id);"/>
<text class="label" align="left" value="&pixels.label;"/>
</row>
<row valign="middle">
<text class="label" value="&tableSpacing.label;"/>
<textfield class="narrow" id="SpacingInput" onkeyup="forceInteger(this.id);"/>
<text class="label" value="&tablePxBetwCells.label;"/>
</row>
<row valign="middle" autostretch="never">
<text class="label" value="&tablePadding.label;"/>
<textfield class="narrow" id="PaddingInput" onkeyup="forceInteger(this.id);"/>
<text class="label" value="&tablePxBetwBrdrCellContent.label;"/>
</row>
</rows>
</grid>
</titledbox>
<!-- Table Alignment and Caption -->
<box flex="1" valign="middle" autostretch="never">
<text class="label" value="&tableAlignment.label;"/>
<menulist id="TableAlignList">
<menupopup>
<menuitem value="&AlignLeft.label;" data="left"/>
<menuitem value="&AlignCenter.label;" data="center"/>
<menuitem value="&AlignRight.label;" data="right"/>
</menupopup>
</menulist>
<spring class="spacer"/>
<box orient="vertical" flex="1">
<spring class="bigspacer"/>
<box orient="vertical" flex="1">
<checkbox id="TableHAlignCheckbox" value="&tableAlignment.label;"/>
<spring class="smallspacer"/>
<menulist id="TableAlignList" oncommand="SetCheckbox('TableHAlignCheckbox');">
<menupopup>
<menuitem value="&AlignLeft.label;" data="left"/>
<menuitem value="&AlignCenter.label;" data="center"/>
<menuitem value="&AlignRight.label;" data="right"/>
</menupopup>
</menulist>
<spring class="bigspacer"/>
<checkbox id="TableCaptionCheckbox" value="&tableCaption.label;"/>
<spring class="smallspacer"/>
<menulist id="TableCaptionList" oncommand="SetCheckbox('TableCaptionCheckbox');">
<menupopup>
<menuitem value="&tableCaptionNone.label;" data=""/>
<menuitem value="&tableCaptionAbove.label;" data="top"/>
<menuitem value="&tableCaptionBelow.label;" data="bottom"/>
</menupopup>
</menulist>
<spring flex="1"/>
</box>
</box>
<spring class="bigspacer"/>
</box> <!-- Border and alignment -->
<spring class="spacer"/>
<box>
<text class="label" value="&tableCaption.label;"/>
<menulist id="TableCaptionList">
<menupopup>
<menuitem value="&tableCaptionNone.label;" data=""/>
<menuitem value="&tableCaptionAbove.label;" data="top"/>
<menuitem value="&tableCaptionBelow.label;" data="bottom"/>
</menupopup>
</menulist>
</box>
<separator class="groove-thin tb-margin"/>
<box valign="middle" autostretch="never">
<text class="label" value="&backgroundColor.label;"/>
<spring class="spacer"/>
<menu class="colorpicker">
<box>
<stack>
<box autostretch="never" valign="middle">
<spring id="tableBackgroundCW" class="color-well"/>
<image class="popup-trigger"/>
</box>
<menupopup>
<colorpicker id="tableBackgroundCP" palettename="standard"
onclick="GetColorAndUpdate('tableBackgroundCP','tableBackgroundCW',null, this.parentNode);"/>
<button class="dialog" value="&defaultColor.label;"
oncommand="GetColorAndUpdate('tableBackgroundCP','tableBackgroundCW',null, this.parentNode)"/>
</menupopup>
</menu>
<button class="dialog color-button" onclick="GetColorAndUpdate('tableBackgroundCW')" flex="1"/>
</stack>
<spring class="spacer"/>
<text class="label" id="TableInheritColor" value="&tableInheritColor.label;" collapsed="true"/>
</box>
<spring class="spacer"/>
<separator class="groove-thin tb-margin"/>
<box flex="1" autostretch="never">
<spring flex="1"/>
<!-- From EdDialogOvlerlay.xul -->
@ -197,14 +181,14 @@
<columns><column/><column/><column/></columns>
<rows>
<row valign="middle" autostretch="never">
<checkbox id="CellHeightCheckbox" value="&tableHeight.label;"/>
<textfield class="narrow" id="CellHeightInput" onkeyup="ChangeIntTextfield(this.id,'CellHeightCheckbox');"/>
<menulist id="CellHeightUnits" oncommand="SetCheckbox('CellHeightCheckbox');"/>
<text class="label" value="&tableHeight.label;"/>
<textfield class="narrow" id="CellHeightInput" onkeyup="ChangeCellTextfield(this.id);"/>
<menulist id="CellHeightUnits" oncommand="ChangeCellData();"/>
</row>
<row valign="middle" autostretch="never">
<checkbox id="CellWidthCheckbox" value="&tableWidth.label;"/>
<textfield class="narrow" id="CellWidthInput" onkeyup="ChangeIntTextfield(this.id,'CellWidthCheckbox');"/>
<menulist id="CellWidthUnits" oncommand="SetCheckbox('CellWidthCheckbox');"/>
<text class="label" value="&tableWidth.label;"/>
<textfield class="narrow" id="CellWidthInput" onkeyup="ChangeCellTextfield(this.id);"/>
<menulist id="CellWidthUnits" oncommand="ChangeCellData();"/>
</row>
</rows>
</grid>
@ -213,94 +197,73 @@
<columns><column/><column/></columns>
<rows>
<row valign="middle" autostretch="never">
<checkbox id="RowSpanCheckbox" value="&cellRowSpan.label;"/>
<textfield class="narrow" id="RowSpanInput" onkeyup="ChangeIntTextfield(this.id,'RowSpanCheckbox');"/>
<text class="label" value="&cellRowSpan.label;"/>
<textfield class="narrow" id="RowSpanInput" onkeyup="ChangeCellTextfield(this.id);"/>
</row>
<row valign="middle" autostretch="never">
<checkbox id="ColSpanCheckbox" value="&cellColSpan.label;"/>
<textfield class="narrow" id="ColSpanInput" onkeyup="ChangeIntTextfield(this.id,'ColSpanCheckbox');"/>
<text class="label" value="&cellColSpan.label;"/>
<textfield class="narrow" id="ColSpanInput" onkeyup="ChangeCellTextfield(this.id);"/>
</row>
</rows>
</grid>
</titledbox>
<box><!-- Alignment and style -->
<titledbox orient="vertical" flex="1">
<title align="left" value="&cellContentAlignment.label;"/>
<grid>
<columns><column/><column/><column/></columns>
<rows>
<row valign="middle" autostretch="never">
<checkbox id="CellHAlignCheckbox" value="&cellHorizontal.label;"/>
<menulist id="CellHAlignList" oncommand="SelectCellHAlign()">
<menupopup>
<menuitem value="&AlignLeft.label;" data="left"/>
<menuitem value="&AlignCenter.label;" data="center"/>
<menuitem value="&AlignRight.label;" data="right"/>
<menuitem value="&cellAlignJustify.label;" data="justify"/>
<menuitem value="&cellAlignAtChar.label;" data="char"/>
</menupopup>
</menulist>
<textfield id="CellAlignCharInput" style="width: 2em"/>
</row>
<spring class="bigspacer"/>
<row valign="middle" autostretch="never">
<checkbox id="CellVAlignCheckbox" value="&cellVertical.label;"/>
<menulist id="CellVAlignList" oncommand="SetCheckbox('CellVAlignCheckbox');">
<menupopup>
<menuitem value="&cellAlignTop.label;" data="top"/>
<menuitem value="&cellAlignMiddle.label;" data="middle"/>
<menuitem value="&cellAlignBottom.label;" data="bottom"/>
</menupopup>
</menulist>
<spring/>
</row>
</rows>
</grid>
</titledbox>
<spring class="spacer"/>
<box orient="vertical">
<checkbox id="CellStyleCheckbox" value="&cellStyle.label;"/>
<menulist id="CellStyleList" oncommand="SetCheckbox('CellStyleCheckbox');">
<menupopup>
<menuitem value="&cellNormal.label;" data="td"/>
<menuitem value="&cellHeader.label;" data="th"/>
</menupopup>
</menulist>
<spring class="spacer"/>
<checkbox id="TextWrapCheckbox" value="&cellTextWrap.label;"/>
<menulist id="TextWrapList" oncommand="SetCheckbox('TextWrapCheckbox');">
<menupopup>
<menuitem value="&cellWrap.label;" data="wrap"/>
<menuitem value="&cellNoWrap.label;" data="nowrap"/>
</menupopup>
</menulist>
<!-- Alignment -->
<titledbox valign="middle" autostretch="never">
<title value="&cellContentAlignment.label;"/>
<text class="label" value="&cellHorizontal.label;"/>
<menulist id="CellHAlignList" oncommand="SelectCellHAlign()">
<menupopup>
<menuitem value="&AlignLeft.label;" data="left"/>
<menuitem value="&AlignCenter.label;" data="center"/>
<menuitem value="&AlignRight.label;" data="right"/>
<menuitem value="&cellAlignJustify.label;" data="justify"/>
<menuitem value="&cellAlignAtChar.label;" data="char"/>
</menupopup>
</menulist>
<box style="width: 5em min-width: 5em">
<!-- We collapse this if not needed, so box preserves space -->
<textfield id="CellAlignCharInput" style="width: 2em"/>
</box>
</box><!-- Alignment and Style -->
<spring flex="1"/>
<text class="label" value="&cellVertical.label;"/>
<menulist id="CellVAlignList" oncommand="ChangeCellData();">
<menupopup>
<menuitem value="&cellAlignTop.label;" data="top"/>
<menuitem value="&cellAlignMiddle.label;" data="middle"/>
<menuitem value="&cellAlignBottom.label;" data="bottom"/>
</menupopup>
</menulist>
</titledbox>
<spring class="spacer"/>
<box>
<text class="label" value="&backgroundColor.label;"/>
<box valign="middle" autostretch="never">
<spring class="spacer"/>
<menu class="colorpicker">
<box>
<checkbox id="HeaderCheck" value="&cellHeader.label;"/>
<spring class="bigspacer"/>
<checkbox id="NoWrapCheck" value="&cellNoWrap.label;"/>
</box>
<separator class="groove-thin tb-margin"/>
<box valign="middle" autostretch="never">
<text class="label" value="&backgroundColor.label;"/>
<stack>
<box autostretch="never" valign="middle">
<spring id="cellBackgroundCW" class="color-well"/>
<image class="popup-trigger"/>
</box>
<menupopup>
<colorpicker id="cellBackgroundCP" palettename="standard"
onclick="GetColorAndUpdate('cellBackgroundCP','cellBackgroundCW', 'CellColorCheckbox', this.parentNode)"/>
<button class="dialog" value="&defaultColor.label;"
oncommand="GetColorAndUpdate('cellBackgroundCP','cellBackgroundCW', 'CellColorCheckbox', this.parentNode)"/>
</menupopup>
</menu>
<button class="dialog color-button" onclick="GetColorAndUpdate('cellBackgroundCW')" flex="1"/>
</stack>
<spring class="spacer"/>
<text class="label" id="CellInheritColor" value="&cellInheritColor.label;" collapsed="true"/>
</box>
<spring class="spacer"/>
<separator class="groove-thin tb-margin"/>
<box autostretch="never">
<html class="wrap" flex="1" style="width: 1em">&cellUseCheckboxHelp.label;</html>
<!-- From EdDialogOvlerlay.xul -->
<spring flex="1"/>
<button class="dialog" id="AdvancedEditButton2"/>
</box>
<spring class="spacer"/>
</box><!-- Cell Panel -->
</tabpanel>

View File

@ -33,9 +33,9 @@
<!ENTITY tabJSE.label "JavaScript Events">
<!ENTITY AddJSEAttributeLabel.label "Add a JavaScript Event Handler">
<!ENTITY AddHTMLAttributeLabel.label "Add a HTML Attribute">
<!ENTITY AddHTMLAttributeLabel.label "Add an HTML Attribute">
<!ENTITY AddCSSAttributeLabel.label "Add a Style Attribute">
<!ENTITY context.RemoveAttribute.label "Remove Attribute">
<!ENTITY context.AddAttribute.label "Add Attribute">
<!ENTITY editAttribute.label "Click on an item to edit its value">
<!ENTITY removeAttribute.label "Remove Attribute">

View File

@ -36,13 +36,14 @@
<!ENTITY altTextEditField.tooltip "Type text to display in place of the image">
<!ENTITY MoreFewerButton.tooltip "Display more or fewer properties to edit">
<!-- These controls are in the Dimensions box of the expanded area -->
<!ENTITY dimensionsBox.label "Dimensions">
<!ENTITY originalSizeRadio.label "Original Size">
<!ENTITY originalSizeRadio.tooltip "Revert to the image's original size">
<!-- actualSize.label should be same as actualSizeRadio.label + ":" -->
<!ENTITY actualSize.label "Actual Size:">
<!ENTITY actualSizeRadio.label "Actual Size">
<!ENTITY actualSizeRadio.tooltip "Revert to the image's actual size">
<!ENTITY customSizeRadio.label "Custom Size">
<!ENTITY customSizeRadio.tooltip "Change the image's original size">
<!ENTITY customSizeRadio.tooltip "Change the image's size as displayed in the page">
<!ENTITY heightEditField.label "Height:">
<!ENTITY widthEditField.label "Width:">
<!ENTITY constrainCheckbox.label "Constrain">

View File

@ -32,16 +32,13 @@
<!ENTITY tableSpacing.label "Spacing:">
<!ENTITY tablePadding.label "Padding:">
<!ENTITY tablePxBetwCells.label "pixels between cells">
<!-- LOCALIZATION NOTE (tablePxBetwBrdrCellContent.label): Don't translate <html:br/> -->
<!ENTITY tablePxBetwBrdrCellContent.label "pixels between border<html:br/>and cell content">
<!ENTITY tablePxBetwBrdrCellContent.label "pixels between cell border and content">
<!ENTITY tableAlignment.label "Table Alignment:">
<!ENTITY tableCaption.label "Caption:">
<!ENTITY tableCaptionAbove.label "Above Table">
<!ENTITY tableCaptionBelow.label "Below Table">
<!ENTITY tableCaptionNone.label "None">
<!ENTITY tableInheritColor.label "(Let page color show through)">
<!-- Don't translate <html:br/> -->
<!ENTITY tableUseCheckboxHelp.label "Use checkboxes to determine which properties<html:br/>are applied to the table">
<!ENTITY cellPercent.label "percent of table">
<!ENTITY cellSelection.label "Selection">
@ -58,20 +55,14 @@
<!ENTITY cellContentAlignment.label "Content Alignment">
<!ENTITY cellHorizontal.label "Horizontal:">
<!ENTITY cellVertical.label "Vertical:">
<!ENTITY cellStyle.label "Cell Style:">
<!ENTITY cellNormal.label "Normal">
<!ENTITY cellHeader.label "Header">
<!ENTITY cellTextWrap.label "Text Wrap:">
<!ENTITY cellWrap.label "Wrap">
<!ENTITY cellNoWrap.label "Don't wrap">
<!ENTITY cellHeader.label "Header style">
<!ENTITY cellNoWrap.label "Don't wrap text">
<!ENTITY cellAlignTop.label "Top">
<!ENTITY cellAlignMiddle.label "Middle">
<!ENTITY cellAlignBottom.label "Bottom">
<!ENTITY cellAlignJustify.label "Justify">
<!ENTITY cellAlignAtChar.label "At Character:">
<!ENTITY cellInheritColor.label "(Let table color show through)">
<!-- Don't translate <html:br/> -->
<!ENTITY cellUseCheckboxHelp.label "Use checkboxes to determine which properties<html:br/>are applied to all selected cells">
<!-- Used in both Table and Cell panels -->
<!ENTITY defaultColor.label "Don't specify color">