doc/webdeveloper/common/css.js

   1 // Formats a style rule property
   2 function webdeveloper_formatStyleRuleProperty(styleRuleProperty)
   3 {
   4     // Switch on the style rule property
   5     switch(styleRuleProperty)
   6     {
   7         case "margin-bottom-value":
   8             return "margin-bottom";
   9         case "margin-left-value":
  10             return "margin-left";
  11         case "margin-right-value":
  12             return "margin-right";
  13         case "margin-top-value":
  14             return "margin-top";
  15         case "padding-bottom-value":
  16             return "padding-bottom";
  17         case "padding-left-value":
  18             return "padding-left";
  19         case "padding-right-value":
  20             return "padding-right";
  21         case "padding-top-value":
  22             return "padding-top";
  23         case "-x-background-x-position":
  24             return "background-x-position";
  25         case "-x-background-y-position":
  26             return "background-y-position";
  27         default:
  28             return styleRuleProperty;
  29     }
  30 }
  31
  32 // Formats a style rule value
  33 function webdeveloper_formatStyleRuleValue(styleRuleValue)
  34 {
  35     // If the style rule value is set
  36     if(styleRuleValue)
  37     {
  38         var rgbRegularExpression = new RegExp("rgb\\((\\d{1,3}),\\s(\\d{1,3}),\\s(\\d{1,3})\\)", "gi");
  39         var styleRuleValueColor  = rgbRegularExpression.exec(styleRuleValue);
  40
  41         // If the style rule value is a color
  42         if(styleRuleValueColor)
  43         {
  44             var blue  = parseInt(styleRuleValueColor[3]).toString(16);
  45             var green = parseInt(styleRuleValueColor[2]).toString(16);
  46             var red   = parseInt(styleRuleValueColor[1]).toString(16);
  47
  48             // If the blue color is only 1 character long
  49             if(blue.length == 1)
  50             {
  51                 blue = "0" + blue;
  52             }
  53
  54             // If the green color is only 1 character long
  55             if(green.length == 1)
  56             {
  57                 green = "0" + green;
  58             }
  59
  60             // If the red color is only 1 character long
  61             if(red.length == 1)
  62             {
  63                 red = "0" + red;
  64             }
  65
  66             return "#" + red + green + blue;
  67         }
  68     }
  69
  70     return styleRuleValue;
  71 }
  72
  73 // Returns the list of the style sheets for the specified document
  74 function webdeveloper_getStyleSheetsForDocument(contentDocument, includeInline, includeAlternate)
  75 {
  76     var styleSheets = new Array();
  77
  78     // If the content document is set
  79     if(contentDocument)
  80     {
  81         var documentStyleSheets       = contentDocument.styleSheets;
  82         var documentStyleSheetsLength = documentStyleSheets.length;
  83         var documentURL               = contentDocument.documentURI;
  84         var styleSheet                = null;
  85
  86         // Loop through the style sheets
  87         for(var i = 0; i < documentStyleSheetsLength; i++)
  88         {
  89             styleSheet = documentStyleSheets[i];
  90
  91             // If this is a valid style sheet and including alternate style sheets or this is not alternate
  92             if(webdeveloper_isValidStyleSheet(styleSheet) && (includeAlternate || !webdeveloper_isAlternateStyleSheet(styleSheet)))
  93             {
  94                 // If including inline style sheets or this is not inline
  95                 if(includeInline || styleSheet.href != documentURL)
  96                 {
  97                     styleSheets.push(styleSheet);
  98                 }
  99
 100                 styleSheets = styleSheets.concat(webdeveloper_getStyleSheetsImportedFromStyleSheet(styleSheet));
 101             }
 102         }
 103     }
 104
 105     return styleSheets;
 106 }
 107
 108 // Returns the list of style sheets imported from the specified style sheet
 109 function webdeveloper_getStyleSheetsImportedFromStyleSheet(styleSheet)
 110 {
 111     var styleSheets = new Array();
 112
 113     // If the style sheet is set
 114     if(styleSheet)
 115     {
 116         var cssRule            = null;
 117         var cssRules           = styleSheet.cssRules;
 118         var cssRulesLength     = cssRules.length;
 119         var importedStyleSheet = null;
 120         var importRule         = Components.interfaces.nsIDOMCSSRule.IMPORT_RULE;
 121
 122         // Loop through the the style sheet rules
 123         for(var i = 0; i < cssRulesLength; i++)
 124         {
 125             cssRule = cssRules[i];
 126
 127             // If this is an import rule
 128             if(cssRule.type == importRule)
 129             {
 130                 importedStyleSheet = cssRule.styleSheet;
 131
 132                 // If this style sheet is valid
 133                 if(webdeveloper_isValidStyleSheet(importedStyleSheet))
 134                 {
 135                     styleSheets.push(importedStyleSheet);
 136
 137                     styleSheets = styleSheets.concat(webdeveloper_getStyleSheetsImportedFromStyleSheet(importedStyleSheet));
 138                 }
 139             }
 140         }
 141     }
 142
 143     return styleSheets;
 144 }
 145
 146 // If there is a style sheet for this media type
 147 function webdeveloper_hasStyleSheetForMedia(styleSheetList, media)
 148 {
 149     // If the style sheet list and media are set
 150     if(styleSheetList && media)
 151     {
 152         var styleSheet       = null;
 153         var styleSheetLength = styleSheetList.length;
 154
 155         // Loop through the style sheets
 156         for(var i = 0; i < styleSheetLength; i++)
 157         {
 158             styleSheet = styleSheetList[i];
 159
 160             // If this style sheet is valid and is for this media type
 161             if(webdeveloper_isValidStyleSheet(styleSheet) && webdeveloper_isMediaStyleSheet(styleSheet, media))
 162             {
 163                 return true;
 164             }
 165         }
 166     }
 167
 168     return false;
 169 }
 170
 171 // Is this style sheet an alternate style sheet
 172 function webdeveloper_isAlternateStyleSheet(styleSheet)
 173 {
 174     // If the style sheet is set
 175     if(styleSheet)
 176     {
 177         var ownerNode = styleSheet.ownerNode;
 178
 179         // If the owner node is set
 180         if(ownerNode)
 181         {
 182             // If the owner node is a processing instruction
 183             if(ownerNode.nodeType == Components.interfaces.nsIDOMNode.PROCESSING_INSTRUCTION_NODE)
 184             {
 185                 // If the processing instruction data contains alternate="yes"
 186                 if(ownerNode.data.indexOf('alternate="yes"') != -1)
 187                 {
 188                     return true;
 189                 }
 190             }
 191             else if(ownerNode.hasAttribute("rel") && ownerNode.getAttribute("rel").toLowerCase() == "alternate stylesheet")
 192             {
 193                 return true;
 194             }
 195         }
 196     }
 197
 198     return false;
 199 }
 200
 201 // Is this style sheet for this media type
 202 function webdeveloper_isMediaStyleSheet(styleSheet, matchMediaType)
 203 {
 204     // If the style sheet and match media type are set
 205     if(styleSheet && matchMediaType)
 206     {
 207         var media       = styleSheet.media;
 208         var mediaLength = media.length;
 209         var mediaType   = null;
 210
 211         // If there is no media and the match media type is screen
 212         if(mediaLength == 0 && matchMediaType == "screen")
 213         {
 214             return true;
 215         }
 216
 217         // Loop through the media
 218         for(var i = 0; i < mediaLength; i++)
 219         {
 220             mediaType = media.item(i).toLowerCase();
 221
 222             // If the media type is all or matches the match media type
 223             if(mediaType == "all" || mediaType == matchMediaType)
 224             {
 225                 return true;
 226             }
 227         }
 228     }
 229
 230     return false;
 231 }
 232
 233 // Is this style sheet a valid style sheet
 234 function webdeveloper_isValidStyleSheet(styleSheet)
 235 {
 236     // If the style sheet is set
 237     if(styleSheet)
 238     {
 239         var styleSheetHref = styleSheet.href;
 240
 241         // If the style sheet href is set and this is not an internal style sheet or the style sheet href is not set and this does not have a Web Developer id
 242         if((styleSheetHref && styleSheetHref.indexOf("about:PreferenceStyleSheet") != 0 && styleSheetHref.indexOf("chrome://") != 0 && styleSheetHref.indexOf("data:text/css") != 0 && styleSheetHref.indexOf("jar:file://") != 0 && styleSheetHref.indexOf("resource://") != 0) || (!styleSheetHref && (!styleSheet.hasAttribute("id") || styleSheet.getAttribute("id").indexOf("webdeveloper-") != 0)))
 243         {
 244             return true;
 245         }
 246     }
 247
 248     return false;
 249 }
 250
 251 // Is this style rule is a valid style rule
 252 function webdeveloper_isValidStyleRule(styleRuleList, styleRule)
 253 {
 254     // If the style rule is set
 255     if(styleRule)
 256     {
 257         // If the style rule is an invalid style rule
 258         if(styleRule.indexOf("-moz-") == 0 || ((styleRule == "margin-left-ltr-source" || styleRule == "margin-left-rtl-source" || styleRule == "margin-right-ltr-source" || styleRule == "margin-right-rtl-source" || styleRule == "padding-left-ltr-source" || styleRule == "padding-left-rtl-source" || styleRule == "padding-right-ltr-source" || styleRule == "padding-right-rtl-source") && styleRuleList.getPropertyValue(styleRule) == "physical"))
 259         {
 260             return false;
 261         }
 262
 263         return true;
 264     }
 265
 266     return false;
 267 }