Skip to content
Browse files

Merge branch 'master' of github.com:firebug/firebug

  • Loading branch information...
2 parents 3ba0aa4 + 17ff6a8 commit a3d64665dba078beb969efe6479df8706f2a457a @janodvarko janodvarko committed May 29, 2012
View
139 extension/content/firebug/console/autoCompleter.js
@@ -106,7 +106,7 @@ Firebug.JSAutoCompleter = function(textBox, completionBox, options)
if (!this.completions)
return true;
- if (this.getCompletionBoxValue() === this.textBox.value)
+ if (this.getCompletionValue() === this.textBox.value)
{
// The user wouldn't see a difference if we completed. This can
// happen for example if you type 'alert' and press enter,
@@ -193,35 +193,69 @@ Firebug.JSAutoCompleter = function(textBox, completionBox, options)
/**
* From a valid completion base, create a list of completions (containing
- * those completion candidates that share a prefix with the user's input)
- * and a default completion.
+ * those completion candidates that share a (sometimes case-insensitive)
+ * prefix with the user's input) and a default completion.
*/
this.createCompletions = function(prefix)
{
var candidates = this.completionBase.candidates;
- var valid = [];
+ var valid = [], ciValid = [];
if (!this.completionBase.expr && !prefix)
{
// Don't complete "".
+ this.completions = null;
+ return;
}
- else
+
+ var lowPrefix = prefix.toLowerCase();
+ for (var i = 0; i < candidates.length; ++i)
{
- for (var i = 0; i < candidates.length; ++i)
+ // Mark a candidate as matching if it matches the prefix case-
+ // insensitively, and shares its upper-case characters.
+ var name = candidates[i];
+ if (!Str.hasPrefix(name.toLowerCase(), lowPrefix))
+ continue;
+
+ var fail = false;
+ for (var j = 0; j < prefix.length; ++j)
+ {
+ var ch = prefix.charAt(j);
+ if (ch !== ch.toLowerCase() && ch !== name.charAt(j))
+ {
+ fail = true;
+ break;
+ }
+ }
+ if (!fail)
{
- var name = candidates[i];
+ ciValid.push(name);
if (Str.hasPrefix(name, prefix))
valid.push(name);
}
}
- if (valid.length > 0)
+ if (ciValid.length > 0)
{
+ // If possible, default to a candidate matching the case by picking
+ // a default from 'valid' and correcting its index.
+ var hasMatchingCase = (valid.length > 0);
+
this.completions = {
- list: valid,
+ list: (hasMatchingCase ? valid : ciValid),
prefix: prefix
};
this.pickDefaultCandidate();
+
+ if (hasMatchingCase)
+ {
+ var find = valid[this.completions.index];
+ this.completions = {
+ list: ciValid,
+ prefix: prefix,
+ index: ciValid.indexOf(find)
+ };
+ }
}
else
{
@@ -289,7 +323,9 @@ Firebug.JSAutoCompleter = function(textBox, completionBox, options)
var completion = this.getCurrentCompletion();
if (completion === null)
return "";
- return this.completionBase.pre + this.completionBase.expr + completion;
+ var userTyped = this.textBox.value;
+ var value = this.completionBase.pre + this.completionBase.expr + completion;
+ return userTyped + value.substr(userTyped.length);
};
/**
@@ -458,14 +494,44 @@ Firebug.JSAutoCompleter = function(textBox, completionBox, options)
};
/**
- * Accept the currently shown completion in the text box.
+ * Get what should be completed to; this is only vaguely related to what is
+ * shown in the completion box.
*/
- this.acceptCompletion = function()
+ this.getCompletionValue = function()
{
- var completion = this.getCurrentCompletion();
- completion = adjustCompletionOnAccept(this.completionBase.pre,
- this.completionBase.expr, completion);
+ var property = this.getCurrentCompletion();
+ var preParsed = this.completionBase.pre, preExpr = this.completionBase.expr;
+ var res = preParsed + preExpr + property;
+
+ // Don't adjust index completions.
+ if (/^\[['"]$/.test(preExpr.slice(-2)))
+ return res;
+
+ if (!isValidProperty(property))
+ {
+ // The property name is actually invalid in free form, so replace
+ // it with array syntax.
+
+ if (preExpr)
+ {
+ res = preParsed + preExpr.slice(0, -1);
+ }
+ else
+ {
+ // Global variable access - assume the variable is a member of 'window'.
+ res = preParsed + "window";
+ }
+ res += '["' + Str.escapeJS(property) + '"]';
+ }
+ return res;
+ };
+ /**
+ * Accept the current completion into the text box.
+ */
+ this.acceptCompletion = function()
+ {
+ var completion = this.getCompletionValue();
var originalValue = this.textBox.value;
this.textBox.value = completion;
setCursorToEOL(this.textBox);
@@ -495,7 +561,7 @@ Firebug.JSAutoCompleter = function(textBox, completionBox, options)
var immediateTarget;
if (dir === -1)
- immediateTarget = (top === 0 ? 0 : top + 2);
+ immediateTarget = (top === 0 ? top : top + 2);
else
immediateTarget = (bottom === list.length ? bottom: bottom - 2) - 1;
if ((selIndex - immediateTarget) * dir < 0)
@@ -542,8 +608,6 @@ Firebug.JSAutoCompleter = function(textBox, completionBox, options)
title.classList.add("fbPopupTitle");
vbox.appendChild(title);
- var escPrefix = Str.escapeForTextNode(this.textBox.value);
-
var list = this.completions.list, selIndex = this.completions.index;
if (this.completions.list.length <= popupSize)
@@ -591,19 +655,25 @@ Firebug.JSAutoCompleter = function(textBox, completionBox, options)
for (var i = this.popupTop; i < this.popupBottom; i++)
{
+ var completion = list[i];
+ var prefixLen = this.completions.prefix.length;
+
var hbox = this.completionPopup.ownerDocument.
createElementNS("http://www.w3.org/1999/xhtml","div");
hbox.completionIndex = i;
var pre = this.completionPopup.ownerDocument.
createElementNS("http://www.w3.org/1999/xhtml","span");
- pre.innerHTML = escPrefix;
+ var preText = this.textBox.value;
+ if (prefixLen)
+ preText = preText.slice(0, -prefixLen) + completion.slice(0, prefixLen);
+ pre.innerHTML = Str.escapeForTextNode(preText);
pre.classList.add("userTypedText");
- var completion = this.completions.list[i].substr(this.completions.prefix.length);
var post = this.completionPopup.ownerDocument.
createElementNS("http://www.w3.org/1999/xhtml","span");
- post.innerHTML = Str.escapeForTextNode(completion);
+ var postText = completion.substr(prefixLen);
+ post.innerHTML = Str.escapeForTextNode(postText);
post.classList.add("completionText");
if (i === selIndex)
@@ -1151,33 +1221,6 @@ function killCompletions(expr, origExpr)
return false;
}
-function adjustCompletionOnAccept(preParsed, preExpr, property)
-{
- var res = preParsed + preExpr + property;
-
- // Don't adjust index completions.
- if (/^\[['"]$/.test(preExpr.slice(-2)))
- return res;
-
- if (!isValidProperty(property))
- {
- // The property name is actually invalid in free form, so replace
- // it with array syntax.
-
- if (preExpr)
- {
- res = preParsed + preExpr.slice(0, -1);
- }
- else
- {
- // Global variable access - assume the variable is a member of 'window'.
- res = preParsed + "window";
- }
- res += '["' + Str.escapeJS(property) + '"]';
- }
- return res;
-}
-
// Types the autocompletion knows about, some of their non-enumerable properties,
// and the return types of some member functions, included in the Firebug.CommandLine
// object to make it more easily extensible.
View
19 extension/content/firebug/css/computedPanel.js
@@ -10,14 +10,17 @@ define([
"firebug/lib/dom",
"firebug/lib/xml",
"firebug/lib/url",
+ "firebug/lib/array",
"firebug/js/sourceLink",
"firebug/chrome/menu",
+ "firebug/lib/options",
"firebug/lib/string",
"firebug/lib/persist",
+ "firebug/css/cssModule",
"firebug/css/cssReps"
],
-function(Obj, Firebug, Domplate, Locale, Events, Css, Dom, Xml, Url, SourceLink, Menu,
- Str, Persist, CSSInfoTip) {
+function(Obj, Firebug, Domplate, Locale, Events, Css, Dom, Xml, Url, Arr, SourceLink, Menu,
+ Options, Str, Persist, CSSModule, CSSInfoTip) {
with (Domplate) {
@@ -95,7 +98,7 @@ CSSComputedPanel.prototype = Obj.extend(Firebug.Panel,
TD({"class": "selectorName", role: "presentation"},
"$selector.selector.text"),
TD({role: "presentation"},
- SPAN({"class": "stylePropValue"}, "$selector.value")),
+ SPAN({"class": "stylePropValue"}, "$selector.value|formatValue")),
TD({"class": "styleSourceLink", role: "presentation"},
TAG(FirebugReps.SourceLink.tag, {object: "$selector|getSourceLink"})
)
@@ -134,6 +137,11 @@ CSSComputedPanel.prototype = Obj.extend(Firebug.Panel,
formatValue: function(value)
{
+ if (Options.get("colorDisplay") == "hex")
+ value = Css.rgbToHex(value);
+ else if (Options.get("colorDisplay") == "hsl")
+ value = Css.rgbToHSL(value);
+
// Add a zero-width space after a comma to allow line breaking
return value.replace(/,/g, ",\u200B");
}
@@ -427,6 +435,7 @@ CSSComputedPanel.prototype = Obj.extend(Firebug.Panel,
var optionMap = {
showUserAgentCSS: 1,
computedStylesDisplay: 1,
+ colorDisplay: 1,
showMozillaSpecificStyles: 1
};
@@ -459,6 +468,8 @@ CSSComputedPanel.prototype = Obj.extend(Firebug.Panel,
"computed.option.tip.Show_Mozilla_Specific_Styles")
);
+ items = Arr.extendArray(items, CSSModule.getColorDisplayOptionMenuItems());
+
return items;
},
@@ -535,7 +546,7 @@ CSSComputedPanel.prototype = Obj.extend(Firebug.Panel,
toggleDisplay: function()
{
var display = Firebug.computedStylesDisplay == "alphabetical" ? "grouped" : "alphabetical";
- Firebug.Options.set("computedStylesDisplay", display);
+ Options.set("computedStylesDisplay", display);
},
sortProperties: function(props)
View
48 extension/content/firebug/css/cssModule.js
@@ -9,8 +9,9 @@ define([
"firebug/lib/css",
"firebug/chrome/window",
"firebug/lib/xml",
+ "firebug/lib/options"
],
-function(Obj, Firebug, Xpcom, Events, Url, Css, Win, Xml) {
+function(Obj, Firebug, Xpcom, Events, Url, Css, Win, Xml, Options) {
// ********************************************************************************************* //
// Constants
@@ -356,7 +357,8 @@ Firebug.CSSModule = Obj.extend(Obj.extend(Firebug.Module, Firebug.EditorSelector
return m ? m[0] : "";
},
- getPropertyInfo: function(computedStyle, propName) {
+ getPropertyInfo: function(computedStyle, propName)
+ {
var propInfo = {
property: propName,
value: computedStyle.getPropertyValue(propName),
@@ -367,6 +369,48 @@ Firebug.CSSModule = Obj.extend(Obj.extend(Firebug.Module, Firebug.EditorSelector
return propInfo;
},
+ setColorDisplay: function(event, type)
+ {
+ Options.set("colorDisplay", type);
+
+ var menuItem = event.target;
+ menuItem.setAttribute("checked", "true");
+ },
+
+ getColorDisplayOptionMenuItems: function()
+ {
+ return [
+ "-",
+ {
+ label: "computed.option.label.Colors_As_Hex",
+ tooltiptext: "computed.option.tip.Colors_As_Hex",
+ type: "radio",
+ name: "colorDisplay",
+ id: "colorDisplayHex",
+ command: Obj.bind(this.setColorDisplay, this, "hex"),
+ checked: Options.get("colorDisplay") == "hex"
+ },
+ {
+ label: "computed.option.label.Colors_As_RGB",
+ tooltiptext: "computed.option.tip.Colors_As_RGB",
+ type: "radio",
+ name: "colorDisplay",
+ id: "colorDisplayRGB",
+ command: Obj.bind(this.setColorDisplay, this, "rgb"),
+ checked: Options.get("colorDisplay") == "rgb"
+ },
+ {
+ label: "computed.option.label.Colors_As_HSL",
+ tooltiptext: "computed.option.tip.Colors_As_HSL",
+ type: "radio",
+ name: "colorDisplay",
+ id: "colorDisplayHSL",
+ command: Obj.bind(this.setColorDisplay, this, "hsl"),
+ checked: Options.get("colorDisplay") == "hsl"
+ }
+ ];
+ },
+
// * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * //
// Module functions
View
78 extension/content/firebug/css/cssPanel.js
@@ -21,15 +21,16 @@ define([
"firebug/lib/persist",
"firebug/lib/system",
"firebug/chrome/menu",
+ "firebug/lib/options",
+ "firebug/css/cssModule",
"firebug/css/cssReps",
"firebug/editor/editor",
"firebug/editor/editorSelector",
- "firebug/chrome/searchBox",
- "firebug/css/cssModule",
+ "firebug/chrome/searchBox"
],
function(Obj, Firebug, Domplate, FirebugReps, Locale, Events, Wrapper, Url,
SourceLink, Css, Dom, Win, Search, Str, Arr, Fonts, Xml, Persist, System, Menu,
- CSSInfoTip) {
+ Options, CSSModule, CSSInfoTip) {
with (Domplate) {
@@ -299,19 +300,19 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
? this.location.editStyleSheet.sheet
: this.location;
- this.currentCSSEditor = Firebug.CSSModule.getCurrentEditor();
+ this.currentCSSEditor = CSSModule.getCurrentEditor();
try
{
this.currentCSSEditor.startEditing(styleSheet, this.context, this);
Events.dispatch(this.fbListeners, 'onStartCSSEditing', [styleSheet, this.context]);
}
catch(exc)
{
- var mode = Firebug.CSSModule.getCurrentEditorName();
+ var mode = CSSModule.getCurrentEditorName();
if (FBTrace.DBG_ERRORS)
FBTrace.sysout("editor.startEditing ERROR "+exc, {exc: exc, name: mode,
currentEditor: this.currentCSSEditor, styleSheet: styleSheet,
- CSSModule:Firebug.CSSModule});
+ CSSModule: CSSModule});
}
}
},
@@ -539,7 +540,11 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
name = this.translateName(name, value);
if (name)
{
- value = Css.stripUnits(Css.rgbToHex(value));
+ if (Options.get("colorDisplay") == "hex")
+ value = Css.rgbToHex(value);
+ else if (Options.get("colorDisplay") == "hsl")
+ value = Css.rgbToHSL(value);
+ value = Css.stripUnits(value);
important = important ? " !important" : "";
var prop = {name: name, value: value, important: important, disabled: disabled};
@@ -653,7 +658,7 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
{
var rule = Firebug.getRepObject(row);
var propName = Dom.getChildByClass(row, "cssPropName").textContent;
- Firebug.CSSModule.deleteProperty(rule, propName, this.context);
+ CSSModule.deleteProperty(rule, propName, this.context);
// Remove the property from the selector map, if it was disabled
var ruleId = Firebug.getRepNode(row).getAttribute("ruleId");
@@ -696,7 +701,7 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
var propValue = Dom.getChildByClass(row, "cssPropValue").textContent;
var parsedValue = parsePriority(propValue);
- Firebug.CSSModule.disableProperty(Css.hasClass(row, "disabledStyle"), rule,
+ CSSModule.disableProperty(Css.hasClass(row, "disabledStyle"), rule,
propName, parsedValue, map, this.context);
this.markChange(this.name == "stylesheet");
@@ -792,7 +797,7 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
this.showToolbarButtons("fbCSSButtons", true);
- Firebug.CSSModule.updateEditButton();
+ CSSModule.updateEditButton();
// wait for loadedContext to restore the panel
if (this.context.loaded && !this.location)
@@ -945,7 +950,7 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
updateOption: function(name, value)
{
- if (name == "expandShorthandProps")
+ if (name == "expandShorthandProps" || name == "colorDisplay")
this.refresh();
},
@@ -957,16 +962,23 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
getOptionsMenuItems: function()
{
- return [
- Menu.optionMenu("Expand_Shorthand_Properties", "expandShorthandProps",
- "css.option.tip.Expand_Shorthand_Properties"),
+ items = [
+ Menu.optionMenu("Expand_Shorthand_Properties", "expandShorthandProps",
+ "css.option.tip.Expand_Shorthand_Properties")
+ ];
+
+ items = Arr.extendArray(items, CSSModule.getColorDisplayOptionMenuItems());
+
+ items.push(
"-",
{
label: "Refresh",
tooltiptext: "panel.tip.Refresh",
command: Obj.bind(this.refresh, this)
}
- ];
+ );
+
+ return items;
},
getContextMenuItems: function(style, target)
@@ -1154,11 +1166,11 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
if (text.charAt(rangeOffset) == ",")
return;
- cssValue = Firebug.CSSModule.parseCSSFontFamilyValue(text, rangeOffset, propName);
+ cssValue = CSSModule.parseCSSFontFamilyValue(text, rangeOffset, propName);
}
else
{
- cssValue = Firebug.CSSModule.parseCSSValue(text, rangeOffset);
+ cssValue = CSSModule.parseCSSValue(text, rangeOffset);
}
if (!cssValue)
@@ -1185,9 +1197,9 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
{
var rule = Firebug.getRepObject(target);
var baseURL = this.getStylesheetURL(rule, true);
- var relURL = Firebug.CSSModule.parseURLValue(cssValue.value);
+ var relURL = CSSModule.parseURLValue(cssValue.value);
var absURL = Url.isDataURL(relURL) ? relURL : Url.absoluteURL(relURL, baseURL);
- var repeat = Firebug.CSSModule.parseRepeatValue(text);
+ var repeat = CSSModule.parseRepeatValue(text);
this.infoTipType = "image";
this.infoTipObject = absURL;
@@ -1459,7 +1471,7 @@ Firebug.CSSStyleSheetPanel.prototype = Obj.extend(Firebug.Panel,
{styleSheet: styleSheet, ruleIndex: ruleIndex});
}
- Firebug.CSSModule.deleteRule(styleSheet, ruleIndex);
+ CSSModule.deleteRule(styleSheet, ruleIndex);
if (this.context.panelName == "stylesheet")
{
@@ -1559,9 +1571,9 @@ CSSEditor.prototype = domplate(Firebug.InlineEditor.prototype,
" = " + propValue);
if (previousValue)
- Firebug.CSSModule.removeProperty(rule, previousValue);
+ CSSModule.removeProperty(rule, previousValue);
- Firebug.CSSModule.setProperty(rule, value, parsedValue.value,
+ CSSModule.setProperty(rule, value, parsedValue.value,
parsedValue.priority);
}
@@ -1571,7 +1583,7 @@ CSSEditor.prototype = domplate(Firebug.InlineEditor.prototype,
else if (!value)
{
// name of the property has been deleted, so remove the property.
- Firebug.CSSModule.removeProperty(rule, previousValue);
+ CSSModule.removeProperty(rule, previousValue);
}
}
else if (Dom.getAncestorByClass(target, "cssPropValue"))
@@ -1589,12 +1601,12 @@ CSSEditor.prototype = domplate(Firebug.InlineEditor.prototype,
if (value && value != "null")
{
parsedValue = parsePriority(value);
- Firebug.CSSModule.setProperty(rule, propName, parsedValue.value,
+ CSSModule.setProperty(rule, propName, parsedValue.value,
parsedValue.priority);
}
else if (previousValue && previousValue != "null")
{
- Firebug.CSSModule.removeProperty(rule, propName);
+ CSSModule.removeProperty(rule, propName);
}
}
@@ -1661,7 +1673,7 @@ CSSEditor.prototype = domplate(Firebug.InlineEditor.prototype,
}
else if (charCode == 59 /*";"*/ && Css.hasClass(target, "cssPropValue"))
{
- var cssValue = Firebug.CSSModule.parseCSSValue(this.input.value, this.input.selectionStart);
+ var cssValue = CSSModule.parseCSSValue(this.input.value, this.input.selectionStart);
// Simple test, if we are inside a string (see issue 4543)
var isValueInString = (cssValue.value.indexOf("\"") != -1);
@@ -1679,9 +1691,9 @@ CSSEditor.prototype = domplate(Firebug.InlineEditor.prototype,
var propRow = Dom.getAncestorByClass(this.target, "cssProp");
var propName = Dom.getChildByClass(propRow, "cssPropName").textContent.toLowerCase();
if (propName == "font" || propName == "font-family")
- return Firebug.CSSModule.parseCSSFontFamilyValue(value, offset, propName);
+ return CSSModule.parseCSSFontFamilyValue(value, offset, propName);
else
- return Firebug.CSSModule.parseCSSValue(value, offset);
+ return CSSModule.parseCSSValue(value, offset);
},
getAutoCompleteList: function(preExpr, expr, postExpr, range, cycle)
@@ -1830,7 +1842,7 @@ CSSEditor.prototype = domplate(Firebug.InlineEditor.prototype,
propName = Dom.getChildByClass(propRow, "cssPropName").textContent;
}
- var range = Firebug.CSSModule.parseCSSValue(value, offset);
+ var range = CSSModule.parseCSSValue(value, offset);
var type = (range && range.type) || "";
var expr = (range ? value.substring(range.start, range.end) : "");
@@ -2090,7 +2102,7 @@ CSSRuleEditor.prototype = domplate(Firebug.InlineEditor.prototype,
// We want to do this before the insert to ease change tracking
if (oldRule)
{
- Firebug.CSSModule.deleteRule(styleSheet, ruleIndex);
+ CSSModule.deleteRule(styleSheet, ruleIndex);
}
// Firefox does not follow the spec for the update selector text case.
@@ -2120,7 +2132,7 @@ CSSRuleEditor.prototype = domplate(Firebug.InlineEditor.prototype,
try
{
- var insertLoc = Firebug.CSSModule.insertRule(styleSheet, cssText, ruleIndex);
+ var insertLoc = CSSModule.insertRule(styleSheet, cssText, ruleIndex);
rule = cssRules[insertLoc];
ruleIndex++;
@@ -2138,7 +2150,7 @@ CSSRuleEditor.prototype = domplate(Firebug.InlineEditor.prototype,
target.innerHTML = Str.escapeForCss(previousValue);
// create dummy rule to be able to recover from error
- var insertLoc = Firebug.CSSModule.insertRule(styleSheet,
+ var insertLoc = CSSModule.insertRule(styleSheet,
'selectorSavingError{}', ruleIndex);
rule = cssRules[insertLoc];
@@ -2432,7 +2444,7 @@ StyleSheetEditor.prototype = domplate(Firebug.BaseEditor,
if (FBTrace.DBG_CSS)
FBTrace.sysout("StyleSheetEditor.saveEdit", arguments);
- Firebug.CSSModule.freeEdit(this.styleSheet, value);
+ CSSModule.freeEdit(this.styleSheet, value);
},
beginEditing: function()
View
30 extension/content/firebug/css/stylePanel.js
@@ -10,18 +10,20 @@ define([
"firebug/lib/locale",
"firebug/lib/events",
"firebug/lib/url",
+ "firebug/lib/array",
"firebug/js/sourceLink",
"firebug/lib/dom",
"firebug/lib/css",
"firebug/lib/xpath",
"firebug/lib/array",
"firebug/lib/fonts",
"firebug/lib/options",
+ "firebug/css/cssModule",
"firebug/css/cssPanel",
"firebug/chrome/menu"
],
-function(Obj, Firebug, Firefox, Domplate, FirebugReps, Xpcom, Locale, Events, Url,
- SourceLink, Dom, Css, Xpath, Arr, Fonts, Options, CSSStyleSheetPanel, Menu) {
+function(Obj, Firebug, Firefox, Domplate, FirebugReps, Xpcom, Locale, Events, Url, Arr,
+ SourceLink, Dom, Css, Xpath, Arr, Fonts, Options, CSSModule, CSSStyleSheetPanel, Menu) {
with (Domplate) {
@@ -502,7 +504,7 @@ CSSStylePanel.prototype = Obj.extend(CSSStyleSheetPanel.prototype,
updateView: function(element)
{
- Firebug.CSSModule.cleanupSheets(element.ownerDocument, Firebug.currentContext);
+ CSSModule.cleanupSheets(element.ownerDocument, Firebug.currentContext);
this.updateCascadeView(element);
@@ -534,16 +536,20 @@ CSSStylePanel.prototype = Obj.extend(CSSStyleSheetPanel.prototype,
updateOption: function(name, value)
{
- if (name == "showUserAgentCSS" || name == "expandShorthandProps" ||
- name == "onlyShowAppliedStyles")
- {
+ var optionMap = {
+ showUserAgentCSS: 1,
+ expandShorthandProps: 1,
+ colorDisplay: 1,
+ showMozillaSpecificStyles: 1
+ };
+
+ if (name in optionMap)
this.refresh();
- }
},
getOptionsMenuItems: function()
{
- var ret = [
+ var items = [
Menu.optionMenu("Only_Show_Applied_Styles", "onlyShowAppliedStyles",
"style.option.tip.Only_Show_Applied_Styles"),
Menu.optionMenu("Show_User_Agent_CSS", "showUserAgentCSS",
@@ -552,11 +558,13 @@ CSSStylePanel.prototype = Obj.extend(CSSStyleSheetPanel.prototype,
"css.option.tip.Expand_Shorthand_Properties")
];
+ items = Arr.extendArray(items, CSSModule.getColorDisplayOptionMenuItems());
+
if (Dom.domUtils && this.selection)
{
var self = this;
- ret.push(
+ items.push(
"-",
{
label: "style.option.label.hover",
@@ -581,7 +589,7 @@ CSSStylePanel.prototype = Obj.extend(CSSStyleSheetPanel.prototype,
);
if (Dom.domUtils.hasPseudoClassLock)
{
- ret.push(
+ items.push(
{
label: "style.option.label.focus",
type: "checkbox",
@@ -596,7 +604,7 @@ CSSStylePanel.prototype = Obj.extend(CSSStyleSheetPanel.prototype,
}
}
- return ret;
+ return items;
},
getContextMenuItems: function(style, target)
View
159 extension/content/firebug/html/highlighterCache.js
@@ -0,0 +1,159 @@
+/* See license.txt for terms of usage */
+
+define([
+],
+function() {
+
+// ********************************************************************************************* //
+// Constants
+
+const ident = {
+ frame: 0,
+ boxModel: 1,
+ imageMap: 2,
+ proxyElt: 3
+};
+
+// ********************************************************************************************* //
+// Implementation
+
+var HighlighterCache =
+{
+ ident: ident,
+
+ highlighters: {
+ frameArr: [],
+ boxModelArr: [],
+ proxyEltArr: []
+ },
+
+ get: function(type)
+ {
+ var node;
+ var hl = this.highlighters;
+
+ switch (type)
+ {
+ case ident.boxModel:
+ if (hl.boxModelArr.length === 1)
+ {
+ node = hl.boxModelArr[0];
+ if (!node.parentElement)
+ return node;
+ }
+ break;
+ case ident.frame:
+ if (hl.frameArr.length === 1)
+ {
+ node = hl.frameArr[0];
+ if (!node.parentElement)
+ return node;
+ }
+ break;
+ case ident.proxyElt:
+ if (hl.proxyEltArr.length === 1)
+ {
+ node = hl.proxyEltArr[0];
+ if (!node.parentElement)
+ return node;
+ }
+ break;
+ }
+ },
+
+ add: function(node)
+ {
+ switch (node.ident)
+ {
+ case ident.boxModel:
+ this.highlighters.boxModelArr.push(node);
+ break;
+ case ident.frame:
+ this.highlighters.frameArr.push(node);
+ break;
+ case ident.proxyElt:
+ this.highlighters.proxyEltArr.push(node);
+ break;
+ }
+ },
+
+ clear: function()
+ {
+ clearBoxModelCache(this.highlighters.boxModelArr);
+
+ clearCache(this.highlighters.frameArr);
+ clearCache(this.highlighters.proxyEltArr);
+
+ this.highlighters.boxModelArr = [];
+ this.highlighters.frameArr = [];
+ this.highlighters.proxyEltArr = [];
+ }
+};
+
+// ********************************************************************************************* //
+// Helpers
+
+function clearCache(arr)
+{
+ try
+ {
+ var i, highlighter;
+ for (i = arr.length - 1; i >= 0; i--)
+ {
+ highlighter = arr[i];
+
+ if (highlighter && highlighter.parentNode)
+ highlighter.parentNode.removeChild(highlighter);
+ }
+ }
+ catch (err)
+ {
+ FBTrace.sysout("highlighterCache.clearCache; EXCEPTION " + err, err);
+ }
+}
+
+function clearBoxModelCache(arr)
+{
+ try
+ {
+ var node;
+ for (var i = arr.length - 1; i >= 0; i--)
+ {
+ var names = ["lines", "offset", "parent"];
+ for (var j=0; j<names.length; j++)
+ {
+ var name = names[j];
+ if (name === "lines")
+ {
+ var lineNames = ["bottom", "left", "top", "right"];
+ for (var k=0; k<lineNames.length; k++)
+ {
+ var lineName = lineNames[k];
+ node = arr[i].lines[lineName];
+
+ if (node && node.parentNode)
+ node.parentNode.removeChild(node);
+ }
+ }
+ else
+ {
+ node = arr[i][name];
+ if (node && node.parentNode)
+ node.parentNode.removeChild(node);
+ }
+ }
+ }
+ }
+ catch (err)
+ {
+ FBTrace.sysout("clearBoxModelCache.clearCache; EXCEPTION " + err, err);
+ }
+}
+
+// ********************************************************************************************* //
+// Registration
+
+return HighlighterCache;
+
+// ********************************************************************************************* //
+});
View
10 extension/content/firebug/html/htmlPanel.js
@@ -1528,7 +1528,7 @@ Firebug.HTMLPanel.prototype = Obj.extend(WalkingPanel,
type: "radio",
name: "entityDisplay",
id: "entityDisplaySymbols",
- command: Obj.bindFixed(this.setEntityDisplay, this, "symbols"),
+ command: Obj.bind(this.setEntityDisplay, this, "symbols"),
checked: Options.get("entityDisplay") == "symbols"
},
{
@@ -1537,7 +1537,7 @@ Firebug.HTMLPanel.prototype = Obj.extend(WalkingPanel,
type: "radio",
name: "entityDisplay",
id: "entityDisplayNames",
- command: Obj.bindFixed(this.setEntityDisplay, this, "names"),
+ command: Obj.bind(this.setEntityDisplay, this, "names"),
checked: Options.get("entityDisplay") == "names"
},
{
@@ -1546,7 +1546,7 @@ Firebug.HTMLPanel.prototype = Obj.extend(WalkingPanel,
type: "radio",
name: "entityDisplay",
id: "entityDisplayUnicode",
- command: Obj.bindFixed(this.setEntityDisplay, this, "unicode"),
+ command: Obj.bind(this.setEntityDisplay, this, "unicode"),
checked: Options.get("entityDisplay") == "unicode"
},
"-",
@@ -1738,11 +1738,11 @@ Firebug.HTMLPanel.prototype = Obj.extend(WalkingPanel,
return vars;
},
- setEntityDisplay: function(type)
+ setEntityDisplay: function(event, type)
{
Options.set("entityDisplay", type);
- var menuItem = Firebug.chrome.$("entityDisplay"+type.charAt(0).toUpperCase()+type.slice(1));
+ var menuItem = event.target;
menuItem.setAttribute("checked", "true");
},
View
158 extension/content/firebug/html/inspector.js
@@ -13,21 +13,17 @@ define([
"firebug/lib/xml",
"firebug/chrome/window",
"firebug/lib/system",
+ "firebug/html/highlighterCache"
],
function(Obj, Firebug, Firefox, FirebugReps, Locale, Events, Wrapper, Css, Dom, Xml,
- Win, System) {
+ Win, System, HighlighterCache) {
// ********************************************************************************************* //
// Constants
const inspectDelay = 200;
const highlightCSS = "chrome://firebug/content/html/highlighter.css";
-const ident = {
- frame: 0,
- boxModel: 1,
- imageMap: 2,
- proxyElt: 3
-};
+const ident = HighlighterCache.ident;
// ********************************************************************************************* //
// Globals
@@ -172,7 +168,7 @@ Firebug.Inspector = Obj.extend(Firebug.Module,
*/
clearAllHighlights: function()
{
- highlighterCache.clear();
+ HighlighterCache.clear();
},
/**
@@ -423,7 +419,7 @@ Firebug.Inspector = Obj.extend(Firebug.Module,
}
else if (!isMulti)
{
- var highlighterNode = highlighterCache.get(highlighter.ident);
+ var highlighterNode = HighlighterCache.get(highlighter.ident);
if (highlighterNode && highlighter.ident === ident.boxModel)
highlighterNode = highlighterNode.offset;
@@ -1324,7 +1320,7 @@ Firebug.Inspector.FrameHighlighter.prototype =
{
if (!isMulti)
{
- var div = highlighterCache.get(ident.frame);
+ var div = HighlighterCache.get(ident.frame);
if (div)
return div;
}
@@ -1340,7 +1336,7 @@ Firebug.Inspector.FrameHighlighter.prototype =
div2.className = "firebugResetStyles";
div.appendChild(div2);
div.ident = ident.frame;
- highlighterCache.add(div);
+ HighlighterCache.add(div);
return div;
}
};
@@ -1530,7 +1526,7 @@ BoxModelHighlighter.prototype =
unhighlight: function(context)
{
- highlighterCache.clear();
+ HighlighterCache.clear();
quickInfoBox.hide();
},
@@ -1547,7 +1543,7 @@ BoxModelHighlighter.prototype =
if (!isMulti)
{
- var nodes = highlighterCache.get(ident.boxModel);
+ var nodes = HighlighterCache.get(ident.boxModel);
if (nodes)
return nodes;
}
@@ -1597,7 +1593,7 @@ BoxModelHighlighter.prototype =
}
nodes.ident = ident.boxModel;
- highlighterCache.add(nodes);
+ HighlighterCache.add(nodes);
return nodes;
},
@@ -1626,138 +1622,6 @@ BoxModelHighlighter.prototype =
// ********************************************************************************************* //
-var highlighterCache =
-{
- highlighters:
- {
- frameArr: [],
- boxModelArr: [],
- proxyEltArr: []
- },
-
- get: function(type)
- {
- var node;
- var hl = this.highlighters;
-
- switch (type)
- {
- case ident.boxModel:
- if (hl.boxModelArr.length === 1)
- {
- node = hl.boxModelArr[0];
- if (!node.parentElement)
- return node;
- }
- break;
- case ident.frame:
- if (hl.frameArr.length === 1)
- {
- node = hl.frameArr[0];
- if (!node.parentElement)
- return node;
- }
- break;
- case ident.proxyElt:
- if (hl.proxyEltArr.length === 1)
- {
- node = hl.proxyEltArr[0];
- if (!node.parentElement)
- return node;
- }
- break;
- }
- },
-
- add: function(node)
- {
- switch (node.ident)
- {
- case ident.boxModel:
- this.highlighters.boxModelArr.push(node);
- break;
- case ident.frame:
- this.highlighters.frameArr.push(node);
- break;
- case ident.proxyElt:
- this.highlighters.proxyEltArr.push(node);
- break;
- }
- },
-
- clear: function()
- {
- try
- {
- this.doClear();
- }
- catch (err)
- {
- // The cache is not properly cleared and it sometimes throws:
- // "TypeError: can't access dead object" (memory leaks)
- // See Issue 5452
- FBTrace.sysout("highlighterCache.clear; EXCEPTION " + err, err);
- }
- },
-
- doClear: function()
- {
- var clearCache = function(arr)
- {
- var i, highlighter;
- for (i = arr.length - 1; i >= 0; i--)
- {
- highlighter = arr[i];
-
- if (highlighter && highlighter.parentNode)
- highlighter.parentNode.removeChild(highlighter);
- }
- };
-
- var clearBoxModelCache = function(arr)
- {
- var node;
- for (var i = arr.length - 1; i >= 0; i--)
- {
- var names = ["lines", "offset", "parent"];
- for (var j=0; j<names.length; j++)
- {
- var name = names[j];
- if (name === "lines")
- {
- var lineNames = ["bottom", "left", "top", "right"];
- for (var k=0; k<lineNames.length; k++)
- {
- var lineName = lineNames[k];
- node = arr[i].lines[lineName];
-
- if (node && node.parentNode)
- node.parentNode.removeChild(node);
- }
- }
- else
- {
- node = arr[i][name];
- if (node && node.parentNode)
- node.parentNode.removeChild(node);
- }
- }
- }
- };
-
- clearBoxModelCache(this.highlighters.boxModelArr);
-
- clearCache(this.highlighters.frameArr);
- clearCache(this.highlighters.proxyEltArr);
-
- this.highlighters.boxModelArr=[];
- this.highlighters.frameArr=[];
- this.highlighters.proxyEltArr=[];
- }
-};
-
-// ********************************************************************************************* //
-
function getNonFrameBody(elt)
{
var body = Dom.getBody(elt.ownerDocument);
@@ -1814,7 +1678,7 @@ function createProxiesForDisabledElements(body)
body.appendChild(div);
div.ident = ident.proxyElt;
- highlighterCache.add(div);
+ HighlighterCache.add(div);
}
}
View
49 extension/content/firebug/lib/css.js
@@ -700,11 +700,58 @@ Css.rgbToHex = function(value)
{
return value.replace(/\brgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)/gi,
function(_, r, g, b) {
- return '#' + ((1 << 24) + (r << 16) + (g << 8) + (b << 0)).
+ return "#" + ((1 << 24) + (r << 16) + (g << 8) + (b << 0)).
toString(16).substr(-6).toUpperCase();
});
}
+Css.rgbToHSL = function(value)
+{
+ return value.replace(/\brgba?\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})(,\s*(\d.\d+|\d))?\)/gi,
+ function(_, r, g, b, _, a) {
+ r /= 255;
+ g /= 255;
+ b /= 255;
+
+ var max = Math.max(r, g, b);
+ var min = Math.min(r, g, b);
+
+ var h = 0;
+ var s = 0;
+ var l = (max+min)/2;
+
+ if (max != min)
+ {
+ var delta = max - min;
+ s = l > 0.5 ? delta/(2-max-min) : delta/(max+min);
+
+ switch (max)
+ {
+ case r:
+ h = (g-b)/delta + (g < b ? 6 : 0);
+ break;
+
+ case g:
+ h = (b-r)/delta + 2;
+ break;
+
+ case b:
+ h = (r-g)/delta + 4;
+ break;
+ }
+ }
+
+ h = Math.round(h * 60);
+ s = Math.round(s * 100);
+ l = Math.round(l * 100);
+
+ if (a)
+ return "hsla("+h+", "+s+"%, "+l+"%, "+a+")";
+ else
+ return "hsl("+h+", "+s+"%, "+l+"%)";
+ });
+}
+
// ********************************************************************************************* //
// CSS Info
View
1 extension/content/firebug/lib/options.js
@@ -54,6 +54,7 @@ const prefNames = // XXXjjb TODO distribute to modules
"showUserAgentCSS",
"expandShorthandProps",
"cssEditMode",
+ "colorDisplay",
// Computed
"computedStylesDisplay",
View
12 extension/locale/en-US/firebug.properties
@@ -480,6 +480,18 @@ style.option.tip.Only_Show_Applied_Styles=Just show styles applied to the elemen
Show_User_Agent_CSS=Show User Agent CSS
style.option.tip.Show_User_Agent_CSS=Also show the CSS defined by the user agent
+# LOCALIZATION NOTE (computed.option.label.Colors_As_Hex, computed.option.tip.Colors_As_Hex,
+# computed.option.label.Colors_As_RGB, computed.option.tip.Colors_As_RGB,
+# computed.option.label.Colors_As_HSL, computed.option.tip.Colors_As_HSL):
+# CSS panel, Style side panel and Computed side panel option (located in tab's option menu).
+# Allows switching the display of CSS colors between hex, rgb(a) and hsl(a) format
+computed.option.label.Colors_As_Hex=Colors As Hex
+computed.option.tip.Colors_As_Hex=Show colors in hexadecimal format
+computed.option.label.Colors_As_RGB=Colors As RGB
+computed.option.tip.Colors_As_RGB=Show colors in RGB format
+computed.option.label.Colors_As_HSL=Colors As HSL
+computed.option.tip.Colors_As_HSL=Show colors in HSL format
+
# LOCALIZATION NOTE (style.option.label.active, style.option.tip.active):
# Style side panel option tooltip (located in tab's option menu). If the option is set to true,
# the Style side panel will simulate the element being activated and therefore display
View
7 extension/modules/loader.js
@@ -262,9 +262,12 @@ FirebugLoader.defaultPrefs = {
"onlyShowAppliedStyles": false,
"showUserAgentCSS": false,
"expandShorthandProps": false,
- "showMozillaSpecificStyles": false,
- "computedStylesDisplay": "grouped",
"cssEditMode": "Source",
+ "colorDisplay": "hex",
+
+// Computed
+ "computedStylesDisplay": "grouped",
+ "showMozillaSpecificStyles": false,
// Script
"breakOnErrors": false,

0 comments on commit a3d6466

Please sign in to comment.
Something went wrong with that request. Please try again.