--- /dev/null
+// Displays all alt attributes
+function webdeveloper_displayAltAttributes(element)
+{
+ var checked = element.getAttribute("checked");
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var imageElement = null;
+ var imageElementList = null;
+ var imageElementsLength = null;
+ var pageDocument = null;
+ var spanElement = null;
+ var text = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+
+ // Need to do this to stop the feature running twice
+ webdeveloper_removeAllElementsByXPath(pageDocument, "//span[@class='webdeveloper-display-alt-attributes']");
+
+ // If the element is checked
+ if(checked)
+ {
+ imageElementList = pageDocument.images;
+ imageElementsLength = imageElementList.length;
+
+ // Loop through all the image elements
+ for(var j = 0; j < imageElementsLength; j++)
+ {
+ imageElement = imageElementList[j];
+
+ // If the alt attribute is set
+ if(imageElement.hasAttribute("alt"))
+ {
+ spanElement = pageDocument.createElement("span");
+ text = "Alt=" + imageElement.getAttribute("alt");
+
+ spanElement.setAttribute("class", "webdeveloper-display-alt-attributes");
+ spanElement.setAttribute("title", text);
+ spanElement.appendChild(pageDocument.createTextNode(text));
+ imageElement.parentNode.insertBefore(spanElement, imageElement);
+ }
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/imports/tooltips.css", "webdeveloper-display-alt-attributes");
+ webdeveloper_toggleFeatureTooltipStyles(element, "webdeveloper-display-alt-attributes-tooltips", "span.webdeveloper-display-alt-attributes");
+}
+
+// Displays all image dimensions
+function webdeveloper_displayImageDimensions(element)
+{
+ var checked = element.getAttribute("checked");
+ var dimensions = null;
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var height = null;
+ var imageElement = null;
+ var imageElementList = null;
+ var imageElementsLength = null;
+ var pageDocument = null;
+ var spanElement = null;
+ var stringBundle = document.getElementById("webdeveloper-string-bundle");
+ var heightText = stringBundle.getString("webdeveloper_height");
+ var width = null;
+ var widthText = stringBundle.getString("webdeveloper_width");
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+
+ // Need to do this to stop the feature running twice
+ webdeveloper_removeAllElementsByXPath(pageDocument, "//span[@class='webdeveloper-display-image-dimensions']");
+
+ // If the element is checked
+ if(checked)
+ {
+ imageElementList = pageDocument.images;
+ imageElementsLength = imageElementList.length;
+
+ // Loop through all the image elements
+ for(var j = 0; j < imageElementsLength; j++)
+ {
+ dimensions = null;
+ imageElement = imageElementList[j];
+ height = imageElement.height;
+ width = imageElement.width;
+
+ // If the width and height are set
+ if(width && height)
+ {
+ dimensions = width + "x" + height;
+ }
+ else if(width)
+ {
+ dimensions = widthText + "=" + width;
+ }
+ else if(height)
+ {
+ dimensions = heightText + "=" + height;
+ }
+
+ // If the dimensions are set
+ if(dimensions)
+ {
+ spanElement = pageDocument.createElement("span");
+
+ spanElement.setAttribute("class", "webdeveloper-display-image-dimensions");
+ spanElement.setAttribute("title", dimensions);
+ spanElement.appendChild(pageDocument.createTextNode(dimensions));
+ imageElement.parentNode.insertBefore(spanElement, imageElement);
+ }
+
+ height = null;
+ width = null;
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/imports/tooltips.css", "webdeveloper-display-image-dimensions");
+ webdeveloper_toggleFeatureTooltipStyles(element, "webdeveloper-display-image-dimensions-tooltips", "span.webdeveloper-display-image-dimensions");
+}
+
+// Displays all image file sizes
+function webdeveloper_displayImageFileSizes(element)
+{
+ var checked = element.getAttribute("checked");
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var fileSize = null;
+ var imageElement = null;
+ var imageElementList = null;
+ var imageElementsLength = null;
+ var pageDocument = null;
+ var spanElement = null;
+ var stringBundle = document.getElementById("webdeveloper-string-bundle");
+ var fileSizeText = stringBundle.getString("webdeveloper_fileSize");
+ var text = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+
+ // Need to do this to stop the feature running twice
+ webdeveloper_removeAllElementsByXPath(pageDocument, "//span[@class='webdeveloper-display-image-file-sizes']");
+
+ // If the element is checked
+ if(checked)
+ {
+ imageElementList = pageDocument.images;
+ imageElementsLength = imageElementList.length;
+
+ // Loop through all the image elements
+ for(var j = 0; j < imageElementsLength; j++)
+ {
+ imageElement = imageElementList[j];
+ fileSize = webdeveloper_getFileSize(imageElement.src);
+
+ // If there is a file size
+ if(fileSize)
+ {
+ spanElement = pageDocument.createElement("span");
+ text = fileSizeText + "=" + webdeveloper_formatFileSize(fileSize);
+
+ spanElement.setAttribute("class", "webdeveloper-display-image-file-sizes");
+ spanElement.setAttribute("title", text);
+ spanElement.appendChild(pageDocument.createTextNode(text));
+ imageElement.parentNode.insertBefore(spanElement, imageElement);
+ }
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/imports/tooltips.css", "webdeveloper-display-image-file-sizes");
+ webdeveloper_toggleFeatureTooltipStyles(element, "webdeveloper-display-image-file-sizes-tooltips", "span.webdeveloper-display-image-file-sizes");
+}
+
+// Displays all image paths
+function webdeveloper_displayImagePaths(element)
+{
+ var checked = element.getAttribute("checked");
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var imageElement = null;
+ var imageElementList = null;
+ var imageElementsLength = null;
+ var pageDocument = null;
+ var spanElement = null;
+ var src = null;
+ var stringBundle = document.getElementById("webdeveloper-string-bundle");
+ var srcText = stringBundle.getString("webdeveloper_src");
+ var text = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+
+ // Need to do this to stop the feature running twice
+ webdeveloper_removeAllElementsByXPath(pageDocument, "//span[@class='webdeveloper-display-image-paths']");
+
+ // If the element is checked
+ if(checked)
+ {
+ imageElementList = pageDocument.images;
+ imageElementsLength = imageElementList.length;
+
+ // Loop through all the image elements
+ for(var j = 0; j < imageElementsLength; j++)
+ {
+ imageElement = imageElementList[j];
+ spanElement = pageDocument.createElement("span");
+ src = imageElement.getAttribute("src");
+
+ // If the src is set
+ if(src)
+ {
+ text = srcText + "=" + src;
+
+ spanElement.setAttribute("class", "webdeveloper-display-image-paths");
+ spanElement.setAttribute("title", text);
+ spanElement.appendChild(pageDocument.createTextNode(text));
+ imageElement.parentNode.insertBefore(spanElement, imageElement);
+ }
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/imports/tooltips.css", "webdeveloper-display-image-paths");
+ webdeveloper_toggleFeatureTooltipStyles(element, "webdeveloper-display-image-paths-tooltips", "span.webdeveloper-display-image-paths");
+}
+
+// Finds all the broken images on the page
+function webdeveloper_findBrokenImages()
+{
+ var cacheDisabled = !webdeveloper_getBooleanPreference("browser.cache.disk.enable", false) && !webdeveloper_getBooleanPreference("browser.cache.memory.enable", false);
+ var divElement = null;
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var documentURL = null;
+ var image = null;
+ var imageLength = null;
+ var imageList = null;
+ var imageSrc = null;
+ var linkElement = null;
+ var listElement = null;
+ var listItemElement = null;
+ var oldTab = getBrowser().selectedTab;
+ var oldURL = getBrowser().currentURI.spec;
+ var generatedDocument = webdeveloper_generateDocument("");
+ var bodyElement = webdeveloper_getDocumentBodyElement(generatedDocument);
+ var headElement = webdeveloper_getDocumentHeadElement(generatedDocument);
+ var headerElement = generatedDocument.createElement("h1");
+ var pageDocument = null;
+ var pElement = null;
+ var scriptElement = generatedDocument.createElement("script");
+ var spanElement = null;
+ var stringBundle = document.getElementById("webdeveloper-string-bundle");
+ var title = stringBundle.getFormattedString("webdeveloper_findBrokenImagesTitle", [oldURL]);
+
+ generatedDocument.title = title;
+
+ webdeveloper_addGeneratedStyles(generatedDocument);
+
+ headerElement.appendChild(generatedDocument.createTextNode(title));
+ bodyElement.appendChild(headerElement);
+
+ webdeveloper_addGeneratedTools(generatedDocument);
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ divElement = generatedDocument.createElement("div");
+ headerElement = generatedDocument.createElement("h2");
+ linkElement = generatedDocument.createElement("a");
+ listElement = generatedDocument.createElement("ol");
+ pageDocument = documentList[i];
+ documentURL = pageDocument.documentURI;
+ imageList = webdeveloper_getImagesForDocument(pageDocument, !cacheDisabled, false);
+ imageLength = imageList.length;
+ spanElement = generatedDocument.createElement("span");
+
+ spanElement.setAttribute("class", "expanded pivot");
+ headerElement.appendChild(spanElement);
+ linkElement.setAttribute("href", documentURL);
+ linkElement.appendChild(generatedDocument.createTextNode(documentURL));
+ headerElement.appendChild(linkElement);
+ bodyElement.appendChild(headerElement);
+
+ // Loop through all the images
+ for(var j = 0; j < imageLength; j++)
+ {
+ image = imageList[j];
+ imageSrc = image.src;
+
+ // If the image is broken
+ if(!image.naturalWidth && !image.naturalHeight)
+ {
+ listItemElement = generatedDocument.createElement("li");
+ linkElement = generatedDocument.createElement("a");
+
+ linkElement.setAttribute("href", imageSrc);
+ linkElement.appendChild(generatedDocument.createTextNode(imageSrc));
+ listItemElement.appendChild(linkElement);
+ listElement.appendChild(listItemElement);
+ }
+ }
+
+ // If there are no broken images
+ if(listElement.hasChildNodes())
+ {
+ divElement.appendChild(listElement);
+ }
+ else
+ {
+ pElement = generatedDocument.createElement("p");
+
+ pElement.appendChild(generatedDocument.createTextNode(stringBundle.getString("webdeveloper_noBrokenImages")));
+ divElement.appendChild(pElement);
+ }
+
+ divElement.setAttribute("class", "output");
+ bodyElement.appendChild(divElement);
+ }
+
+ scriptElement.setAttribute("defer", "defer");
+ scriptElement.setAttribute("src", "chrome://webdeveloper/content/common/xpath.js");
+ scriptElement.setAttribute("type", "text/javascript");
+ headElement.appendChild(scriptElement);
+
+ scriptElement = generatedDocument.createElement("script");
+
+ scriptElement.setAttribute("defer", "defer");
+ scriptElement.setAttribute("src", "chrome://webdeveloper/content/generated/output_pivot.js");
+ scriptElement.setAttribute("type", "text/javascript");
+ headElement.appendChild(scriptElement);
+
+ // If the open tabs in background preference is set to true
+ if(webdeveloper_getBooleanPreference("webdeveloper.open.tabs.background", true))
+ {
+ getBrowser().selectedTab = oldTab;
+ }
+}
+
+// Hides/shows all background images
+function webdeveloper_hideBackgroundImages(element)
+{
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/hide_background_images.css", "webdeveloper-hide-background-images");
+}
+
+// Hides/shows all the images
+function webdeveloper_hideImages(element, id)
+{
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var hide = element.getAttribute("checked");
+ var inputElement = null;
+ var inputElementList = null;
+ var inputElementsLength = null;
+ var pageDocument = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+ inputElementList = pageDocument.getElementsByTagName("input");
+ inputElementsLength = inputElementList.length;
+
+ // Loop through all the input tags
+ for(var j = 0; j < inputElementsLength; j++)
+ {
+ inputElement = inputElementList[j];
+
+ // If hiding images and the element is an image
+ if(hide && inputElement.hasAttribute("type") && inputElement.getAttribute("type").toLowerCase() == "image")
+ {
+ inputElement.className += " webdeveloper-image";
+
+ inputElement.setAttribute("type", "submit");
+ }
+ else if(inputElement.className.indexOf("webdeveloper-image") != -1)
+ {
+ inputElement.className = webdeveloper_removeSubstring(inputElement.className, "webdeveloper-image");
+
+ inputElement.setAttribute("type", "image");
+ }
+ else
+ {
+ // This stops the fields reordering
+ inputElement.setAttribute("type", inputElement.getAttribute("type"));
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/hide_images.css", id);
+}
+
+// Makes all the images full size
+function webdeveloper_makeImagesFullSize()
+{
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var image = null;
+ var imageLength = null;
+ var imageList = null;
+ var pageDocument = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+ imageList = pageDocument.images;
+ imageLength = imageList.length;
+
+ // Loop through all the images
+ for(var j = 0; j < imageLength; j++)
+ {
+ image = imageList[j];
+
+ // If the image width is set
+ if(image.hasAttribute("width"))
+ {
+ image.removeAttribute("width");
+ }
+
+ // If the image height is set
+ if(image.hasAttribute("height"))
+ {
+ image.removeAttribute("height");
+ }
+ }
+ }
+}
+
+// Makes all the images invisible
+function webdeveloper_makeImagesInvisible(element, id)
+{
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var image = null;
+ var imageLength = null;
+ var imageList = null;
+ var inputElement = null;
+ var inputElementList = null;
+ var inputElementsLength = null;
+ var invisible = element.getAttribute("checked");
+ var pageDocument = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+ imageList = pageDocument.images;
+ imageLength = imageList.length;
+ inputElementList = pageDocument.getElementsByTagName("input");
+ inputElementsLength = inputElementList.length;
+
+ // Loop through all the input tags
+ for(var j = 0; j < inputElementsLength; j++)
+ {
+ inputElement = inputElementList[j];
+
+ // If making images invisible and the element is an image
+ if(invisible && inputElement.hasAttribute("type") && inputElement.getAttribute("type").toLowerCase() == "image")
+ {
+ inputElement.className += " webdeveloper-image";
+
+ inputElement.setAttribute("type", "submit");
+ }
+ else if(inputElement.className.indexOf("webdeveloper-image") != -1)
+ {
+ inputElement.className = webdeveloper_removeSubstring(inputElement.className, "webdeveloper-image");
+
+ inputElement.setAttribute("type", "image");
+ }
+ else
+ {
+ // This stops the fields reordering
+ inputElement.setAttribute("type", inputElement.getAttribute("type"));
+ }
+ }
+
+ // Loop through all the images
+ for(j = 0; j < imageLength; j++)
+ {
+ image = imageList[j];
+
+ // If making images invisible
+ if(invisible)
+ {
+ // If the image width is not set and the image is not broken
+ if(!image.hasAttribute("width") && image.naturalWidth)
+ {
+ image.setAttribute("width", image.naturalWidth);
+ }
+
+ // If the image height is not set and the image is not broken
+ if(!image.hasAttribute("height") && image.naturalHeight)
+ {
+ image.setAttribute("height", image.naturalHeight);
+ }
+
+ image.setAttribute("src", "chrome://webdeveloper/content/images/spacer.gif?" + image.getAttribute("src"));
+ }
+ else
+ {
+ image.setAttribute("src", webdeveloper_removeSubstring(image.getAttribute("src"), "chrome://webdeveloper/content/images/spacer.gif?"));
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/make_images_invisible.css", id);
+}
+
+// Outlines all images
+function webdeveloper_outlineAllImages(element)
+{
+ webdeveloper_outlineBackgroundImages(element, false);
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/outline_all_images.css", "webdeveloper-outline-all-images");
+}
+
+// Outlines all background images
+function webdeveloper_outlineBackgroundImages(element, toggleStyleSheet)
+{
+ var backgroundImage = null;
+ var checked = element.getAttribute("checked");
+ var cssURI = CSSPrimitiveValue.CSS_URI;
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var node = null;
+ var pageDocument = null;
+ var treeWalker = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+ treeWalker = pageDocument.createTreeWalker(webdeveloper_getDocumentBodyElement(pageDocument), NodeFilter.SHOW_ELEMENT, null, false);
+
+ // While the tree walker has more nodes
+ while((node = treeWalker.nextNode()) != null)
+ {
+ backgroundImage = node.ownerDocument.defaultView.getComputedStyle(node, null).getPropertyCSSValue("background-image");
+
+ // If this element has a background image and it is a URL
+ if(backgroundImage && backgroundImage.primitiveType == cssURI)
+ {
+ // If the element is checked
+ if(checked)
+ {
+ // If the style sheet should be toggled
+ if(toggleStyleSheet)
+ {
+ node.style.MozOutline = "1px solid #ff0000";
+ }
+ else
+ {
+ node.style.MozOutline = "1px solid #0000ff";
+ }
+ }
+ else
+ {
+ webdeveloper_removeElementOutline(node);
+ }
+ }
+ }
+ }
+
+ // If the style sheet should be toggled
+ if(toggleStyleSheet)
+ {
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/empty.css", "webdeveloper-outline-background-images");
+ }
+}
+
+// Outlines all the images with adjusted dimensions
+function webdeveloper_outlineImagesWithAdjustedDimensions(element)
+{
+ var checked = element.getAttribute("checked");
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var imageElement = null;
+ var imageElementList = null;
+ var imageElementsLength = null;
+ var naturalHeight = null;
+ var naturalWidth = null;
+ var pageDocument = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+ imageElementList = pageDocument.images;
+ imageElementsLength = imageElementList.length;
+
+ // Loop through all the img tags
+ for(var j = 0; j < imageElementsLength; j++)
+ {
+ imageElement = imageElementList[j];
+ naturalHeight = imageElement.naturalHeight;
+ naturalWidth = imageElement.naturalWidth;
+
+ // If outlining
+ if(checked)
+ {
+ // If the width or height has been adjusted
+ if((naturalWidth && imageElement.hasAttribute("width") && imageElement.getAttribute("width") != naturalWidth)
+ || (naturalHeight && imageElement.hasAttribute("height") && imageElement.getAttribute("height") != naturalHeight))
+ {
+ imageElement.className += " webdeveloper-adjusted-image";
+ }
+ }
+ else if(imageElement.className.indexOf("webdeveloper-adjusted-image") != -1)
+ {
+ imageElement.className = webdeveloper_removeSubstring(imageElement.className, "webdeveloper-adjusted-image");
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/outline_images_with_adjusted_dimensions.css", "webdeveloper-outline-images-with-adjusted-dimensions");
+}
+
+// Outlines all the images with oversized dimensions
+function webdeveloper_outlineImagesWithOversizedDimensions(element)
+{
+ var checked = element.getAttribute("checked");
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var imageElement = null;
+ var imageElementList = null;
+ var imageElementsLength = null;
+ var naturalHeight = null;
+ var naturalWidth = null;
+ var pageDocument = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+ imageElementList = pageDocument.images;
+ imageElementsLength = imageElementList.length;
+
+ // Loop through all the img tags
+ for(var j = 0; j < imageElementsLength; j++)
+ {
+ imageElement = imageElementList[j];
+ naturalHeight = imageElement.naturalHeight;
+ naturalWidth = imageElement.naturalWidth;
+
+ // If outlining
+ if(checked)
+ {
+ // If the width or height has been oversized
+ if((naturalWidth && imageElement.hasAttribute("width") && imageElement.getAttribute("width") > naturalWidth)
+ || (naturalHeight && imageElement.hasAttribute("height") && imageElement.getAttribute("height") > naturalHeight))
+ {
+ imageElement.className += " webdeveloper-oversized-image";
+ }
+ }
+ else if(imageElement.className.indexOf("webdeveloper-oversized-image") != -1)
+ {
+ imageElement.className = webdeveloper_removeSubstring(imageElement.className, "webdeveloper-oversized-image");
+ }
+ }
+ }
+
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/outline_images_with_oversized_dimensions.css", "webdeveloper-outline-images-with-oversized-dimensions");
+}
+
+// Outlines all the images with empty alt attributes
+function webdeveloper_outlineImagesWithEmptyAltAttributes(element)
+{
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/outline_images_with_empty_alt_attributes.css", "webdeveloper-outline-images-with-empty-alt-attributes");
+}
+
+// Outlines all the images without alt attributes
+function webdeveloper_outlineImagesWithoutAltAttributes(element)
+{
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/outline_images_without_alt_attributes.css", "webdeveloper-outline-images-without-alt-attributes");
+}
+
+// Outlines all the images without dimensions
+function webdeveloper_outlineImagesWithoutDimensions(element)
+{
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/outline_images_without_dimensions.css", "webdeveloper-outline-images-without-dimensions");
+}
+
+// Outlines all the images without title attributes
+function webdeveloper_outlineImagesWithoutTitleAttributes(element)
+{
+ webdeveloper_toggleStyleSheet(element, "chrome://webdeveloper/content/stylesheets/outline_images_without_title_attributes.css", "webdeveloper-outline-images-without-title-attributes");
+}
+
+// Replaces all images with their alt attributes
+function webdeveloper_replaceImagesWithAltAttributes(element)
+{
+ var altAttribute = null;
+ var checked = element.getAttribute("checked");
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var imageElement = null;
+ var imageElementList = null;
+ var imageElementsLength = null;
+ var pageDocument = null;
+ var previousElement = null;
+ var spanElement = null;
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ pageDocument = documentList[i];
+
+ // Need to do this to stop the feature running twice
+ webdeveloper_removeAllElementsByXPath(pageDocument, "//span[@class='webdeveloper-replace-images-with-alt-attributes']");
+
+ // If the element is checked
+ if(checked)
+ {
+ imageElementList = pageDocument.images;
+ imageElementsLength = imageElementList.length;
+
+ // Loop through all the img tags
+ for(var j = 0; j < imageElementsLength; j++)
+ {
+ imageElement = imageElementList[j];
+ altAttribute = imageElement.getAttribute("alt");
+ spanElement = pageDocument.createElement("span");
+
+ // If the alt attribute is set
+ if(altAttribute)
+ {
+ spanElement.setAttribute("class", "webdeveloper-replace-images-with-alt-attributes");
+ spanElement.appendChild(pageDocument.createTextNode(altAttribute));
+ imageElement.parentNode.insertBefore(spanElement, imageElement);
+ }
+ }
+ }
+ }
+
+ webdeveloper_hideImages(element, "webdeveloper-replace-images-with-alt-attributes");
+}
+
+// Toggles external site images
+function webdeveloper_toggleExternalSiteImages(element)
+{
+ var imageBehavior = 1;
+ var legacyImageBehavior = 0;
+
+ // If disabling external images
+ if(element.getAttribute("checked"))
+ {
+ imageBehavior = 3;
+ legacyImageBehavior = 1;
+ }
+
+ webdeveloper_setIntegerPreference("network.image.imageBehavior", legacyImageBehavior);
+ webdeveloper_setIntegerPreference("permissions.default.image", imageBehavior);
+ BrowserReload();
+}
+
+// Toggles image animations
+function webdeveloper_toggleImageAnimations(element)
+{
+ var imageBehavior = "normal";
+
+ // If disabling images
+ if(element.getAttribute("checked"))
+ {
+ imageBehavior = "none";
+ }
+
+ webdeveloper_setStringPreference("image.animation_mode", imageBehavior);
+ BrowserReload();
+}
+
+// Toggles images
+function webdeveloper_toggleImages(element)
+{
+ var imageBehavior = 1;
+ var legacyImageBehavior = 0;
+
+ // If disabling images
+ if(element.getAttribute("checked"))
+ {
+ imageBehavior = 2;
+ legacyImageBehavior = 2;
+ }
+
+ webdeveloper_setIntegerPreference("network.image.imageBehavior", legacyImageBehavior);
+ webdeveloper_setIntegerPreference("permissions.default.image", imageBehavior);
+ BrowserReload();
+}
+
+// Updates the disable images menu
+function webdeveloper_updateDisableImagesMenu(suffix)
+{
+ var checked = false;
+ var disableExternalSiteImagesChecked = false;
+ var disableExternalSiteImagesMenu = document.getElementById("webdeveloper-disable-external-site-images-" + suffix);
+ var disableImagesChecked = false;
+ var disableImagesPreferenceValue = webdeveloper_getIntegerPreference("permissions.default.image", true);
+
+ // If the image preference value is set to 2
+ if(disableImagesPreferenceValue == 2)
+ {
+ disableImagesChecked = true;
+ }
+ else if(disableImagesPreferenceValue == 3)
+ {
+ disableExternalSiteImagesChecked = true;
+ }
+
+ // If the image animation preference is set to none
+ if(webdeveloper_getStringPreference("image.animation_mode", false) == "none")
+ {
+ checked = true;
+ }
+
+ webdeveloper_configureElement(document.getElementById("webdeveloper-disable-all-images-" + suffix), "checked", disableImagesChecked);
+ webdeveloper_configureElement(disableExternalSiteImagesMenu, "checked", disableExternalSiteImagesChecked);
+ webdeveloper_configureElement(disableExternalSiteImagesMenu, "disabled", disableImagesChecked);
+ webdeveloper_configureElement(document.getElementById("webdeveloper-disable-image-animations-" + suffix), "checked", checked);
+}
+
+// Updates the images menu
+function webdeveloper_updateImagesMenu(suffix)
+{
+ var disableImagesChecked = false;
+ var disableImagesPreferenceValue = webdeveloper_getIntegerPreference("permissions.default.image", true);
+
+ // If the image preference value is set to 2
+ if(disableImagesPreferenceValue == 2)
+ {
+ disableImagesChecked = true;
+ }
+
+ webdeveloper_configureElement(document.getElementById("webdeveloper-find-broken-images-" + suffix), "disabled", disableImagesChecked);
+ webdeveloper_configureElement(document.getElementById("webdeveloper-hide-background-images-" + suffix), "disabled", disableImagesChecked);
+ webdeveloper_configureElement(document.getElementById("webdeveloper-hide-images-" + suffix), "disabled", disableImagesChecked);
+ webdeveloper_configureElement(document.getElementById("webdeveloper-make-images-full-size-" + suffix), "disabled", disableImagesChecked);
+ webdeveloper_configureElement(document.getElementById("webdeveloper-make-images-invisible-" + suffix), "disabled", disableImagesChecked);
+ webdeveloper_configureElement(document.getElementById("webdeveloper-view-image-information-" + suffix), "disabled", disableImagesChecked);
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-display-alt-attributes-" + suffix), "checked", "webdeveloper-display-alt-attributes");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-display-image-dimensions-" + suffix), "checked", "webdeveloper-display-image-dimensions");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-display-image-file-sizes-" + suffix), "checked", "webdeveloper-display-image-file-sizes");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-display-image-paths-" + suffix), "checked", "webdeveloper-display-image-paths");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-hide-background-images-" + suffix), "checked", "webdeveloper-hide-background-images");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-hide-images-" + suffix), "checked", "webdeveloper-hide-images");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-make-images-invisible-" + suffix), "checked", "webdeveloper-make-images-invisible");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-replace-images-with-alt-attributes-" + suffix), "checked", "webdeveloper-replace-images-with-alt-attributes");
+}
+
+// Updates the outline images menu
+function webdeveloper_updateOutlineImagesMenu(suffix)
+{
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-outline-all-images-" + suffix), "checked", "webdeveloper-outline-all-images");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-outline-background-images-" + suffix), "checked", "webdeveloper-outline-background-images");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-outline-images-with-adjusted-dimensions-" + suffix), "checked", "webdeveloper-outline-images-with-adjusted-dimensions");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-outline-images-with-empty-alt-attributes-" + suffix), "checked", "webdeveloper-outline-images-with-empty-alt-attributes");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-outline-images-without-alt-attributes-" + suffix), "checked", "webdeveloper-outline-images-without-alt-attributes");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-outline-images-without-dimensions-" + suffix), "checked", "webdeveloper-outline-images-without-dimensions");
+ webdeveloper_configureElementByAppliedStyle(document.getElementById("webdeveloper-outline-images-without-title-attributes-" + suffix), "checked", "webdeveloper-outline-images-without-title-attributes");
+}
+
+// Displays all the images for the page
+function webdeveloper_viewImageInformation()
+{
+ var cellDataElement = null;
+ var cellHeaderElement = null;
+ var divElement = null;
+ var documentList = webdeveloper_getDocuments(webdeveloper_getContentWindow());
+ var documentLength = documentList.length;
+ var documentURL = null;
+ var fileSize = null;
+ var height = 0;
+ var image = null;
+ var imageElement = null;
+ var imageLength = null;
+ var imageList = new Array();
+ var imageSrc = null;
+ var linkElement = null;
+ var oldTab = getBrowser().selectedTab;
+ var oldURL = getBrowser().currentURI.spec;
+ var generatedDocument = webdeveloper_generateDocument("");
+ var bodyElement = webdeveloper_getDocumentBodyElement(generatedDocument);
+ var headElement = webdeveloper_getDocumentHeadElement(generatedDocument);
+ var headerElement = generatedDocument.createElement("h1");
+ var pageDocument = null;
+ var pElement = null;
+ var scriptElement = generatedDocument.createElement("script");
+ var shade = false;
+ var spanElement = null;
+ var stringBundle = document.getElementById("webdeveloper-string-bundle");
+ var title = stringBundle.getFormattedString("webdeveloper_viewImageInformationTitle", [oldURL]);
+ var tableElement = null;
+ var tableRowElement = null;
+ var width = 0;
+
+ generatedDocument.title = title;
+
+ webdeveloper_addGeneratedStyles(generatedDocument);
+
+ headerElement.appendChild(generatedDocument.createTextNode(title));
+ bodyElement.appendChild(headerElement);
+
+ webdeveloper_addGeneratedTools(generatedDocument);
+
+ // Loop through the documents
+ for(var i = 0; i < documentLength; i++)
+ {
+ divElement = generatedDocument.createElement("div");
+ headerElement = generatedDocument.createElement("h2");
+ linkElement = generatedDocument.createElement("a");
+ pageDocument = documentList[i];
+ documentURL = pageDocument.documentURI;
+ imageList = webdeveloper_getImagesForDocument(pageDocument, true, true);
+ spanElement = generatedDocument.createElement("span");
+
+ linkElement.setAttribute("href", documentURL);
+ linkElement.appendChild(generatedDocument.createTextNode(documentURL));
+ headerElement.appendChild(linkElement);
+ bodyElement.appendChild(headerElement);
+
+ // If the tidy information preference is set
+ if(webdeveloper_getBooleanPreference("webdeveloper.information.tidy", true))
+ {
+ imageList = webdeveloper_tidyImages(imageList);
+ }
+
+ headerElement = generatedDocument.createElement("h3");
+ imageLength = imageList.length;
+
+ spanElement.setAttribute("class", "expanded pivot");
+ headerElement.appendChild(spanElement);
+
+ // If there is one image
+ if(imageLength == 1)
+ {
+ headerElement.appendChild(generatedDocument.createTextNode(imageLength + " " + stringBundle.getString("webdeveloper_image").toLowerCase()));
+ }
+ else
+ {
+ headerElement.appendChild(generatedDocument.createTextNode(imageLength + " " + stringBundle.getString("webdeveloper_images").toLowerCase()));
+ }
+
+ bodyElement.appendChild(headerElement);
+
+ // Loop through the images
+ for(var j = 0; j < imageLength; j++)
+ {
+ image = imageList[j];
+ height = image.naturalHeight;
+ imageElement = generatedDocument.createElement("img");
+ imageSrc = image.src;
+ fileSize = webdeveloper_getFileSize(imageSrc);
+ pElement = generatedDocument.createElement("p");
+ shade = true;
+ tableElement = generatedDocument.createElement("table");
+ width = image.naturalWidth;
+
+ imageElement.setAttribute("src", imageSrc);
+ pElement.appendChild(imageElement);
+ divElement.appendChild(pElement);
+
+ // Src
+ cellDataElement = generatedDocument.createElement("td");
+ cellHeaderElement = generatedDocument.createElement("th");
+ linkElement = generatedDocument.createElement("a");
+ tableRowElement = generatedDocument.createElement("tr");
+
+ cellHeaderElement.appendChild(generatedDocument.createTextNode(stringBundle.getString("webdeveloper_src")));
+ tableRowElement.appendChild(cellHeaderElement);
+ linkElement.setAttribute("href", imageSrc);
+ linkElement.appendChild(generatedDocument.createTextNode(imageSrc));
+ cellDataElement.appendChild(linkElement);
+ tableRowElement.appendChild(cellDataElement);
+ tableElement.appendChild(tableRowElement);
+
+ // If there is a width
+ if(width)
+ {
+ cellDataElement = generatedDocument.createElement("td");
+ cellHeaderElement = generatedDocument.createElement("th");
+ tableRowElement = generatedDocument.createElement("tr");
+
+ cellHeaderElement.appendChild(generatedDocument.createTextNode(stringBundle.getString("webdeveloper_width")));
+ tableRowElement.appendChild(cellHeaderElement);
+ cellDataElement.setAttribute("class", "shaded");
+ cellDataElement.appendChild(generatedDocument.createTextNode(width));
+ tableRowElement.appendChild(cellDataElement);
+ tableElement.appendChild(tableRowElement);
+ }
+
+ // If there is a height
+ if(height)
+ {
+ cellDataElement = generatedDocument.createElement("td");
+ cellHeaderElement = generatedDocument.createElement("th");
+ shade = !shade;
+ tableRowElement = generatedDocument.createElement("tr");
+
+ // If this cell should be shaded
+ if(shade)
+ {
+ cellDataElement.setAttribute("class", "shaded");
+ }
+
+ cellHeaderElement.appendChild(generatedDocument.createTextNode(stringBundle.getString("webdeveloper_height")));
+ tableRowElement.appendChild(cellHeaderElement);
+ cellDataElement.appendChild(generatedDocument.createTextNode(height));
+ tableRowElement.appendChild(cellDataElement);
+ tableElement.appendChild(tableRowElement);
+ }
+
+ // If there is a file size
+ if(fileSize)
+ {
+ cellDataElement = generatedDocument.createElement("td");
+ cellHeaderElement = generatedDocument.createElement("th");
+ shade = !shade;
+ tableRowElement = generatedDocument.createElement("tr");
+
+ // If this cell should be shaded
+ if(shade)
+ {
+ cellDataElement.setAttribute("class", "shaded");
+ }
+
+ cellHeaderElement.appendChild(generatedDocument.createTextNode(stringBundle.getString("webdeveloper_fileSize")));
+ tableRowElement.appendChild(cellHeaderElement);
+ cellDataElement.appendChild(generatedDocument.createTextNode(webdeveloper_formatFileSize(fileSize)));
+ tableRowElement.appendChild(cellDataElement);
+ tableElement.appendChild(tableRowElement);
+ }
+
+ // If there is an alt attribute
+ if(image.hasAttribute("alt"))
+ {
+ cellDataElement = generatedDocument.createElement("td");
+ cellHeaderElement = generatedDocument.createElement("th");
+ shade = !shade;
+ tableRowElement = generatedDocument.createElement("tr");
+
+ // If this cell should be shaded
+ if(shade)
+ {
+ cellDataElement.setAttribute("class", "shaded");
+ }
+
+ cellHeaderElement.appendChild(generatedDocument.createTextNode(stringBundle.getString("webdeveloper_alt")));
+ tableRowElement.appendChild(cellHeaderElement);
+ cellDataElement.appendChild(generatedDocument.createTextNode(image.getAttribute("alt")));
+ tableRowElement.appendChild(cellDataElement);
+ tableElement.appendChild(tableRowElement);
+ }
+
+ // If there is a title attribute
+ if(image.hasAttribute("title"))
+ {
+ cellDataElement = generatedDocument.createElement("td");
+ cellHeaderElement = generatedDocument.createElement("th");
+ shade = !shade;
+ tableRowElement = generatedDocument.createElement("tr");
+
+ // If this cell should be shaded
+ if(shade)
+ {
+ cellDataElement.setAttribute("class", "shaded");
+ }
+
+ cellHeaderElement.appendChild(generatedDocument.createTextNode(stringBundle.getString("webdeveloper_title")));
+ tableRowElement.appendChild(cellHeaderElement);
+ cellDataElement.appendChild(generatedDocument.createTextNode(image.getAttribute("title")));
+ tableRowElement.appendChild(cellDataElement);
+ tableElement.appendChild(tableRowElement);
+ }
+
+ divElement.appendChild(tableElement);
+ divElement.appendChild(generatedDocument.createElement("hr"));
+ }
+
+ divElement.setAttribute("class", "output");
+ bodyElement.appendChild(divElement);
+ }
+
+ scriptElement.setAttribute("defer", "defer");
+ scriptElement.setAttribute("src", "chrome://webdeveloper/content/common/xpath.js");
+ scriptElement.setAttribute("type", "text/javascript");
+ headElement.appendChild(scriptElement);
+
+ scriptElement = generatedDocument.createElement("script");
+
+ scriptElement.setAttribute("defer", "defer");
+ scriptElement.setAttribute("src", "chrome://webdeveloper/content/generated/output_pivot.js");
+ scriptElement.setAttribute("type", "text/javascript");
+ headElement.appendChild(scriptElement);
+
+ // If the open tabs in background preference is set to true
+ if(webdeveloper_getBooleanPreference("webdeveloper.open.tabs.background", true))
+ {
+ getBrowser().selectedTab = oldTab;
+ }
+}