home *** CD-ROM | disk | FTP | other *** search
/ PC Pro 2005 October / DPPCPRO1005.ISO / Download / Web Developer / webdeveloper.xpi / chrome / webdeveloper.jar / content / webdeveloper / css.js < prev    next >
Encoding:
JavaScript  |  2005-03-21  |  25.4 KB  |  624 lines
  1. // Adds a user style sheet to the page
  2. function webdeveloper_addUserStyleSheet(element, applyStyle)
  3. {
  4.     const addStyleSheet = element.getAttribute("checked");
  5.  
  6.     // If adding a style sheet and applying styles
  7.     if(addStyleSheet && applyStyle)
  8.     {
  9.         const filePicker   = Components.classes["@mozilla.org/filepicker;1"].createInstance(Components.interfaces.nsIFilePicker);
  10.         const stringBundle = document.getElementById("webdeveloper-string-bundle");
  11.  
  12.         filePicker.appendFilter(stringBundle.getString("webdeveloper_styleSheetDescription"), "*.css");
  13.         filePicker.init(window, stringBundle.getString("webdeveloper_addUserStyleSheetTitle"), filePicker.modeOpen);
  14.  
  15.         // If the user selected a style sheet
  16.         if(filePicker.show() == filePicker.returnOK)
  17.         {
  18.             const inputStream      = Components.classes["@mozilla.org/network/file-input-stream;1"].createInstance(Components.interfaces.nsIFileInputStream);
  19.             const scriptableStream = Components.classes["@mozilla.org/scriptableinputstream;1"].createInstance(Components.interfaces.nsIScriptableInputStream);
  20.  
  21.             inputStream.init(filePicker.file, 0x01, 0444, null);
  22.             scriptableStream.init(inputStream);
  23.  
  24.             webdeveloper_userStyleSheet = scriptableStream.read(scriptableStream.available());
  25.  
  26.             scriptableStream.close();
  27.             inputStream.close();
  28.         }
  29.         else
  30.         {
  31.             addStyleSheet               = false;
  32.             webdeveloper_userStyleSheet = null;
  33.         }
  34.     }
  35.  
  36.     // If adding a style sheet and the style sheet is not empty
  37.     if(addStyleSheet && webdeveloper_userStyleSheet)
  38.     {
  39.         const mainTabBox   = getBrowser().mTabBox;
  40.         const documentList = webdeveloper_getDocuments(getBrowser().browsers[mainTabBox.selectedIndex].contentWindow, new Array());
  41.  
  42.         var headElementList = null;
  43.         var pageDocument    = null;
  44.         var styleElement    = null;
  45.  
  46.         // Loop through the documents
  47.         for(var i = 0; i < documentList.length; i++)
  48.         {
  49.             pageDocument    = documentList[i];
  50.             headElementList = pageDocument.getElementsByTagName("head");
  51.             styleElement    = pageDocument.createElement("style");
  52.  
  53.             styleElement.setAttribute("id", "webdeveloper-add-user-style-sheet");
  54.             styleElement.setAttribute("type", "text/css");
  55.             styleElement.appendChild(pageDocument.createTextNode(webdeveloper_userStyleSheet));
  56.  
  57.             // If there is a head element
  58.             if(headElementList.length > 0)
  59.             {
  60.                 headElementList[0].appendChild(styleElement);
  61.             }
  62.             else
  63.             {
  64.                 pageDocument.documentElement.appendChild(styleElement);
  65.             }
  66.         }
  67.  
  68.         // If applying styles
  69.         if(applyStyle)
  70.         {
  71.             webdeveloper_addAppliedStyle("webdeveloper-add-user-style-sheet");
  72.         }
  73.     }
  74.     else
  75.     {
  76.         webdeveloper_userStyleSheet = null;
  77.         webdeveloper_removeStyleSheet("webdeveloper-add-user-style-sheet", true);
  78.     }
  79.  
  80.     webdeveloper_configureEquivalentElements(element, "checked", addStyleSheet);
  81. }
  82.  
  83. // Display CSS for the given media type
  84. function webdeveloper_displayCSSMediaType(type)
  85. {
  86.     const mainTabBox   = getBrowser().mTabBox;
  87.     const documentList = webdeveloper_getDocuments(getBrowser().browsers[mainTabBox.selectedIndex].contentWindow, new Array());
  88.  
  89.     var media          = null;
  90.     var mediaText      = null;
  91.     var ownerNode      = null;
  92.     var pageDocument   = null;
  93.     var styleSheet     = null;
  94.     var styleSheetList = null;
  95.  
  96.     // Loop through the documents
  97.     for(var i = 0; i < documentList.length; i++)
  98.     {
  99.         pageDocument   = documentList[i];
  100.         styleSheetList = pageDocument.styleSheets;
  101.  
  102.         // Loop through the style sheets
  103.         for(var j = 0; j < styleSheetList.length; j++)
  104.         {
  105.             styleSheet = styleSheetList[j];
  106.  
  107.             // If the style sheet is set
  108.             if(styleSheet)
  109.             {
  110.                 media     = styleSheet.media;
  111.                 ownerNode = styleSheet.ownerNode;
  112.  
  113.                 // If the style sheet has an owner node
  114.                 if(ownerNode)
  115.                 {
  116.                     // If the owner node is a processing instruction or is an alternate style sheet
  117.                     if(ownerNode.nodeType == 7 || (ownerNode.hasAttribute("rel") && ownerNode.getAttribute("rel").toLowerCase() == "alternate stylesheet"))
  118.                     {
  119.                         styleSheet.disabled = true;
  120.                     }
  121.                     else
  122.                     {
  123.                         // If the owner node has a webdeveloper-added-medium attribute
  124.                         if(ownerNode.hasAttribute("webdeveloper-added-medium"))
  125.                         {
  126.                             media.deleteMedium("screen");
  127.                             ownerNode.removeAttribute("webdeveloper-added-medium");
  128.                         }
  129.  
  130.                         mediaText = media.mediaText;
  131.  
  132.                         // If there is no media text and the type is not screen or there is media text and it does not contain all or the type
  133.                         if((!mediaText && type != "screen") || (mediaText && mediaText.indexOf("all") == -1 && mediaText.indexOf(type) == -1))
  134.                         {
  135.                             styleSheet.disabled = true;
  136.                         }
  137.                         else
  138.                         {
  139.                             styleSheet.disabled = false;
  140.  
  141.                             // If the media text does not contain screen
  142.                             if(mediaText.indexOf("screen") == -1)
  143.                             {
  144.                                 ownerNode.setAttribute("webdeveloper-added-medium", "true");
  145.                                 media.appendMedium("screen");
  146.                             }
  147.                         }
  148.                     }
  149.                 }
  150.                 else
  151.                 {
  152.                     styleSheet.disabled = true;
  153.                 }
  154.             }
  155.         }
  156.     }
  157. }
  158.  
  159. // Display the disable individual style sheet menu
  160. function webdeveloper_displayDisableIndividualStyleSheetMenu(menu, tooltips)
  161. {
  162.     const mainTabBox      = getBrowser().mTabBox;
  163.     const currentDocument = getBrowser().browsers[mainTabBox.selectedIndex].contentDocument;
  164.     const stringBundle    = document.getElementById("webdeveloper-string-bundle");
  165.  
  166.     var mediaList       = null;
  167.     var menuItem        = null;
  168.     var ownerNode       = null;
  169.     var styleSheet      = null;
  170.     var styleSheetHref  = null;
  171.     var styleSheetLabel = null;
  172.     var styleSheetList  = currentDocument.styleSheets;
  173.  
  174.     webdeveloper_removeGeneratedMenuItems(menu);
  175.  
  176.     // Loop through the style sheets
  177.     for(var i = 0; i < styleSheetList.length; i++)
  178.     {
  179.         styleSheet     = styleSheetList[i];
  180.         mediaList      = styleSheet.media.mediaText;
  181.         ownerNode      = styleSheet.ownerNode;
  182.         styleSheetHref = styleSheet.href;
  183.  
  184.         // If this is not an inline style sheet, a rule from the browser or an alternate style sheet
  185.         if(styleSheetHref != currentDocument.documentURI && styleSheetHref.indexOf("resource://") != 0 && styleSheetHref.indexOf("about:PreferenceStyleSheet") != 0 && styleSheetHref.indexOf("jar:file://") != 0 && styleSheetHref.indexOf("chrome://") != 0 && (!ownerNode || ownerNode.nodeType == 7 || !ownerNode.hasAttribute("rel") || ownerNode.getAttribute("rel").toLowerCase() != "alternate stylesheet"))
  186.         {
  187.             menuItem = document.createElement("menuitem");
  188.  
  189.             // If the style sheet is imported from a processing instruction or does not have a title
  190.             if(ownerNode.nodeType == 7 || !ownerNode.hasAttribute("title"))
  191.             {
  192.                 styleSheetLabel = styleSheetHref;
  193.             }
  194.             else
  195.             {
  196.                 styleSheetLabel = ownerNode.getAttribute("title");
  197.             }
  198.  
  199.             menuItem.setAttribute("class", "webdeveloper-generated-menu");
  200.             menuItem.setAttribute("label", styleSheetLabel);
  201.             menuItem.setAttribute("oncommand", "webdeveloper_toggleIndividualStyleSheet('" + styleSheetHref + "')");
  202.             menuItem.setAttribute("type", "checkbox");
  203.  
  204.             // If displaying tooltips
  205.             if(tooltips)
  206.             {
  207.                 menuItem.setAttribute("tooltiptext", styleSheetLabel);
  208.             }
  209.  
  210.             // If the style sheet is disabled
  211.             if(!styleSheet.disabled)
  212.             {
  213.                 menuItem.setAttribute("checked", true);
  214.             }
  215.  
  216.             menu.appendChild(menuItem);
  217.         }
  218.     }
  219.  
  220.     // If the menu has no children
  221.     if(!menu.hasChildNodes())
  222.     {
  223.         menuItem = document.createElement("menuitem");
  224.         styleSheetLabel = stringBundle.getString("webdeveloper_noStyleSheets");
  225.  
  226.         menuItem.setAttribute("class", "webdeveloper-generated-menu");
  227.         menuItem.setAttribute("disabled", true);
  228.         menuItem.setAttribute("label", styleSheetLabel);
  229.  
  230.         // If displaying tooltips
  231.         if(tooltips)
  232.         {
  233.             menuItem.setAttribute("tooltiptext", styleSheetLabel);
  234.         }
  235.  
  236.         menu.appendChild(menuItem);
  237.     }
  238. }
  239.  
  240. // Displays a style sheet
  241. function webdeveloper_displayStyleSheet(styleSheet, generatedPage)
  242. {
  243.     const request        = new XMLHttpRequest();
  244.     const styleSheetHref = styleSheet.href;
  245.  
  246.     var cssRule       = null;
  247.     var headerElement = null;
  248.     var linkElement   = null;
  249.     var preElement    = null;
  250.  
  251.     request.open("get", styleSheetHref, false);
  252.     request.send("");
  253.  
  254.     headerElement = generatedPage.content.document.createElement("h2");
  255.     linkElement   = generatedPage.content.document.createElement("a");
  256.     linkElement.setAttribute("href", styleSheetHref);
  257.     linkElement.appendChild(generatedPage.content.document.createTextNode(styleSheetHref));
  258.     headerElement.appendChild(linkElement);
  259.     generatedPage.content.document.body.appendChild(headerElement);
  260.  
  261.     preElement = generatedPage.content.document.createElement("pre");
  262.     preElement.appendChild(generatedPage.content.document.createTextNode(request.responseText));
  263.     generatedPage.content.document.body.appendChild(preElement);
  264.  
  265.     // Loop through the the style sheet rules
  266.     for(i = 0; i < styleSheet.cssRules.length; i++)
  267.     {
  268.         cssRule = styleSheet.cssRules[i];
  269.  
  270.         // If this is an import rule
  271.         if(cssRule.type == 3)
  272.         {
  273.             webdeveloper_displayStyleSheet(cssRule.styleSheet, generatedPage);
  274.         }
  275.     }
  276. }
  277.  
  278. // Allows the user to edit the CSS of the current page
  279. function webdeveloper_editCSS(force)
  280. {
  281.     toggleSidebar("webdeveloper-edit-css-sidebar", force);
  282. }
  283.  
  284. // Output style information for an element
  285. function webdeveloper_outputStyleInformationForElement(displayInSidebar, styleSheetArray, title)
  286. {
  287.     const preferencesService = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefService).getBranch("");
  288.  
  289.     var generatedDocument = null;
  290.     var headerElement     = null;
  291.     var linkElement       = null;
  292.     var preElement        = null;
  293.     var styleSheet        = null;
  294.  
  295.     // If displaying in the sidebar
  296.     if(displayInSidebar)
  297.     {
  298.         var parent = null;
  299.  
  300.         generatedDocument = document.getElementById("sidebar-box").getElementsByAttribute("id", "sidebar")[0].contentDocument.getElementById("webdeveloper-view-style-information-iframe").contentDocument;
  301.         parent            = generatedDocument.getElementsByTagName("head")[0];
  302.  
  303.         webdeveloper_removeAllChildNodes(parent);
  304.  
  305.         parent = generatedDocument.body;
  306.  
  307.         webdeveloper_removeAllChildNodes(parent);
  308.     }
  309.     else
  310.     {
  311.         const request = new XMLHttpRequest();
  312.  
  313.         var generatedPage = webdeveloper_generatePage("");
  314.  
  315.         // This must be done to make generated content render
  316.         request.open("get", "about:blank", false);
  317.         request.send("");
  318.  
  319.         generatedDocument = generatedPage.content.document;
  320.     }
  321.  
  322.     generatedDocument.title = title;
  323.  
  324.     linkElement = generatedDocument.createElement("link");
  325.     linkElement.setAttribute("href", "chrome://webdeveloper/content/stylesheets/generated_content.css");
  326.     linkElement.setAttribute("media", "all");
  327.     linkElement.setAttribute("rel", "stylesheet");
  328.     linkElement.setAttribute("type", "text/css");
  329.     generatedDocument.getElementsByTagName("head")[0].appendChild(linkElement);
  330.  
  331.     headerElement = generatedDocument.createElement("h1");
  332.     headerElement.appendChild(generatedDocument.createTextNode(title));
  333.     generatedDocument.body.appendChild(headerElement);
  334.  
  335.     // Loop through the style sheets
  336.     for(styleSheet in styleSheetArray)
  337.     {
  338.         linkElement = generatedDocument.createElement("a");
  339.         linkElement.setAttribute("href", styleSheet);
  340.         linkElement.appendChild(generatedDocument.createTextNode(styleSheet));
  341.         generatedDocument.body.appendChild(linkElement);
  342.  
  343.         preElement = generatedDocument.createElement("pre");
  344.         preElement.appendChild(generatedDocument.createTextNode(styleSheetArray[styleSheet]));
  345.         generatedDocument.body.appendChild(preElement);
  346.     }
  347. }
  348.  
  349. // Toggles the default browser styles
  350. function webdeveloper_toggleDefaultStyles(element, applyStyle)
  351. {
  352.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/disable_default_styles.css", "webdeveloper-disable-default-styles", applyStyle);
  353. }
  354.  
  355. // Uses the border box model
  356. function webdeveloper_useBorderBoxModel(element, applyStyle)
  357. {
  358.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/border_box_model.css", "webdeveloper-use-border-box-model", applyStyle);
  359. }
  360.  
  361. // View CSS
  362. function webdeveloper_viewCSS()
  363. {
  364.     const mainTabBox         = getBrowser().mTabBox;
  365.     const documentList       = webdeveloper_getDocuments(getBrowser().browsers[mainTabBox.selectedIndex].contentWindow, new Array());
  366.     const oldTab             = getBrowser().selectedTab;
  367.     const oldURL             = getBrowser().currentURI.spec;
  368.     const preferencesService = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefService).getBranch("");
  369.     const request            = new XMLHttpRequest();
  370.     const stringBundle       = document.getElementById("webdeveloper-string-bundle");
  371.     const title              = stringBundle.getFormattedString("webdeveloper_viewCSSTitle", [oldURL]);
  372.  
  373.     var cssRule          = null;
  374.     var documentURL      = null;
  375.     var generatedPage    = null;
  376.     var headerElement    = null;
  377.     var inlineStylesText = "";
  378.     var linkElement      = null;
  379.     var pageDocument     = null;
  380.     var preElement       = null;
  381.     var styleSheet       = null;
  382.     var styleSheetHref   = null;
  383.     var styleSheetList   = new Array();
  384.  
  385.     generatedPage = webdeveloper_generatePage("");
  386.  
  387.     // This must be done to make generated content render
  388.     request.open("get", "about:blank", false);
  389.     request.send("");
  390.  
  391.     generatedPage.content.document.title = title;
  392.  
  393.     linkElement = generatedPage.content.document.createElement("link");
  394.     linkElement.setAttribute("href", "chrome://webdeveloper/content/stylesheets/generated_content.css");
  395.     linkElement.setAttribute("media", "all");
  396.     linkElement.setAttribute("rel", "stylesheet");
  397.     linkElement.setAttribute("type", "text/css");
  398.     generatedPage.content.document.getElementsByTagName("head")[0].appendChild(linkElement);
  399.  
  400.     headerElement = generatedPage.content.document.createElement("h1");
  401.     headerElement.appendChild(generatedPage.content.document.createTextNode(title));
  402.     generatedPage.content.document.body.appendChild(headerElement);
  403.  
  404.     // Loop through the documents
  405.     for(var i = 0; i < documentList.length; i++)
  406.     {
  407.         inlineStylesText = "";
  408.         pageDocument     = documentList[i];
  409.         documentURL      = pageDocument.documentURI;
  410.         styleSheetList   = pageDocument.getElementsByTagName("style");
  411.  
  412.         headerElement = generatedPage.content.document.createElement("h2");
  413.         linkElement   = generatedPage.content.document.createElement("a");
  414.         linkElement.setAttribute("href", documentURL);
  415.         linkElement.appendChild(generatedPage.content.document.createTextNode(documentURL));
  416.         headerElement.appendChild(linkElement);
  417.         generatedPage.content.document.body.appendChild(headerElement);
  418.  
  419.         // Loop through the inline style sheets
  420.         for(var j = 0; j < styleSheetList.length; j++)
  421.         {
  422.             inlineStylesText += styleSheetList[j].innerHTML.trim() + "\n\n";
  423.         }
  424.  
  425.         // If there are inline styles
  426.         if(inlineStylesText != "")
  427.         {
  428.             headerElement = generatedPage.content.document.createElement("h2");
  429.             preElement    = generatedPage.content.document.createElement("pre");
  430.             headerElement.appendChild(generatedPage.content.document.createTextNode(stringBundle.getFormattedString("webdeveloper_inlineStyles", [documentURL])));
  431.             generatedPage.content.document.body.appendChild(headerElement);
  432.             preElement.appendChild(generatedPage.content.document.createTextNode(inlineStylesText));
  433.             generatedPage.content.document.body.appendChild(preElement);
  434.         }
  435.  
  436.         styleSheetList = pageDocument.styleSheets;
  437.  
  438.         // Loop through the style sheets
  439.         for(j = 0; j < styleSheetList.length; j++)
  440.         {
  441.             styleSheet     = styleSheetList[j];
  442.             styleSheetHref = styleSheet.href;
  443.  
  444.             // If this is an inline style sheet
  445.             if(styleSheetHref == documentURL)
  446.             {
  447.                 // Loop through the the style sheet rules
  448.                 for(var k = 0; k < styleSheet.cssRules.length; k++)
  449.                 {
  450.                     cssRule = styleSheet.cssRules[k];
  451.  
  452.                     // If this is an import rule
  453.                     if(cssRule.type == 3)
  454.                     {
  455.                         webdeveloper_displayStyleSheet(cssRule.styleSheet, generatedPage);
  456.                     }
  457.                 }
  458.             }
  459.             else if(styleSheetHref && styleSheetHref.indexOf("resource://") != 0 && styleSheetHref.indexOf("about:PreferenceStyleSheet") != 0 && styleSheetHref.indexOf("jar:file://") != 0 && styleSheetHref.indexOf("chrome://") != 0)
  460.             {
  461.                 webdeveloper_displayStyleSheet(styleSheet, generatedPage);
  462.             }
  463.         }
  464.     }
  465.  
  466.     // If the open tabs in background preference is set to true
  467.     if(preferencesService.prefHasUserValue("webdeveloper.open.tabs.background") && preferencesService.getBoolPref("webdeveloper.open.tabs.background"))
  468.     {
  469.         getBrowser().selectedTab = oldTab;
  470.     }
  471. }
  472.  
  473. // View style information
  474. function webdeveloper_viewStyleInformation(element, applyStyle)
  475. {
  476.     const mainTabBox   = getBrowser().mTabBox;
  477.     const documentList = webdeveloper_getDocuments(getBrowser().browsers[mainTabBox.selectedIndex].contentWindow, new Array());
  478.  
  479.     var checked      = null;
  480.     var pageDocument = null;
  481.  
  482.     // If the element is not set we are coming from a keyboard shortcut
  483.     if(!element)
  484.     {
  485.         element = document.getElementById("webdeveloper-view-style-information-menu");
  486.  
  487.         if(element.getAttribute("checked"))
  488.         {
  489.             element.removeAttribute("checked");
  490.         }
  491.         else
  492.         {
  493.             element.setAttribute("checked", true);
  494.         }
  495.     }
  496.  
  497.     checked = element.getAttribute("checked");
  498.  
  499.     // Loop through the documents
  500.     for(var i = 0; i < documentList.length; i++)
  501.     {
  502.         pageDocument = documentList[i];
  503.  
  504.         // If viewing style information
  505.         if(checked)
  506.         {
  507.             pageDocument.addEventListener("mouseover", webdeveloper_displayElementAncestors, true);
  508.             pageDocument.addEventListener("click", webdeveloper_viewStyleInformationForElement, true);
  509.         }
  510.         else
  511.         {
  512.             var sidebar = document.getElementById("sidebar-box");
  513.  
  514.             pageDocument.removeEventListener("mouseover", webdeveloper_displayElementAncestors, true);
  515.             pageDocument.removeEventListener("click", webdeveloper_viewStyleInformationForElement, true);
  516.             getBrowser().contentWindow.status = null;
  517.  
  518.             // If the sidebar exists, is visible and is showing view style information
  519.             if(sidebar && !sidebar.getAttribute("hidden") && sidebar.getAttribute("src") == "chrome://webdeveloper/content/sidebar/view_style_information.xul")
  520.             {
  521.                 toggleSidebar("webdeveloper-view-style-information-sidebar");
  522.             }
  523.         }
  524.     }
  525.  
  526.     webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/view_style_information.css", "webdeveloper-view-style-information", applyStyle);
  527. }
  528.  
  529. // View style information for an element
  530. function webdeveloper_viewStyleInformationForElement(event)
  531. {
  532.     const eventTarget = event.target;
  533.  
  534.     // If there is an event target and the click was not a right click
  535.     if(eventTarget && event.button != 2)
  536.     {
  537.         const domUtils           = Components.classes["@mozilla.org/inspector/dom-utils;1"].getService(Components.interfaces.inIDOMUtils);
  538.         const oldURL             = getBrowser().currentURI.spec;
  539.         const preferencesService = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefService).getBranch("");
  540.         const displayInSidebar   = preferencesService.prefHasUserValue("webdeveloper.view.style.information.sidebar") && preferencesService.getBoolPref("webdeveloper.view.style.information.sidebar");
  541.         const ruleList           = domUtils.getCSSStyleRules(eventTarget);
  542.         const stringBundle       = document.getElementById("webdeveloper-string-bundle");
  543.  
  544.         var elementRule       = null;
  545.         var headerElement     = null;
  546.         var line              = null;
  547.         var styleRule         = null;
  548.         var styleRuleList     = null;
  549.         var styleSheetArray   = new Array();
  550.         var styleSheet        = null;
  551.         var styleText         = null;
  552.  
  553.         // Loop through the element rules
  554.         for(var i = 0; i < ruleList.Count(); i++)
  555.         {
  556.             elementRule = ruleList.GetElementAt(i).QueryInterface(Components.interfaces.nsIDOMCSSStyleRule);
  557.             line        = domUtils.getRuleLine(elementRule);
  558.  
  559.             // If there is a parent style sheet
  560.             if(elementRule.parentStyleSheet)
  561.             {
  562.                 styleSheet = elementRule.parentStyleSheet.href;
  563.             }
  564.  
  565.             // If it's not a rule from the browser
  566.             if(styleSheet && styleSheet.indexOf("resource://") != 0 && styleSheet.indexOf("about:PreferenceStyleSheet") != 0 && styleSheet.indexOf("jar:file://") != 0 && styleSheet.indexOf("chrome://") != 0)
  567.             {
  568.                 styleRuleList = elementRule.style;
  569.                 styleText     = elementRule.selectorText + "    (" + stringBundle.getString("webdeveloper_viewStyleInformationLine") + " " + line + ")\n{";
  570.  
  571.                 // Loop through the style rules
  572.                 for(var j = 0; j < styleRuleList.length; j++)
  573.                 {
  574.                     styleRule  = styleRuleList[j];
  575.                     styleText += "\n    " + styleRule + ": " + styleRuleList.getPropertyValue(styleRule) + ";";
  576.                 }
  577.  
  578.                 styleText += "\n}\n\n";
  579.  
  580.                 // If this style sheet has rules already stored
  581.                 if(styleSheetArray[styleSheet])
  582.                 {
  583.                     styleSheetArray[styleSheet] += styleText;
  584.                 }
  585.                 else
  586.                 {
  587.                     styleSheetArray[styleSheet] = styleText;
  588.                 }
  589.             }
  590.         }
  591.  
  592.         // If displaying in the sidebar
  593.         if(displayInSidebar)
  594.         {
  595.             toggleSidebar("webdeveloper-view-style-information-sidebar", true);
  596.  
  597.             // If the sidebar document is found
  598.             if(document.getElementById("sidebar-box").getElementsByAttribute("id", "sidebar")[0].contentDocument.getElementById("webdeveloper-view-style-information-iframe"))
  599.             {
  600.                 webdeveloper_outputStyleInformationForElement(displayInSidebar, styleSheetArray, stringBundle.getFormattedString("webdeveloper_viewStyleInformationTitle", [oldURL]));
  601.             }
  602.             else
  603.             {
  604.                 // This sets a small timeout to guarantee the sidebar is open
  605.                 window.setTimeout(webdeveloper_outputStyleInformationForElement, 250, displayInSidebar, styleSheetArray, stringBundle.getFormattedString("webdeveloper_viewStyleInformationTitle", [oldURL]));
  606.             }
  607.         }
  608.         else
  609.         {
  610.             const oldTab = getBrowser().selectedTab;
  611.  
  612.             webdeveloper_outputStyleInformationForElement(displayInSidebar, styleSheetArray, stringBundle.getFormattedString("webdeveloper_viewStyleInformationTitle", [oldURL]));
  613.  
  614.             // If the open tabs in background preference is set to true
  615.             if(preferencesService.prefHasUserValue("webdeveloper.open.tabs.background") && preferencesService.getBoolPref("webdeveloper.open.tabs.background"))
  616.             {
  617.                 getBrowser().selectedTab = oldTab;
  618.             }
  619.         }
  620.  
  621.         event.preventDefault();
  622.     }
  623. }
  624.