mozilla
/
mozilla-history
зеркало из https://github.com/mozilla/mozilla-history.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

-- NOT PART OF THE BUILD -- 

CaScadeS only

1. adds support for -moz-opacity
2. fixes support for line-height; b=169362
3. SerializeExternalSheet was using unefficient code; b=168755
4. prepares @page support, related to implem did by rods and myself in bug 115199
5. fixed border support
6. added support for !important declarations (but please see bug 178668)
7. fixed volume support; b=169363
8. prepares support for CSS level and browsers compatiblity
   (be able to say e.g. I want styles CSS 2 accepted by both NS4 and Opera5)
9. adds support for moving rules inside and between stylesheets,
    and support for stylesheet reordering
10. removed JS warnings
11. faster and more efficient code in stylesheets tree refresh
This commit is contained in:
glazman%netscape.com 2002-11-07 09:24:36 +00:00
Родитель d10d4ceb2f
Коммит f30d3ed334
6 изменённых файлов: 520 добавлений и 256 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

10
extensions/editor/cascades/resources/content/EdCssProps-utils.js
Просмотреть файл

@ -125,11 +125,7 @@ function getLocalFileURL(openOnly)
}
// SaveFilePickerDirectory(fp, fileType);
var ioService = GetIOService();
if (ioService && ioService.getURLSpecFromFile)
return fp.file ? ioService.getURLSpecFromFile(fp.file) : null;
else
return fp.file ? getURLSpecFromFile(fp.file) : null;
return fp.file ? getURLSpecFromFile(fp.file) : null;
}
// blatantly stolen from Venkman
@ -164,3 +160,7 @@ function doDump(text, value) {
dump("===> " + text + " : " + value + "\n");
}
function ClearTreeSelection(tree) {
if (tree)
tree.treeBoxObject.selection.clearSelection();
}

407
extensions/editor/cascades/resources/content/EdCssProps.js
Просмотреть файл

@ -43,12 +43,13 @@ const CHARSET_RULE = 5;
const PAGE_RULE = 6;
const OWNER_NODE = 7;
const GENERAL_TAB = 1;
const TEXT_TAB = 2;
const BACKGROUND_TAB = 3;
const BORDER_TAB = 4;
const BOX_TAB = 5;
const AURAL_TAB = 6;
const COMPATIBILITY_TAB = 1;
const GENERAL_TAB = 2;
const TEXT_TAB = 3;
const BACKGROUND_TAB = 4;
const BORDER_TAB = 5;
const BOX_TAB = 6;
const AURAL_TAB = 7;
const GENERIC_SELECTOR = 0;
const TYPE_ELEMENT_SELECTOR = 1;
@ -94,7 +95,7 @@ function Startup()
gDialog.upButton = document.getElementById("upButton");
gDialog.downButton = document.getElementById("downButton");
gDialog.selectedTab = GENERAL_TAB;
gDialog.selectedTab = COMPATIBILITY_TAB;
gDialog.sheetInfoTabPanelTitle = document.getElementById("sheetInfoTabPanelTitle");
gDialog.textTab = document.getElementById("textTab");
gDialog.brownFoxLabel = document.getElementById("brownFoxLabel");
@ -142,6 +143,7 @@ function Startup()
gDialog.muteVolumeCheckbox = document.getElementById("muteVolumeCheckbox");
gDialog.opacityScrollbar = document.getElementById("opacityScrollbar");
gDialog.opacityLabel = document.getElementById("opacityLabel");
gDialog.sheetInfoTabGridRows = document.getElementById("sheetInfoTabGridRows");
gDialog.sheetInfoTabGrid = document.getElementById("sheetInfoTabGrid");
@ -226,7 +228,7 @@ function CleanSheetsTree(sheetsTreeChildren)
{
// we need to clear the selection in the tree otherwise the onselect
// action on the tree will be fired when we removed the selected entry
gDialog.sheetsTree.treeBoxObject.selection.clearSelection();
ClearTreeSelection(gDialog.sheetsTree);
var elt = sheetsTreeChildren.firstChild;
while (elt) {
@ -241,9 +243,9 @@ function AddSheetEntryToTree(sheetsTree, ownerNode)
if (ownerNode.nodeType == Node.ELEMENT_NODE) {
var ownerTag = ownerNode.nodeName.toLowerCase()
var relType = ownerNode.getAttribute("rel");
if (relType) relType = relType.toLowerCase();
if (ownerTag == "style" ||
(ownerTag == "link" &&
(relType == "stylesheet" || relType == "alternate stylesheet"))) {
(ownerTag == "link" && relType.indexOf("stylesheet") != -1)) {
var treeitem = document.createElementNS(XUL_NS, "treeitem");
var treerow = document.createElementNS(XUL_NS, "treerow");
@ -362,6 +364,24 @@ function AddStyleRuleToTreeChildren(rule, external, depth)
return subtreeitem;
}
function AddPageRuleToTreeChildren(rule, external, depth)
{
var subtreeitem = document.createElementNS(XUL_NS, "treeitem");
var subtreerow = document.createElementNS(XUL_NS, "treerow");
var subtreecell = document.createElementNS(XUL_NS, "treecell");
// show the selector attached to the rule
subtreecell.setAttribute("label", "@page " + rule.selectorText);
var o = newObject( subtreeitem, external, PAGE_RULE, rule, false, depth );
PushInObjectsArray(o);
if (external) {
subtreecell.setAttribute("properties", "external");
}
subtreerow.appendChild(subtreecell);
subtreeitem.appendChild(subtreerow);
return subtreeitem;
}
function AddImportRuleToTreeChildren(rule, external, depth)
{
var subtreeitem = document.createElementNS(XUL_NS, "treeitem");
@ -409,6 +429,11 @@ function AddRulesToTreechildren(treeItem, rules, external, depth)
subtreeitem = AddStyleRuleToTreeChildren(rules[j], external, depth);
subtreechildren.appendChild(subtreeitem);
break;
case CSSRule.PAGE_RULE:
// this is a CSSStyleRule
subtreeitem = AddPageRuleToTreeChildren(rules[j], external, depth);
subtreechildren.appendChild(subtreeitem);
break;
case CSSRule.IMPORT_RULE:
// this is CSSImportRule for @import
subtreeitem = AddImportRuleToTreeChildren(rules[j], external, depth);
@ -422,7 +447,7 @@ function AddRulesToTreechildren(treeItem, rules, external, depth)
// show "@media" and media list
subtreecell.setAttribute("label", "@media "+rules[j].media.mediaText, external);
o = newObject( subtreeitem, external, MEDIA_RULE, rules[j], false, depth );
PushInObjectsArray(o, insertIndex);
PushInObjectsArray(o);
if (external) {
subtreecell.setAttribute("properties", "external");
}
@ -431,8 +456,7 @@ function AddRulesToTreechildren(treeItem, rules, external, depth)
subtreeitem.setAttribute("container", "true");
// let's browse the rules attached to this CSSMediaRule, keeping the
// current external and increasing depth
AddRulesToTreechildren(subtreeitem, rules[j].cssRules, external, depth+1,
(insertIndex == -1) ? insertIndex : insertIndex+1 );
AddRulesToTreechildren(subtreeitem, rules[j].cssRules, external, depth+1);
subtreechildren.appendChild(subtreeitem);
break;
case CSSRule.CHARSET_RULE:
@ -443,7 +467,7 @@ function AddRulesToTreechildren(treeItem, rules, external, depth)
// show "@charset" and the encoding
subtreecell.setAttribute("label", "@charset "+rules[j].encoding, external);
o = newObject( subtreeitem, external, CHARSET_RULE, rules[j], false, depth );
PushInObjectsArray(o, insertIndex);
PushInObjectsArray(o);
if (external) {
subtreecell.setAttribute("properties", "external");
}
@ -490,19 +514,21 @@ function GetSelectedItemData()
function onSelectCSSTreeItem(tab)
{
// convert the tab string into a tab id
if (tab == "general") tab = GENERAL_TAB;
else if (tab == "text") tab = TEXT_TAB;
else if (tab == "background") tab = BACKGROUND_TAB;
else if (tab == "border") tab = BORDER_TAB;
else if (tab == "box") tab = BOX_TAB;
else if (tab == "aural") tab = AURAL_TAB;
if (tab == "general") tab = GENERAL_TAB;
else if (tab == "compatibility") tab = COMPATIBILITY_TAB;
else if (tab == "text") tab = TEXT_TAB;
else if (tab == "background") tab = BACKGROUND_TAB;
else if (tab == "border") tab = BORDER_TAB;
else if (tab == "box") tab = BOX_TAB;
else if (tab == "aural") tab = AURAL_TAB;
GetSelectedItemData();
if (gDialog.selectedIndex == -1) {
// there is no tree item selected, let's fallback to the Info tab
// but there is nothing we can display in that tab...
gDialog.sheetTabbox.selectedTab = gDialog.sheetInfoTab;
if (tab != COMPATIBILITY_TAB)
gDialog.sheetTabbox.selectedTab = gDialog.sheetInfoTab;
return;
}
@ -524,6 +550,9 @@ function onSelectCSSTreeItem(tab)
tab = gDialog.selectedTab ? gDialog.selectedTab : GENERAL_TAB;
}
switch (tab) {
case COMPATIBILITY_TAB:
return;
break;
case TEXT_TAB:
// we have to update the text preview, let's remove its style attribute
gDialog.brownFoxLabel.removeAttribute("style");
@ -578,65 +607,70 @@ function onSelectCSSTreeItem(tab)
}
break;
case SHEET:
var alternate = "";
if (external &&
cssObject.ownerNode.getAttribute("rel").toLowerCase() == "alternate stylesheet") {
alternate = " (alternate)";
if (cssObject) {
var alternate = "";
if (external &&
cssObject.ownerNode.getAttribute("rel").toLowerCase().indexOf("alternate") != -1) {
alternate = " (alternate)";
}
gDialog.sheetInfoTabPanelTitle.setAttribute("value", "Stylesheet"+alternate);
AddLabelToInfobox(gridrows, "Type:", cssObject.type, null, false);
AddCheckboxToInfobox(gridrows, "Disabled:", "check to disable stylesheet (cannot be saved)",
cssObject.disabled, "onStylesheetDisabledChange");
var href;
if (cssObject.ownerNode.nodeName.toLowerCase() == "link") {
href = cssObject.href;
}
else {
href = "none (embedded into the document)";
}
AddLabelToInfobox(gridrows, "URL:", href, null, false);
var mediaList = cssObject.media.mediaText;
if (!mediaList || mediaList == "") {
mediaList = "all";
}
AddEditableZoneToInfobox(gridrows, "Media list:", mediaList, "onStylesheetMediaChange", false);
if (cssObject.title) {
AddEditableZoneToInfobox(gridrows, "Title:", cssObject.title, "onStylesheetTitleChange", false);
}
if (cssObject.cssRules) {
AddLabelToInfobox(gridrows, "Number of rules:", cssObject.cssRules.length, null, false);
}
if (!external && cssObject.ownerNode.nodeName.toLowerCase() == "style")
// we can export only embedded stylesheets
AddSingleButtonToInfobox(gridrows, "Export stylesheet and switch to exported version", "onExportStylesheet")
}
gDialog.sheetInfoTabPanelTitle.setAttribute("value", "Stylesheet"+alternate);
AddLabelToInfobox(gridrows, "Type:", cssObject.type, false);
AddCheckboxToInfobox(gridrows, "Disabled:", "check to disable stylesheet (cannot be saved)",
cssObject.disabled, "onStylesheetDisabledChange");
var href;
if (cssObject.ownerNode.nodeName.toLowerCase() == "link") {
href = cssObject.href;
}
else {
href = "none (embedded into the document)";
}
AddLabelToInfobox(gridrows, "URL:", href, false);
var mediaList = cssObject.media.mediaText;
if (!mediaList || mediaList == "") {
mediaList = "all";
}
AddEditableZoneToInfobox(gridrows, "Media list:", mediaList, "onStylesheetMediaChange", false);
if (cssObject.title) {
AddEditableZoneToInfobox(gridrows, "Title:", cssObject.title, "onStylesheetTitleChange", false);
}
if (cssObject.cssRules) {
AddLabelToInfobox(gridrows, "Number of rules:", cssObject.cssRules.length, false);
}
if (!external && cssObject.ownerNode.nodeName.toLowerCase() == "style")
// we can export only embedded stylesheets
AddSingleButtonToInfobox(gridrows, "Export stylesheet and switch to exported version", "onExportStylesheet")
else
AddLabelToInfobox(gridrows, "Unable to retrieve stylesheet", null, null, false);
break;
case STYLE_RULE:
case PAGE_RULE:
var h = document.defaultView.getComputedStyle(grid.parentNode, "").getPropertyValue("height");
// let's prepare the grid for the case the rule has a laaaaarge number
// of property declarations
grid.setAttribute("style", "overflow: auto; height: "+h);
gDialog.sheetInfoTabPanelTitle.setAttribute("value", "Style rule");
gDialog.sheetInfoTabPanelTitle.setAttribute("value",
(type == STYLE_RULE) ? "Style rule" : "Page rule" );
AddLabelToInfobox(gridrows, "Selector:", cssObject.selectorText, false);
AddLabelToInfobox(gridrows, "Selector:", cssObject.selectorText, null, false);
if (cssObject.style.length) {
AddDeclarationToInfobox(gridrows, "Declarations:", GetDeclarationText(cssObject, 0),
GetDeclarationImportance(cssObject, 0), false);
for (var i=1; i<cssObject.style.length; i++) {
AddDeclarationToInfobox(gridrows, "", GetDeclarationText(cssObject, i),
GetDeclarationImportance(cssObject, i), false);
AddLabelToInfobox(gridrows, "Declarations:", " ", "Importance", false);
for (var i=0; i<cssObject.style.length; i++) {
AddDeclarationToInfobox(gridrows, cssObject, i, false);
}
}
// TO BE DONE : we need a way of changing the importance of a given declaration
// TO BE DONE : need a way of changing the importance of a given declaration
break;
case MEDIA_RULE:
gDialog.sheetInfoTabPanelTitle.setAttribute("value", "Media rule");
AddLabelToInfobox(gridrows, "Media list:", cssObject.media.mediaText, false);
AddLabelToInfobox(gridrows, "Number of declarations:", cssObject.cssRules.length, false);
AddLabelToInfobox(gridrows, "Media list:", cssObject.media.mediaText, null, false);
AddLabelToInfobox(gridrows, "Number of rules:", cssObject.cssRules.length, null, false);
break;
case IMPORT_RULE:
gDialog.sheetInfoTabPanelTitle.setAttribute("value", "Import rule");
AddLabelToInfobox(gridrows, "URL:", cssObject.href, false);
AddLabelToInfobox(gridrows, "Media list:", cssObject.media.mediaText, false);
AddLabelToInfobox(gridrows, "URL:", cssObject.href, null, false);
AddLabelToInfobox(gridrows, "Media list:", cssObject.media.mediaText, null, false);
break;
// TO BE DONE : @charset and other exotic rules
}
@ -658,6 +692,12 @@ function UpdateButtons(importState, mediaState, linkState, styleState, ruleState
styleState = false;
ruleState = true;
}
if (!gDialog.selectedObject) {
importState = false;
mediaState = false;
if (gDialog.selectedIndex != -1)
ruleState = false;
}
EnableUI(gDialog.atimportButton, importState);
EnableUI(gDialog.atmediaButton, mediaState);
EnableUI(gDialog.linkButton, linkState);
@ -778,25 +818,35 @@ function AddCheckboxToInfobox(rows, label, checkboxLabel, value, callback)
// param String label
// param String value
// param boolean strong
function AddLabelToInfobox(rows, label, value, strong)
function AddLabelToInfobox(rows, firstLabel, flexibleLabel, lastLabel, strong)
{
var labelLabel = document.createElementNS(XUL_NS, "label");
var row = document.createElementNS(XUL_NS, "row");
row.setAttribute("align", "center");
labelLabel.setAttribute("value", label);
labelLabel.setAttribute("value", firstLabel);
if (strong) {
labelLabel.setAttribute("class", "titleLabel");
}
row.appendChild(labelLabel);
if (value) {
if (flexibleLabel) {
var valueLabel = document.createElementNS(XUL_NS, "label");
valueLabel.setAttribute("value", value);
valueLabel.setAttribute("value", flexibleLabel);
if (strong) {
valueLabel.setAttribute("class", "titleLabel");
}
row.appendChild(valueLabel);
}
if (lastLabel) {
valueLabel = document.createElementNS(XUL_NS, "label");
valueLabel.setAttribute("value", lastLabel);
if (strong) {
valueLabel.setAttribute("class", "titleLabel");
}
row.appendChild(valueLabel);
}
rows.appendChild(row);
}
@ -805,28 +855,37 @@ function AddLabelToInfobox(rows, label, value, strong)
// param String label
// param String value
// param String importance
function AddDeclarationToInfobox(rows, label, value, importance)
function AddDeclarationToInfobox(rows, cssObject, i, importance)
{
var labelLabel = document.createElementNS(XUL_NS, "label");
var row = document.createElementNS(XUL_NS, "row");
row.setAttribute("align", "center");
labelLabel.setAttribute("value", label);
labelLabel.setAttribute("value", "");
row.appendChild(labelLabel);
var valueLabel = document.createElementNS(XUL_NS, "label");
valueLabel.setAttribute("value", value);
valueLabel.setAttribute("value", GetDeclarationText(cssObject, i));
row.appendChild(valueLabel);
var importanceLabel = document.createElementNS(XUL_NS, "label");
importanceLabel.setAttribute("value", importance);
if (importance == "!important") {
importanceLabel.setAttribute("class", "bangImportant");
var importanceLabel = document.createElementNS(XUL_NS, "checkbox");
if (GetDeclarationImportance(cssObject, i) == "important") {
importanceLabel.setAttribute("checked", true);
}
importanceLabel.setAttribute("oncommand", "TogglePropertyImportance(\"" + cssObject.style.item(i) + "\")" );
row.appendChild(importanceLabel);
rows.appendChild(row);
}
function TogglePropertyImportance(property)
{
var cssObject = gDialog.selectedObject;
dump("IMPORTANCE = " + cssObject.style.getPropertyPriority(property) + "\n");
var newImportance = (cssObject.style.getPropertyPriority(property) == "important") ? "" : "important" ;
dump("NEW IMPORTANCE = " + newImportance + "\n");
cssObject.style.setProperty(property, cssObject.style.getPropertyValue(property), newImportance);
}
// * retrieves the index-nth style declaration in a rule
// param DOMCSSRule styleRule
// param integer index
@ -939,7 +998,7 @@ function CreateNewStyleElement()
gDialog.newMediaList = "";
gDialog.newTitle = "";
gDialog.sheetInfoTabPanelTitle.setAttribute("value", "New Stylesheet");
AddLabelToInfobox(gridrows, "Type:", "text/css", false);
AddLabelToInfobox(gridrows, "Type:", "text/css", null, false);
AddEditableZoneToInfobox(gridrows, "Media list:", gDialog.newMediaList, "onNewMediaListChange", true);
AddEditableZoneToInfobox(gridrows, "Title:", gDialog.newTitle, "onNewTitleChange", false);
@ -958,7 +1017,7 @@ function CreateNewLinkedSheet()
gDialog.newMediaList = "";
gDialog.newTitle = "";
gDialog.sheetInfoTabPanelTitle.setAttribute("value", "New Linked Stylesheet");
AddLabelToInfobox(gridrows, "Type:", "text/css", false);
AddLabelToInfobox(gridrows, "Type:", "text/css", null, false);
// alternate stylesheet ?
AddCheckboxToInfobox(gridrows, "Alternate:", "check to create alternate stylesheet", gDialog.newAlternate,
"onNewAlternateChange");
@ -971,8 +1030,8 @@ function CreateNewLinkedSheet()
AddSingleButtonToInfobox(gridrows, "Create Stylesheet", "onConfirmCreateNewObject")
// the two following labels are unfortunately useful...
AddLabelToInfobox(gridrows, "", "(Warning : save document *before* attaching local stylesheet)", false);
AddLabelToInfobox(gridrows, "", "(use Refresh button if stylesheet is not immediately downloaded)", false);
AddLabelToInfobox(gridrows, "", "(Warning : save document *before* attaching local stylesheet)", null, false);
AddLabelToInfobox(gridrows, "", "(use Refresh button if stylesheet is not immediately downloaded)", null, false);
}
// * forget about everything, and let's redo it
@ -1184,7 +1243,7 @@ function onConfirmCreateNewObject()
containerIndex = GetSheetContainer();
// **must** clear the selection before changing the tree
gDialog.sheetsTree.treeBoxObject.selection.clearSelection();
ClearTreeSelection(gDialog.sheetsTree);
var containerCssObject = objectsArray[containerIndex].cssElt;
var containerDepth = objectsArray[containerIndex].depth;
@ -1242,7 +1301,7 @@ function onConfirmCreateNewObject()
case SHEET:
gInsertIndex = -1;
gDialog.sheetsTree.treeBoxObject.selection.clearSelection();
ClearTreeSelection(gDialog.sheetsTree);
if (gDialog.newExternal && gDialog.newURL != "") {
subtreeitem = document.createElementNS(XUL_NS, "treeitem");
@ -1289,7 +1348,7 @@ function onConfirmCreateNewObject()
clearTimeout(gAsyncLoadingTimerID);
sheetIndex = objectsArray.length - 1;
//gAsyncLoadingTimerID = setTimeout("sheetLoadedTimeoutCallback(" + sheetIndex + ")", kAsyncTimeout);
gAsyncLoadingTimerID = setTimeout("sheetLoadedTimeoutCallback(" + sheetIndex + ")", kAsyncTimeout);
}
else {
o = newObject( subtreeitem, external, SHEET, newSheetOwnerNode.sheet, false, 0 );
@ -1323,7 +1382,7 @@ function sheetLoadedTimeoutCallback(index)
{
var subtreeitem = objectsArray[index].xulElt;
gInsertIndex = index+1;
gDialog.sheetsTree.treeBoxObject.selection.clearSelection();
ClearTreeSelection(gDialog.sheetsTree);
if (objectsArray[index].type == OWNER_NODE && objectsArray[index].cssElt.sheet != null) {
var sheet = objectsArray[index].cssElt.sheet;
AddRulesToTreechildren(subtreeitem , sheet.cssRules, objectsArray[index].external,
@ -1421,9 +1480,168 @@ function RemoveObject()
// * moves a sheet/rule up in the tree
function MoveObjectUp()
{
/* NOT YET IMPLEMENTED */
var objectIndex = FindObjectIndexInObjectsArray(gDialog.selectedObject);
if (objectIndex == -1) return;
GetSelectedItemData();
var index = gDialog.selectedIndex;
if (index <= 0) return;
var sheetIndex = GetSheetContainer();
switch (gDialog.selectedType) {
case SHEET:
var ownerNode = gDialog.selectedObject.ownerNode;
ClearTreeSelection(gDialog.sheetsTree)
index--;
while (index && objectsArray[index].type != SHEET)
index--;
if (index == -1) return;
ownerNode.parentNode.insertBefore(ownerNode, objectsArray[index].cssElt.ownerNode);
Restart();
selectTreeItem(objectsArray[index].xulElt);
gDialog.modified = true;
break;
case OWNER_NODE:
ownerNode = gDialog.selectedObject;
ClearTreeSelection(gDialog.sheetsTree)
index--;
while (index && objectsArray[index].type != SHEET)
index--;
if (index == -1) return;
ownerNode.parentNode.insertBefore(ownerNode, objectsArray[index].cssElt.ownerNode);
Restart();
selectTreeItem(objectsArray[index].xulElt);
gDialog.modified = true;
break;
case STYLE_RULE:
case PAGE_RULE:
var rule = gDialog.selectedObject;
objectsArray[sheetIndex].modified = true;
ClearTreeSelection(gDialog.sheetsTree)
var ruleText = rule.cssText;
var subtreeitem;
var newRule;
if (rule.parentRule) {
var ruleIndex = getRuleIndexInRulesList(rule.parentRule.cssRules, rule);
var parentRule = rule.parentRule;
if (ruleIndex == -1) return;
if (!ruleIndex) {
// we have to move the rule just before its parent rule
parentRule.deleteRule(0);
var parentRuleIndex;
parentRuleIndex = getRuleIndexInRulesList(parentRule.parentStyleSheet.cssRules, parentRule);
parentRule.parentStyleSheet.insertRule(ruleText, parentRuleIndex);
newRule = parentRule.parentStyleSheet.cssRules[parentRuleIndex];
}
else {
// we just move the rule in its parentRule
parentRule.deleteRule(ruleIndex);
parentRule.insertRule(ruleText, ruleIndex - 1);
newRule = parentRule.cssRules.item(ruleIndex - 1);
}
// remove the tree entry
objectsArray[index].xulElt.parentNode.removeChild(objectsArray[index].xulElt);
// delete the object
objectsArray.splice(index, 1);
// position the insertion index
gInsertIndex = index - 1;
subtreeitem = AddStyleRuleToTreeChildren(newRule,
objectsArray[index-1].external,
objectsArray[index-1].depth);
// make the new tree entry
objectsArray[index].xulElt.parentNode.insertBefore(subtreeitem,
objectsArray[index].xulElt);
selectTreeItem(subtreeitem);
}
else {
// standard case, the parent of the rule is the stylesheet itself
ruleIndex = getRuleIndexInRulesList(rule.parentStyleSheet.cssRules, rule);
var refStyleSheet = rule.parentStyleSheet;
if (ruleIndex == -1) return;
if (ruleIndex) {
// we just move the rule in the sheet
refStyleSheet.deleteRule(ruleIndex);
var targetRule = refStyleSheet.cssRules.item(ruleIndex - 1);
if (targetRule.type == CSSRule.MEDIA_RULE) {
targetRule.insertRule(ruleText, targetRule.cssRules.length);
var targetRuleIndex = FindObjectIndexInObjectsArray(targetRule);
newRule = targetRule.cssRules.item(targetRule.cssRules.length - 1);
var subtreechildren = GetSubtreeChildren(objectsArray[targetRuleIndex].xulElt);
// in this case, the target treeitem is at same location but one level deeper
// remove the tree entry
objectsArray[index].xulElt.parentNode.removeChild(objectsArray[index].xulElt);
// delete the object
objectsArray.splice(index, 1);
// position the insertion index
gInsertIndex = index;
subtreeitem = AddStyleRuleToTreeChildren(newRule,
objectsArray[targetRuleIndex].external,
objectsArray[targetRuleIndex].depth + 1);
// make the new tree entry
subtreechildren.appendChild(subtreeitem);
selectTreeItem(subtreeitem);
return;
}
else if (targetRule.type != CSSRule.IMPORT_RULE &&
targetRule.type != CSSRule.CHARSET_RULE) {
// we can move the rule before its predecessor only if that one is
// not an @import rule nor an @charset rule
refStyleSheet.insertRule(ruleText, ruleIndex - 1);
newRule = refStyleSheet.cssRules[ruleIndex - 1];
// remove the tree entry
objectsArray[index].xulElt.parentNode.removeChild(objectsArray[index].xulElt);
// delete the object
objectsArray.splice(index, 1);
// position the insertion index
gInsertIndex = index - 1;
subtreeitem = AddStyleRuleToTreeChildren(newRule,
objectsArray[index-1].external,
objectsArray[index-1].depth);
// make the new tree entry
objectsArray[index].xulElt.parentNode.insertBefore(subtreeitem,
objectsArray[index].xulElt);
selectTreeItem(subtreeitem);
return;
}
}
// At this point, we need to move the rule from one sheet to another one, if it
// exists...
// First, let's if there is another candidate stylesheet before the current one
// for the style rule's ownership
var refSheetIndex = FindObjectIndexInObjectsArray(refStyleSheet);
sheetIndex = refSheetIndex;
if (!sheetIndex) return; // early way out
sheetIndex--;
while (sheetIndex && (objectsArray[sheetIndex].type != SHEET ||
objectsArray[sheetIndex])) {
sheetIndex--;
}
if (sheetIndex == -1) return; // no embedded or local stylesheet available
var newStyleSheet = objectsArray[sheetIndex].cssElt;
// we need to check the type of the last rule in the sheet, if it exists
if (newStyleSheet.cssRules.length &&
newStyleSheet.cssRules[newStyleSheet.cssRules.length - 1].type == CSSRule.MEDIA_RULE) {
// this media rule is our target
var refMediaRule = newStyleSheet.cssRules[newStyleSheet.cssRules.length - 1];
var refMediaRuleIndex = FindObjectIndexInObjectsArray(refMediaRule );
var refRuleIndex = refMediaRuleIndex++;
while (refRuleIndex < objectsArray.length && objectsArray[refRuleIndex].depth > 1)
refRuleIndex++;
// refRuleIndex represents where we should insert the new object
}
else {
// we just append the rule to the list of rules of the sheet
}
}
break;
}
}
// * moves a sheet/rule down in the tree
@ -1474,3 +1692,22 @@ function getCurrentEditor() {
else
return GetCurrentEditor();
}
function AddCSSLevelChoice(rows)
{
var labelLabel = document.createElementNS(XUL_NS, "label");
var row = document.createElementNS(XUL_NS, "row");
row.setAttribute("align", "center");
labelLabel.setAttribute("value", "CSS Level");
row.appendChild(labelLabel);
var level;
for (level = 1; level < 4; level++) {
var levelCheckbox = document.createElementNS(XUL_NS, "checkbox");
levelCheckbox.setAttribute("label", level);
row.appendChild(levelCheckbox);
}
rows.appendChild(row);
}

224
extensions/editor/cascades/resources/content/EdCssProps.xul
Просмотреть файл

@ -68,119 +68,117 @@
<spacer id="dummy" style="display:none"/>
<broadcaster id="args" value=""/>
<hbox>
<grid flex="1">
<rows><row flex="1"/><row/></rows>
<columns>
<column>
<tree flex="1"
seltype="single"
hidecolumnpicker="true"
id="sheetsTree"
onselect="onSelectCSSTreeItem(null);">
<treecols>
<treecol primary="true"
id="sheetsTreeCol"
flex="1"
label="&sheetsTreeColumn.label;"/>
</treecols>
<treechildren flex="1" id="stylesheetsTree"/>
</tree>
<grid>
<columns><column flex="1"/><column flex="1"/><column flex="1"/></columns>
<rows>
<row>
<button label="&importRuleButton.label;"
id="atimportButton"
disabled="true"
oncommand="CreateNewAtimportRule();"/>
<spacer/>
<button label="&mediaRuleButton.label;" id="atmediaButton" disabled="true"/>
</row>
<row>
<button label="&linkedSheetButton.label;"
id="linkButton"
oncommand="CreateNewLinkedSheet();"/>
<button label="&styleSheetButton.label;"
id="styleButton"
oncommand="CreateNewStyleElement();"/>
<button label="&ruleButton.label;"
id="ruleButton" disabled="true"
oncommand="CreateNewStyleRule();"/>
</row>
</rows>
</grid>
<checkbox label="&expertModeChecbox.label;"
id="expertModeCheckbox"
checked="true"
oncommand="toggleExpertMode();"/>
</column>
<column>
<vbox>
<button id="upButton"
class="up"
label="&upButton.label;"
oncommand="MoveObjectUp()"/>
<button id="downButton"
class="down"
label="&downButton.label;"
oncommand="MoveObjectDown()"/>
<spacer flex="1"/>
<button label="&refreshButton.label;"
oncommand="Refresh();"/>
<spacer flex="1"/>
<button label="&removeButton.label;"
id="removeButton"
disabled="true"
oncommand="RemoveObject();"/>
</vbox>
</column>
</columns>
</grid>
<tabbox id="sheetTabbox">
<tabs>
<tab id="sheetInfoTab"
selected="true"
label="&sheetInfoTab.label;"
oncommand="onSelectCSSTreeItem('general');"/>
<tab id="textTab"
label="&textTab.label;"
oncommand="onSelectCSSTreeItem('text');"/>
<tab id="backgroundTab"
label="&backgroundTab.label;"
oncommand="onSelectCSSTreeItem('background');"/>
<tab id="borderTab"
label="&borderTab.label;"
oncommand="onSelectCSSTreeItem('border');"/>
<tab id="boxTab"
label="&boxTab.label;"
oncommand="onSelectCSSTreeItem('box');"/>
<tab id="auralTab"
label="&auralTab.label;"
oncommand="onSelectCSSTreeItem('aural');"/>
</tabs>
<!-- defined in tabsOverlay -->
<tabpanels id="TabPanels">
<!-- STYLESHEET INFORMATION PANEL -->
<vbox id="sheetInfoTabPanel"
flex="1">
<label id="sheetInfoTabPanelTitle"
value=""/>
<vbox flex="1">
<grid id="sheetInfoTabGrid">
<columns><column/><column flex="1"/></columns>
</grid>
<grid flex="1">
<rows><row flex="1"/><row/></rows>
<columns>
<column>
<tree flex="1"
seltype="single"
hidecolumnpicker="true"
id="sheetsTree"
onselect="onSelectCSSTreeItem(null);">
<treecols>
<treecol primary="true"
id="sheetsTreeCol"
flex="1"
label="&sheetsTreeColumn.label;"/>
</treecols>
<treechildren flex="1" id="stylesheetsTree"/>
</tree>
<grid>
<columns><column flex="1"/><column flex="1"/><column flex="1"/></columns>
<rows>
<row>
<button label="&importRuleButton.label;"
id="atimportButton"
disabled="true"
oncommand="CreateNewAtimportRule();"/>
<spacer/>
<button label="&mediaRuleButton.label;" id="atmediaButton" disabled="true"/>
</row>
<row>
<button label="&linkedSheetButton.label;"
id="linkButton"
oncommand="CreateNewLinkedSheet();"/>
<button label="&styleSheetButton.label;"
id="styleButton"
oncommand="CreateNewStyleElement();"/>
<button label="&ruleButton.label;"
id="ruleButton" disabled="true"
oncommand="CreateNewStyleRule();"/>
</row>
</rows>
</grid>
<checkbox label="&expertModeChecbox.label;"
id="expertModeCheckbox"
checked="true"
oncommand="toggleExpertMode();"/>
</column>
<column>
<vbox>
<button id="upButton"
class="up"
label="&upButton.label;"
oncommand="MoveObjectUp()"/>
<button id="downButton"
class="down"
label="&downButton.label;"
oncommand="MoveObjectDown()"/>
<spacer flex="1"/>
<button label="&refreshButton.label;"
oncommand="Refresh();"/>
<spacer flex="1"/>
<button label="&removeButton.label;"
id="removeButton"
disabled="true"
oncommand="RemoveObject();"/>
</vbox>
</vbox>
<!-- other tabs defined in tabsOverlay.xul -->
</tabpanels>
</tabbox>
</hbox>
<hbox>
<spacer flex="1"/>
<hbox>
<button class="align-right"
label="&closeButton.label;"
oncommand="FlushChanges(); window.close();"/>
</hbox>
</column>
</columns>
</grid>
<vbox>
<tabbox id="sheetTabbox">
<tabs>
<tab id="sheetInfoTab"
label="&sheetInfoTab.label;"
oncommand="onSelectCSSTreeItem('general');"/>
<tab id="textTab"
label="&textTab.label;"
oncommand="onSelectCSSTreeItem('text');"/>
<tab id="backgroundTab"
label="&backgroundTab.label;"
oncommand="onSelectCSSTreeItem('background');"/>
<tab id="borderTab"
label="&borderTab.label;"
oncommand="onSelectCSSTreeItem('border');"/>
<tab id="boxTab"
label="&boxTab.label;"
oncommand="onSelectCSSTreeItem('box');"/>
<tab id="auralTab"
label="&auralTab.label;"
oncommand="onSelectCSSTreeItem('aural');"/>
</tabs>
<!-- defined in tabsOverlay -->
<tabpanels id="TabPanels">
<!-- STYLESHEET INFORMATION PANEL -->
<vbox id="sheetInfoTabPanel"
flex="1">
<label id="sheetInfoTabPanelTitle"
value=""/>
<vbox flex="1">
<grid id="sheetInfoTabGrid">
<columns><column/><column flex="1"/></columns>
</grid>
</vbox>
</vbox>
<!-- other tabs defined in tabsOverlay.xul -->
</tabpanels>
</tabbox>
<hbox align="center">
<spacer flex="1"/>
<button label="&closeButton.label;"
oncommand="FlushChanges(); window.close();"/>
</hbox>
</vbox>
</hbox>
</window>

115
extensions/editor/cascades/resources/content/commonCssProps.js
Просмотреть файл

@ -560,21 +560,23 @@ function InitAuralTabPanel()
// observe the scrollbar and call onScrollbarAttrModified when an attribute is modified
gDialog.volumeScrollbar.removeEventListener("DOMAttrModified", onVolumeScrollbarAttrModified, false);
gDialog.volumeScrollbar.addEventListener("DOMAttrModified", onVolumeScrollbarAttrModified, false);
var volume = getSpecifiedStyle("volume");
if (volume == "silent") {
gDialog.muteVolumeCheckbox.checked = true;
gDialog.volumeScrollbar.setAttribute("disable", "true");
gDialog.volumeScrollbar.setAttribute("disabled", "true");
}
else {
gDialog.muteVolumeCheckbox.checked = false;
gDialog.volumeScrollbar.removeAttribute("disable");
gDialog.volumeScrollbar.removeAttribute("disabled");
}
// if no volume specified, display medium value
if (!volume || volume == "") volume = "50";
if (!volume)
volume = "50";
gDialog.volumeMenulist.value = volume;
UpdateScrollbar(gDialog.volumeMenulist, 'volumeScrollbar');
gDialog.volumeScrollbar.addEventListener("DOMAttrModified", onVolumeScrollbarAttrModified, false);
SelectsOneChoice("speak", "speakMenulist", "SpeakMenu", null);
SelectsOneChoice("speech-rate", "speechRateMenulist", "SpeechRateMenu", null);
}
@ -597,7 +599,10 @@ function onOpacityScrollbarAttrModified(aEvent)
{
if (aEvent.attrName == "curpos") {
var v = aEvent.newValue / 1000;
doDump("opacity", v);
if (v == 1)
gDialog.opacityLabel.setAttribute("value", "transparent");
else
gDialog.opacityLabel.setAttribute("value", v);
AddStyleToElement(gDialog.selectedObject, "-moz-opacity", v);
SetModifiedFlagOnStylesheet();
}
@ -699,17 +704,17 @@ function InitBorderTabPanel()
var style = [ getSpecifiedStyle("border-top-style"),
getSpecifiedStyle("border-left-style"),
getSpecifiedStyle("border-right-style"),
getSpecifiedStyle("border-top-style")
getSpecifiedStyle("border-bottom-style")
];
var width = [ getSpecifiedStyle("border-top-width"),
getSpecifiedStyle("border-left-width"),
getSpecifiedStyle("border-left-width"),
getSpecifiedStyle("border-top-width")
getSpecifiedStyle("border-right-width"),
getSpecifiedStyle("border-bottom-width")
];
var color = [ ConvertRGBColorIntoHEXColor(getSpecifiedStyle("border-top-color")),
ConvertRGBColorIntoHEXColor(getSpecifiedStyle("border-left-color")),
ConvertRGBColorIntoHEXColor(getSpecifiedStyle("border-right-color")),
ConvertRGBColorIntoHEXColor(getSpecifiedStyle("border-top-color"))
ConvertRGBColorIntoHEXColor(getSpecifiedStyle("border-bottom-color"))
];
var sameFourSides = false;
@ -726,29 +731,45 @@ function InitBorderTabPanel()
var sideArray = [ "top", "left", "right", "bottom" ];
for (var i=0; i<sideArray.length; i++) {
var menuItemPrefix = style[i];
if (!menuItemPrefix || menuItemPrefix == "")
menuItemPrefix = "unspecified";
var styleMenuitem = document.getElementById( menuItemPrefix+sideArray[i]+"BorderStyle" );
var styleMenulist = document.getElementById( sideArray[i]+"BorderStyleMenulist" );
styleMenulist.selectedItem = styleMenuitem;
var styleMenu = document.getElementById( sideArray[i]+"BorderStyleMenulist" );
var colorInput = document.getElementById( sideArray[i]+"BorderColorInput" );
colorInput.value = color[i];
setColorWell("border"+sideArray[i]+"CW", color[i]);
var widthInput = document.getElementById( sideArray[i]+"BorderWidthInput" );
widthInput.value = width[i];
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-color", color[i]);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-style", style[i]);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-width", width[i]);
if (!i || !sameFourSides) {
EnableUI(styleMenu, true);
EnableUI(colorInput, true);
EnableUI(widthInput, true);
SelectsOneChoice("border-"+sideArray[i]+"-style",
sideArray[i]+"BorderStyleMenulist",
sideArray[i]+"BorderStyle", gDialog.borderPreview)
colorInput.value = color[i];
setColorWell("border"+sideArray[i]+"CW", color[i]);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-color", color[i]);
widthInput.value = width[i];
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-width", width[i]);
}
else {
EnableUI(styleMenu, false);
EnableUI(colorInput, false);
EnableUI(widthInput, false);
colorInput.value = "";
setColorWell("border"+sideArray[i]+"CW", "");
widthInput.value = "";
styleMenu.selectedItem = document.getElementById("unspecified" + sideArray[i] + "BorderStyle");
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-color", color[0]);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-style", style[0]);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-width", width[0]);
}
}
if (sameFourSides)
gDialog.allFourBordersSame.setAttribute("checked", "true");
else
gDialog.allFourBordersSame.removeAttribute("checked");
ToggleFourBorderSidesSameStyle(gDialog.allFourBordersSame);
}
// * Inits the values shown in the Background tab panel
@ -948,14 +969,20 @@ function SerializeEmbeddedSheet(sheet)
// param String href
function SerializeExternalSheet(sheet, href)
{
var nsuri = Components.classes["@mozilla.org/network/standard-url;1"].createInstance(Components.interfaces.nsIURI);
const classes = Components.classes;
const interfaces = Components.interfaces;
const nsILocalFile = interfaces.nsILocalFile;
const nsIFileOutputStream = interfaces.nsIFileOutputStream;
const FILEOUT_CTRID = '@mozilla.org/network/file-output-stream;1';
var fileHandler = GetFileProtocolHandler();
var localFile;
if (href)
nsuri.spec = href;
localFile = fileHandler.getFileFromURLSpec(href).QueryInterface(nsILocalFile);
else
nsuri.spec = sheet.href;
var fileURL = nsuri.QueryInterface(Components.interfaces.nsIFileURL);
var localFile = fileURL.file;
var fileOuputStream = Components.classes['@mozilla.org/network/file-output-stream;1'].createInstance(Components.interfaces.nsIFileOutputStream);
localFile = fileHandler.getFileFromURLSpec(sheet.href).QueryInterface(nsILocalFile);
var fileOuputStream = classes[FILEOUT_CTRID].createInstance(nsIFileOutputStream);
try {
fileOuputStream.init(localFile, -1, -1, 0);
@ -1025,8 +1052,8 @@ function ToggleFourBorderSidesSameStyle(elt)
var sideArray = [ "left", "right", "bottom" ];
var style = getSpecifiedStyle("border-top-style");
/*if (!style || style == "")
style = "unspecified";*/
if (!sameStyle && !style)
style = "unspecified";
var color = gDialog.topBorderColorInput.value;
var width = getSpecifiedStyle("border-top-width");
@ -1036,17 +1063,21 @@ function ToggleFourBorderSidesSameStyle(elt)
var colorInput = document.getElementById( sideArray[i] + "BorderColorInput" );
var colorButton = document.getElementById( sideArray[i] + "BorderColorButton" );
if (sameStyle) {
styleMenulist.setAttribute("disabled", "true");
widthInput.setAttribute("disabled", "true");
styleMenulist.selectedItem = document.getElementById("unspecified" + sideArray[i] + "BorderStyle");
widthInput.value = "";
colorInput.value = "";
colorInput.setAttribute("disabled", "true");
setColorWell("border"+sideArray[i]+"CW", "");
widthInput.setAttribute("disabled", "true");
styleMenulist.setAttribute("disabled", "true");
colorButton.setAttribute("disabled", "true");
IfFourSidesSameStyle("border", "style", style,
'allFourBordersSame', 'borderPreview', null);
IfFourSidesSameStyle("border", "color", color,
'allFourBordersSame', 'borderPreview', null);
IfFourSidesSameStyle("border", "width", width,
'allFourBordersSame', 'borderPreview', null);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-color", color);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-style", style);
AddStyleToElement(gDialog.borderPreview, "border-"+sideArray[i]+"-width", width);
}
else {
styleMenulist.removeAttribute("disabled");
@ -1057,8 +1088,6 @@ function ToggleFourBorderSidesSameStyle(elt)
colorInput.value = color;
setColorWell("border"+sideArray[i]+"CW", color);
widthInput.value = width;
if (!style || style == "")
style = "none";
var styleMenuitem = document.getElementById( style+sideArray[i]+"BorderStyle" );
styleMenulist.selectedItem = styleMenuitem;
}

18
extensions/editor/cascades/resources/content/tabsOverlay.xul
Просмотреть файл

@ -323,16 +323,14 @@
</row>
<row align="center">
<label value="&opacity.label;"/>
<hbox align="center">
<scrollbar flex="1"
id="opacityScrollbar"
align="horizontal"
curpos="0"
maxpos="1000"
increment="10"
pageincrement="100"/>
<label id="opacityLabel" value="transparent"/>
</hbox>
<scrollbar flex="1"
id="opacityScrollbar"
align="horizontal"
curpos="0"
maxpos="1000"
increment="10"
pageincrement="100"/>
<label id="opacityLabel" value="transparent"/>
</row>
<row align="center">
<label value="&backgroundImage.label;"/>

2
extensions/editor/cascades/resources/locale/en-US/EdCssProps.dtd
Просмотреть файл

@ -234,3 +234,5 @@
<!ENTITY xfastSpeechRate.label "x-fast">
<!ENTITY opacity.label "Opacity:">
<!ENTITY compatibilityTab.label "Compatibility">