| OLD | NEW |
| 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 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 // Shim that simulates a <browser> tag via Mutation Observers. | 5 // Shim that simulates a <webview> tag via Mutation Observers. |
| 6 // | 6 // |
| 7 // The actual tag is implemented via the browser plugin. The internals of this | 7 // The actual tag is implemented via the browser plugin. The internals of this |
| 8 // are hidden via Shadow DOM. | 8 // are hidden via Shadow DOM. |
| 9 | 9 |
| 10 var BROWSER_TAG_ATTRIBUTES = ['src', 'width', 'height']; | 10 var WEB_VIEW_ATTRIBUTES = ['src', 'width', 'height']; |
| 11 | 11 |
| 12 window.addEventListener('DOMContentLoaded', function() { | 12 window.addEventListener('DOMContentLoaded', function() { |
| 13 // Handle <browser> tags already in the document. | 13 // Handle <webview> tags already in the document. |
| 14 var browserNodes = document.body.querySelectorAll('browser'); | 14 var webViewNodes = document.body.querySelectorAll('webview'); |
| 15 for (var i = 0, browserNode; browserNode = browserNodes[i]; i++) { | 15 for (var i = 0, webViewNode; webViewNode = webViewNodes[i]; i++) { |
| 16 new BrowserTag(browserNode); | 16 new WebView(webViewNode); |
| 17 } | 17 } |
| 18 | 18 |
| 19 // Handle <browser> tags added later. | 19 // Handle <webview> tags added later. |
| 20 var documentObserver = new WebKitMutationObserver(function(mutations) { | 20 var documentObserver = new WebKitMutationObserver(function(mutations) { |
| 21 mutations.forEach(function(mutation) { | 21 mutations.forEach(function(mutation) { |
| 22 for (var i = 0, addedNode; addedNode = mutation.addedNodes[i]; i++) { | 22 for (var i = 0, addedNode; addedNode = mutation.addedNodes[i]; i++) { |
| 23 if (addedNode.tagName == 'BROWSER') { | 23 if (addedNode.tagName == 'WEBVIEW') { |
| 24 new BrowserTag(addedNode); | 24 new WebView(addedNode); |
| 25 } | 25 } |
| 26 } | 26 } |
| 27 }); | 27 }); |
| 28 }); | 28 }); |
| 29 documentObserver.observe(document, {subtree: true, childList: true}); | 29 documentObserver.observe(document, {subtree: true, childList: true}); |
| 30 }); | 30 }); |
| 31 | 31 |
| 32 /** | 32 /** |
| 33 * @constructor | 33 * @constructor |
| 34 */ | 34 */ |
| 35 function BrowserTag(node) { | 35 function WebView(node) { |
| 36 this.node_ = node; | 36 this.node_ = node; |
| 37 var shadowRoot = new WebKitShadowRoot(node); | 37 var shadowRoot = new WebKitShadowRoot(node); |
| 38 | 38 |
| 39 this.objectNode_ = document.createElement('object'); | 39 this.objectNode_ = document.createElement('object'); |
| 40 this.objectNode_.type = 'application/browser-plugin'; | 40 this.objectNode_.type = 'application/browser-plugin'; |
| 41 BROWSER_TAG_ATTRIBUTES.forEach(this.copyAttribute_, this); | 41 WEB_VIEW_ATTRIBUTES.forEach(this.copyAttribute_, this); |
| 42 shadowRoot.appendChild(this.objectNode_); | 42 shadowRoot.appendChild(this.objectNode_); |
| 43 | 43 |
| 44 // Map attribute modifications on the <browser> tag to changes on the | 44 // Map attribute modifications on the <webview> tag to changes on the |
| 45 // underlying <object> node. | 45 // underlying <object> node. |
| 46 var handleMutation = this.handleMutation_.bind(this); | 46 var handleMutation = this.handleMutation_.bind(this); |
| 47 var observer = new WebKitMutationObserver(function(mutations) { | 47 var observer = new WebKitMutationObserver(function(mutations) { |
| 48 mutations.forEach(handleMutation); | 48 mutations.forEach(handleMutation); |
| 49 }); | 49 }); |
| 50 observer.observe( | 50 observer.observe( |
| 51 this.node_, | 51 this.node_, |
| 52 {attributes: true, attributeFilter: BROWSER_TAG_ATTRIBUTES}); | 52 {attributes: true, attributeFilter: WEB_VIEW_ATTRIBUTES}); |
| 53 | 53 |
| 54 // Expose getters and setters for the attributes. | 54 // Expose getters and setters for the attributes. |
| 55 BROWSER_TAG_ATTRIBUTES.forEach(function(attributeName) { | 55 WEB_VIEW_ATTRIBUTES.forEach(function(attributeName) { |
| 56 Object.defineProperty(this.node_, attributeName, { | 56 Object.defineProperty(this.node_, attributeName, { |
| 57 get: function() { | 57 get: function() { |
| 58 var value = node.getAttribute(attributeName); | 58 var value = node.getAttribute(attributeName); |
| 59 var numericValue = parseInt(value, 10); | 59 var numericValue = parseInt(value, 10); |
| 60 return isNaN(numericValue) ? value : numericValue; | 60 return isNaN(numericValue) ? value : numericValue; |
| 61 }, | 61 }, |
| 62 set: function(value) { | 62 set: function(value) { |
| 63 node.setAttribute(attributeName, value); | 63 node.setAttribute(attributeName, value); |
| 64 }, | 64 }, |
| 65 enumerable: true | 65 enumerable: true |
| 66 }); | 66 }); |
| 67 }, this); | 67 }, this); |
| 68 }; | 68 }; |
| 69 | 69 |
| 70 /** | 70 /** |
| 71 * @private | 71 * @private |
| 72 */ | 72 */ |
| 73 BrowserTag.prototype.handleMutation_ = function(mutation) { | 73 WebView.prototype.handleMutation_ = function(mutation) { |
| 74 switch (mutation.attributeName) { | 74 switch (mutation.attributeName) { |
| 75 case 'src': | 75 case 'src': |
| 76 this.objectNode_.postMessage(this.node_.getAttribute('src')); | 76 this.objectNode_.postMessage(this.node_.getAttribute('src')); |
| 77 break; | 77 break; |
| 78 default: | 78 default: |
| 79 this.copyAttribute_(mutation.attributeName); | 79 this.copyAttribute_(mutation.attributeName); |
| 80 break; | 80 break; |
| 81 } | 81 } |
| 82 }; | 82 }; |
| 83 | 83 |
| 84 /** | 84 /** |
| 85 * @private | 85 * @private |
| 86 */ | 86 */ |
| 87 BrowserTag.prototype.copyAttribute_ = function(attributeName) { | 87 WebView.prototype.copyAttribute_ = function(attributeName) { |
| 88 this.objectNode_.setAttribute( | 88 this.objectNode_.setAttribute( |
| 89 attributeName, this.node_.getAttribute(attributeName)); | 89 attributeName, this.node_.getAttribute(attributeName)); |
| 90 }; | 90 }; |
| OLD | NEW |