15c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)/* 25c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * Copyright (C) 2007, 2008 Apple Inc. All rights reserved. 35c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * 45c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * Redistribution and use in source and binary forms, with or without 55c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * modification, are permitted provided that the following conditions 65c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * are met: 75c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * 85c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * 1. Redistributions of source code must retain the above copyright 95c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * notice, this list of conditions and the following disclaimer. 105c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * 2. Redistributions in binary form must reproduce the above copyright 115c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * notice, this list of conditions and the following disclaimer in the 125c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * documentation and/or other materials provided with the distribution. 135c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * 3. Neither the name of Apple Computer, Inc. ("Apple") nor the names of 145c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * its contributors may be used to endorse or promote products derived 155c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * from this software without specific prior written permission. 165c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * 175c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * THIS SOFTWARE IS PROVIDED BY APPLE AND ITS CONTRIBUTORS "AS IS" AND ANY 185c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED 195c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 205c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * DISCLAIMED. IN NO EVENT SHALL APPLE OR ITS CONTRIBUTORS BE LIABLE FOR ANY 215c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES 225c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 235c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND 245c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 255c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF 265c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 275c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) */ 285c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 295c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)/** 305c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * @extends {WebInspector.ResourceView} 315c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) * @constructor 325c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) */ 335c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)WebInspector.FontView = function(resource) 345c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles){ 355c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) WebInspector.ResourceView.call(this, resource); 365c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 37a854de003a23bf3c7f95ec0f8154ada64092ff5cTorne (Richard Coles) this.element.classList.add("font"); 385c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)} 395c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 405c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)WebInspector.FontView._fontPreviewLines = [ "ABCDEFGHIJKLM", "NOPQRSTUVWXYZ", "abcdefghijklm", "nopqrstuvwxyz", "1234567890" ]; 415c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 425c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)WebInspector.FontView._fontId = 0; 435c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 445c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)WebInspector.FontView._measureFontSize = 50; 455c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 465c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)WebInspector.FontView.prototype = { 4709380295ba73501a205346becac22c6978e4671dTorne (Richard Coles) /** 4809380295ba73501a205346becac22c6978e4671dTorne (Richard Coles) * @return {boolean} 4909380295ba73501a205346becac22c6978e4671dTorne (Richard Coles) */ 505c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) hasContent: function() 515c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) { 525c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) return true; 535c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) }, 545c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 555c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) _createContentIfNeeded: function() 565c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) { 575c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) if (this.fontPreviewElement) 585c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) return; 595c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 605c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) var uniqueFontName = "WebInspectorFontPreview" + (++WebInspector.FontView._fontId); 615c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 625c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontStyleElement = document.createElement("style"); 635c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontStyleElement.textContent = "@font-face { font-family: \"" + uniqueFontName + "\"; src: url(" + this.resource.url + "); }"; 645c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) document.head.appendChild(this.fontStyleElement); 655c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 665c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) var fontPreview = document.createElement("div"); 675c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) for (var i = 0; i < WebInspector.FontView._fontPreviewLines.length; ++i) { 685c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) if (i > 0) 697242dc3dbeb210b5e876a3c42d1ec1a667fc621aPrimiano Tucci fontPreview.createChild("br"); 707242dc3dbeb210b5e876a3c42d1ec1a667fc621aPrimiano Tucci fontPreview.createTextChild(WebInspector.FontView._fontPreviewLines[i]); 715c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) } 725c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontPreviewElement = fontPreview.cloneNode(true); 735c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontPreviewElement.style.setProperty("font-family", uniqueFontName); 745c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontPreviewElement.style.setProperty("visibility", "hidden"); 755c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 765c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._dummyElement = fontPreview; 775c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._dummyElement.style.visibility = "hidden"; 785c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._dummyElement.style.zIndex = "-1"; 795c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._dummyElement.style.display = "inline"; 805c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._dummyElement.style.position = "absolute"; 815c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._dummyElement.style.setProperty("font-family", uniqueFontName); 825c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._dummyElement.style.setProperty("font-size", WebInspector.FontView._measureFontSize + "px"); 835c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 845c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.element.appendChild(this.fontPreviewElement); 855c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) }, 865c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 875c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) wasShown: function() 885c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) { 895c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._createContentIfNeeded(); 905c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 915c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.updateFontPreviewSize(); 925c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) }, 935c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 945c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) onResize: function() 955c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) { 965c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) if (this._inResize) 975c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) return; 985c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 995c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this._inResize = true; 1005c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) try { 1015c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.updateFontPreviewSize(); 1025c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) } finally { 1035c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) delete this._inResize; 1045c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) } 1055c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) }, 1065c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1075c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) _measureElement: function() 1085c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) { 1095c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.element.appendChild(this._dummyElement); 1105c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) var result = { width: this._dummyElement.offsetWidth, height: this._dummyElement.offsetHeight }; 1115c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.element.removeChild(this._dummyElement); 1125c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1135c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) return result; 1145c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) }, 1155c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1165c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) updateFontPreviewSize: function() 1175c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) { 1185c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) if (!this.fontPreviewElement || !this.isShowing()) 1195c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) return; 1205c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1215c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontPreviewElement.style.removeProperty("visibility"); 1225c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) var dimension = this._measureElement(); 1235c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1245c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) const height = dimension.height; 1255c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) const width = dimension.width; 1265c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1275c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) // Subtract some padding. This should match the paddings in the CSS plus room for the scrollbar. 1285c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) const containerWidth = this.element.offsetWidth - 50; 1295c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) const containerHeight = this.element.offsetHeight - 30; 1305c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1315c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) if (!height || !width || !containerWidth || !containerHeight) { 1325c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontPreviewElement.style.removeProperty("font-size"); 1335c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) return; 1345c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) } 1355c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1365c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) var widthRatio = containerWidth / width; 1375c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) var heightRatio = containerHeight / height; 1385c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) var finalFontSize = Math.floor(WebInspector.FontView._measureFontSize * Math.min(widthRatio, heightRatio)) - 2; 1395c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1405c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) this.fontPreviewElement.style.setProperty("font-size", finalFontSize + "px", null); 1415c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) }, 1425c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) 1435c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles) __proto__: WebInspector.ResourceView.prototype 1445c87bf8b86a7c82ef50fb7a89697d8e02e2553beTorne (Richard Coles)} 145