Home | History | Annotate | Download | only in front-end
      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 WebInspector.FontView = function(resource)
     30 {
     31     WebInspector.ResourceView.call(this, resource);
     32 
     33     this.element.addStyleClass("font");
     34 }
     35 
     36 WebInspector.FontView._fontInnerHTML = "ABCDEFGHIJKLM<br>NOPQRSTUVWXYZ<br>abcdefghijklm<br>nopqrstuvwxyz<br>1234567890";
     37 
     38 WebInspector.FontView._fontId = 0;
     39 
     40 WebInspector.FontView._measureFontSize = 50;
     41 
     42 WebInspector.FontView.prototype = {
     43     hasContent: function()
     44     {
     45         return true;
     46     },
     47 
     48     _createContentIfNeeded: function()
     49     {
     50         if (this.fontPreviewElement)
     51             return;
     52 
     53         var uniqueFontName = "WebInspectorFontPreview" + (++WebInspector.FontView._fontId);
     54 
     55         this.fontStyleElement = document.createElement("style");
     56         this.fontStyleElement.textContent = "@font-face { font-family: \"" + uniqueFontName + "\"; src: url(" + this.resource.url + "); }";
     57         document.head.appendChild(this.fontStyleElement);
     58 
     59         this.fontPreviewElement = document.createElement("div");
     60         this.fontPreviewElement.innerHTML = WebInspector.FontView._fontInnerHTML;
     61         this.fontPreviewElement.style.setProperty("font-family", uniqueFontName, null);
     62         this.fontPreviewElement.style.setProperty("visibility", "hidden", null);
     63 
     64         this._dummyElement = document.createElement("div");
     65         this._dummyElement.style.visibility = "hidden";
     66         this._dummyElement.style.zIndex = "-1";
     67         this._dummyElement.style.display = "inline";
     68         this._dummyElement.style.position = "absolute";
     69         this._dummyElement.style.setProperty("font-family", uniqueFontName, null);
     70         this._dummyElement.style.setProperty("font-size", WebInspector.FontView._measureFontSize + "px", null);
     71         this._dummyElement.innerHTML = WebInspector.FontView._fontInnerHTML;
     72 
     73         this.element.appendChild(this.fontPreviewElement);
     74     },
     75 
     76     show: function(parentElement)
     77     {
     78         WebInspector.ResourceView.prototype.show.call(this, parentElement);
     79         this._createContentIfNeeded();
     80 
     81         this.updateFontPreviewSize();
     82     },
     83 
     84     resize: function()
     85     {
     86         if (this._inResize)
     87             return;
     88 
     89         this._inResize = true;
     90         try {
     91             this.updateFontPreviewSize();
     92         } finally {
     93             delete this._inResize;
     94         }
     95     },
     96 
     97     _measureElement: function()
     98     {
     99         this.element.appendChild(this._dummyElement);
    100         var result = { width: this._dummyElement.offsetWidth, height: this._dummyElement.offsetHeight };
    101         this.element.removeChild(this._dummyElement);
    102 
    103         return result;
    104     },
    105 
    106     updateFontPreviewSize: function()
    107     {
    108         if (!this.fontPreviewElement || !this.visible)
    109             return;
    110 
    111         this.fontPreviewElement.style.removeProperty("visibility");
    112         var dimension = this._measureElement();
    113 
    114         const height = dimension.height;
    115         const width = dimension.width;
    116 
    117         // Subtract some padding. This should match the paddings in the CSS plus room for the scrollbar.
    118         const containerWidth = this.element.offsetWidth - 50;
    119         const containerHeight = this.element.offsetHeight - 30;
    120 
    121         if (!height || !width || !containerWidth || !containerHeight) {
    122             this.fontPreviewElement.style.removeProperty("font-size");
    123             return;
    124         }
    125 
    126         var widthRatio = containerWidth / width;
    127         var heightRatio = containerHeight / height;
    128         var finalFontSize = Math.floor(WebInspector.FontView._measureFontSize * Math.min(widthRatio, heightRatio)) - 2;
    129 
    130         this.fontPreviewElement.style.setProperty("font-size", finalFontSize + "px", null);
    131     }
    132 }
    133 
    134 WebInspector.FontView.prototype.__proto__ = WebInspector.ResourceView.prototype;
    135