DevTools: Reduce code via using document.createElementWithClass and document.createChild.

Source/devtools/front_end/source_frame/ImageView.js

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
  *     notice, this list of conditions and the following disclaimer.
  * 2.  Redistributions in binary form must reproduce the above copyright
@@ skipping 38 matching lines @@
     wasShown: function()
     {
         this._createContentIfNeeded();
     },
 
     _createContentIfNeeded: function()
     {
         if (this._container)
             return;
 
-        var imageContainer = document.createElement("div");
-        imageContainer.className = "image";
-        this.element.appendChild(imageContainer);
-
-        var imagePreviewElement = document.createElement("img");
-        imagePreviewElement.classList.add("resource-image-view");
-        imageContainer.appendChild(imagePreviewElement);
+        var imageContainer = this.element.createChild("div", "image");
+        var imagePreviewElement = imageContainer.createChild("img", "resource-image-view");
         imagePreviewElement.addEventListener("contextmenu", this._contextMenu.bind(this), true);
 
-        this._container = document.createElement("div");
-        this._container.className = "info";
-        this.element.appendChild(this._container);
+        this._container = this.element.createChild("div", "info");
+        this._container.createChild("h1", "title").textContent = this.resource.displayName;
 
-        var imageNameElement = document.createElement("h1");
-        imageNameElement.className = "title";
-        imageNameElement.textContent = this.resource.displayName;
-        this._container.appendChild(imageNameElement);
-
-        var infoListElement = document.createElement("dl");
-        infoListElement.className = "infoList";
+        var infoListElement = document.createElementWithClass("dl", "infoList");
 
         this.resource.populateImageSource(imagePreviewElement);
 
         /**
          * @this {WebInspector.ImageView}
          */
         function onImageLoad()
         {
             var content = this.resource.content;
             if (content)
                 var resourceSize = this._base64ToSize(content);
             else
                 var resourceSize = this.resource.resourceSize;
 
             var imageProperties = [
                 { name: WebInspector.UIString("Dimensions"), value: WebInspector.UIString("%d × %d", imagePreviewElement.naturalWidth, imagePreviewElement.naturalHeight) },
                 { name: WebInspector.UIString("File size"), value: Number.bytesToString(resourceSize) },
                 { name: WebInspector.UIString("MIME type"), value: this.resource.mimeType }
             ];
 
             infoListElement.removeChildren();
             for (var i = 0; i < imageProperties.length; ++i) {
-                var dt = document.createElement("dt");
-                dt.textContent = imageProperties[i].name;
-                infoListElement.appendChild(dt);
-                var dd = document.createElement("dd");
-                dd.textContent = imageProperties[i].value;
-                infoListElement.appendChild(dd);
+                infoListElement.createChild("dt").textContent = imageProperties[i].name;
+                infoListElement.createChild("dd").textContent = imageProperties[i].value;
             }
-            var dt = document.createElement("dt");
-            dt.textContent = WebInspector.UIString("URL");
-            infoListElement.appendChild(dt);
-            var dd = document.createElement("dd");
-            var externalResource = true;
-            dd.appendChild(WebInspector.linkifyURLAsNode(this.resource.url, undefined, undefined, externalResource));
-            infoListElement.appendChild(dd);
-
+            infoListElement.createChild("dt").textContent = WebInspector.UIString("URL");
+            infoListElement.createChild("dd").appendChild(WebInspector.linkifyURLAsNode(this.resource.url, undefined, undefined, true /* externalResource */));
             this._container.appendChild(infoListElement);
         }
         imagePreviewElement.addEventListener("load", onImageLoad.bind(this), false);
         this._imagePreviewElement = imagePreviewElement;
     },
 
     _base64ToSize: function(content)
     {
         if (!content.length)
             return 0;
@@ skipping 25 matching lines @@
         InspectorFrontendHost.copyText(this.resource.url);
     },
 
     _openInNewTab: function()
     {
         InspectorFrontendHost.openInNewTab(this.resource.url);
     },
 
     __proto__: WebInspector.ResourceView.prototype
 }