update web-animations.html

This commit is contained in:
Luke Pulverenti 2016-05-17 01:45:06 -04:00
parent f2e329c22d
commit 30db5a009c
6 changed files with 21 additions and 25 deletions

View File

@ -8,4 +8,7 @@ Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<script src="../web-animations-js/web-animations-next-lite.min.js"></script>
<!--<script src="../web-animations-js/web-animations-next-lite.min.js"></script>-->
<script>
require(['webAnimations']);
</script>

View File

@ -373,7 +373,7 @@ define(['browser'], function (browser) {
currentUrls = [];
}
if (enableAnimation() && !browser.animate) {
if (enableAnimation() && !document.documentElement.animate) {
require(['webAnimations']);
}

View File

@ -4,6 +4,8 @@
vertical-align: middle;
width: auto;
margin: 0;
padding-top: 0;
padding-bottom: 0;
}
.btnNotificationsInner {

View File

@ -5,7 +5,8 @@
}
[is=paper-icon-button-light] iron-icon, [is=paper-icon-button-light] img {
width: 100%;
/* Don't specify both dimensions or it may not get sized properly */
/*width: 100%;*/
height: 100%;
}

View File

@ -15,14 +15,14 @@
function fadeInRight(elem) {
var pct = browserInfo.mobile ? '2%' : '1%';
var pct = browserInfo.mobile ? '2%' : '0.5%';
var keyframes = [
{ opacity: '0', transform: 'translate3d(' + pct + ', 0, 0)', offset: 0 },
{ opacity: '1', transform: 'none', offset: 1 }];
elem.animate(keyframes, {
duration: 300,
duration: 160,
iterations: 1,
easing: 'ease-out'
});
@ -40,21 +40,12 @@
return;
}
elem.animate(keyframes, {
duration: 160,
duration: 120,
iterations: 1,
easing: 'ease-out'
});
}
function animateTabOnShow(newPanel, animateTabs, index) {
if (animateTabs && animateTabs.indexOf(index) != -1 && /*browserInfo.animate &&*/ newPanel.animate) {
setTimeout(function () {
fadeInRight(newPanel);
}, 160);
}
}
var libraryBrowser = (function (window, document, screen) {
// Regular Expressions for parsing tags and attributes
@ -301,11 +292,13 @@
var index = parseInt(link.getAttribute('data-index'));
var newPanel = panels[index];
animateTabOnShow(newPanel, animateTabs, index);
// If toCenter is called syncronously within the click event, it sometimes ends up canceling it
setTimeout(function () {
if (animateTabs && animateTabs.indexOf(index) != -1 && /*browserInfo.animate &&*/ newPanel.animate) {
fadeInRight(newPanel);
}
tabs.dispatchEvent(new CustomEvent("tabchange", {
detail: {
selectedTabIndex: index
@ -315,7 +308,7 @@
newPanel.classList.add('is-active');
//scrollHelper.toCenter(tabs, link, true);
}, 160);
}, 120);
}
});

View File

@ -157,17 +157,21 @@
case 0:
break;
case 1:
document.body.classList.add('autoScrollY');
depends.push('scripts/livetvguide');
break;
case 2:
document.body.classList.remove('autoScrollY');
depends.push('scripts/livetvchannels');
depends.push('paper-icon-item');
depends.push('paper-item-body');
break;
case 3:
document.body.classList.remove('autoScrollY');
depends.push('scripts/livetvrecordings');
break;
case 4:
document.body.classList.remove('autoScrollY');
depends.push('scripts/livetvseriestimers');
break;
default:
@ -210,13 +214,6 @@
loadTab(view, parseInt(e.detail.selectedTabIndex));
});
view.addEventListener('viewshow', function (e) {
// Needed on the guide tab
// Ideally this should be moved to the guide tab on show/hide
document.body.classList.add('autoScrollY');
});
view.addEventListener('viewbeforehide', function (e) {
document.body.classList.remove('autoScrollY');