Upgraded Editor Advanced Edit XUL/JS. r=cmanske

This commit is contained in:
rgoodger%ihug.co.nz 1999-12-02 10:22:31 +00:00
Родитель b6881a37f6
Коммит c0af08d344
5 изменённых файлов: 529 добавлений и 366 удалений

Просмотреть файл

@ -14,9 +14,8 @@ function BuildCSSAttributeTable()
if(style.indexOf(":") != -1) {
name = TrimString(nvpairs.split(":")[0]);
value = TrimString(nvpairs.split(":")[1]);
if(!AddCSSAttribute(name,value)) {
if ( !AddTreeItem( name, value, "CSSATree", CSSAttrs ) )
dump("Failed to add CSS attribute: " + i + "\n");
}
} else
return false;
}
@ -26,57 +25,30 @@ function BuildCSSAttributeTable()
if(nvpairs[i].indexOf(":") != -1) {
name = TrimString(nvpairs[i].split(":")[0]);
value = TrimString(nvpairs[i].split(":")[1]);
if(!AddCSSAttribute(name,value)) {
if( !AddTreeItem( name, value, "CSSATree", CSSAttrs ) )
dump("Failed to add CSS attribute: " + i + "\n");
}
}
}
}
function AddCSSAttribute(name,value)
{
var treekids = document.getElementById("CSSAList");
if(!CheckAttributeNameSimilarity(name, CSSAttrs)) {
dump("repeated CSS attribute, ignoring\n");
return false;
}
CSSAttrs[CSSAttrs.length] = name;
var treeitem = document.createElement("treeitem");
var treerow = document.createElement("treerow");
var attrcell = document.createElement("treecell");
var attrcontent = document.createTextNode(name.toLowerCase());
attrcell.appendChild(attrcontent);
treerow.appendChild(attrcell);
var valcell = document.createElement("treecell");
valcell.setAttribute("class","value");
var valField = document.createElement("html:input");
var attrValue = value;
valField.setAttribute("type","text");
valField.setAttribute("id",name.toLowerCase());
valField.setAttribute("value",attrValue);
valField.setAttribute("flex","100%");
valField.setAttribute("class","AttributesCell");
valcell.appendChild(valField);
treerow.appendChild(valcell);
treeitem.appendChild(treerow);
treekids.appendChild(treeitem);
return true;
}
// add an attribute to the tree widget
function onAddCSSAttribute()
function onAddCSSAttribute( which )
{
if( !which )
return;
if( which.getAttribute ( "disabled" ) )
return;
var name = dialog.AddCSSAttributeNameInput.value;
var value = TrimString(dialog.AddCSSAttributeValueInput.value);
if(name == "")
return;
// WHAT'S GOING ON? NAME ALWAYS HAS A VALUE OF accented "a"???
dump(name+"= New Attribute Name - SHOULD BE EMPTY\n");
if ( !CheckAttributeNameSimilarity( name, CSSAttrs ) )
return false;
if(AddCSSAttribute(name,value)) {
if ( AddTreeItem ( name, value, "CSSAList", CSSAttrs ) ) {
dialog.AddCSSAttributeNameInput.value = "";
dialog.AddCSSAttributeValueInput.value = "";
}
@ -84,12 +56,48 @@ function onAddCSSAttribute()
}
// does enabling based on any user input.
function doCSSEnabling()
function doCSSEnabling( keycode )
{
var name = TrimString(dialog.AddCSSAttributeNameInput.value).toLowerCase();
if( name == "" || !CheckAttributeNameSimilarity(name,CSSAttrs)) {
dialog.AddCSSAttribute.setAttribute("disabled","true");
} else {
dialog.AddCSSAttribute.removeAttribute("disabled");
}
if(keycode == 13) {
onAddCSSAttribute( document.getElementById ( "AddCSSAttribute" ) );
return;
}
var name = TrimString(dialog.AddCSSAttributeNameInput.value).toLowerCase();
if( name == "" || !CheckAttributeNameSimilarity(name,CSSAttrs))
dialog.AddCSSAttribute.setAttribute("disabled","true");
else
dialog.AddCSSAttribute.removeAttribute("disabled");
}
function UpdateCSSAttributes()
{
dump("===============[ Setting and Updating STYLE ]===============\n");
var CSSAList = document.getElementById("CSSAList");
var styleString = "";
for(var i = 0; i < CSSAList.childNodes.length; i++)
{
var item = CSSAList.childNodes[i];
var name = TrimString(item.firstChild.firstChild.getAttribute("value"));
var value = TrimString(item.firstChild.lastChild.firstChild.value);
// this code allows users to be sloppy in typing in values, and enter
// things like "foo: " and "bar;". This will trim off everything after the
// respective character.
if(name.indexOf(":") != -1)
name = name.substring(0,name.lastIndexOf(":"));
if(value.indexOf(";") != -1)
value = value.substring(0,value.lastIndexOf(";"));
if(i == (CSSAList.childNodes.length - 1))
styleString += name + ": " + value + ";"; // last property
else
styleString += name + ": " + value + "; ";
}
dump("stylestring: ||" + styleString + "||\n");
if(styleString.length > 0) {
element.removeAttribute("style");
element.setAttribute("style",styleString); // NOTE BUG 18894!!!
} else {
if(element.getAttribute("style"))
element.removeAttribute("style");
}
}

Просмотреть файл

@ -1,82 +1,44 @@
/** EdAEHTMLAttributes.js
* - this file applies to the Editor Advanced Edit dialog box.
* - contains functions for creating the HTML Attributes list
**/
// build attribute list in tree form from element attributes
function BuildHTMLAttributeTable()
{
dump("NODENAME: " + element.nodeName + "\n");
var nodeMap = element.attributes;
var nodeMapCount = nodeMap.length;
var treekids = document.getElementById("HTMLAList");
if(nodeMapCount > 0) {
for(i = 0; i < nodeMapCount; i++)
{
if(!CheckAttributeNameSimilarity(nodeMap[i].nodeName, JSEAttrs) ||
IsEventHandler(nodeMap[i].nodeName) ||
TrimString(nodeMap[i].nodeName.toLowerCase()) == "style") {
dump("repeated property, JS event handler or style property!\n");
continue; // repeated attribute, ignore this one and go to next
}
HTMLAttrs[i] = nodeMap[i].nodeName;
var treeitem = document.createElement("treeitem");
var treerow = document.createElement("treerow");
var attrcell = document.createElement("treecell");
var attrcontent = document.createTextNode(nodeMap[i].nodeName.toUpperCase());
attrcell.appendChild(attrcontent);
treerow.appendChild(attrcell);
var valcell = document.createElement("treecell");
valcell.setAttribute("class","value");
var valField = document.createElement("html:input");
var attrValue = element.getAttribute(nodeMap[i].nodeName);
valField.setAttribute("type","text");
valField.setAttribute("id",nodeMap[i].nodeName.toLowerCase());
valField.setAttribute("value",attrValue);
valField.setAttribute("flex","100%");
valField.setAttribute("class","AttributesCell");
valcell.appendChild(valField);
treerow.appendChild(valcell);
treeitem.appendChild(treerow);
treekids.appendChild(treeitem);
if(nodeMap.length > 0) {
for(i = 0; i < nodeMap.length; i++)
{
if ( !CheckAttributeNameSimilarity( nodeMap[i].nodeName, JSEAttrs ) ||
IsEventHandler( nodeMap[i].nodeName ) ||
TrimString( nodeMap[i].nodeName.toLowerCase() ) == "style" ) {
continue; // repeated or non-HTML attribute, ignore this one and go to next
}
var name = nodeMap[i].nodeName.toLowerCase();
var value = element.getAttribute ( nodeMap[i].nodeName );
AddTreeItem ( name, value, "HTMLAList", HTMLAttrs );
}
}
}
function AddHTMLAttribute(name,value)
{
HTMLAttrs[HTMLAttrs.length] = name;
var treekids = document.getElementById("HTMLAList");
var treeitem = document.createElement("treeitem");
var treerow = document.createElement("treerow");
var attrcell = document.createElement("treecell");
var attrcontent = document.createTextNode(name.toUpperCase());
attrcell.appendChild(attrcontent);
treerow.appendChild(attrcell);
var valcell = document.createElement("treecell");
valcell.setAttribute("class","value");
var valField = document.createElement("html:input");
valField.setAttribute("type","text");
valField.setAttribute("id",name);
valField.setAttribute("value",value);
valField.setAttribute("flex","100%");
valField.setAttribute("class","AttributesCell");
valcell.appendChild(valField);
treerow.appendChild(valcell);
treeitem.appendChild(treerow);
treekids.appendChild(treeitem);
return true;
}
// add an attribute to the tree widget
function onAddHTMLAttribute()
function onAddHTMLAttribute(which)
{
var name = dialog.AddHTMLAttributeNameInput.value;
if(!which)
return;
if( which.getAttribute ( "disabled" ) )
return;
var name = dialog.AddHTMLAttributeNameInput.value;
var value = TrimString(dialog.AddHTMLAttributeValueInput.value);
if(name == "")
return;
// WHAT'S GOING ON? NAME ALWAYS HAS A VALUE OF accented "a"???
dump(name+"= New Attribute Name - SHOULD BE EMPTY\n");
if(AddHTMLAttribute(name,value)) {
if ( !CheckAttributeNameSimilarity( name, CSSAttrs ) )
return false;
if ( AddTreeItem ( name, value, "HTMLAList", HTMLAttrs ) ) {
dialog.AddHTMLAttributeNameInput.value = "";
dialog.AddHTMLAttributeValueInput.value = "";
}
@ -84,12 +46,39 @@ function onAddHTMLAttribute()
}
// does enabling based on any user input.
function doHTMLEnabling()
function doHTMLEnabling( keycode )
{
var name = TrimString(dialog.AddHTMLAttributeNameInput.value).toLowerCase();
if( name == "" || !CheckAttributeNameSimilarity(name,HTMLAttrs)) {
dialog.AddHTMLAttribute.setAttribute("disabled","true");
} else {
dialog.AddHTMLAttribute.removeAttribute("disabled");
}
if(keycode == 13) {
onAddHTMLAttribute(document.getElementById("AddHTMLAttribute"));
return;
}
var name = TrimString(dialog.AddHTMLAttributeNameInput.value).toLowerCase();
if( name == "" || !CheckAttributeNameSimilarity(name,HTMLAttrs)) {
dialog.AddHTMLAttribute.setAttribute("disabled","true");
} else {
dialog.AddHTMLAttribute.removeAttribute("disabled");
}
}
// update the object with added and removed attributes
function UpdateHTMLAttributes()
{
dump("===============[ Setting and Updating HTML ]===============\n");
var HTMLAList = document.getElementById("HTMLAList");
for(var i = 0; i < HTMLAList.childNodes.length; i++)
{
var item = HTMLAList.childNodes[i];
var 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++ )
{
var name = HTMLRAttrs[i];
if(element.getAttribute(name))
element.removeAttribute(name);
else continue; // doesn't exist, so don't bother removing it.
}
}

Просмотреть файл

@ -1,48 +1,24 @@
// build attribute list in tree form from element attributes
function BuildJSEAttributeTable()
{
dump("Loading event handlers list...\n");
var nodeMap = element.attributes;
var nodeMapCount = nodeMap.length;
var treekids = document.getElementById("JSEAList");
dump("nmc: " + nodeMapCount + "\n");
if(nodeMapCount > 0) {
for(var i = 0; i < nodeMapCount; i++)
{
if(!CheckAttributeNameSimilarity(nodeMap[i].nodeName, JSEAttrs)) {
dump("repeated JS handler!\n");
continue; // repeated attribute, ignore this one and go to next
}
if(!IsEventHandler(nodeMap[i].nodeName)) {
dump("not an event handler\n");
continue; // attribute isn't an event handler.
}
JSEAttrs[i] = nodeMap[i].nodeName;
var treeitem = document.createElement("treeitem");
var treerow = document.createElement("treerow");
var attrcell = document.createElement("treecell");
var attrcontent = document.createTextNode(nodeMap[i].nodeName.toLowerCase());
attrcell.appendChild(attrcontent);
treerow.appendChild(attrcell);
var valcell = document.createElement("treecell");
valcell.setAttribute("class","value");
var valField = document.createElement("html:input");
var attrValue = element.getAttribute(nodeMap[i].nodeName);
valField.setAttribute("type","text");
valField.setAttribute("id",nodeMap[i].nodeName.toLowerCase());
valField.setAttribute("value",attrValue);
valField.setAttribute("flex","100%");
valField.setAttribute("class","AttributesCell");
valcell.appendChild(valField);
treerow.appendChild(valcell);
treeitem.appendChild(treerow);
treekids.appendChild(treeitem);
}
if(nodeMap.length > 0) {
for(var i = 0; i < nodeMap.length; i++)
{
if( !CheckAttributeNameSimilarity( nodeMap[i].nodeName, JSEAttrs ) )
continue; // repeated or non-JS handler, ignore this one and go to next
if( !IsEventHandler( nodeMap[i].nodeName ) )
continue; // attribute isn't an event handler.
var name = nodeMap[i].nodeName.toLowerCase();
var value = element.getAttribute(nodeMap[i].nodeName);
AddTreeItem( name, value, "JSEATree", JSEAttrs ); // add item to tree
}
}
}
function IsEventHandler(which)
// check to see if given string is an event handler.
function IsEventHandler( which )
{
var handlerName = which.toLowerCase();
var firstTwo = handlerName.substring(0,2);
@ -52,40 +28,22 @@ function IsEventHandler(which)
return false;
}
function AddJSEAttribute(name,value)
{
JSEAttrs[JSEAttrs.length] = name;
var treekids = document.getElementById("JSEAList");
var treeitem = document.createElement("treeitem");
var treerow = document.createElement("treerow");
var attrcell = document.createElement("treecell");
var attrcontent = document.createTextNode(name.toLowerCase());
attrcell.appendChild(attrcontent);
treerow.appendChild(attrcell);
var valcell = document.createElement("treecell");
valcell.setAttribute("class","value");
var valField = document.createElement("html:input");
valField.setAttribute("type","text");
valField.setAttribute("id",name);
valField.setAttribute("value",value);
valField.setAttribute("flex","100%");
valField.setAttribute("class","AttributesCell");
valcell.appendChild(valField);
treerow.appendChild(valcell);
treeitem.appendChild(treerow);
treekids.appendChild(treeitem);
}
// add an attribute to the tree widget
function onAddJSEAttribute()
function onAddJSEAttribute( which )
{
if( !which )
return;
if( which.getAttribute ( "disabled" ) )
return;
var name = dialog.AddJSEAttributeNameInput.value;
var value = TrimString(dialog.AddJSEAttributeValueInput.value);
if(name == "")
return;
// WHAT'S GOING ON? NAME ALWAYS HAS A VALUE OF accented "a"???
dump(name+"= New Attribute Name - SHOULD BE EMPTY\n");
if(AddJSEAttribute(name,value)) {
if ( name.substring(0,2).toLowerCase() != "on" )
name = "on" + name; // user has entered event without "on" prefix, add it
if ( AddTreeItem( name, value, "JSEAList", JSEAttrs ) ) {
dialog.AddJSEAttributeNameInput.value = "";
dialog.AddJSEAttributeValueInput.value = "";
}
@ -93,12 +51,41 @@ function onAddJSEAttribute()
}
// does enabling based on any user input.
function doJSEEnabling()
function doJSEEnabling( keycode )
{
var name = TrimString(dialog.AddJSEAttributeNameInput.value).toLowerCase();
if( name == "" || !CheckAttributeNameSimilarity(name,JSEAttrs)) {
dialog.AddJSEAttribute.setAttribute("disabled","true");
} else {
dialog.AddJSEAttribute.removeAttribute("disabled");
}
if(keycode == 13) {
onAddJSEAttribute( document.getElementById ( "AddJSEAttribute" ) );
return;
}
var name = TrimString(dialog.AddJSEAttributeNameInput.value).toLowerCase();
if ( name.substring(0,2) != "on" )
name = "on" + name; // user has entered event without "on" prefix, add it
if( name == "" || !CheckAttributeNameSimilarity(name, JSEAttrs))
dialog.AddJSEAttribute.setAttribute("disabled","true");
else
dialog.AddJSEAttribute.removeAttribute("disabled");
}
function UpdateJSEAttributes()
{
dump("===============[ Setting and Updating JSE ]===============\n");
var JSEAList = document.getElementById("JSEAList");
for(var i = 0; i < JSEAList.childNodes.length; i++)
{
var item = JSEAList.childNodes[i];
name = TrimString(item.firstChild.firstChild.getAttribute("value"));
value = TrimString(item.firstChild.lastChild.firstChild.value);
// set the event handler
element.setAttribute(name,value);
}
// remove removed attributes
for( var i = 0; i < JSERAttrs.length; i++ )
{
var name = JSERAttrs[i];
if(element.getAttribute(name))
element.removeAttribute(name);
else continue; // doesn't exist, so don't bother removing it.
}
}

Просмотреть файл

@ -18,30 +18,49 @@
* Rights Reserved.
*
* Contributor(s):
* Ben Goodger
* Ben "Count XULula" Goodger
*/
/************** FOR NOW **************/
var TEXT_WIDGETS_DONT_SUCK = false;
var PERFORMANCE_BOOSTS = false;
/************** GLOBALS **************/
var tagname = null;
var element = null;
var tagname = null; // element.nodeName;
var element = null; // handle for the actual element
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
/************** INITIALISATION && SETUP **************/
/**
* function : void Startup();
* parameters : none
* returns : none
* desc. : startup and initialisation, prepares dialog.
**/
function Startup()
{
dump("Welcome to EdAdvancedEdit '99 \n");
// This is the return value for the parent,
// who only needs to know if OK was clicked
// who only needs to know if OK was clicked
window.opener.AdvancedEditOK = false;
if (!InitEditorShell())
return;
// initialise the ok and cancel buttons
doSetOKCancel(onOK, null);
// load string bundle
bundle = srGetStrBundle("chrome://editor/locale/editor.properties");
// Element to edit is passed in
element = window.arguments[1];
if (!element || element == "undefined") {
@ -50,36 +69,41 @@ function Startup()
}
dump("*** Element passed into Advanced Edit: "+element+" ***\n");
// place the tag name in the header
var tagLabel = document.getElementById("tagLabel");
if(tagLabel.hasChildNodes()) {
tagLabel.removeChild(tagLabel.firstChild);
}
var textLabel = document.createTextNode("<" + element.nodeName + ">");
tagLabel.appendChild(textLabel);
// Create dialog object to store controls for easy access
dialog = new Object;
dialog.AddHTMLAttributeNameInput = document.getElementById("AddHTMLAttributeNameInput");
dialog = new Object;
dialog.AddHTMLAttributeNameInput = document.getElementById("AddHTMLAttributeNameInput");
dialog.AddHTMLAttributeValueInput = document.getElementById("AddHTMLAttributeValueInput");
dialog.AddHTMLAttribute = document.getElementById("AddHTMLAttribute");
dialog.AddCSSAttributeNameInput = document.getElementById("AddCSSAttributeNameInput");
dialog.AddCSSAttributeValueInput = document.getElementById("AddCSSAttributeValueInput");
dialog.AddCSSAttribute = document.getElementById("AddCSSAttribute");
dialog.AddJSEAttributeNameInput = document.getElementById("AddJSEAttributeNameInput");
dialog.AddJSEAttributeValueInput = document.getElementById("AddJSEAttributeValueInput");
dialog.AddJSEAttribute = document.getElementById("AddJSEAttribute");
dialog.AddHTMLAttribute = document.getElementById("AddHTMLAttribute");
dialog.AddCSSAttributeNameInput = document.getElementById("AddCSSAttributeNameInput");
dialog.AddCSSAttributeValueInput = document.getElementById("AddCSSAttributeValueInput");
dialog.AddCSSAttribute = document.getElementById("AddCSSAttribute");
dialog.AddJSEAttributeNameInput = document.getElementById("AddJSEAttributeNameInput");
dialog.AddJSEAttributeValueInput = document.getElementById("AddJSEAttributeValueInput");
dialog.AddJSEAttribute = document.getElementById("AddJSEAttribute");
// build the attribute trees
BuildHTMLAttributeTable();
BuildCSSAttributeTable();
BuildJSEAttributeTable();
// size the dialog properly
window.sizeToContent();
}
// for..in loop, typeof, /^on/ match
/**
* function : bool onOK ( void );
* parameters : none
* returns : boolean true to close the window
* desc. : event handler for ok button
**/
function onOK()
{
dump("in onOK\n")
@ -89,63 +113,201 @@ function onOK()
return true; // do close the window
}
// function EdAvancedEdit.js::<UpdateObject>
// Updates the copy of the page object with the data set in this dialog.
/**
* function : void UpdateObject ( void );
* parameters : none
* returns : none
* desc. : Updates the copy of the page object with the data set in this dialog.
**/
function UpdateObject()
{
dump("in UpdateObject\n");
var HTMLAList = document.getElementById("HTMLAList");
var CSSAList = document.getElementById("CSSAList");
var JSEAList = document.getElementById("JSEAList");
UpdateHTMLAttributes();
UpdateCSSAttributes();
UpdateJSEAttributes();
}
/**
* function : bool CheckAttributeNameSimilarity ( string attName, array attArray );
* parameters : attribute to look for, array of current attributes
* returns : false if attribute already exists, true if it does not
* desc. : checks to see if any other attributes by the same name as the arg supplied
* already exist.
**/
function CheckAttributeNameSimilarity(attName, attArray)
{
for(var i = 0; i < attArray.length; i++)
{
if(attName == attArray[i])
return false;
}
return true;
}
/**
* function : bool CheckAttributeNotRemoved ( string attName, array attArray );
* parameters : attribute to look for, array of deleted attributes
* returns : false if attribute already exists, true if it does not
* desc. : check to see if the attribute is in the array marked for removal
* before updating the final object
**/
function CheckAttributeNotRemoved( attName, attArray )
{
dump("IN CAAAAAAAA\n");
dump("CAAAA: " + attArray + "\n");
for( var i = 0; i < attArray.length; i++ )
{
if( attName == attArray[i] )
return false;
}
return true;
}
/**
* function : void doRemoveAttribute( DOMElement which);
* parameters : DOMElement that was context-clicked.
* 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 )
{
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;
// HTML ATTRIBUTES
for(var i = 0; i < HTMLAList.childNodes.length; i++)
var kids = tree.lastChild; // treechildren element of tree
var selArray = [];
for ( var i = 0; i < tree.selectedItems.length; i++ )
{
var item = HTMLAList.childNodes[i];
var name = TrimString(item.firstChild.firstChild.firstChild.nodeValue);
var value = TrimString(item.firstChild.lastChild.firstChild.value);
dump("HTML Attrs: n: " + name + "; v: " + value + "\n");
element.setAttribute(name,value);
var item = tree.selectedItems[i];
// add to array of removed items for the particular panel that is displayed
var name = item.firstChild.firstChild;
switch ( tree.id ) {
case "HTMLATree":
HTMLRAttrs[HTMLRAttrs.length] = TrimString(name.getAttribute("value"));
dump("HTMLRAttrs[" + (HTMLRAttrs.length - 1) + "]: " + HTMLRAttrs[HTMLRAttrs.length-1] + "\n");
break;
case "CSSATree":
CSSRAttrs[CSSRAttrs.length] = TrimString(name.getAttribute("value"));
break;
case "JSEATree":
JSERAttrs[JSERAttrs.length] = TrimString(name.getAttribute("value"));
break;
default: break;
}
selArray[i] = item;
}
// CSS ATTRIBUTES
var styleString = "";
for(var i = 0; i < CSSAList.childNodes.length; i++)
// 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++ )
{
var item = CSSAList.childNodes[i];
var name = TrimString(item.firstChild.firstChild.firstChild.nodeValue);
var value = TrimString(item.firstChild.lastChild.firstChild.value);
if(name.lastIndexOf(":") == (name.length - 1) && name.length > 0)
name = name.substring(0,name.length-1);
if(value.lastIndexOf(";") == (value.length - 1) && value.length > 0)
value = name.substring(0,value.length-1);
if(i == (CSSAList.childNodes.length - 1))
styleString += name + ": " + value + ";"; // last property
else
styleString += name + ": " + value + "; ";
}
dump("stylestring: ||" + styleString + "||\n");
var name = "width";
if(styleString.length > 0) {
element.setAttribute(name,styleString);
}
// JS EVENT HANDLERS
for(var i = 0; i < JSEAList.childNodes.length; i++)
{
var item = JSEAList.childNodes[i];
name = TrimString(item.firstChild.firstChild.firstChild.nodeValue);
value = TrimString(item.firstChild.lastChild.firstChild.value);
element.setAttribute(name,value);
// 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)
{
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;
switch(tree.id) {
case "HTMLATree":
document.getElementById("AddHTMLAttributeNameInput").focus();
break;
case "CSSATree":
document.getElementById("AddCSSAttributeNameInput").focus();
break;
case "JSEATree":
document.getElementById("AddJSEAttributeNameInput").focus();
break;
default:
break;
}
}
// checks to see if any other attributes by the same name as the arg supplied
// already exist.
function CheckAttributeNameSimilarity(attName, attArray)
function doSelect(e)
{
for(var i = 0; i < attArray.length; i++)
if ( TEXT_WIDGETS_DONT_SUCK && PERFORMANCE_BOOSTS ) {
var cell = e.target.parentNode.lastChild;
var input = cell.firstChild;
var selitems = document.getElementsByAttribute("class","FocusSelected");
for ( var i = 0; i < selitems.length; i++ )
{
if(attName == attArray[i])
return false;
if ( selitems[i].nodeName == "input" ) {
selitems[i].removeAttribute("class","FocusSelected");
selitems[i].setAttribute("class","AttributesCell");
} else if ( selitems[i].nodeName == "treecell" )
selitems[i].removeAttribute("class","FocusSelected");
}
return true;
cell.setAttribute("class","FocusSelected");
input.setAttribute("class","FocusSelected");
input.focus();
}
}
// adds a generalised treeitem.
function AddTreeItem ( name, value, treekids, attArray, valueCaseFunc )
{
attArray[attArray.length] = name;
var treekids = document.getElementById ( treekids );
var treeitem = document.createElement ( "treeitem" );
var treerow = document.createElement ( "treerow" );
var attrcell = document.createElement ( "treecell" );
attrcell.setAttribute( "value", name.toLowerCase() );
treerow.appendChild ( attrcell );
if ( !valueCaseFunc ) {
// no handling function provided, create default cell.
var valcell = CreateCellWithField ( name, value);
treerow.appendChild ( valcell );
} else
valueCaseFunc(); // run user specified function for adding content
treeitem.appendChild ( treerow );
treekids.appendChild ( treeitem );
return treeitem;
}
// creates a generic treecell with field inside.
// optional parameters for initial values.
function CreateCellWithField( name, value )
{
var valcell = document.createElement ( "treecell" );
valcell.setAttribute ( "class", "value" );
valcell.setAttribute ( "treeallowevents", "true" );
var valField = document.createElement ( "html:input" );
valField.setAttribute ( "type", "text" );
if ( name ) valField.setAttribute ( "id", name );
if ( value ) valField.setAttribute ( "value", value );
valField.setAttribute ( "flex", "100%" );
valField.setAttribute ( "class", "AttributesCell" );
valcell.appendChild ( valField );
return valcell;
}
// todo: implement attribute parsing, e.g. colorpicker appending, etc.
function AttributeParser( name, value )
{
}

Просмотреть файл

@ -19,7 +19,7 @@
- Rights Reserved.
-
- Contributor(s):
- Ben Goodger
- Ben "Count XULula" Goodger
-->
@ -36,139 +36,156 @@
onload = "Startup()"
align="vertical">
<!-- Methods common to all editor dialogs -->
<html:script language="JavaScript" src="chrome://editor/content/EdDialogCommon.js"/>
<!-- global dialog functions -->
<html:script language="JavaScript" src="chrome://editor/content/EdAdvancedEdit.js"/>
<!-- element page functions -->
<html:script language="JavaScript" src="chrome://editor/content/EdAEHTMLAttributes.js"/>
<html:script language="JavaScript" src="chrome://editor/content/EdAECSSAttributes.js"/>
<html:script language="JavaScript" src="chrome://editor/content/EdAEJSEAttributes.js"/>
<!-- Methods common to all editor dialogs -->
<html:script language="JavaScript" src="chrome://editor/content/EdDialogCommon.js"/>
<!-- global dialog functions -->
<html:script language="JavaScript" src="chrome://editor/content/EdAdvancedEdit.js"/>
<!-- element page functions -->
<html:script language="JavaScript" src="chrome://editor/content/EdAEHTMLAttributes.js"/>
<html:script language="JavaScript" src="chrome://editor/content/EdAECSSAttributes.js"/>
<html:script language="JavaScript" src="chrome://editor/content/EdAEJSEAttributes.js"/>
<html:script language="JavaScript" src="chrome://global/content/dialogOverlay.js" />
<html:script language="JavaScript" src="chrome://global/content/dialogOverlay.js" />
<html:script language="javascript" src="chrome://global/content/strres.js" />
<broadcaster id="args" value=""/>
<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 align="horizontal">
<html:label flex="100%">&currentattributesfor.label;</html:label>
<html:div flex="100%" id="tagLabel"/>
</box>
<spring class="spacer"/>
<tabcontrol align="vertical">
<tabbox>
<tab selected="true">&tabHTML.label;</tab>
<tab>&tabCSS.label;</tab>
<tab>&tabJSE.label;</tab>
<spring flex="1"/>
</tabbox>
<tabpanel>
<!-- CSS Properties -->
<box align="horizontal">
<html:label>&currentattributesfor.label;</html:label>
<html:div flex="100%" id="tagLabel"/>
</box>
<spring class="spacer"/>
<tabcontrol align="vertical">
<tabbox>
<tab selected="true">&tabHTML.label;</tab>
<tab>&tabCSS.label;</tab>
<tab>&tabJSE.label;</tab>
<spring flex="1"/>
</tabbox>
<tabpanel>
<!-- ============================================================== -->
<!-- HTML Attributes -->
<!-- ============================================================== -->
<box class="tabpanel" flex="100%" align="vertical">
<tree id="HTMLATree" class="AttributesTree" flex="100%">
<treecol width="20%"/>
<treecol width="80%"/>
<tree id="HTMLATree"
class="AttributesTree"
flex="100%"
context="attlistPopup">
<treecol width="35%"/>
<treecol width="65%" style="min-width: 30%"/>
<treehead>
<treerow>
<treecell>&tree.attributeHeader.label;</treecell>
<treecell>&tree.valueHeader.label;</treecell>
<treecell value="&tree.attributeHeader.label;"/>
<treecell value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="HTMLAList"/>
</tree>
<box align="vertical">
<spring class="spacer"/>
<html:fieldset>
<html:legend>&AddHTMLAttributeLabel.label;</html:legend>
<box align="horizontal">
<html:label for="AddHTMLAttributeNameInput"> &AttName.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddHTMLAttributeNameInput" onkeyup="doHTMLEnabling()" onmouseup="doHTMLEnabling()"/></html:div>
<spring class="spacer"/>
</box>
<html:label for="AddHTMLAttributeValueInput"> &AttValue.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddHTMLAttributeValueInput"/></html:div>
<spring flex="100%" class="spacer"/>
<html:div><titledbutton class="push" id="AddHTMLAttribute" onclick="onAddHTMLAttribute()" value="&AddAttributeButton.label;" disabled="true"/></html:div>
</box>
<spring class="spacer"/>
<html:fieldset>
<html:legend>&AddHTMLAttributeLabel.label;</html:legend>
<box align="horizontal">
<html:label for="AddHTMLAttributeNameInput"> &AttName.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddHTMLAttributeNameInput" onkeyup="doHTMLEnabling(event.which)" onmouseup="doHTMLEnabling(event.which)"/></html:div>
<spring class="spacer"/>
</box>
<html:label for="AddHTMLAttributeValueInput"> &AttValue.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddHTMLAttributeValueInput" onkeyup="doHTMLEnabling(event.which)"/></html:div>
<spring flex="100%" class="spacer"/>
<html:div><titledbutton class="push" id="AddHTMLAttribute" onclick="onAddHTMLAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/></html:div>
</box>
</html:fieldset>
</box>
</html:fieldset>
</box>
</box>
<!-- JavaScript Event Handlers -->
<!-- ============================================================== -->
<!-- CSS Attributes -->
<!-- ============================================================== -->
<box class="tabpanel" flex="100%" align="vertical">
<tree id="JSEATree" class="AttributesTree" flex="100%">
<treecol width="20%"/>
<treecol width="80%"/>
<tree id="CSSATree" class="AttributesTree" flex="100%" context="attlistPopup">
<treecol width="35%"/>
<treecol width="65%" style="min-width: 30%"/>
<treehead>
<treerow>
<treecell>&tree.attributeHeader.label;</treecell>
<treecell>&tree.valueHeader.label;</treecell>
</treerow>
</treehead>
<treechildren id="JSEAList"/>
</tree>
<box align="vertical">
<spring class="spacer"/>
<html:fieldset>
<html:legend>&AddJSEAttributeLabel.label;</html:legend>
<box align="horizontal">
<html:label for="JSEAddAttributeNameInput"> &AttName.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddJSEAttributeNameInput" onkeyup="doJSEEnabling()" onmouseup="doJSEEnabling()"/></html:div>
<spring class="spacer"/>
</box>
<html:label for="AddJSEAttributeValueInput"> &AttValue.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddJSEAttributeValueInput"/></html:div>
<spring flex="100%" class="spacer"/>
<html:div><titledbutton class="push" id="AddJSEAttribute" onclick="onAddJSEAttribute()" value="&AddAttributeButton.label;" disabled="true"/></html:div>
</box>
</box>
</html:fieldset>
</box>
</box>
<!-- HTML Attributes -->
<box class="tabpanel" flex="100%" align="vertical">
<tree id="CSSATree" class="AttributesTree" flex="100%">
<treecol width="20%"/>
<treecol width="80%"/>
<treehead>
<treerow>
<treecell>&tree.attributeHeader.label;</treecell>
<treecell>&tree.valueHeader.label;</treecell>
<treecell value="&tree.attributeHeader.label;"/>
<treecell value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="CSSAList"/>
</tree>
<box align="vertical">
<spring class="spacer"/>
<html:fieldset>
<html:legend>&AddCSSAttributeLabel.label;</html:legend>
<box align="horizontal">
<html:label for="AddCSSAttributeNameInput"> &AttName.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddCSSAttributeNameInput" onkeyup="doCSSEnabling()" onmouseup="doCSSEnabling()"/></html:div>
<spring class="spacer"/>
</box>
<html:label for="AddCSSAttributeValueInput"> &AttValue.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddCSSAttributeValueInput"/></html:div>
<spring flex="100%" class="spacer"/>
<html:div><titledbutton class="push" id="AddCSSAttribute" onclick="onAddCSSAttribute()" value="&AddAttributeButton.label;" disabled="true"/></html:div>
</box>
</box>
</html:fieldset>
<spring class="spacer"/>
<html:fieldset>
<html:legend>&AddCSSAttributeLabel.label;</html:legend>
<box align="horizontal">
<html:label for="AddCSSAttributeNameInput"> &AttName.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddCSSAttributeNameInput" onkeyup="doCSSEnabling(event.which)" onmouseup="doCSSEnabling(event.which)"/></html:div>
<spring class="spacer"/>
</box>
<html:label for="AddCSSAttributeValueInput"> &AttValue.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddCSSAttributeValueInput" onkeyup="doCSSEnabling(event.which)"/></html:div>
<spring flex="100%" class="spacer"/>
<html:div><titledbutton class="push" id="AddCSSAttribute" onclick="onAddCSSAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/></html:div>
</box>
</box>
</html:fieldset>
</box>
</box>
<!-- ============================================================== -->
<!-- JavaScript Event Handlers -->
<!-- ============================================================== -->
<box class="tabpanel" flex="100%" align="vertical">
<tree id="JSEATree" class="AttributesTree" flex="100%" context="attlistPopup">
<treecol width="35%"/>
<treecol width="65%" style="min-width: 30%"/>
<treehead>
<treerow>
<treecell value="&tree.attributeHeader.label;"/>
<treecell value="&tree.valueHeader.label;"/>
</treerow>
</treehead>
<treechildren id="JSEAList"/>
</tree>
<box align="vertical">
<spring class="spacer"/>
<html:fieldset>
<html:legend>&AddJSEAttributeLabel.label;</html:legend>
<box align="horizontal">
<html:label for="JSEAddAttributeNameInput"> &AttName.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddJSEAttributeNameInput" onkeyup="doJSEEnabling(event.which)" onmouseup="doJSEEnabling(event.which)"/></html:div>
<spring class="spacer"/>
</box>
<html:label for="AddJSEAttributeValueInput"> &AttValue.label;</html:label>
<box align="horizontal" flex="100%">
<html:div><html:input type="text" id="AddJSEAttributeValueInput" onkeyup="doJSEEnabling(event.which)"/></html:div>
<spring flex="100%" class="spacer"/>
<html:div><titledbutton class="push" id="AddJSEAttribute" onclick="onAddJSEAttribute(this)" value="&AddAttributeButton.label;" disabled="true"/></html:div>
</box>
</box>
</html:fieldset>
</box>
</box>
<!-- ============================================================== -->
</tabpanel>
</tabcontrol>
</tabpanel>
</tabcontrol>
<box align="horizontal">
<html:div style="margin-top: 0.5em"><titledbutton class="push" value="&HTMLReference.label;"/></html:div>
<spring flex="100%"/>
<!-- from global dialogOverlay -->
<box id="okCancelButtons"/>
</box>
<box align="horizontal">
<html:div style="margin-top: 0.5em"><titledbutton class="push" value="&HTMLReference.label;"/></html:div>
<spring flex="100%"/>
<!-- from global dialogOverlay -->
<box id="okCancelButtons"/>
</box>
</window>