milas/jellyfish-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

update tabs

Browse source
This commit is contained in:
Luke Pulverenti 2016-05-15 12:30:32 -04:00
parent 516c5715a1
commit 26dcecb51f
29 changed files with 535 additions and 501 deletions
Download patch file Download diff file Expand all files Collapse all files

6
dashboard-ui/scripts/channels.js
View file

@ -74,11 +74,9 @@
var page = this;
var mdlTabs = page.querySelector('.mdl-tabs');
var mdlTabs = page.querySelector('.libraryViewNav');
componentHandler.upgradeAllRegistered(page);
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs);
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs, page.querySelectorAll('.pageTabContent'));
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex));

2
dashboard-ui/scripts/channelslatest.js
View file

@ -26,7 +26,7 @@
pageIdOn('pageinit', "channelsPage", function () {
var page = this;
var mdlTabs = page.querySelector('.mdl-tabs');
var mdlTabs = page.querySelector('.libraryViewNav');
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex));

9
dashboard-ui/scripts/indexpage.js
View file

@ -243,21 +243,20 @@
var self = this;
self.renderTab = function () {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + 0 + '\']');
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
loadHomeTab(view, tabContent);
};
var mdlTabs = view.querySelector('.mdl-tabs');
var mdlTabs = view.querySelector('.libraryViewNav');
componentHandler.upgradeAllRegistered(view);
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs);
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'));
var tabControllers = [];
var renderedTabs = [];
function loadTab(page, index) {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']');
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
switch (index) {

64
dashboard-ui/scripts/librarybrowser.js
View file

@ -1,4 +1,4 @@
define(['playlistManager', 'appSettings', 'appStorage', 'apphost', 'datetime', 'jQuery', 'itemHelper', 'mediaInfo', 'scrollStyles'], function (playlistManager, appSettings, appStorage, appHost, datetime, $, itemHelper, mediaInfo) {
define(['playlistManager', 'scrollHelper', 'appSettings', 'appStorage', 'apphost', 'datetime', 'jQuery', 'itemHelper', 'mediaInfo', 'scrollStyles'], function (playlistManager, scrollHelper, appSettings, appStorage, appHost, datetime, $, itemHelper, mediaInfo) {
function parentWithClass(elem, className) {
@ -176,7 +176,7 @@
if (selected == null) {
var elem = tabs.querySelector('.mdl-tabs__tab.is-active');
var elem = tabs.querySelector('.pageTabButton.is-active');
if (elem) {
return parseInt(elem.getAttribute('data-index'));
}
@ -191,18 +191,18 @@
}
}));
} else {
var tabButtons = tabs.querySelectorAll('.mdl-tabs__tab');
var tabButtons = tabs.querySelectorAll('.pageTabButton');
tabButtons[selected].click();
}
},
configureSwipeTabs: function (ownerpage, tabs) {
var pageCount = tabs.querySelectorAll('.mdl-tabs__panel').length;
var pageCount = ownerpage.querySelectorAll('.pageTabContent').length;
require(['hammer'], function (Hammer) {
var hammertime = new Hammer(tabs);
var hammertime = new Hammer(ownerpage);
hammertime.get('swipe').set({ direction: Hammer.DIRECTION_HORIZONTAL });
hammertime.on('swipeleft', function (e) {
@ -225,22 +225,64 @@
});
},
configurePaperLibraryTabs: function (ownerpage, tabs) {
configurePaperLibraryTabs: function (ownerpage, tabs, panels) {
if (!browserInfo.safari) {
LibraryBrowser.configureSwipeTabs(ownerpage, tabs);
}
tabs.querySelector('.mdl-tabs__tab-bar').addEventListener('click', function (e) {
var buttons = tabs.querySelectorAll('.pageTabButton');
for (var i = 0, length = buttons.length; i < length; i++) {
buttons[i].classList.add('mdl-button');
buttons[i].classList.add('mdl-js-button');
}
var link = parentWithClass(e.target, 'mdl-tabs__tab');
tabs.classList.add('hiddenScrollX');
if (link) {
function fadeInRight(elem) {
var pct = browserInfo.mobile ? '1%' : '0.5%';
var keyframes = [
{ opacity: '0', transform: 'translate3d(' + pct + ', 0, 0)', offset: 0 },
{ opacity: '1', transform: 'none', offset: 1 }];
elem.animate(keyframes, {
duration: 300,
iterations: 1,
easing: 'ease-out'
});
}
tabs.addEventListener('click', function (e) {
var current = tabs.querySelector('.is-active');
var link = parentWithClass(e.target, 'pageTabButton');
if (link && link != current) {
if (current) {
current.classList.remove('is-active');
panels[parseInt(current.getAttribute('data-index'))].classList.remove('is-active');
}
link.classList.add('is-active');
var index = parseInt(link.getAttribute('data-index'));
tabs.dispatchEvent(new CustomEvent("tabchange", {
detail: {
selectedTabIndex: parseInt(link.getAttribute('data-index'))
selectedTabIndex: index
}
}));
panels[index].classList.add('is-active');
//if (browserInfo.animate) {
// fadeInRight(panels[index]);
//}
// If toCenter is called syncronously within the click event, it sometimes ends up canceling it
//setTimeout(function() {
// scrollHelper.toCenter(tabs, link, true);
//}, 10);
}
});
@ -271,7 +313,7 @@
onTabbedpagebeforeshowInternal: function (page, e, isFirstLoad) {
var pageTabsContainer = page.querySelector('.mdl-tabs');
var pageTabsContainer = page.querySelector('.libraryViewNav');
if (isFirstLoad) {

2
dashboard-ui/scripts/livetvrecordings.js
View file

@ -98,7 +98,7 @@
ApiClient.getLiveTvRecordings({
userId: Dashboard.getCurrentUserId(),
limit: 6,
limit: 4,
IsInProgress: false,
Fields: 'CanDelete,PrimaryImageAspectRatio'

8
dashboard-ui/scripts/livetvsuggested.js
View file

@ -141,7 +141,7 @@
function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']');
var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
var scope = 'LiveTvPage';
var renderMethod = '';
@ -197,11 +197,9 @@
var page = this;
var mdlTabs = page.querySelector('.mdl-tabs');
var mdlTabs = page.querySelector('.libraryViewNav');
componentHandler.upgradeAllRegistered(page);
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs);
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs, page.querySelectorAll('.pageTabContent'));
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex));

14
dashboard-ui/scripts/moviesrecommended.js
View file

@ -271,19 +271,19 @@
var self = this;
self.initTab = function() {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + 0 + '\']');
self.initTab = function () {
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
initSuggestedTab(view, tabContent);
};
self.renderTab = function () {
var tabContent = view.querySelector('.mdl-tabs__panel[data-index=\'' + 0 + '\']');
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + 0 + '\']');
loadSuggestionsTab(view, params, tabContent);
};
$('.recommendations', view).createCardMenus();
var mdlTabs = view.querySelector('.mdl-tabs');
var mdlTabs = view.querySelector('.libraryViewNav');
function onPlaybackStop(e, state) {
@ -297,22 +297,20 @@
}
}
componentHandler.upgradeAllRegistered(view);
var baseUrl = 'movies.html';
var topParentId = params.topParentId;
if (topParentId) {
baseUrl += '?topParentId=' + topParentId;
}
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs);
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'));
var tabControllers = [];
var renderedTabs = [];
function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']');
var tabContent = view.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
switch (index) {

7
dashboard-ui/scripts/musicrecommended.js
View file

@ -216,7 +216,7 @@
function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']');
var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
var scope = 'MusicPage';
var renderMethod = '';
@ -285,7 +285,7 @@
$('.recommendations', page).createCardMenus();
var mdlTabs = page.querySelector('.mdl-tabs');
var mdlTabs = page.querySelector('.libraryViewNav');
var baseUrl = 'music.html';
var topParentId = LibraryMenu.getTopParentId();
@ -293,8 +293,7 @@
baseUrl += '?topParentId=' + topParentId;
}
componentHandler.upgradeAllRegistered(page);
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs);
libraryBrowser.configurePaperLibraryTabs(page, mdlTabs, page.querySelectorAll('.pageTabContent'));
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(page, parseInt(e.detail.selectedTabIndex));

11
dashboard-ui/scripts/site.js
View file

@ -2004,7 +2004,6 @@ var AppInfo = {};
define("material-design-lite", [bowerPath + "/material-design-lite/material.min", "css!" + bowerPath + "/material-design-lite/material"]);
define("MaterialSpinner", ["material-design-lite"]);
define("MaterialTabs", ["material-design-lite"]);
define("jQuery", [bowerPath + '/jquery/dist/jquery.slim.min'], function () {
@ -2560,7 +2559,7 @@ var AppInfo = {};
defineRoute({
path: '/home.html',
dependencies: ['MaterialTabs'],
dependencies: [],
autoFocus: false,
controller: 'scripts/indexpage'
});
@ -2614,7 +2613,7 @@ var AppInfo = {};
defineRoute({
path: '/livetv.html',
dependencies: [],
dependencies: ['paper-button'],
autoFocus: false
});
@ -2729,7 +2728,7 @@ var AppInfo = {};
defineRoute({
path: '/movies.html',
dependencies: ['MaterialTabs', 'paper-checkbox', 'paper-fab', 'scripts/alphapicker', 'paper-button'],
dependencies: ['paper-checkbox', 'paper-fab', 'scripts/alphapicker', 'paper-button'],
autoFocus: false,
controller: 'scripts/moviesrecommended'
});
@ -2811,7 +2810,7 @@ var AppInfo = {};
defineRoute({
path: '/nowplaying.html',
dependencies: ['MaterialTabs', 'paper-icon-button-light', 'paper-slider', 'paper-button'],
dependencies: ['paper-icon-button-light', 'paper-slider', 'paper-button'],
controller: 'scripts/nowplayingpage',
autoFocus: false
});
@ -2944,7 +2943,7 @@ var AppInfo = {};
defineRoute({
path: '/tv.html',
dependencies: ['paper-checkbox', 'paper-button', 'paper-icon-button-light', 'MaterialTabs'],
dependencies: ['paper-checkbox', 'paper-icon-button-light', 'paper-button'],
autoFocus: false,
controller: 'scripts/tvrecommended'
});

8
dashboard-ui/scripts/tvrecommended.js
View file

@ -181,7 +181,7 @@
function loadTab(page, index) {
var tabContent = page.querySelector('.mdl-tabs__panel[data-index=\'' + index + '\']');
var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']');
var depends = [];
switch (index) {
@ -232,7 +232,7 @@
});
}
var mdlTabs = view.querySelector('.mdl-tabs');
var mdlTabs = view.querySelector('.libraryViewNav');
function onPlaybackStop(e, state) {
@ -246,8 +246,6 @@
}
}
componentHandler.upgradeAllRegistered(view);
var baseUrl = 'tv.html';
var topParentId = params.topParentId;
if (topParentId) {
@ -260,7 +258,7 @@
view.querySelector('#resumableItems').classList.remove('hiddenScrollX');
}
libraryBrowser.createCardMenus(view.querySelector('#resumableItems'));
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs);
libraryBrowser.configurePaperLibraryTabs(view, mdlTabs, view.querySelectorAll('.pageTabContent'));
mdlTabs.addEventListener('tabchange', function (e) {
loadTab(view, parseInt(e.detail.selectedTabIndex));