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

Side by Side Diff: chrome/browser/resources/pdf/index.html

Issue 137663008: Implement viewporting for the out of process PDF plugin. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Created 6 years, 10 months 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 <!DOCTYPE HTML> 1 <!DOCTYPE HTML>
2 <!-- NOTE: index.html/index.js are automatically generated from index.in.html 2 <!-- NOTE: index.html/index.js are automatically generated from index.in.html
3 using the command: vulcanize --csp index.in.html -o index.html 3 using the command: vulcanize --csp index.in.html -o index.html
4 index.html/index.js SHOULD NOT be modified manually. 4 index.html/index.js SHOULD NOT be modified manually.
5 TODO(raymes): Get rid of the need for vulcanize once HTMLImports is 5 TODO(raymes): Get rid of the need for vulcanize once HTMLImports is
6 working properly in polymer. --> 6 working properly in polymer. -->
7 <html i18n-values="dir:textdirection"> 7 <html i18n-values="dir:textdirection">
8 <head> 8 <head>
9 <meta charset="utf-8"> 9 <meta charset="utf-8">
10 <script src="polymer_loader.js"></script> 10 <script src="polymer_loader.js"></script>
(...skipping 154 matching lines...) Expand 10 before | Expand all | Expand 10 after
165 165
166 <polymer-element name="polymer-selector" attributes="selected multi valueattr se lectedClass selectedProperty selectedItem selectedModel selectedIndex notap targ et itemsSelector activateEvent" assetpath="../../../../third_party/polymer/polym er-selector/"> 166 <polymer-element name="polymer-selector" attributes="selected multi valueattr se lectedClass selectedProperty selectedItem selectedModel selectedIndex notap targ et itemsSelector activateEvent" assetpath="../../../../third_party/polymer/polym er-selector/">
167 <template> 167 <template>
168 <polymer-selection id="selection" multi="{{multi}}" on-polymer-select="{{sel ectionSelect}}"></polymer-selection> 168 <polymer-selection id="selection" multi="{{multi}}" on-polymer-select="{{sel ectionSelect}}"></polymer-selection>
169 <content id="items" select="*"></content> 169 <content id="items" select="*"></content>
170 </template> 170 </template>
171 171
172 </polymer-element> 172 </polymer-element>
173 173
174 <polymer-element name="viewer-toolbar" attributes="fadingIn" on-mouseover="{{fad eIn}}" on-mousemove="{{fadeIn}}" on-mouseout="{{fadeOut}}" assetpath="html_offic e/elements/viewer-toolbar/"> 174 <polymer-element name="viewer-toolbar" attributes="fadingIn" on-mouseover="{{fad eIn}}" on-mousemove="{{fadeIn}}" on-mouseout="{{fadeOut}}" assetpath="html_offic e/elements/viewer-toolbar/">
175 <template> 175 <template>
176 <style>/* Copyright 2013 The Chromium Authors. All rights reserved. 176 <style>/* Copyright 2013 The Chromium Authors. All rights reserved.
177 * Use of this source code is governed by a BSD-style license that can be 177 * Use of this source code is governed by a BSD-style license that can be
178 * found in the LICENSE file. */ 178 * found in the LICENSE file. */
179 179
180 :host { 180 :host {
181 -webkit-transition: opacity 0.4s ease-in-out; 181 -webkit-transition: opacity 400ms ease-in-out;
182 bottom: 0; 182 bottom: 0;
183 display: block; 183 display: block;
184 font-size: 0; 184 font-size: 0;
185 opacity: 1; 185 opacity: 1;
186 padding: 30px 30px 15px 30vw;
186 position: fixed; 187 position: fixed;
187 right: 0; 188 right: 0;
188 padding: 30px 30px 15px 30vw;
189 } 189 }
190 190
191 #toolbar { 191 #toolbar {
192 border-radius: 3px; 192 border-radius: 3px;
193 box-shadow: 0 1px 2px gray, 0 3px 3px rgba(0, 0, 0, .2); 193 box-shadow: 0 1px 2px gray, 0 3px 3px rgba(0, 0, 0, .2);
194 overflow: hidden; 194 overflow: hidden;
195 } 195 }
196 </style> 196 </style>
197 <div id="toolbar"> 197 <div id="toolbar">
198 <content></content> 198 <content></content>
199 </div> 199 </div>
200 </template> 200 </template>
201 201
202 </polymer-element> 202 </polymer-element>
203 203
204 <polymer-element name="viewer-button" attributes="src latchable" assetpath="html _office/elements/viewer-button/"> 204 <polymer-element name="viewer-button" attributes="src latchable" assetpath="html _office/elements/viewer-button/">
205 <template> 205 <template>
206 <style>/* Copyright 2013 The Chromium Authors. All rights reserved. 206 <style>/* Copyright 2013 The Chromium Authors. All rights reserved.
207 * Use of this source code is governed by a BSD-style license that can be 207 * Use of this source code is governed by a BSD-style license that can be
208 * found in the LICENSE file. */ 208 * found in the LICENSE file. */
209 209
210 #icon { 210 #icon {
211 background-position: center center; 211 background-position: center center;
212 background-repeat: no-repeat; 212 background-repeat: no-repeat;
213 background-size: 100% 100%; 213 background-size: 100% 100%;
214 height: 100%; 214 height: 100%;
215 width: 100%; 215 width: 100%;
216 } 216 }
(...skipping 16 matching lines...) Expand all
233 :host(:hover:host) { 233 :host(:hover:host) {
234 background-image: linear-gradient(rgb(73, 102, 155), rgb(32, 52, 95)); 234 background-image: linear-gradient(rgb(73, 102, 155), rgb(32, 52, 95));
235 } 235 }
236 236
237 :host(.latchable.polymer-selected:host), 237 :host(.latchable.polymer-selected:host),
238 :host(:active:host) { 238 :host(:active:host) {
239 background-color: rgb(75, 103, 156); 239 background-color: rgb(75, 103, 156);
240 background-image: none; 240 background-image: none;
241 } 241 }
242 </style> 242 </style>
243 <div id="icon"></div> 243 <div id="icon"></div>
244 </template> 244 </template>
245 245
246 </polymer-element> 246 </polymer-element>
247 <style> 247 <style>
248 body { 248 body {
249 background-color: #ccc; 249 background-color: #ccc;
250 margin: 0; 250 margin: 0;
251 } 251 }
252 viewer-toolbar { 252 viewer-toolbar {
253 z-index: 2; 253 z-index: 2;
254 } 254 }
255 object { 255 #plugin {
256 height: 100%;
257 position: fixed;
258 width: 100%;
256 z-index: 1; 259 z-index: 1;
257 } 260 }
261 #sizer {
262 position: absolute;
263 z-index: 0;
264 }
258 </style> 265 </style>
259 </head> 266 </head>
260 <body> 267 <body>
261 268
262 <viewer-toolbar> 269 <div id="sizer"></div>
270
271 <viewer-toolbar id="toolbar">
263 <polymer-selector> 272 <polymer-selector>
264 <viewer-button src="button_fit_page.png" latchable="true"></viewer-button> 273 <viewer-button id="fit-to-page-button" src="button_fit_page.png" latchable=" ">
265 <viewer-button src="button_fit_width.png" latchable="true"></viewer-button> 274 </viewer-button>
266 <viewer-button src="button_zoom_in.png"></viewer-button> 275 <viewer-button id="fit-to-width-button" src="button_fit_width.png" latchable ="">
267 <viewer-button src="button_zoom_out.png"></viewer-button> 276 </viewer-button>
277 <viewer-button id="zoom-in-button" src="button_zoom_in.png">
278 </viewer-button>
279 <viewer-button id="zoom-out-button" src="button_zoom_out.png">
280 </viewer-button>
268 </polymer-selector> 281 </polymer-selector>
269 <viewer-button src="button_save.png"></viewer-button> 282 <viewer-button id="save-button" src="button_save.png"></viewer-button>
270 <viewer-button src="button_print.png"></viewer-button> 283 <viewer-button id="print-button" src="button_print.png"></viewer-button>
271 </viewer-toolbar> 284 </viewer-toolbar>
272 285
273 286
274 <script src="index.js"></script> 287 <script src="index.js"></script>
275 </body> 288 </body>
276 <script src="pdf.js"></script> 289 <script src="pdf.js"></script>
277 </html> 290 </html>
OLDNEW
« no previous file with comments | « chrome/browser/resources/component_extension_resources.grd ('k') | chrome/browser/resources/pdf/index.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698