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

Merge pull request #1569 from Camc314/migrate-to-ES6-16

Migration of Auth to ES6 modules
This commit is contained in:
dkanada 2020-07-20 09:06:31 +09:00 committed by GitHub
commit 08aadfe935
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 122 additions and 77 deletions

View file

@ -1,14 +1,20 @@
define(['appSettings', 'loading', 'browser', 'globalize', 'emby-button'], function(appSettings, loading, browser, globalize) {
'use strict';
import appSettings from 'appSettings';
import loading from 'loading';
import browser from 'browser';
import globalize from 'globalize';
import 'emby-button';
/* eslint-disable indent */
function handleConnectionResult(page, result) {
loading.hide();
switch (result.State) {
case 'SignedIn':
var apiClient = result.ApiClient;
case 'SignedIn': {
const apiClient = result.ApiClient;
Dashboard.onServerChanged(apiClient.getCurrentUserId(), apiClient.accessToken(), apiClient);
Dashboard.navigate('home.html');
break;
}
case 'ServerSignIn':
Dashboard.navigate('login.html?serverid=' + result.Servers[0].Id, false, 'none');
break;
@ -30,7 +36,7 @@ define(['appSettings', 'loading', 'browser', 'globalize', 'emby-button'], functi
function submitServer(page) {
loading.show();
var host = page.querySelector('#txtServerHost').value;
const host = page.querySelector('#txtServerHost').value;
ConnectionManager.connectToAddress(host, {
enableAutoLogin: appSettings.enableAutoLogin()
}).then(function(result) {
@ -42,11 +48,11 @@ define(['appSettings', 'loading', 'browser', 'globalize', 'emby-button'], functi
});
}
return function(view, params) {
export default function(view, params) {
view.querySelector('.addServerForm').addEventListener('submit', onServerSubmit);
view.querySelector('.btnCancel').addEventListener('click', goBack);
require(['autoFocuser'], function (autoFocuser) {
import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(view);
});
@ -57,9 +63,10 @@ define(['appSettings', 'loading', 'browser', 'globalize', 'emby-button'], functi
}
function goBack() {
require(['appRouter'], function(appRouter) {
import('appRouter').then(({default: appRouter}) => {
appRouter.back();
});
}
};
});
}
/* eslint-enable indent */

View file

@ -1,5 +1,6 @@
define(['globalize'], function (globalize) {
'use strict';
import globalize from 'globalize';
/* eslint-disable indent */
function processForgotPasswordResult(result) {
if ('ContactAdmin' == result.Action) {
@ -17,7 +18,7 @@ define(['globalize'], function (globalize) {
}
if ('PinCode' == result.Action) {
var msg = globalize.translate('MessageForgotPasswordFileCreated');
let msg = globalize.translate('MessageForgotPasswordFileCreated');
msg += '<br/>';
msg += '<br/>';
msg += 'Enter PIN here to finish Password Reset<br/>';
@ -34,7 +35,7 @@ define(['globalize'], function (globalize) {
}
}
return function (view, params) {
export default function (view, params) {
function onSubmit(e) {
ApiClient.ajax({
type: 'POST',
@ -49,5 +50,6 @@ define(['globalize'], function (globalize) {
}
view.querySelector('form').addEventListener('submit', onSubmit);
};
});
}
/* eslint-enable indent */

View file

@ -1,9 +1,10 @@
define(['globalize'], function (globalize) {
'use strict';
import globalize from 'globalize';
/* eslint-disable indent */
function processForgotPasswordResult(result) {
if (result.Success) {
var msg = globalize.translate('MessagePasswordResetForUsers');
let msg = globalize.translate('MessagePasswordResetForUsers');
msg += '<br/>';
msg += '<br/>';
msg += result.UsersReset.join('<br/>');
@ -22,7 +23,7 @@ define(['globalize'], function (globalize) {
});
}
return function (view, params) {
export default function (view, params) {
function onSubmit(e) {
ApiClient.ajax({
type: 'POST',
@ -37,5 +38,6 @@ define(['globalize'], function (globalize) {
}
view.querySelector('form').addEventListener('submit', onSubmit);
};
});
}
/* eslint-enable indent */

View file

@ -1,14 +1,24 @@
define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layoutManager', 'browser', 'globalize', 'cardStyle', 'emby-checkbox'], function (appHost, appSettings, dom, connectionManager, loading, layoutManager, browser, globalize) {
'use strict';
import appHost from 'apphost';
import appSettings from 'appSettings';
import dom from 'dom';
import connectionManager from 'connectionManager';
import loading from 'loading';
import layoutManager from 'layoutManager';
import browser from 'browser';
import globalize from 'globalize';
import 'cardStyle';
import 'emby-checkbox';
var enableFocusTransform = !browser.slow && !browser.edge;
/* eslint-disable indent */
const enableFocusTransform = !browser.slow && !browser.edge;
function authenticateUserByName(page, apiClient, username, password) {
loading.show();
apiClient.authenticateUserByName(username, password).then(function (result) {
var user = result.User;
var serverId = getParameterByName('serverid');
var newUrl;
const user = result.User;
const serverId = getParameterByName('serverid');
let newUrl;
if (user.Policy.IsAdministrator && !serverId) {
newUrl = 'dashboard.html';
@ -26,7 +36,7 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
const UnauthorizedOrForbidden = [401, 403];
if (UnauthorizedOrForbidden.includes(response.status)) {
require(['toast'], function (toast) {
import('toast').then(({default: toast}) => {
const messageKey = response.status === 401 ? 'MessageInvalidUser' : 'MessageUnauthorizedUser';
toast(globalize.translate(messageKey));
});
@ -58,23 +68,23 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
}
}
var metroColors = ['#6FBD45', '#4BB3DD', '#4164A5', '#E12026', '#800080', '#E1B222', '#008040', '#0094FF', '#FF00C7', '#FF870F', '#7F0037'];
const metroColors = ['#6FBD45', '#4BB3DD', '#4164A5', '#E12026', '#800080', '#E1B222', '#008040', '#0094FF', '#FF00C7', '#FF870F', '#7F0037'];
function getRandomMetroColor() {
var index = Math.floor(Math.random() * (metroColors.length - 1));
const index = Math.floor(Math.random() * (metroColors.length - 1));
return metroColors[index];
}
function getMetroColor(str) {
if (str) {
var character = String(str.substr(0, 1).charCodeAt());
var sum = 0;
const character = String(str.substr(0, 1).charCodeAt());
let sum = 0;
for (var i = 0; i < character.length; i++) {
for (let i = 0; i < character.length; i++) {
sum += parseInt(character.charAt(i));
}
var index = String(sum).substr(-1);
const index = String(sum).substr(-1);
return metroColors[index];
}
@ -82,13 +92,13 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
}
function loadUserList(context, apiClient, users) {
var html = '';
let html = '';
for (var i = 0; i < users.length; i++) {
var user = users[i];
for (let i = 0; i < users.length; i++) {
const user = users[i];
// TODO move card creation code to Card component
var cssClass = 'card squareCard scalableCard squareCard-scalable';
let cssClass = 'card squareCard scalableCard squareCard-scalable';
if (layoutManager.tv) {
cssClass += ' show-focus';
@ -98,13 +108,13 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
}
}
var cardBoxCssClass = 'cardBox cardBox-bottompadded';
const cardBoxCssClass = 'cardBox cardBox-bottompadded';
html += '<button type="button" class="' + cssClass + '">';
html += '<div class="' + cardBoxCssClass + '">';
html += '<div class="cardScalable">';
html += '<div class="cardPadder cardPadder-square"></div>';
html += '<div class="cardContent" data-haspw="' + user.HasPassword + '" data-username="' + user.Name + '" data-userid="' + user.Id + '">';
var imgUrl;
let imgUrl;
if (user.PrimaryImageTag) {
imgUrl = apiClient.getUserImageUrl(user.Id, {
@ -114,7 +124,7 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
});
html += '<div class="cardImageContainer coveredImage coveredImage-noScale" style="background-image:url(\'' + imgUrl + "');\"></div>";
} else {
var background = getMetroColor(user.Id);
const background = getMetroColor(user.Id);
imgUrl = 'assets/img/avatar.png';
html += '<div class="cardImageContainer coveredImage coveredImage-noScale" style="background-image:url(\'' + imgUrl + "');background-color:" + background + ';"></div>';
}
@ -131,9 +141,9 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
context.querySelector('#divUsers').innerHTML = html;
}
return function (view, params) {
export default function (view, params) {
function getApiClient() {
var serverId = params.serverid;
const serverId = params.serverid;
if (serverId) {
return connectionManager.getOrCreateApiClient(serverId);
@ -147,20 +157,20 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
view.querySelector('.manualLoginForm').classList.add('hide');
view.querySelector('.btnManual').classList.remove('hide');
require(['autoFocuser'], function (autoFocuser) {
import('autoFocuser').then(({default: autoFocuser}) => {
autoFocuser.autoFocus(view);
});
}
view.querySelector('#divUsers').addEventListener('click', function (e) {
var card = dom.parentWithClass(e.target, 'card');
var cardContent = card ? card.querySelector('.cardContent') : null;
const card = dom.parentWithClass(e.target, 'card');
const cardContent = card ? card.querySelector('.cardContent') : null;
if (cardContent) {
var context = view;
var id = cardContent.getAttribute('data-userid');
var name = cardContent.getAttribute('data-username');
var haspw = cardContent.getAttribute('data-haspw');
const context = view;
const id = cardContent.getAttribute('data-userid');
const name = cardContent.getAttribute('data-username');
const haspw = cardContent.getAttribute('data-haspw');
if (id === 'manual') {
context.querySelector('#txtManualName').value = '';
@ -176,7 +186,7 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
});
view.querySelector('.manualLoginForm').addEventListener('submit', function (e) {
appSettings.enableAutoLogin(view.querySelector('.chkRememberLogin').checked);
var apiClient = getApiClient();
const apiClient = getApiClient();
authenticateUserByName(view, apiClient, view.querySelector('#txtManualName').value, view.querySelector('#txtManualPassword').value);
e.preventDefault();
return false;
@ -199,7 +209,7 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
view.querySelector('.btnSelectServer').classList.add('hide');
}
var apiClient = getApiClient();
const apiClient = getApiClient();
apiClient.getPublicUsers().then(function (users) {
if (users.length) {
showVisualForm();
@ -215,5 +225,6 @@ define(['apphost', 'appSettings', 'dom', 'connectionManager', 'loading', 'layout
view.querySelector('.disclaimer').textContent = options.LoginDisclaimer || '';
});
});
};
});
}
/* eslint-enable indent */

View file

@ -1,10 +1,27 @@
define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focusManager', 'connectionManager', 'globalize', 'actionsheet', 'dom', 'browser', 'material-icons', 'flexStyles', 'emby-scroller', 'emby-itemscontainer', 'cardStyle', 'emby-button'], function (loading, appRouter, layoutManager, appSettings, appHost, focusManager, connectionManager, globalize, actionSheet, dom, browser) {
'use strict';
import loading from 'loading';
import appRouter from 'appRouter';
import layoutManager from 'layoutManager';
import appSettings from 'appSettings';
import appHost from 'apphost';
import focusManager from 'focusManager';
import connectionManager from 'connectionManager';
import globalize from 'globalize';
import actionSheet from 'actionsheet';
import dom from 'dom';
import browser from 'browser';
import 'material-icons';
import 'flexStyles';
import 'emby-scroller';
import 'emby-itemscontainer';
import 'cardStyle';
import 'emby-button';
var enableFocusTransform = !browser.slow && !browser.edge;
/* eslint-disable indent */
const enableFocusTransform = !browser.slow && !browser.edge;
function renderSelectServerItems(view, servers) {
var items = servers.map(function (server) {
const items = servers.map(function (server) {
return {
name: server.Name,
showIcon: true,
@ -14,8 +31,8 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
server: server
};
});
var html = items.map(function (item) {
var cardImageContainer;
let html = items.map(function (item) {
let cardImageContainer;
if (item.showIcon) {
cardImageContainer = '<span class="cardImageIcon material-icons ' + item.icon + '"></span>';
@ -25,7 +42,7 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
// TODO move card creation code to Card component
var cssClass = 'card overflowSquareCard loginSquareCard scalableCard overflowSquareCard-scalable';
let cssClass = 'card overflowSquareCard loginSquareCard scalableCard overflowSquareCard-scalable';
if (layoutManager.tv) {
cssClass += ' show-focus';
@ -35,10 +52,10 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
}
}
var cardBoxCssClass = 'cardBox';
const cardBoxCssClass = 'cardBox';
var innerOpening = '<div class="' + cardBoxCssClass + '">';
var cardContainer = '';
const innerOpening = '<div class="' + cardBoxCssClass + '">';
let cardContainer = '';
cardContainer += '<button raised class="' + cssClass + '" style="display:inline-block;" data-id="' + item.id + '" data-url="' + (item.url || '') + '" data-cardtype="' + item.cardType + '">';
cardContainer += innerOpening;
cardContainer += '<div class="cardScalable">';
@ -55,7 +72,7 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
cardContainer += '</div></div></button>';
return cardContainer;
}).join('');
var itemsContainer = view.querySelector('.servers');
const itemsContainer = view.querySelector('.servers');
if (!items.length) {
html = '<p>' + globalize.translate('MessageNoServersAvailable') + '</p>';
@ -89,7 +106,7 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
}
function alertTextWithOptions(options) {
require(['alert'], function (alert) {
import('alert').then(({default: alert}) => {
alert(options);
});
}
@ -98,14 +115,14 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
alertText(globalize.translate('MessageUnableToConnectToServer'));
}
return function (view, params) {
export default function (view, params) {
function connectToServer(server) {
loading.show();
connectionManager.connectToServer(server, {
enableAutoLogin: appSettings.enableAutoLogin()
}).then(function (result) {
loading.hide();
var apiClient = result.ApiClient;
const apiClient = result.ApiClient;
switch (result.State) {
case 'SignedIn':
@ -140,7 +157,7 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
}
function onServerClick(server) {
var menuItems = [];
const menuItems = [];
menuItems.push({
name: globalize.translate('Connect'),
id: 'connect'
@ -178,10 +195,10 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
connectionManager.getAvailableServers().then(onServersRetrieved);
}
var servers;
let servers;
updatePageStyle(view, params);
view.addEventListener('viewshow', function (e) {
var isRestored = e.detail.isRestored;
const isRestored = e.detail.isRestored;
appRouter.setTitle(null);
if (!isRestored) {
@ -189,20 +206,21 @@ define(['loading', 'appRouter', 'layoutManager', 'appSettings', 'apphost', 'focu
}
});
view.querySelector('.servers').addEventListener('click', function (e) {
var card = dom.parentWithClass(e.target, 'card');
const card = dom.parentWithClass(e.target, 'card');
if (card) {
var url = card.getAttribute('data-url');
const url = card.getAttribute('data-url');
if (url) {
appRouter.show(url);
} else {
var id = card.getAttribute('data-id');
const id = card.getAttribute('data-id');
onServerClick(servers.filter(function (s) {
return s.Id === id;
})[0]);
}
}
});
};
});
}
/* eslint-enable indent */