OLD | NEW |
1 // Copyright (c) 2012 The Polymer Authors. All rights reserved. | 1 // Copyright (c) 2012 The Polymer Authors. All rights reserved. |
2 // | 2 // |
3 // Redistribution and use in source and binary forms, with or without | 3 // Redistribution and use in source and binary forms, with or without |
4 // modification, are permitted provided that the following conditions are | 4 // modification, are permitted provided that the following conditions are |
5 // met: | 5 // met: |
6 // | 6 // |
7 // * Redistributions of source code must retain the above copyright | 7 // * Redistributions of source code must retain the above copyright |
8 // notice, this list of conditions and the following disclaimer. | 8 // notice, this list of conditions and the following disclaimer. |
9 // * Redistributions in binary form must reproduce the above | 9 // * Redistributions in binary form must reproduce the above |
10 // copyright notice, this list of conditions and the following disclaimer | 10 // copyright notice, this list of conditions and the following disclaimer |
(...skipping 372 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
383 } | 383 } |
384 target = target.parentNode; | 384 target = target.parentNode; |
385 } | 385 } |
386 } | 386 } |
387 }); | 387 }); |
388 ; | 388 ; |
389 | 389 |
390 Polymer('viewer-toolbar', { | 390 Polymer('viewer-toolbar', { |
391 fadingIn: false, | 391 fadingIn: false, |
392 timerId: undefined, | 392 timerId: undefined, |
393 inInitialFade: false, | 393 inInitialFadeIn: false, |
394 ready: function() { | 394 ready: function() { |
395 this.parentNode.addEventListener('mousemove', function(e) { | 395 this.parentNode.addEventListener('mousemove', function(e) { |
396 var rect = this.getBoundingClientRect(); | 396 var rect = this.getBoundingClientRect(); |
397 if (e.clientX >= rect.left && e.clientX <= rect.right && | 397 if (e.clientX >= rect.left && e.clientX <= rect.right && |
398 e.clientY >= rect.top && e.clientY <= rect.bottom) { | 398 e.clientY >= rect.top && e.clientY <= rect.bottom) { |
399 this.fadingIn = true; | 399 this.fadingIn = true; |
400 // If we hover over the toolbar, cancel the initial fade in. | 400 // If we hover over the toolbar, cancel the initial fade in. |
401 if (this.inInitialFade) | 401 if (this.inInitialFadeIn) |
402 this.inInitialFade = false; | 402 this.inInitialFadeIn = false; |
403 } else { | 403 } else { |
404 // Initially we want to keep the toolbar up for a longer period. | 404 // Initially we want to keep the toolbar up for a longer period. |
405 if (!this.inInitialFade) | 405 if (!this.inInitialFadeIn) |
406 this.fadingIn = false; | 406 this.fadingIn = false; |
407 } | 407 } |
408 }.bind(this)); | 408 }.bind(this)); |
409 }, | 409 }, |
410 initialFadeIn: function() { | 410 initialFadeIn: function() { |
411 this.inInitialFade = true; | 411 this.inInitialFadeIn = true; |
412 this.fadeIn(); | 412 this.fadeIn(); |
413 this.fadeOutAfterDelay(6000); | 413 this.fadeOutAfterDelay(6000); |
414 }, | 414 }, |
415 fadingInChanged: function() { | 415 fadingInChanged: function() { |
416 if (this.fadingIn) { | 416 if (this.fadingIn) { |
417 this.fadeIn(); | 417 this.fadeIn(); |
418 } else { | 418 } else { |
419 if (this.timerId === undefined) | 419 if (this.timerId === undefined) |
420 this.fadeOutAfterDelay(3000); | 420 this.fadeOutAfterDelay(3000); |
421 } | 421 } |
422 }, | 422 }, |
423 fadeIn: function() { | 423 fadeIn: function() { |
424 this.style.opacity = 1; | 424 this.style.opacity = 1; |
425 clearTimeout(this.timerId); | 425 clearTimeout(this.timerId); |
426 this.timerId = undefined; | 426 this.timerId = undefined; |
427 }, | 427 }, |
428 fadeOutAfterDelay: function(delay) { | 428 fadeOutAfterDelay: function(delay) { |
429 this.timerId = setTimeout( | 429 this.timerId = setTimeout( |
430 function() { | 430 function() { |
431 this.style.opacity = 0; | 431 this.style.opacity = 0; |
432 this.timerId = undefined; | 432 this.timerId = undefined; |
433 this.inInitialFade = false; | 433 this.inInitialFadeIn = false; |
434 }.bind(this), delay); | 434 }.bind(this), delay); |
435 } | 435 } |
436 }); | 436 }); |
437 ; | 437 ; |
438 | 438 |
439 (function() { | 439 (function() { |
440 var dpi = ''; | 440 var dpi = ''; |
441 | 441 |
442 Polymer('viewer-button', { | 442 Polymer('viewer-button', { |
443 src: '', | 443 src: '', |
(...skipping 24 matching lines...) Expand all Loading... |
468 ; | 468 ; |
469 | 469 |
470 Polymer('viewer-page-indicator', { | 470 Polymer('viewer-page-indicator', { |
471 text: '1', | 471 text: '1', |
472 timerId: undefined, | 472 timerId: undefined, |
473 ready: function() { | 473 ready: function() { |
474 var callback = this.fadeIn.bind(this, 2000); | 474 var callback = this.fadeIn.bind(this, 2000); |
475 window.addEventListener('scroll', function() { | 475 window.addEventListener('scroll', function() { |
476 requestAnimationFrame(callback); | 476 requestAnimationFrame(callback); |
477 }); | 477 }); |
478 this.fadeIn(); | |
479 }, | 478 }, |
480 initialFadeIn: function() { | 479 initialFadeIn: function() { |
481 this.fadeIn(6000); | 480 this.fadeIn(6000); |
482 }, | 481 }, |
483 fadeIn: function(displayTime) { | 482 fadeIn: function(displayTime) { |
484 var percent = window.scrollY / | 483 var percent = window.scrollY / |
485 (document.body.scrollHeight - | 484 (document.body.scrollHeight - |
486 document.documentElement.clientHeight); | 485 document.documentElement.clientHeight); |
487 this.style.top = percent * | 486 this.style.top = percent * |
488 (document.documentElement.clientHeight - this.offsetHeight) + 'px'; | 487 (document.documentElement.clientHeight - this.offsetHeight) + 'px'; |
(...skipping 40 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
529 var segmentCopy = segment.cloneNode(true); | 528 var segmentCopy = segment.cloneNode(true); |
530 segmentCopy.style.webkitTransform = | 529 segmentCopy.style.webkitTransform = |
531 'rotate(' + (i * angle) + 'deg) skewY(' + | 530 'rotate(' + (i * angle) + 'deg) skewY(' + |
532 -1 * (90 - angle) + 'deg)'; | 531 -1 * (90 - angle) + 'deg)'; |
533 segmentsElement.appendChild(segmentCopy); | 532 segmentsElement.appendChild(segmentCopy); |
534 this.segments.push(segmentCopy); | 533 this.segments.push(segmentCopy); |
535 } | 534 } |
536 this.progressChanged(); | 535 this.progressChanged(); |
537 } | 536 } |
538 }); | 537 }); |
OLD | NEW |