| OLD | NEW |
|---|
| 1 <!doctype html> | 1 <!doctype html> |
| 2 <html> | 2 <html> |
| 3 <head> | 3 <head> |
| 4 <meta charset="utf-8"> | 4 <meta charset="utf-8"> |
| 5 <meta name="viewport" content="width=device-width, user-scalable=no"> | 5 <meta name="viewport" content="width=device-width, user-scalable=no"> |
| 6 <script> | 6 <script> |
| 7 function notifyDidFinishLoading() { | 7 function notifyDidFinishLoading() { |
| 8 if (plugin.didFinishLoading) | 8 if (plugin.didFinishLoading) |
| 9 plugin.didFinishLoading(); | 9 plugin.didFinishLoading(); |
| 10 } | 10 } |
| 11 | 11 |
| 12 document.onkeydown = function(e) { | 12 document.onkeydown = function(e) { |
| 13 if (e.keyIdentifier == 'Enter' || e.keyIdentifier == 'U+0020') { | 13 if (e.keyIdentifier == 'Enter' || e.keyIdentifier == 'U+0020') { |
| 14 plugin.load(); | 14 plugin.load(); |
| 15 e.preventDefault(); | 15 e.preventDefault(); |
| 16 } | 16 } |
| 17 }; | 17 }; |
| 18 </script> | 18 </script> |
| 19 <link rel="stylesheet" href="plugin_placeholders.css"></link> | 19 <link rel="stylesheet" href="plugin_placeholders.css"></link> |
| 20 <style> | 20 <style> |
| 21 #outer { | 21 #outer { |
| 22 position: relative; |
| 22 border: none; | 23 border: none; |
| 23 cursor: pointer; | 24 cursor: pointer; |
| 24 background-position: center; | |
| 25 background-repeat: no-repeat; | |
| 26 background-size: contain; | |
| 27 } | 25 } |
| 28 | 26 |
| 29 #shielding { | 27 #shielding { |
| 30 background-color: rgba(0, 0, 0, 0.5); | 28 background-color: rgba(0, 0, 0, 0.5); |
| 29 position: absolute; |
| 30 top: 0px; |
| 31 left: 0px; |
| 31 height: 100%; | 32 height: 100%; |
| 32 position: absolute; | |
| 33 width: 100%; | 33 width: 100%; |
| 34 z-index: 2; |
| 34 } | 35 } |
| 35 | 36 |
| 36 #plugin_icon { | 37 #plugin_icon { |
| 37 opacity: 0.8; | 38 opacity: 0.8; |
| 38 } | 39 } |
| 39 | 40 |
| 40 #plugin_icon:hover { | 41 #plugin_icon:hover { |
| 41 opacity: 0.95; | 42 opacity: 0.95; |
| 42 } | 43 } |
| 43 | 44 |
| 45 #poster { |
| 46 z-index: 1; |
| 47 } |
| 48 |
| 44 #inner { | 49 #inner { |
| 45 margin-top: -25px; | 50 margin-top: -25px; |
| 46 } | 51 } |
| 47 </style> | 52 </style> |
| 53 <base i18n-values="href:baseurl"> |
| 48 </head> | 54 </head> |
| 49 | 55 |
| 50 <body onload="notifyDidFinishLoading();"> | 56 <body onload="notifyDidFinishLoading();"> |
| 51 <div i18n-values="title:name;.style.background-image:background" id="outer" | 57 <div i18n-values="title:name" id="outer" onclick="plugin.load()"> |
| 52 onclick="plugin.load()"> | 58 <img id="poster" i18n-values="srcset:poster"> |
| 53 <div id="shielding"> | 59 <div id="shielding"> |
| 54 <div id="inner"> | 60 <div id="inner"> |
| 55 <div><img id="plugin_icon" src="plugin_power_saver_play.png" /></div> | 61 <div><img id="plugin_icon" src="plugin_power_saver_play.png" /></div> |
| 56 </div> | 62 </div> |
| 57 </div> | 63 </div> |
| 58 </div> | 64 </div> |
| 59 </body> | 65 </body> |
| 60 </html> | 66 </html> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 981623003:
Plugin Power Saver: Implement srcset syntax for posters. (Closed)
Base URL: https://chromium.googlesource.com/chromium/src.git@master