mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

use shared alpha picker

Browse source
This commit is contained in:
Luke Pulverenti 2016-06-07 01:42:26 -04:00
parent 0f7541beda
commit d8cde41200
26 changed files with 444 additions and 331 deletions
Download patch file Download diff file Expand all files Collapse all files

113
dashboard-ui/scripts/alphapicker.js
View file

@ -1,113 +0,0 @@
define(['jQuery'], function ($) {
function getPickerHtml() {
var html = '';
html += '<a href="#">#</a>';
html += '<a href="#">A</a>';
html += '<a href="#">B</a>';
html += '<a href="#">C</a>';
html += '<a href="#">D</a>';
html += '<a href="#">E</a>';
html += '<a href="#">F</a>';
html += '<a href="#">G</a>';
html += '<a href="#">H</a>';
html += '<a href="#">I</a>';
html += '<a href="#">J</a>';
html += '<a href="#">K</a>';
html += '<a href="#">L</a>';
html += '<a href="#">M</a>';
html += '<a href="#">N</a>';
html += '<a href="#">O</a>';
html += '<a href="#">P</a>';
html += '<a href="#">Q</a>';
html += '<a href="#">R</a>';
html += '<a href="#">S</a>';
html += '<a href="#">T</a>';
html += '<a href="#">U</a>';
html += '<a href="#">V</a>';
html += '<a href="#">W</a>';
html += '<a href="#">X</a>';
html += '<a href="#">Y</a>';
html += '<a href="#">Z</a>';
return html;
}
function init(container, picker) {
$('.itemsContainer', container).addClass('itemsContainerWithAlphaPicker');
picker.innerHTML = getPickerHtml();
$(picker).on('click', 'a', function () {
var elem = this;
var isSelected = elem.classList.contains('selectedCharacter');
$('.selectedCharacter', picker).removeClass('selectedCharacter');
if (!isSelected) {
elem.classList.add('selectedCharacter');
$(picker).trigger('alphaselect', [this.innerHTML]);
} else {
$(picker).trigger('alphaclear');
}
});
}
pageClassOn('pageinit', "libraryPage", function () {
var page = this;
var pickers = page.querySelectorAll('.alphabetPicker');
if (!pickers.length) {
return;
}
if (page.classList.contains('pageWithAbsoluteTabs')) {
for (var i = 0, length = pickers.length; i < length; i++) {
init($(pickers[i]).parents('.pageTabContent'), pickers[i]);
}
} else {
init(page, pickers[0]);
}
});
$.fn.alphaValue = function (val) {
if (val == null) {
return $('.selectedCharacter', this).html();
}
val = val.toLowerCase();
$('.selectedCharacter', this).removeClass('selectedCharacter');
$('a', this).each(function () {
if (this.innerHTML.toLowerCase() == val) {
this.classList.add('selectedCharacter');
} else {
this.classList.remove('selectedCharacter');
}
});
return this;
};
$.fn.alphaClear = function (val) {
return this.alphaValue('');
};
});

24
dashboard-ui/scripts/channelitems.js
View file

@ -247,32 +247,8 @@
function updateFilterControls(page) {
var query = getQuery(page);
$('.alphabetPicker', page).alphaValue(query.NameStartsWithOrGreater);
}
pageIdOn('pageinit', "channelItemsPage", function () {
var page = this;
$('.alphabetPicker', this).on('alphaselect', function (e, character) {
var query = getQuery(page);
query.NameStartsWithOrGreater = character;
query.StartIndex = 0;
reloadItems(page);
}).on('alphaclear', function (e) {
var query = getQuery(page);
query.NameStartsWithOrGreater = '';
reloadItems(page);
});
});
pageIdOn('pagebeforeshow', "channelItemsPage", function () {
var page = this;

41
dashboard-ui/scripts/itemlistpage.js
View file

@ -1,4 +1,4 @@
define(['libraryBrowser', 'jQuery'], function (libraryBrowser, $) {
define(['libraryBrowser', 'jQuery', 'alphaPicker'], function (libraryBrowser, $, alphaPicker) {
return function (view, params) {
@ -237,13 +237,6 @@
});
}
function updateFilterControls() {
var query = getQuery();
$('.alphabetPicker', view).alphaValue(query.NameStartsWithOrGreater);
}
function onListItemClick(e) {
var query = getQuery();
@ -257,28 +250,38 @@
}
}
$('.alphabetPicker', view).on('alphaselect', function (e, character) {
var alphaPickerElement = view.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery();
query.NameStartsWithOrGreater = character;
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(view);
}).on('alphaclear', function (e) {
var query = getQuery();
query.NameStartsWithOrGreater = '';
reloadItems(view);
});
self.alphaPicker = new alphaPicker({
element: alphaPickerElement
});
$(view).on('click', '.mediaItem', onListItemClick);
function updateFilterControls() {
var query = getQuery();
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
view.addEventListener('viewbeforeshow', function (e) {
reloadItems(view);
updateFilterControls();
LibraryMenu.setBackButtonVisible(params.context);
});
view.addEventListener('viewdestroy', function (e) {
if (self.alphaPicker) {
self.alphaPicker.destroy();
}
});
};
});

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

@ -1593,7 +1593,7 @@
cardProgress.innerHTML = progressHtml;
}
else {
cardProgress = card.querySelector('.cardFooter');
cardProgress = card.querySelector('.cardProgress');
if (cardProgress) {
cardProgress.parentNode.removeChild(cardProgress);
}

20
dashboard-ui/scripts/mediaplayer-video.js
View file

@ -432,12 +432,28 @@
nowPlayingTabButtons[i].addEventListener('click', onTabButtonClick);
}
elem.querySelector('.chapterCard').addEventListener('click', function () {
elem.addEventListener('click', function (e) {
self.seek(parseInt(this.getAttribute('data-position')));
var chapterCard = parentWithClass(e.target, 'chapterCard');
if (chapterCard) {
self.seek(parseInt(chapterCard.getAttribute('data-position')));
}
});
};
function parentWithClass(elem, className) {
while (!elem.classList || !elem.classList.contains(className)) {
elem = elem.parentNode;
if (!elem) {
return null;
}
}
return elem;
}
function getNowPlayingTabsHtml(item) {
var html = '';

21
dashboard-ui/scripts/movies.js
View file

@ -1,4 +1,4 @@
define(['jQuery'], function ($) {
define(['jQuery', 'alphaPicker'], function ($, alphaPicker) {
return function (view, params, tabContent) {
@ -270,25 +270,22 @@
var query = getQuery(context);
$('.alphabetPicker', context).alphaValue(query.NameStartsWithOrGreater);
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
function initPage(context) {
$('.alphabetPicker', context).on('alphaselect', function (e, character) {
var alphaPickerElement = context.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(context);
query.NameStartsWithOrGreater = character;
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(context);
});
}).on('alphaclear', function (e) {
var query = getQuery(context);
query.NameStartsWithOrGreater = '';
reloadItems(context);
self.alphaPicker = new alphaPicker({
element: alphaPickerElement
});
context.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {

23
dashboard-ui/scripts/movietrailers.js
View file

@ -1,4 +1,4 @@
define(['jQuery'], function ($) {
define(['jQuery', 'alphaPicker'], function ($, alphaPicker) {
var data = {};
@ -159,25 +159,22 @@
var query = getQuery(tabContent);
$('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater);
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
function initPage(page, tabContent) {
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
var query = getQuery(page);
query.NameStartsWithOrGreater = character;
var alphaPickerElement = tabContent.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
});
}).on('alphaclear', function (e) {
var query = getQuery(page);
query.NameStartsWithOrGreater = '';
reloadItems(tabContent);
self.alphaPicker = new alphaPicker({
element: alphaPickerElement
});
tabContent.querySelector('.itemsContainer').addEventListener('needsrefresh', function () {

23
dashboard-ui/scripts/musicalbumartists.js
View file

@ -1,4 +1,4 @@
define(['jQuery'], function ($) {
define(['jQuery', 'alphaPicker'], function ($, alphaPicker) {
return function (view, params, tabContent) {
@ -156,25 +156,20 @@
var query = getQuery(tabContent);
$('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater);
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
var alphaPickerElement = tabContent.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = character;
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
});
}).on('alphaclear', function (e) {
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = '';
reloadItems(tabContent);
self.alphaPicker = new alphaPicker({
element: alphaPickerElement
});
self.renderTab = function () {

31
dashboard-ui/scripts/musicalbums.js
View file

@ -1,4 +1,4 @@
define(['jQuery'], function ($) {
define(['jQuery', 'alphaPicker'], function ($, alphaPicker) {
return function (view, params, tabContent) {
@ -209,33 +209,20 @@
var query = getQuery(page);
$('.alphabetPicker', page).alphaValue(query.NameStartsWithOrGreater);
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
var alphaPickerElement = tabContent.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(tabContent);
if (query.SortBy.indexOf('AlbumArtist') == -1) {
query.NameStartsWithOrGreater = character;
query.AlbumArtistStartsWithOrGreater = '';
} else {
query.AlbumArtistStartsWithOrGreater = character;
query.NameStartsWithOrGreater = '';
}
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
});
}).on('alphaclear', function (e) {
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = '';
query.AlbumArtistStartsWithOrGreater = '';
reloadItems(tabContent);
self.alphaPicker = new alphaPicker({
element: alphaPickerElement
});
self.renderTab = function () {

28
dashboard-ui/scripts/musicartists.js
View file

@ -1,4 +1,4 @@
define(['jQuery'], function ($) {
define(['jQuery', 'alphaPicker'], function ($, alphaPicker) {
return function (view, params, tabContent) {
@ -156,27 +156,23 @@
var query = getQuery(tabContent);
$('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater);
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
var alphaPickerElement = tabContent.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = character;
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
}).on('alphaclear', function (e) {
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = '';
reloadItems(tabContent);
});
self.renderTab = function () {
self.alphaPicker = new alphaPicker({
element: alphaPickerElement
});
self.renderTab = function () {
reloadItems(tabContent);
};

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

@ -1792,6 +1792,7 @@ var AppInfo = {};
define("libjass", [bowerPath + "/libjass/libjass", "css!" + bowerPath + "/libjass/libjass"], returnFirstDependency);
define("emby-button", [embyWebComponentsBowerPath + "/emby-button/emby-button"], returnFirstDependency);
define("alphaPicker", [embyWebComponentsBowerPath + "/alphapicker/alphapicker"], returnFirstDependency);
define("paper-icon-button-light", [embyWebComponentsBowerPath + "/emby-button/paper-icon-button-light"]);
define("emby-input", [embyWebComponentsBowerPath + "/emby-input/emby-input"], returnFirstDependency);
@ -2582,7 +2583,7 @@ var AppInfo = {};
defineRoute({
path: '/itemlist.html',
dependencies: ['paper-checkbox', 'scripts/alphapicker'],
dependencies: ['paper-checkbox'],
autoFocus: false,
controller: 'scripts/itemlistpage',
transition: 'fade'
@ -2744,7 +2745,7 @@ var AppInfo = {};
defineRoute({
path: '/movies.html',
dependencies: ['paper-checkbox', 'scripts/alphapicker', 'emby-button'],
dependencies: ['paper-checkbox', 'emby-button'],
autoFocus: false,
controller: 'scripts/moviesrecommended',
transition: 'fade'
@ -2752,7 +2753,7 @@ var AppInfo = {};
defineRoute({
path: '/music.html',
dependencies: ['scripts/alphapicker'],
dependencies: [],
controller: 'scripts/musicrecommended',
autoFocus: false,
transition: 'fade'

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

@ -1,4 +1,4 @@
define(['libraryBrowser', 'scripts/alphapicker', 'scrollStyles'], function (libraryBrowser) {
define(['libraryBrowser', 'scrollStyles'], function (libraryBrowser) {
return function (view, params) {

22
dashboard-ui/scripts/tvshows.js
View file

@ -1,4 +1,4 @@
define(['events', 'libraryBrowser', 'imageLoader', 'jQuery'], function (events, libraryBrowser, imageLoader, $) {
define(['events', 'libraryBrowser', 'imageLoader', 'jQuery', 'alphaPicker'], function (events, libraryBrowser, imageLoader, $, alphaPicker) {
return function (view, params, tabContent) {
@ -187,26 +187,22 @@
function updateFilterControls(tabContent) {
var query = getQuery(tabContent);
$('.alphabetPicker', tabContent).alphaValue(query.NameStartsWithOrGreater);
self.alphaPicker.value(query.NameStartsWithOrGreater);
}
function initPage(tabContent) {
$('.alphabetPicker', tabContent).on('alphaselect', function (e, character) {
var alphaPickerElement = tabContent.querySelector('.alphaPicker');
alphaPickerElement.addEventListener('alphavaluechanged', function (e) {
var newValue = e.detail.value;
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = character;
query.NameStartsWithOrGreater = newValue;
query.StartIndex = 0;
reloadItems(tabContent);
});
}).on('alphaclear', function (e) {
var query = getQuery(tabContent);
query.NameStartsWithOrGreater = '';
getQuery(tabContent).StartIndex = 0;
reloadItems(tabContent);
self.alphaPicker = new alphaPicker({
element: alphaPickerElement
});
tabContent.querySelector('.btnFilter').addEventListener('click', function () {