1 /* 2 * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. 3 * 4 * Redistribution and use in source and binary forms, with or without 5 * modification, are permitted provided that the following conditions 6 * are met: 7 * 8 * 1. Redistributions of source code must retain the above copyright 9 * notice, this list of conditions and the following disclaimer. 10 * 2. Redistributions in binary form must reproduce the above copyright 11 * notice, this list of conditions and the following disclaimer in the 12 * documentation and/or other materials provided with the distribution. 13 * 3. Neither the name of Apple Computer, Inc. ("Apple") nor the names of 14 * its contributors may be used to endorse or promote products derived 15 * from this software without specific prior written permission. 16 * 17 * THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY 18 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED 19 * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 20 * DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY 21 * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES 22 * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 23 * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND 24 * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 25 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF 26 * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 27 */ 28 29 /** 30 * @extends {WebInspector.ResourceView} 31 * @constructor 32 */ 33 WebInspector.ImageView = function(resource) 34 { 35 WebInspector.ResourceView.call(this, resource); 36 37 this.element.classList.add("image"); 38 } 39 40 WebInspector.ImageView.prototype = { 41 /** 42 * @return {boolean} 43 */ 44 hasContent: function() 45 { 46 return true; 47 }, 48 49 wasShown: function() 50 { 51 this._createContentIfNeeded(); 52 }, 53 54 _createContentIfNeeded: function() 55 { 56 if (this._container) 57 return; 58 59 var imageContainer = this.element.createChild("div", "image"); 60 var imagePreviewElement = imageContainer.createChild("img", "resource-image-view"); 61 imagePreviewElement.addEventListener("contextmenu", this._contextMenu.bind(this), true); 62 63 this._container = this.element.createChild("div", "info"); 64 this._container.createChild("h1", "title").textContent = this.resource.displayName; 65 66 var infoListElement = document.createElementWithClass("dl", "infoList"); 67 68 this.resource.populateImageSource(imagePreviewElement); 69 70 /** 71 * @this {WebInspector.ImageView} 72 */ 73 function onImageLoad() 74 { 75 var content = this.resource.content; 76 if (content) 77 var resourceSize = this._base64ToSize(content); 78 else 79 var resourceSize = this.resource.resourceSize; 80 81 var imageProperties = [ 82 { name: WebInspector.UIString("Dimensions"), value: WebInspector.UIString("%d %d", imagePreviewElement.naturalWidth, imagePreviewElement.naturalHeight) }, 83 { name: WebInspector.UIString("File size"), value: Number.bytesToString(resourceSize) }, 84 { name: WebInspector.UIString("MIME type"), value: this.resource.mimeType } 85 ]; 86 87 infoListElement.removeChildren(); 88 for (var i = 0; i < imageProperties.length; ++i) { 89 infoListElement.createChild("dt").textContent = imageProperties[i].name; 90 infoListElement.createChild("dd").textContent = imageProperties[i].value; 91 } 92 infoListElement.createChild("dt").textContent = WebInspector.UIString("URL"); 93 infoListElement.createChild("dd").appendChild(WebInspector.linkifyURLAsNode(this.resource.url, undefined, undefined, true /* externalResource */)); 94 this._container.appendChild(infoListElement); 95 } 96 imagePreviewElement.addEventListener("load", onImageLoad.bind(this), false); 97 this._imagePreviewElement = imagePreviewElement; 98 }, 99 100 _base64ToSize: function(content) 101 { 102 if (!content.length) 103 return 0; 104 var size = (content.length || 0) * 3 / 4; 105 if (content.length > 0 && content[content.length - 1] === "=") 106 size--; 107 if (content.length > 1 && content[content.length - 2] === "=") 108 size--; 109 return size; 110 }, 111 112 _contextMenu: function(event) 113 { 114 var contextMenu = new WebInspector.ContextMenu(event); 115 contextMenu.appendItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Copy image URL" : "Copy Image URL"), this._copyImageURL.bind(this)); 116 if (this._imagePreviewElement.src) 117 contextMenu.appendItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Copy image as Data URL" : "Copy Image As Data URL"), this._copyImageAsDataURL.bind(this)); 118 contextMenu.appendItem(WebInspector.UIString(WebInspector.useLowerCaseMenuTitles() ? "Open image in new tab" : "Open Image in New Tab"), this._openInNewTab.bind(this)); 119 contextMenu.show(); 120 }, 121 122 _copyImageAsDataURL: function() 123 { 124 InspectorFrontendHost.copyText(this._imagePreviewElement.src); 125 }, 126 127 _copyImageURL: function() 128 { 129 InspectorFrontendHost.copyText(this.resource.url); 130 }, 131 132 _openInNewTab: function() 133 { 134 InspectorFrontendHost.openInNewTab(this.resource.url); 135 }, 136 137 __proto__: WebInspector.ResourceView.prototype 138 } 139