| 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 |