OLD | NEW |
| (Empty) |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | |
2 // Use of this source code is governed by a BSD-style license that can be | |
3 // found in the LICENSE file. | |
4 | |
5 'use strict'; | |
6 | |
7 privateScriptController.installClass('PluginPlaceholderElement', function(Plugin
PlaceholderElementPrototype) { | |
8 // FIXME: Load this from a .css file. | |
9 var styleSource = | |
10 '#plugin-placeholder {' + | |
11 ' all: initial;' + | |
12 ' width: 100%;' + | |
13 ' height: 100%;' + | |
14 ' overflow: hidden;' + | |
15 ' display: flex;' + | |
16 ' align-items: center;' + | |
17 ' background: gray;' + | |
18 ' font: 12px -webkit-control;' + | |
19 '}' + | |
20 '#plugin-placeholder-content {' + | |
21 ' text-align: center;' + | |
22 ' margin: auto;' + | |
23 '}'; | |
24 | |
25 PluginPlaceholderElementPrototype.createdCallback = function() { | |
26 this.id = 'plugin-placeholder'; | |
27 | |
28 var styleElement = document.createElement('style'); | |
29 styleElement.textContent = styleSource; | |
30 | |
31 var contentElement = document.createElement('div'); | |
32 contentElement.id = 'plugin-placeholder-content'; | |
33 | |
34 var messageElement = document.createElement('div'); | |
35 messageElement.id = 'plugin-placeholder-message'; | |
36 | |
37 // FIXME: UI polish, l10n, etc. for the close button. | |
38 var closeButton = document.createElement('button'); | |
39 closeButton.id = 'plugin-placeholder-close-button'; | |
40 closeButton.textContent = 'Close'; | |
41 closeButton.style.display = 'none'; | |
42 closeButton.addEventListener('click', function() { | |
43 // FIXME: Record UMA Plugin_Hide_Click. | |
44 this.hide(); | |
45 }.bind(this)); | |
46 | |
47 contentElement.appendChild(messageElement); | |
48 contentElement.appendChild(closeButton); | |
49 this.appendChild(styleElement); | |
50 this.appendChild(contentElement); | |
51 | |
52 this.messageElement = messageElement; | |
53 this.closeButton = closeButton; | |
54 }; | |
55 | |
56 PluginPlaceholderElementPrototype.hide = function() { | |
57 var host = (this.parentNode instanceof ShadowRoot) ? this.parentNode.hos
t : this; | |
58 host.style.display = 'none'; | |
59 | |
60 // If we have a width and height, search for a parent (often <div>) with
the | |
61 // same dimensions. If we find such a parent, hide that as well. | |
62 // This makes much more uncovered page content usable (including clickab
le) | |
63 // as opposed to merely visible. | |
64 // TODO(cevans) -- it's a foul heuristic but we're going to tolerate it
for | |
65 // now for these reasons: | |
66 // 1) Makes the user experience better. | |
67 // 2) Foulness is encapsulated within this single function. | |
68 // 3) Confidence in no false positives. | |
69 // 4) Seems to have a good / low false negative rate at this time. | |
70 // | |
71 // This heuristic was copied from plugins::PluginPlaceholder::HidePlugin | |
72 // (src/components/plugins/renderer/plugin_placeholder.cc) and should be | |
73 // kept in sync with it until it goes away. | |
74 if (host.hasAttribute('width') && host.hasAttribute('height')) { | |
75 var presentationAttributeInPixels = function(attr) { | |
76 var match = host.getAttribute(attr).match(/^\s*(\d+)\s*(px)?\s*$
/); | |
77 if (match) | |
78 return match[1] + 'px'; | |
79 }; | |
80 var width = presentationAttributeInPixels('width'); | |
81 var height = presentationAttributeInPixels('height'); | |
82 if (!width || !height) | |
83 return; | |
84 | |
85 var element = host; | |
86 while (element instanceof Element) { | |
87 if (element.style.width == width && element.style.height == heig
ht) | |
88 element.style.display = 'none'; | |
89 element = element.parentNode; | |
90 } | |
91 } | |
92 }; | |
93 | |
94 Object.defineProperty(PluginPlaceholderElementPrototype, 'message', { | |
95 get: function() { return this.messageElement.textContent; }, | |
96 set: function(message) { this.messageElement.textContent = message; }, | |
97 }); | |
98 | |
99 Object.defineProperty(PluginPlaceholderElementPrototype, 'closeable', { | |
100 get: function() { return this.closeButton.style.display != 'none'; }, | |
101 set: function(closeable) { this.closeButton.style.display = closeable ?
'' : 'none'; }, | |
102 }); | |
103 }); | |
OLD | NEW |