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

285 lines
8.9 KiB
JavaScript
Raw Normal View History

2016-08-20 02:58:35 -04:00
define(['appSettings', 'cardStyle', 'emby-checkbox'], function (appSettings) {
2013-02-20 20:33:05 -05:00
2016-06-19 12:53:53 -04:00
function getApiClient() {
var serverId = getParameterByName('serverid');
if (serverId) {
return ConnectionManager.getOrCreateApiClient(serverId);
} else {
return ApiClient;
}
}
2016-05-17 13:44:17 -04:00
var LoginPage = {
2015-05-05 19:15:47 -04:00
2016-05-17 13:44:17 -04:00
showVisualForm: function (page) {
2016-06-18 13:26:42 -04:00
page.querySelector('.visualLoginForm').classList.remove('hide');
page.querySelector('.manualLoginForm').classList.add('hide');
2016-05-17 13:44:17 -04:00
},
2015-05-05 19:15:47 -04:00
2016-05-17 13:44:17 -04:00
getLastSeenText: function (lastActivityDate) {
2015-05-05 19:15:47 -04:00
2016-05-17 13:44:17 -04:00
if (!lastActivityDate) {
return "";
2015-12-14 10:43:03 -05:00
}
2014-02-23 22:27:13 -05:00
2016-05-17 13:44:17 -04:00
return "Last seen " + humane_date(lastActivityDate);
},
2013-02-20 20:33:05 -05:00
2016-05-17 13:44:17 -04:00
authenticateUserByName: function (page, apiClient, username, password) {
2014-02-23 22:27:13 -05:00
2016-05-17 13:44:17 -04:00
Dashboard.showLoadingMsg();
2013-07-08 12:13:21 -04:00
2016-05-17 13:44:17 -04:00
apiClient.authenticateUserByName(username, password).then(function (result) {
2013-07-08 12:13:21 -04:00
2016-05-17 13:44:17 -04:00
var user = result.User;
2013-07-08 12:13:21 -04:00
2016-05-17 13:44:17 -04:00
var serverId = getParameterByName('serverid');
2013-07-08 12:13:21 -04:00
2016-05-17 13:44:17 -04:00
var newUrl;
2013-07-08 12:13:21 -04:00
2016-05-17 13:44:17 -04:00
if (user.Policy.IsAdministrator && !serverId) {
newUrl = "dashboard.html";
2015-05-05 19:15:47 -04:00
} else {
2016-05-17 13:44:17 -04:00
newUrl = "home.html";
2015-05-05 19:15:47 -04:00
}
2015-05-05 19:15:47 -04:00
Dashboard.hideLoadingMsg();
2016-05-17 13:44:17 -04:00
Dashboard.onServerChanged(user.Id, result.AccessToken, apiClient);
Dashboard.navigate(newUrl);
2014-07-07 21:41:03 -04:00
2016-06-14 15:21:26 -04:00
}, function (response) {
2016-06-18 13:26:42 -04:00
page.querySelector('#txtManualName').value = '';
page.querySelector('#txtManualPassword').value = '';
2016-05-17 13:44:17 -04:00
Dashboard.hideLoadingMsg();
2013-02-20 20:33:05 -05:00
2016-06-14 15:21:26 -04:00
if (response.status == 401) {
2016-05-17 13:44:17 -04:00
require(['toast'], function (toast) {
toast(Globalize.translate('MessageInvalidUser'));
});
2016-06-14 15:21:26 -04:00
} else {
showServerConnectionFailure();
}
2016-05-17 13:44:17 -04:00
});
2013-02-20 20:33:05 -05:00
}
2016-05-17 13:44:17 -04:00
};
2013-07-15 21:36:18 -04:00
2016-06-14 15:21:26 -04:00
function showServerConnectionFailure() {
Dashboard.alert({
message: Globalize.translate("MessageUnableToConnectToServer"),
title: Globalize.translate("HeaderConnectionFailure")
});
}
2016-05-17 13:44:17 -04:00
function showManualForm(context, showCancel, focusPassword) {
2016-06-18 13:26:42 -04:00
2016-08-20 02:58:35 -04:00
context.querySelector('.chkRememberLogin').checked = appSettings.enableAutoLogin();
2016-06-18 13:26:42 -04:00
context.querySelector('.manualLoginForm').classList.remove('hide');
context.querySelector('.visualLoginForm').classList.add('hide');
2013-02-20 20:33:05 -05:00
2016-05-17 13:44:17 -04:00
if (focusPassword) {
2016-06-18 13:26:42 -04:00
context.querySelector('#txtManualPassword').focus();
2016-05-17 13:44:17 -04:00
} else {
2016-06-18 13:26:42 -04:00
context.querySelector('#txtManualName').focus();
2016-05-17 13:44:17 -04:00
}
2016-05-17 13:44:17 -04:00
if (showCancel) {
2016-06-18 13:26:42 -04:00
context.querySelector('.btnCancel').classList.remove('hide');
2016-05-17 13:44:17 -04:00
} else {
2016-06-18 13:26:42 -04:00
context.querySelector('.btnCancel').classList.add('hide');
2016-05-17 13:44:17 -04:00
}
}
2013-02-20 20:33:05 -05:00
var metroColors = ["#6FBD45", "#4BB3DD", "#4164A5", "#E12026", "#800080", "#E1B222", "#008040", "#0094FF", "#FF00C7", "#FF870F", "#7F0037"];
function getRandomMetroColor() {
var 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;
for (var i = 0; i < character.length; i++) {
sum += parseInt(character.charAt(i));
}
var index = String(sum).substr(-1);
return metroColors[index];
} else {
return getRandomMetroColor();
}
}
2016-05-17 13:44:17 -04:00
function loadUserList(context, apiClient, users) {
2013-02-20 20:33:05 -05:00
var html = "";
for (var i = 0, length = users.length; i < length; i++) {
var user = users[i];
2016-08-12 00:33:56 -04:00
html += '<div class="card squareCard scalableCard"><div class="cardBox cardBox-bottompadded visualCardBox">';
2013-02-20 20:33:05 -05:00
2014-07-26 13:30:15 -04:00
html += '<div class="cardScalable">';
2016-08-11 16:28:49 -04:00
html += '<div class="cardPadder cardPadder-square"></div>';
2014-07-26 13:30:15 -04:00
html += '<a class="cardContent" href="#" data-ajax="false" data-haspw="' + user.HasPassword + '" data-username="' + user.Name + '" data-userid="' + user.Id + '">';
2013-02-20 20:33:05 -05:00
2014-07-29 23:31:35 -04:00
var imgUrl;
2013-02-20 20:33:05 -05:00
if (user.PrimaryImageTag) {
2015-05-05 19:15:47 -04:00
imgUrl = apiClient.getUserImageUrl(user.Id, {
2014-07-26 13:30:15 -04:00
width: 300,
tag: user.PrimaryImageTag,
type: "Primary"
2013-02-20 20:33:05 -05:00
});
2016-08-20 02:27:48 -04:00
html += '<div class="cardImageContainer coveredImage coveredImage-noScale" style="background-image:url(\'' + imgUrl + '\');"></div>';
2013-04-25 19:28:01 -04:00
}
else {
var background = getMetroColor(user.Id);
2013-04-25 19:28:01 -04:00
2014-07-29 23:31:35 -04:00
imgUrl = 'css/images/logindefault.png';
2016-08-20 02:27:48 -04:00
html += '<div class="cardImageContainer coveredImage coveredImage-noScale" style="background-image:url(\'' + imgUrl + '\');background-color:' + background + ';"></div>';
2013-02-20 20:33:05 -05:00
}
2014-07-26 13:30:15 -04:00
html += '</a>';
html += '</div>';
2016-08-23 13:07:50 -04:00
html += '<div class="cardFooter visualCardBox-cardFooter">';
2014-07-26 13:30:15 -04:00
html += '<div class="cardText">' + user.Name + '</div>';
2013-04-25 19:28:01 -04:00
2016-08-09 01:10:29 -04:00
html += '<div class="cardText cardText-secondary">';
var lastSeen = LoginPage.getLastSeenText(user.LastActivityDate);
if (lastSeen != "") {
html += lastSeen;
}
else {
html += "&nbsp;";
}
2013-02-20 20:33:05 -05:00
html += '</div>';
2014-07-26 13:30:15 -04:00
html += '</div>';
html += '</div>';
2013-02-20 20:33:05 -05:00
2014-07-26 13:30:15 -04:00
html += '</div>';
2013-02-20 20:33:05 -05:00
}
2016-06-18 13:26:42 -04:00
context.querySelector('#divUsers').innerHTML = html;
}
2014-07-07 21:41:03 -04:00
2016-06-18 13:26:42 -04:00
function parentWithClass(elem, className) {
2014-07-07 21:41:03 -04:00
2016-06-18 13:26:42 -04:00
while (!elem.classList || !elem.classList.contains(className)) {
elem = elem.parentNode;
2013-02-20 20:33:05 -05:00
2016-06-18 13:26:42 -04:00
if (!elem) {
return null;
2014-07-07 21:41:03 -04:00
}
2016-06-18 13:26:42 -04:00
}
return elem;
2016-05-17 13:44:17 -04:00
}
2013-02-20 20:33:05 -05:00
2016-05-17 13:44:17 -04:00
return function (view, params) {
2013-07-08 12:13:21 -04:00
2016-05-17 13:44:17 -04:00
var self = this;
2015-08-29 14:07:02 -04:00
view.querySelector('#divUsers').addEventListener('click', function (e) {
2016-06-18 13:26:42 -04:00
var cardContent = parentWithClass(e.target, 'cardContent');
if (cardContent) {
var context = view;
var id = cardContent.getAttribute('data-userid');
var name = cardContent.getAttribute('data-username');
var haspw = cardContent.getAttribute('data-haspw');
if (id == 'manual') {
2016-07-12 13:17:15 -04:00
context.querySelector('#txtManualName').value = '';
2016-06-18 13:26:42 -04:00
showManualForm(context, true);
}
else if (haspw == 'false') {
LoginPage.authenticateUserByName(context, getApiClient(), name, '');
} else {
context.querySelector('#txtManualName').value = name;
context.querySelector('#txtManualPassword').value = '';
showManualForm(context, true, true);
}
}
});
view.querySelector('.manualLoginForm').addEventListener('submit', function (e) {
2016-06-19 12:53:53 -04:00
2016-08-20 02:58:35 -04:00
appSettings.enableAutoLogin(view.querySelector('.chkRememberLogin').checked);
2016-06-19 12:53:53 -04:00
var apiClient = getApiClient();
LoginPage.authenticateUserByName(view, apiClient, view.querySelector('#txtManualName').value, view.querySelector('#txtManualPassword').value);
2016-06-18 13:26:42 -04:00
e.preventDefault();
// Disable default form submission
return false;
});
2016-05-17 13:44:17 -04:00
view.querySelector('.btnForgotPassword').addEventListener('click', function () {
Dashboard.navigate('forgotpassword.html');
2015-05-05 19:15:47 -04:00
});
2013-02-20 20:33:05 -05:00
2016-05-17 13:44:17 -04:00
view.querySelector('.btnCancel').addEventListener('click', function () {
LoginPage.showVisualForm(view);
});
view.querySelector('.btnManual').addEventListener('click', function () {
2016-07-12 13:17:15 -04:00
view.querySelector('#txtManualName').value = '';
2016-05-17 13:44:17 -04:00
showManualForm(view, true);
});
view.addEventListener('viewshow', function (e) {
Dashboard.showLoadingMsg();
2016-06-19 12:53:53 -04:00
var apiClient = getApiClient();
apiClient.getPublicUsers().then(function (users) {
2016-05-17 13:44:17 -04:00
2016-06-19 12:53:53 -04:00
if (!users.length) {
2016-05-17 13:44:17 -04:00
2016-07-12 13:17:15 -04:00
view.querySelector('#txtManualName').value = '';
2016-06-19 12:53:53 -04:00
showManualForm(view, false, false);
2015-05-19 15:15:40 -04:00
2016-06-19 12:53:53 -04:00
} else {
2015-05-19 15:15:40 -04:00
2016-06-19 12:53:53 -04:00
LoginPage.showVisualForm(view);
loadUserList(view, apiClient, users);
}
2015-06-16 00:52:01 -04:00
2016-06-19 12:53:53 -04:00
Dashboard.hideLoadingMsg();
});
2016-05-17 13:44:17 -04:00
2016-06-19 12:53:53 -04:00
apiClient.getJSON(apiClient.getUrl('Branding/Configuration')).then(function (options) {
2016-05-17 13:44:17 -04:00
2016-06-19 12:53:53 -04:00
view.querySelector('.disclaimer').innerHTML = options.LoginDisclaimer || '';
2016-05-17 13:44:17 -04:00
});
if (Dashboard.isConnectMode()) {
2016-06-18 13:26:42 -04:00
view.querySelector('.connectButtons').classList.remove('hide');
2016-05-17 13:44:17 -04:00
} else {
2016-06-18 13:26:42 -04:00
view.querySelector('.connectButtons').classList.add('hide');
2016-05-17 13:44:17 -04:00
}
});
};
});