third_party/WebKit/Source/devtools/front_end/source_frame/FontView.js

   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  * @constructor
  31  * @extends {WebInspector.VBox}
  32  * @param {string} url
  33  * @param {string} mimeType
  34  * @param {!WebInspector.ContentProvider} contentProvider
  35  */
  36 WebInspector.FontView = function(url, mimeType, contentProvider)
  37 {
  38     WebInspector.VBox.call(this);
  39     this.registerRequiredCSS("source_frame/fontView.css");
  40     this.element.classList.add("font-view");
  41     this._url = url;
  42     this._mimeType = mimeType;
  43     this._contentProvider = contentProvider;
  44 }
  45
  46 WebInspector.FontView._fontPreviewLines = [ "ABCDEFGHIJKLM", "NOPQRSTUVWXYZ", "abcdefghijklm", "nopqrstuvwxyz", "1234567890" ];
  47
  48 WebInspector.FontView._fontId = 0;
  49
  50 WebInspector.FontView._measureFontSize = 50;
  51
  52 WebInspector.FontView.prototype = {
  53     /**
  54      * @param {string} uniqueFontName
  55      * @param {?string} content
  56      */
  57     _onFontContentLoaded: function(uniqueFontName, content)
  58     {
  59         var url = content ? WebInspector.Resource.contentAsDataURL(content, this._mimeType, true) : this._url;
  60         this.fontStyleElement.textContent = String.sprintf("@font-face { font-family: \"%s\"; src: url(%s); }", uniqueFontName, url);
  61     },
  62
  63     _createContentIfNeeded: function()
  64     {
  65         if (this.fontPreviewElement)
  66             return;
  67
  68         var uniqueFontName = "WebInspectorFontPreview" + (++WebInspector.FontView._fontId);
  69
  70         this.fontStyleElement = createElement("style");
  71         this._contentProvider.requestContent(this._onFontContentLoaded.bind(this, uniqueFontName));
  72         this.element.appendChild(this.fontStyleElement);
  73
  74         var fontPreview = createElement("div");
  75         for (var i = 0; i < WebInspector.FontView._fontPreviewLines.length; ++i) {
  76             if (i > 0)
  77                 fontPreview.createChild("br");
  78             fontPreview.createTextChild(WebInspector.FontView._fontPreviewLines[i]);
  79         }
  80         this.fontPreviewElement = fontPreview.cloneNode(true);
  81         this.fontPreviewElement.style.setProperty("font-family", uniqueFontName);
  82         this.fontPreviewElement.style.setProperty("visibility", "hidden");
  83
  84         this._dummyElement = fontPreview;
  85         this._dummyElement.style.visibility = "hidden";
  86         this._dummyElement.style.zIndex = "-1";
  87         this._dummyElement.style.display = "inline";
  88         this._dummyElement.style.position = "absolute";
  89         this._dummyElement.style.setProperty("font-family", uniqueFontName);
  90         this._dummyElement.style.setProperty("font-size", WebInspector.FontView._measureFontSize + "px");
  91
  92         this.element.appendChild(this.fontPreviewElement);
  93     },
  94
  95     wasShown: function()
  96     {
  97         this._createContentIfNeeded();
  98
  99         this.updateFontPreviewSize();
 100     },
 101
 102     onResize: function()
 103     {
 104         if (this._inResize)
 105             return;
 106
 107         this._inResize = true;
 108         try {
 109             this.updateFontPreviewSize();
 110         } finally {
 111             delete this._inResize;
 112         }
 113     },
 114
 115     _measureElement: function()
 116     {
 117         this.element.appendChild(this._dummyElement);
 118         var result = { width: this._dummyElement.offsetWidth, height: this._dummyElement.offsetHeight };
 119         this.element.removeChild(this._dummyElement);
 120
 121         return result;
 122     },
 123
 124     updateFontPreviewSize: function()
 125     {
 126         if (!this.fontPreviewElement || !this.isShowing())
 127             return;
 128
 129         this.fontPreviewElement.style.removeProperty("visibility");
 130         var dimension = this._measureElement();
 131
 132         const height = dimension.height;
 133         const width = dimension.width;
 134
 135         // Subtract some padding. This should match the paddings in the CSS plus room for the scrollbar.
 136         const containerWidth = this.element.offsetWidth - 50;
 137         const containerHeight = this.element.offsetHeight - 30;
 138
 139         if (!height || !width || !containerWidth || !containerHeight) {
 140             this.fontPreviewElement.style.removeProperty("font-size");
 141             return;
 142         }
 143
 144         var widthRatio = containerWidth / width;
 145         var heightRatio = containerHeight / height;
 146         var finalFontSize = Math.floor(WebInspector.FontView._measureFontSize * Math.min(widthRatio, heightRatio)) - 2;
 147
 148         this.fontPreviewElement.style.setProperty("font-size", finalFontSize + "px", null);
 149     },
 150
 151     __proto__: WebInspector.VBox.prototype
 152 }