update login page

This commit is contained in:
Luke Pulverenti 2015-05-05 19:15:47 -04:00
parent c710303de9
commit 7d1dbeddec
9 changed files with 137 additions and 83 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 97 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

View File

@ -4,7 +4,7 @@
<title>${TitleForgotPassword}</title>
</head>
<body>
<div data-role="page" class="page standalonePage forgotPasswordPage">
<div data-role="page" class="page standalonePage forgotPasswordPage" data-theme="b">
<div data-role="content">
@ -22,7 +22,7 @@
<br />
<p>
<button type="submit" data-icon="check" data-theme="b">
<button type="submit" data-icon="check">
${ButtonSubmit}
</button>
</p>

View File

@ -4,7 +4,7 @@
<title>${TitlePasswordReset}</title>
</head>
<body>
<div data-role="page" class="page standalonePage forgotPasswordPage">
<div data-role="page" class="page standalonePage forgotPasswordPage" data-theme="b">
<div data-role="content">
@ -19,7 +19,7 @@
<br />
<p>
<button type="submit" data-icon="check" data-theme="b">
<button type="submit" data-icon="check">
${ButtonSubmit}
</button>
</p>

View File

@ -4,12 +4,12 @@
<title>${TitleSignIn}</title>
</head>
<body>
<div id="loginPage" data-role="page" class="page standalonePage">
<div id="loginPage" data-role="page" class="page standalonePage" data-theme="b">
<div data-role="content">
<form class="manualLoginForm" id="manualLoginForm" style="display: none; text-align: center; margin: 0 auto;">
<h1 style="text-align: left;">${HeaderPleaseSignIn}</h1>
<label for="txtManualName" style="text-align: left;">${LabelUser}</label>
@ -29,27 +29,37 @@
</button>
</p>
<br />
<p>
<a href="forgotpassword.html">
${ButtonForgotPassword}
</a>
</p>
</form>
<div class="visualLoginForm" style="display: none; text-align: center;">
<br/>
<br />
<div id="divUsers" class="itemsContainer"></div>
<p class="localhostMessage" style="text-align: center; display: none;">${PasswordLocalhostMessage}</p>
<p>
<a href="#" class="lnkManualLogin" onclick="LoginPage.showManualForm($.mobile.activePage, true);">${ButtonManualLogin}</a>
<a href="forgotpassword.html" style="margin-left: 2em;">${ButtonForgotPassword}</a>
</p>
<div class="readOnlyContent" style="margin: 2em auto 0;">
<a href="#" onclick="LoginPage.showManualForm($.mobile.activePage, true);" data-role="button" data-icon="lock">${ButtonManualLogin}</a>
</div>
</div>
<div class="readOnlyContent" style="margin: 0 auto 1em;">
<a href="forgotpassword.html" data-role="button" data-icon="info">
${ButtonForgotPassword}
</a>
<p class="disclaimer" style="text-align: center; margin-top: 2em;"></p>
<div class="connectButtons" style="display:none;">
<br />
<a href="selectserver.html" data-role="button" data-icon="action">
${ButtonChangeServer}
</a>
<a href="connectlogin.html?mode=connect" data-role="button" data-icon="lock">
${ButtonSignInWithConnect}
</a>
</div>
</div>
<p class="disclaimer" style="text-align: center; margin-top: 2em;"></p>
</div>
<script type="text/javascript">

View File

@ -43,7 +43,7 @@
break;
case MediaBrowser.ConnectionState.ServerSignIn:
{
window.location = 'connectlogin.html?mode=serversignin&serverid=' + result.Servers[0].Id;
window.location = 'login.html?serverid=' + result.Servers[0].Id;
}
break;
case MediaBrowser.ConnectionState.ServerSelection:

View File

@ -1,34 +1,59 @@
var LoginPage = {
getApiClient: function () {
var serverId = getParameterByName('serverid');
var deferred = DeferredBuilder.Deferred();
if (serverId) {
deferred.resolveWith(null, [ConnectionManager.getOrCreateApiClient(serverId)]);
} else {
deferred.resolveWith(null, [ApiClient]);
}
return deferred.promise();
},
onPageShow: function () {
Dashboard.showLoadingMsg();
var page = this;
// Show all users on localhost
var promise1 = ApiClient.getPublicUsers();
LoginPage.getApiClient().done(function (apiClient) {
promise1.done(function (users) {
// Show all users on localhost
var promise1 = apiClient.getPublicUsers();
var showManualForm = !users.length;
promise1.done(function (users) {
if (showManualForm) {
var showManualForm = !users.length;
LoginPage.showManualForm(page, false, false);
if (showManualForm) {
} else {
LoginPage.showVisualForm(page);
LoginPage.loadUserList(users);
}
LoginPage.showManualForm(page, false, false);
Dashboard.hideLoadingMsg();
} else {
LoginPage.showVisualForm(page);
LoginPage.loadUserList(page, apiClient, users);
}
Dashboard.hideLoadingMsg();
});
apiClient.getJSON(apiClient.getUrl('Branding/Configuration')).done(function (options) {
$('.disclaimer', page).html(options.LoginDisclaimer || '');
});
});
ApiClient.getJSON(ApiClient.getUrl('Branding/Configuration')).done(function (options) {
$('.disclaimer', page).html(options.LoginDisclaimer || '');
});
if (Dashboard.isConnectMode()) {
$('.connectButtons', page).show();
} else {
$('.connectButtons', page).hide();
}
},
cancelLogin: function () {
@ -67,30 +92,24 @@
return "Last seen " + humane_date(lastActivityDate);
},
getImagePath: function (user) {
if (!user.PrimaryImageTag) {
return "css/images/logindefault.png";
}
return ApiClient.getUserImageUrl(user.Id, {
width: 240,
tag: user.PrimaryImageTag,
type: "Primary"
});
},
authenticateUserByName: function (username, password) {
authenticateUserByName: function (apiClient, username, password) {
Dashboard.showLoadingMsg();
ApiClient.authenticateUserByName(username, password).done(function (result) {
apiClient.authenticateUserByName(username, password).done(function (result) {
var user = result.User;
var serverId = getParameterByName('serverid');
// In a multi-server supported app, set the server address
if (serverId) {
Dashboard.serverAddress(apiClient.serverAddress());
}
Dashboard.setCurrentUser(user.Id, result.AccessToken);
if (user.Policy.IsAdministrator) {
if (user.Policy.IsAdministrator && !serverId) {
window.location = "dashboard.html?u=" + user.Id + '&t=' + result.AccessToken;
} else {
window.location = "index.html?u=" + user.Id + '&t=' + result.AccessToken;
@ -111,11 +130,9 @@
},
loadUserList: function (users) {
loadUserList: function (page, apiClient, users) {
var html = "";
var page = $.mobile.activePage;
for (var i = 0, length = users.length; i < length; i++) {
var user = users[i];
@ -130,7 +147,7 @@
if (user.PrimaryImageTag) {
imgUrl = ApiClient.getUserImageUrl(user.Id, {
imgUrl = apiClient.getUserImageUrl(user.Id, {
width: 300,
tag: user.PrimaryImageTag,
type: "Primary"
@ -172,11 +189,15 @@
$('a', elem).on('click', function () {
var id = this.getAttribute('data-userid');
var name = this.getAttribute('data-username');
var haspw = this.getAttribute('data-haspw');
if (haspw == 'false') {
LoginPage.authenticateUserByName(name, '');
if (id == 'manual') {
LoginPage.showManualForm(page, true);
}
else if (haspw == 'false') {
LoginPage.authenticateUserByName(apiClient, name, '');
} else {
$('#txtManualName', page).val(name);
$('#txtManualPassword', '#loginPage').val('');
@ -187,7 +208,9 @@
onManualSubmit: function () {
LoginPage.authenticateUserByName($('#txtManualName', '#loginPage').val(), $('#txtManualPassword', '#loginPage').val());
LoginPage.getApiClient().done(function (apiClient) {
LoginPage.authenticateUserByName(apiClient, $('#txtManualName', '#loginPage').val(), $('#txtManualPassword', '#loginPage').val());
});
// Disable default form submission
return false;

View File

@ -22,7 +22,7 @@
case MediaBrowser.ConnectionState.ServerSignIn:
{
if (Dashboard.isRunningInCordova()) {
window.location = 'connectlogin.html?mode=serversignin&serverid=' + result.Servers[0].Id;
window.location = 'login.html?serverid=' + result.Servers[0].Id;
} else {
showServerConnectionFailure();
}
@ -64,13 +64,20 @@
var href = "#";
html += '<a class="cardContent lnkServer" data-serverid="' + server.Id + '" href="' + href + '">';
var imgUrl = 'css/images/server.png';
var imgUrl = server.Id == 'connect' ? 'css/images/logo536.png' : '';
html += '<div class="cardImage" style="background-image:url(\'' + imgUrl + '\');">';
if (imgUrl) {
html += '<div class="cardImage" style="background-image:url(\'' + imgUrl + '\');">';
} else {
html += '<div class="cardImage" style="text-align:center;">';
var icon = server.Id == 'new' ? 'plus-circle' : 'globe';
html += '<i class="fa fa-' + icon + '" style="color:#fff;vertical-align:middle;font-size:100px;margin-top:25%;"></i>';
}
html += "</div>";
// cardContent
// cardContent'
html += "</a>";
// cardScalable
@ -78,11 +85,13 @@
html += '<div class="cardFooter">';
html += '<div class="cardText" style="text-align:right; float:right;">';
if (server.showOptions !== false) {
html += '<div class="cardText" style="text-align:right; float:right;">';
html += '<button class="btnServerMenu" type="button" data-inline="true" data-iconpos="notext" data-icon="ellipsis-v" style="margin: 2px 0 0;"></button>';
html += '<button class="btnServerMenu" type="button" data-inline="true" data-iconpos="notext" data-icon="ellipsis-v" style="margin: 2px 0 0;"></button>';
html += "</div>";
html += "</div>";
}
html += '<div class="cardText" style="margin-right: 30px; padding: 11px 0 10px;">';
html += server.Name;
@ -117,6 +126,17 @@
$('.lnkServer', elem).on('click', function () {
var id = this.getAttribute('data-serverid');
if (id == 'new') {
window.location = 'connectlogin.html?mode=manualserver';
return;
}
if (id == 'connect') {
window.location = 'connectlogin.html?mode=connect';
return;
}
var server = servers.filter(function (s) {
return s.Id == id;
})[0];
@ -281,10 +301,8 @@
var href = "#";
html += '<a class="cardContent" href="' + href + '">';
var imgUrl = 'css/images/server.png';
html += '<div class="cardImage" style="background-image:url(\'' + imgUrl + '\');">';
html += '<div class="cardImage" style="text-align:center;">';
html += '<i class="fa fa-globe" style="color:#fff;vertical-align:middle;font-size:100px;margin-top:25%;"></i>';
html += "</div>";
// cardContent
@ -356,20 +374,30 @@
ConnectionManager.getAvailableServers().done(function (servers) {
servers = servers.slice(0);
if (Dashboard.isRunningInCordova()) {
servers.push({
Name: Globalize.translate('ButtonNewServer'),
Id: 'new',
showOptions: false
});
}
if (!ConnectionManager.isLoggedIntoConnect()) {
servers.push({
Name: Globalize.translate('ButtonSignInWithConnect'),
Id: 'connect',
showOptions: false
});
}
renderServers(page, servers);
Dashboard.hideLoadingMsg();
});
loadInvitations(page);
if (Dashboard.isRunningInCordova()) {
$('.newServer', page).show();
$('.connectLogin', page).show();
} else {
$('.newServer', page).hide();
$('.connectLogin', page).hide();
}
}
$(document).on('pageshow', "#selectServerPage", function () {

View File

@ -19,13 +19,6 @@
</div>
<div class="serverList"></div>
<div class="newServer">
<br />
<a data-role="button" href="connectlogin.html?mode=manualserver" data-icon="plus">${ButtonNewServer}</a>
</div>
<div class="connectLogin">
<a data-role="button" href="connectlogin.html?mode=connect" data-icon="action">${ButtonSignInWithConnect}</a>
</div>
<br />
<div class="noServersMessage" style="display:none;padding-left:5px;">
${MessageNoServersAvailableToConnect}