Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(5)

Side by Side Diff: Source/core/html/shadow/PluginPlaceholderElement.js

Issue 698533003: Implement support for closing shadow DOM plugin placeholders. (Closed) Base URL: svn://svn.chromium.org/blink/trunk
Patch Set: mkwst comments Created 6 years, 1 month ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 // Copyright 2014 The Chromium Authors. All rights reserved. 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 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 'use strict'; 5 'use strict';
6 6
7 installClass('PluginPlaceholderElement', function(PluginPlaceholderElementProtot ype) { 7 installClass('PluginPlaceholderElement', function(PluginPlaceholderElementProtot ype) {
8 // FIXME: Load this from a .css file. 8 // FIXME: Load this from a .css file.
9 var styleSource = 9 var styleSource =
10 '#plugin-placeholder {' + 10 '#plugin-placeholder {' +
(...skipping 15 matching lines...) Expand all
26 26
27 var styleElement = document.createElement('style'); 27 var styleElement = document.createElement('style');
28 styleElement.textContent = styleSource; 28 styleElement.textContent = styleSource;
29 29
30 var contentElement = document.createElement('div'); 30 var contentElement = document.createElement('div');
31 contentElement.id = 'plugin-placeholder-content'; 31 contentElement.id = 'plugin-placeholder-content';
32 32
33 var messageElement = document.createElement('div'); 33 var messageElement = document.createElement('div');
34 messageElement.id = 'plugin-placeholder-message'; 34 messageElement.id = 'plugin-placeholder-message';
35 35
36 // FIXME: UI polish, l10n, etc. for the close button.
37 var closeButton = document.createElement('button');
38 closeButton.id = 'plugin-placeholder-close-button';
39 closeButton.textContent = 'Close';
40 closeButton.style.display = 'none';
41 closeButton.addEventListener('click', function() {
42 // FIXME: Record UMA Plugin_Hide_Click.
43 this.hide();
44 }.bind(this));
45
36 contentElement.appendChild(messageElement); 46 contentElement.appendChild(messageElement);
47 contentElement.appendChild(closeButton);
37 this.appendChild(styleElement); 48 this.appendChild(styleElement);
38 this.appendChild(contentElement); 49 this.appendChild(contentElement);
39 50
40 this.messageElement = messageElement; 51 this.messageElement = messageElement;
52 this.closeButton = closeButton;
53 };
54
55 PluginPlaceholderElementPrototype.hide = function() {
56 var host = (this.parentNode instanceof ShadowRoot) ? this.parentNode.hos t : this;
57 host.style.display = 'none';
58
59 // If we have a width and height, search for a parent (often <div>) with the
60 // same dimensions. If we find such a parent, hide that as well.
61 // This makes much more uncovered page content usable (including clickab le)
62 // as opposed to merely visible.
63 // TODO(cevans) -- it's a foul heuristic but we're going to tolerate it for
64 // now for these reasons:
65 // 1) Makes the user experience better.
66 // 2) Foulness is encapsulated within this single function.
67 // 3) Confidence in no false positives.
68 // 4) Seems to have a good / low false negative rate at this time.
69 //
70 // This heuristic was copied from plugins::PluginPlaceholder::HidePlugin
71 // (src/components/plugins/renderer/plugin_placeholder.cc) and should be
72 // kept in sync with it until it goes away.
73 if (host.hasAttribute('width') && host.hasAttribute('height')) {
74 var presentationAttributeInPixels = function(attr) {
75 var match = host.getAttribute(attr).match(/^\s*(\d+)\s*(px)?\s*$ /);
76 if (match)
77 return match[1] + 'px';
78 };
79 var width = presentationAttributeInPixels('width');
80 var height = presentationAttributeInPixels('height');
81 if (!width || !height)
82 return;
83
84 var element = host;
85 while (element instanceof Element) {
86 if (element.style.width == width && element.style.height == heig ht)
87 element.style.display = 'none';
88 element = element.parentNode;
89 }
90 }
41 }; 91 };
42 92
43 Object.defineProperty(PluginPlaceholderElementPrototype, 'message', { 93 Object.defineProperty(PluginPlaceholderElementPrototype, 'message', {
44 get: function() { return this.messageElement.textContent; }, 94 get: function() { return this.messageElement.textContent; },
45 set: function(message) { this.messageElement.textContent = message; }, 95 set: function(message) { this.messageElement.textContent = message; },
46 }); 96 });
97
98 Object.defineProperty(PluginPlaceholderElementPrototype, 'closeable', {
99 get: function() { return this.closeButton.style.display != 'none'; },
100 set: function(closeable) { this.closeButton.style.display = closeable ? '' : 'none'; },
101 });
47 }); 102 });
OLDNEW
« no previous file with comments | « Source/core/html/shadow/PluginPlaceholderElement.idl ('k') | Source/core/plugins/testing/DictionaryPluginPlaceholder.h » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698