mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
continue jquery removal
This commit is contained in:
Luke Pulverenti
parent
2dba35a875
commit
5b0ece51d2
15 changed files with 692 additions and 595 deletions
|
|
@ -1,45 +1,16 @@
|
|||
define(['jQuery', 'paper-icon-button-light'], function ($) {
|
||||
define(['paper-icon-button-light'], function () {
|
||||
|
||||
function connectToServer(page, server) {
|
||||
function updatePageStyle(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
ConnectionManager.connectToServer(server).then(function (result) {
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
||||
var apiClient = result.ApiClient;
|
||||
|
||||
switch (result.State) {
|
||||
|
||||
case MediaBrowser.ConnectionState.SignedIn:
|
||||
{
|
||||
Dashboard.onServerChanged(apiClient.getCurrentUserId(), apiClient.accessToken(), apiClient);
|
||||
Dashboard.navigate('home.html');
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ServerSignIn:
|
||||
{
|
||||
Dashboard.onServerChanged(null, null, apiClient);
|
||||
Dashboard.navigate('login.html?serverid=' + result.Servers[0].Id);
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ServerUpdateNeeded:
|
||||
{
|
||||
Dashboard.alert(alert({
|
||||
|
||||
text: Globalize.translate('core#ServerUpdateNeeded', 'https://emby.media'),
|
||||
html: Globalize.translate('core#ServerUpdateNeeded', '<a href="https://emby.media">https://emby.media</a>')
|
||||
|
||||
}));
|
||||
}
|
||||
break;
|
||||
default:
|
||||
showServerConnectionFailure();
|
||||
break;
|
||||
}
|
||||
|
||||
});
|
||||
if (getParameterByName('showuser') == '1') {
|
||||
page.classList.add('libraryPage');
|
||||
page.classList.add('noSecondaryNavPage');
|
||||
page.classList.remove('standalonePage');
|
||||
} else {
|
||||
page.classList.add('standalonePage');
|
||||
page.classList.remove('noSecondaryNavPage');
|
||||
page.classList.remove('libraryPage');
|
||||
}
|
||||
}
|
||||
|
||||
function showServerConnectionFailure() {
|
||||
|
|
@ -84,280 +55,326 @@
|
|||
function renderServers(page, servers) {
|
||||
|
||||
if (servers.length) {
|
||||
$('.noServersMessage', page).hide();
|
||||
$('.serverList', page).show();
|
||||
page.querySelector('.noServersMessage').classList.add('hide');
|
||||
page.querySelector('.serverList').classList.remove('hide');
|
||||
} else {
|
||||
$('.noServersMessage', page).show();
|
||||
$('.serverList', page).hide();
|
||||
page.querySelector('.serverList').classList.add('hide');
|
||||
page.querySelector('.noServersMessage').classList.remove('hide');
|
||||
}
|
||||
|
||||
var html = '';
|
||||
|
||||
html += servers.map(getServerHtml).join('');
|
||||
|
||||
var elem = $('.serverList', page).html(html);
|
||||
|
||||
$('.lnkServer', elem).on('click', function () {
|
||||
|
||||
var item = $(this).parents('.serverItem')[0];
|
||||
var id = item.getAttribute('data-id');
|
||||
|
||||
var server = servers.filter(function (s) {
|
||||
return s.Id == id;
|
||||
})[0];
|
||||
|
||||
connectToServer(page, server);
|
||||
|
||||
});
|
||||
|
||||
$('.btnServerMenu', elem).on('click', function () {
|
||||
showServerMenu(this);
|
||||
});
|
||||
page.querySelector('.serverList').innerHTML = html;
|
||||
}
|
||||
|
||||
function showGeneralError() {
|
||||
|
||||
// Need the timeout because jquery mobile will not show a popup if there's currently already one in the process of closing
|
||||
setTimeout(function () {
|
||||
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
Dashboard.alert({
|
||||
message: Globalize.translate('DefaultErrorMessage')
|
||||
});
|
||||
}, 300);
|
||||
|
||||
}
|
||||
|
||||
function acceptInvitation(page, id) {
|
||||
|
||||
Dashboard.showModalLoadingMsg();
|
||||
|
||||
// Add/Update connect info
|
||||
ConnectionManager.acceptServer(id).then(function () {
|
||||
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
loadPage(page);
|
||||
|
||||
}, function () {
|
||||
|
||||
showGeneralError();
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
Dashboard.alert({
|
||||
message: Globalize.translate('DefaultErrorMessage')
|
||||
});
|
||||
}
|
||||
|
||||
function deleteServer(page, serverId) {
|
||||
function parentWithClass(elem, className) {
|
||||
|
||||
Dashboard.showModalLoadingMsg();
|
||||
while (!elem.classList || !elem.classList.contains(className)) {
|
||||
elem = elem.parentNode;
|
||||
|
||||
// Add/Update connect info
|
||||
ConnectionManager.deleteServer(serverId).then(function () {
|
||||
if (!elem) {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
|
||||
loadPage(page);
|
||||
|
||||
}, function () {
|
||||
|
||||
showGeneralError();
|
||||
|
||||
});
|
||||
return elem;
|
||||
}
|
||||
|
||||
function rejectInvitation(page, id) {
|
||||
return function (view, params) {
|
||||
|
||||
Dashboard.showModalLoadingMsg();
|
||||
var cachedServers;
|
||||
|
||||
// Add/Update connect info
|
||||
ConnectionManager.rejectServer(id).then(function () {
|
||||
function connectToServer(page, server) {
|
||||
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
loadPage(page);
|
||||
ConnectionManager.connectToServer(server).then(function (result) {
|
||||
|
||||
}, function () {
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
||||
showGeneralError();
|
||||
var apiClient = result.ApiClient;
|
||||
|
||||
});
|
||||
}
|
||||
switch (result.State) {
|
||||
|
||||
function showServerMenu(elem) {
|
||||
case MediaBrowser.ConnectionState.SignedIn:
|
||||
{
|
||||
Dashboard.onServerChanged(apiClient.getCurrentUserId(), apiClient.accessToken(), apiClient);
|
||||
Dashboard.navigate('home.html');
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ServerSignIn:
|
||||
{
|
||||
Dashboard.onServerChanged(null, null, apiClient);
|
||||
Dashboard.navigate('login.html?serverid=' + result.Servers[0].Id);
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ServerUpdateNeeded:
|
||||
{
|
||||
Dashboard.alert(alert({
|
||||
|
||||
var card = $(elem).parents('.serverItem');
|
||||
var page = $(elem).parents('.page');
|
||||
var serverId = card.attr('data-id');
|
||||
text: Globalize.translate('core#ServerUpdateNeeded', 'https://emby.media'),
|
||||
html: Globalize.translate('core#ServerUpdateNeeded', '<a href="https://emby.media">https://emby.media</a>')
|
||||
|
||||
var menuItems = [];
|
||||
|
||||
menuItems.push({
|
||||
name: Globalize.translate('ButtonDelete'),
|
||||
id: 'delete',
|
||||
ironIcon: 'delete'
|
||||
});
|
||||
|
||||
require(['actionsheet'], function (actionsheet) {
|
||||
|
||||
actionsheet.show({
|
||||
items: menuItems,
|
||||
positionTo: elem,
|
||||
callback: function (id) {
|
||||
|
||||
switch (id) {
|
||||
|
||||
case 'delete':
|
||||
deleteServer(page, serverId);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}));
|
||||
}
|
||||
break;
|
||||
default:
|
||||
showServerConnectionFailure();
|
||||
break;
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function acceptInvitation(page, id) {
|
||||
|
||||
Dashboard.showModalLoadingMsg();
|
||||
|
||||
// Add/Update connect info
|
||||
ConnectionManager.acceptServer(id).then(function () {
|
||||
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
loadPage(page);
|
||||
|
||||
}, function () {
|
||||
|
||||
showGeneralError();
|
||||
});
|
||||
}
|
||||
|
||||
function deleteServer(page, serverId) {
|
||||
|
||||
Dashboard.showModalLoadingMsg();
|
||||
|
||||
// Add/Update connect info
|
||||
ConnectionManager.deleteServer(serverId).then(function () {
|
||||
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
|
||||
loadPage(page);
|
||||
|
||||
}, function () {
|
||||
|
||||
showGeneralError();
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function rejectInvitation(page, id) {
|
||||
|
||||
Dashboard.showModalLoadingMsg();
|
||||
|
||||
// Add/Update connect info
|
||||
ConnectionManager.rejectServer(id).then(function () {
|
||||
|
||||
Dashboard.hideModalLoadingMsg();
|
||||
|
||||
loadPage(page);
|
||||
|
||||
}, function () {
|
||||
|
||||
showGeneralError();
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function showServerMenu(elem) {
|
||||
|
||||
var card = parentWithClass(elem, 'serverItem');
|
||||
var page = parentWithClass(elem, 'page');
|
||||
var serverId = card.getAttribute('data-id');
|
||||
|
||||
var menuItems = [];
|
||||
|
||||
menuItems.push({
|
||||
name: Globalize.translate('ButtonDelete'),
|
||||
id: 'delete',
|
||||
ironIcon: 'delete'
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
require(['actionsheet'], function (actionsheet) {
|
||||
|
||||
function showPendingInviteMenu(elem) {
|
||||
actionsheet.show({
|
||||
items: menuItems,
|
||||
positionTo: elem,
|
||||
callback: function (id) {
|
||||
|
||||
var card = $(elem).parents('.inviteItem');
|
||||
var page = $(elem).parents('.page');
|
||||
var invitationId = card.attr('data-id');
|
||||
switch (id) {
|
||||
|
||||
var menuItems = [];
|
||||
|
||||
menuItems.push({
|
||||
name: Globalize.translate('ButtonAccept'),
|
||||
id: 'accept',
|
||||
ironIcon: 'add'
|
||||
});
|
||||
|
||||
menuItems.push({
|
||||
name: Globalize.translate('ButtonReject'),
|
||||
id: 'reject',
|
||||
ironIcon: 'cancel'
|
||||
});
|
||||
|
||||
require(['actionsheet'], function (actionsheet) {
|
||||
|
||||
actionsheet.show({
|
||||
items: menuItems,
|
||||
positionTo: elem,
|
||||
callback: function (id) {
|
||||
|
||||
switch (id) {
|
||||
|
||||
case 'accept':
|
||||
acceptInvitation(page, invitationId);
|
||||
break;
|
||||
case 'reject':
|
||||
rejectInvitation(page, invitationId);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
case 'delete':
|
||||
deleteServer(page, serverId);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function getPendingInviteHtml(invite) {
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<paper-icon-item class="inviteItem" data-id="' + invite.Id + '">';
|
||||
|
||||
html += '<paper-fab mini class="blue lnkServer" icon="wifi" item-icon></paper-fab>';
|
||||
|
||||
html += '<paper-item-body two-line>';
|
||||
|
||||
html += '<div>';
|
||||
html += invite.Name;
|
||||
html += '</div>';
|
||||
|
||||
html += '</paper-item-body>';
|
||||
|
||||
html += '<button is="paper-icon-button-light" class="btnInviteMenu"><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
|
||||
|
||||
html += '</paper-icon-item>';
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function renderInvitations(page, list) {
|
||||
|
||||
if (list.length) {
|
||||
$('.invitationSection', page).show();
|
||||
} else {
|
||||
$('.invitationSection', page).hide();
|
||||
}
|
||||
|
||||
var html = list.map(getPendingInviteHtml).join('');
|
||||
|
||||
var elem = $('.invitationList', page).html(html);
|
||||
|
||||
$('.btnInviteMenu', elem).on('click', function () {
|
||||
showPendingInviteMenu(this);
|
||||
});
|
||||
}
|
||||
|
||||
function loadInvitations(page) {
|
||||
|
||||
if (ConnectionManager.isLoggedIntoConnect()) {
|
||||
|
||||
ConnectionManager.getUserInvitations().then(function (list) {
|
||||
|
||||
renderInvitations(page, list);
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
renderInvitations(page, []);
|
||||
}
|
||||
|
||||
}
|
||||
function showPendingInviteMenu(elem) {
|
||||
|
||||
function loadPage(page) {
|
||||
var card = parentWithClass(elem, 'inviteItem');
|
||||
var page = parentWithClass(elem, 'page');
|
||||
var invitationId = card.getAttribute('data-id');
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
var menuItems = [];
|
||||
|
||||
ConnectionManager.getAvailableServers().then(function (servers) {
|
||||
menuItems.push({
|
||||
name: Globalize.translate('ButtonAccept'),
|
||||
id: 'accept',
|
||||
ironIcon: 'add'
|
||||
});
|
||||
|
||||
servers = servers.slice(0);
|
||||
menuItems.push({
|
||||
name: Globalize.translate('ButtonReject'),
|
||||
id: 'reject',
|
||||
ironIcon: 'cancel'
|
||||
});
|
||||
|
||||
renderServers(page, servers);
|
||||
require(['actionsheet'], function (actionsheet) {
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
actionsheet.show({
|
||||
items: menuItems,
|
||||
positionTo: elem,
|
||||
callback: function (id) {
|
||||
|
||||
switch (id) {
|
||||
|
||||
case 'accept':
|
||||
acceptInvitation(page, invitationId);
|
||||
break;
|
||||
case 'reject':
|
||||
rejectInvitation(page, invitationId);
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function getPendingInviteHtml(invite) {
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<paper-icon-item class="inviteItem" data-id="' + invite.Id + '">';
|
||||
|
||||
html += '<paper-fab mini class="blue lnkServer" icon="wifi" item-icon></paper-fab>';
|
||||
|
||||
html += '<paper-item-body two-line>';
|
||||
|
||||
html += '<div>';
|
||||
html += invite.Name;
|
||||
html += '</div>';
|
||||
|
||||
html += '</paper-item-body>';
|
||||
|
||||
html += '<button is="paper-icon-button-light" class="btnInviteMenu"><iron-icon icon="' + AppInfo.moreIcon + '"></iron-icon></button>';
|
||||
|
||||
html += '</paper-icon-item>';
|
||||
|
||||
return html;
|
||||
}
|
||||
|
||||
function renderInvitations(page, list) {
|
||||
|
||||
if (list.length) {
|
||||
page.querySelector('.invitationSection').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.invitationSection').classList.add('hide');
|
||||
}
|
||||
|
||||
var html = list.map(getPendingInviteHtml).join('');
|
||||
|
||||
page.querySelector('.invitationList').innerHTML = html;
|
||||
}
|
||||
|
||||
function loadInvitations(page) {
|
||||
|
||||
if (ConnectionManager.isLoggedIntoConnect()) {
|
||||
|
||||
ConnectionManager.getUserInvitations().then(function (list) {
|
||||
|
||||
renderInvitations(page, list);
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
renderInvitations(page, []);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function loadPage(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
ConnectionManager.getAvailableServers().then(function (servers) {
|
||||
|
||||
servers = servers.slice(0);
|
||||
cachedServers = servers;
|
||||
|
||||
renderServers(page, servers);
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
|
||||
loadInvitations(page);
|
||||
|
||||
if (ConnectionManager.isLoggedIntoConnect()) {
|
||||
page.querySelector('.connectLogin').classList.add('hide');
|
||||
} else {
|
||||
page.querySelector('.connectLogin').classList.remove('hide');
|
||||
}
|
||||
}
|
||||
|
||||
view.querySelector('.invitationList').addEventListener('click', function (e) {
|
||||
|
||||
var btnInviteMenu = parentWithClass(e.target, 'btnInviteMenu');
|
||||
if (btnInviteMenu) {
|
||||
showPendingInviteMenu(btnInviteMenu);
|
||||
}
|
||||
});
|
||||
view.querySelector('.serverList').addEventListener('click', function (e) {
|
||||
|
||||
var lnkServer = parentWithClass(e.target, 'lnkServer');
|
||||
if (lnkServer) {
|
||||
var item = parentWithClass(lnkServer, 'serverItem');
|
||||
var id = item.getAttribute('data-id');
|
||||
|
||||
var server = cachedServers.filter(function (s) {
|
||||
return s.Id == id;
|
||||
})[0];
|
||||
|
||||
connectToServer(page, server);
|
||||
}
|
||||
|
||||
var btnServerMenu = parentWithClass(e.target, 'btnServerMenu');
|
||||
if (btnServerMenu) {
|
||||
showServerMenu(btnServerMenu);
|
||||
}
|
||||
});
|
||||
|
||||
loadInvitations(page);
|
||||
|
||||
if (ConnectionManager.isLoggedIntoConnect()) {
|
||||
$('.connectLogin', page).hide();
|
||||
} else {
|
||||
$('.connectLogin', page).show();
|
||||
}
|
||||
}
|
||||
|
||||
function updatePageStyle(page) {
|
||||
|
||||
if (getParameterByName('showuser') == '1') {
|
||||
$(page).addClass('libraryPage').addClass('noSecondaryNavPage').removeClass('standalonePage');
|
||||
} else {
|
||||
$(page).removeClass('libraryPage').removeClass('noSecondaryNavPage').addClass('standalonePage');
|
||||
}
|
||||
}
|
||||
|
||||
pageIdOn('pagebeforeshow', "selectServerPage", function () {
|
||||
|
||||
var page = this;
|
||||
updatePageStyle(page);
|
||||
});
|
||||
|
||||
pageIdOn('pageshow', "selectServerPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
loadPage(page);
|
||||
});
|
||||
|
||||
view.addEventListener('viewbeforeshow', function () {
|
||||
updatePageStyle(this);
|
||||
});
|
||||
view.addEventListener('viewshow', function () {
|
||||
loadPage(this);
|
||||
});
|
||||
};
|
||||
});
|
||||
Loading…
Add table
Add a link
Reference in a new issue