mirror of
https://github.com/jellyfin/jellyfin-web.git
synced 2024-11-17 19:08:18 -07:00
added manual server form
This commit is contained in:
parent
5257e91628
commit
c710303de9
@ -9,7 +9,7 @@
|
||||
|
||||
<div data-role="content">
|
||||
|
||||
<form class="connectLoginForm" style="text-align: center; margin: 0 auto;">
|
||||
<form class="connectLoginForm" style="text-align: center; margin: 0 auto;display:none;">
|
||||
|
||||
<h1 style="text-align: left;">${HeaderSignInWithConnect}</h1>
|
||||
<br />
|
||||
@ -27,18 +27,64 @@
|
||||
<button type="submit" data-icon="check">
|
||||
${ButtonSignIn}
|
||||
</button>
|
||||
<p>
|
||||
<p class="forgotPassword" style="display:none;">
|
||||
<a href="http://emby.media/community/index.php?app=core&module=global§ion=lostpass" target="_blank">${ButtonForgotPassword}</a>
|
||||
</p>
|
||||
<div class="skip">
|
||||
<br />
|
||||
<a data-role="button" data-icon="delete" href="connectlogin.html?mode=manualserver">${ButtonSkip}</a>
|
||||
<div class="fieldDescription">${TextConnectToServerManually}</div>
|
||||
</div>
|
||||
|
||||
<br />
|
||||
<h2 style="text-align: left;">${HeaderNewUsers}</h2>
|
||||
<a data-role="button" data-icon="action" href="http://emby.media/community/index.php?app=core&module=global§ion=register" target="_blank">${ButtonSignUp}</a>
|
||||
<div class="newUsers" style="display:none;">
|
||||
<br />
|
||||
<h2 style="text-align: left;">${HeaderNewUsers}</h2>
|
||||
<a data-role="button" data-icon="action" href="http://emby.media/community/index.php?app=core&module=global§ion=register" target="_blank">${ButtonSignUp}</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<form class="manualServerForm" style="text-align: center; margin: 0 auto;display:none;">
|
||||
|
||||
<h1 style="text-align: left;">${HeaderNewServer}</h1>
|
||||
<br />
|
||||
<div>
|
||||
<label for="txtServerHost" style="text-align: left;">${LabelServerHost}</label>
|
||||
<input type="text" id="txtServerHost" required="required" />
|
||||
<div class="fieldDescription" style="text-align:left;">${LabelServerHostHelp}</div>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<label for="txtServerPort" style="text-align: left;">${LabelServerPort}</label>
|
||||
<input type="number" id="txtServerPort" step="1" min="0" />
|
||||
</div>
|
||||
<br /><br />
|
||||
|
||||
<button type="submit" data-icon="check">
|
||||
${ButtonConnect}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<div class="welcomeContainer readOnlyContent" style="text-align: center; margin: 0 auto;display:none;">
|
||||
|
||||
<div style="text-align: left;">
|
||||
<h1>${HeaderWelcomeToEmby}</h1>
|
||||
<p style="margin:2em 0;">${EmbyIntroMessage}</p>
|
||||
<p style="margin:2em 0;" class="embyIntroDownloadMessage"></p>
|
||||
|
||||
|
||||
<a class="btn btnActionAccent btnIconRight" href="connectlogin.html">
|
||||
<span>
|
||||
${ButtonNext}
|
||||
</span>
|
||||
<i class="fa fa-arrow-right"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$('.connectLoginForm').off('submit', ConnectLoginPage.onSubmit).on('submit', ConnectLoginPage.onSubmit);
|
||||
$('.manualServerForm').off('submit', ConnectLoginPage.onManualServerSubmit).on('submit', ConnectLoginPage.onManualServerSubmit);
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
|
7
dashboard-ui/css/materialize.css
vendored
7
dashboard-ui/css/materialize.css
vendored
@ -202,11 +202,16 @@ button.btn:not(.btn-inline), button.btn-large:not(.btn-inline) {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.btn:not(.btn-inline):not(.btnNoText) i {
|
||||
.btn:not(.btn-inline):not(.btnNoText):not(.btnIconRight) i {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
.btnIconRight:not(.btn-inline):not(.btnNoText) i {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.btn-large i {
|
||||
position: absolute;
|
||||
left: 24px;
|
||||
|
@ -36,7 +36,7 @@
|
||||
}
|
||||
|
||||
.videoControls {
|
||||
padding: 0 .5em;
|
||||
padding: .5em .5em;
|
||||
background-color: rgba(0, 0, 0, .8);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
@ -80,7 +80,7 @@
|
||||
z-index: 99999;
|
||||
}
|
||||
|
||||
#videoPlayer .nowPlayingInfo img {
|
||||
#videoPlayer .nowPlayingImage img {
|
||||
height: auto !important;
|
||||
max-width: 100px;
|
||||
max-height: 200px;
|
||||
@ -202,7 +202,7 @@
|
||||
}
|
||||
|
||||
@media all and (min-width: 1300px) {
|
||||
#videoPlayer .nowPlayingInfo img {
|
||||
#videoPlayer .nowPlayingImage img {
|
||||
height: auto !important;
|
||||
max-width: 150px;
|
||||
max-height: 300px;
|
||||
|
@ -28,6 +28,126 @@
|
||||
|
||||
}
|
||||
|
||||
function handleConnectionResult(page, result) {
|
||||
|
||||
switch (result.State) {
|
||||
|
||||
case MediaBrowser.ConnectionState.SignedIn:
|
||||
{
|
||||
var apiClient = result.ApiClient;
|
||||
|
||||
Dashboard.serverAddress(apiClient.serverAddress());
|
||||
Dashboard.setCurrentUser(apiClient.getCurrentUserId(), apiClient.accessToken());
|
||||
window.location = 'index.html';
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ServerSignIn:
|
||||
{
|
||||
window.location = 'connectlogin.html?mode=serversignin&serverid=' + result.Servers[0].Id;
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ServerSelection:
|
||||
{
|
||||
onLoggedIn();
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ConnectSignIn:
|
||||
{
|
||||
loadMode(page, 'welcome');
|
||||
}
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function loadAppConnection(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
ConnectionManager.connect().done(function (result) {
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
||||
handleConnectionResult(page, result);
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function loadPage(page) {
|
||||
|
||||
var mode = getParameterByName('mode');
|
||||
|
||||
if (!mode) {
|
||||
|
||||
if (Dashboard.isRunningInCordova()) {
|
||||
loadAppConnection(page);
|
||||
return;
|
||||
}
|
||||
mode = 'connect';
|
||||
}
|
||||
|
||||
loadMode(page, mode);
|
||||
}
|
||||
function loadMode(page, mode) {
|
||||
|
||||
if (mode == 'welcome') {
|
||||
$('.connectLoginForm', page).hide();
|
||||
$('.welcomeContainer', page).show();
|
||||
$('.manualServerForm', page).hide();
|
||||
}
|
||||
else if (mode == 'connect') {
|
||||
$('.connectLoginForm', page).show();
|
||||
$('.welcomeContainer', page).hide();
|
||||
$('.manualServerForm', page).hide();
|
||||
}
|
||||
else if (mode == 'manualserver') {
|
||||
$('.manualServerForm', page).show();
|
||||
$('.connectLoginForm', page).hide();
|
||||
$('.welcomeContainer', page).hide();
|
||||
}
|
||||
}
|
||||
|
||||
$(document).on('pageshow', "#connectLoginPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
loadPage(page);
|
||||
|
||||
var link = '<a href="http://emby.media" target="_blank">http://emby.media</a>';
|
||||
$('.embyIntroDownloadMessage', page).html(Globalize.translate('EmbyIntroDownloadMessage', link));
|
||||
|
||||
if (Dashboard.isRunningInCordova()) {
|
||||
$('.newUsers', page).hide();
|
||||
$('.forgotPassword', page).hide();
|
||||
$('.skip', page).show();
|
||||
} else {
|
||||
$('.skip', page).hide();
|
||||
$('.newUsers', page).show();
|
||||
$('.forgotPassword', page).show();
|
||||
}
|
||||
});
|
||||
|
||||
function submitManualServer(page) {
|
||||
|
||||
var host = $('#txtServerHost', page).val();
|
||||
var port = $('#txtServerPort', page).val();
|
||||
|
||||
if (port) {
|
||||
host += ':' + port;
|
||||
}
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
ConnectionManager.connectToAddress(host).done(function (result) {
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
||||
handleConnectionResult(page, result);
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function submit(page) {
|
||||
|
||||
var user = $('#txtManualName', page).val();
|
||||
@ -45,6 +165,15 @@
|
||||
submit(page);
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
onManualServerSubmit: function () {
|
||||
var page = $(this).parents('.page');
|
||||
|
||||
submitManualServer(page);
|
||||
|
||||
return false;
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -40,26 +40,29 @@
|
||||
html += '<button id="btnCast" class="btnCast btnDefaultCast headerButton headerButtonRight" type="button" data-role="none" style="visibility:hidden;"><div class="headerSelectedPlayer"></div><div class="btnCastImage"></div></button>';
|
||||
|
||||
}
|
||||
|
||||
if (user.name) {
|
||||
|
||||
html += '<a class="headerButton headerButtonRight headerUserButton" href="#" onclick="Dashboard.showUserFlyout(this);">';
|
||||
|
||||
html += '<a class="headerButton headerButtonRight headerUserButton" href="#" onclick="Dashboard.showUserFlyout(this);">';
|
||||
if (user.imageUrl) {
|
||||
|
||||
if (user.imageUrl) {
|
||||
var userButtonHeight = 26;
|
||||
|
||||
var userButtonHeight = 26;
|
||||
var url = user.imageUrl;
|
||||
|
||||
var url = user.imageUrl;
|
||||
if (user.supportsImageParams) {
|
||||
url += "&height=" + (userButtonHeight * Math.max(devicePixelRatio || 1, 2));
|
||||
}
|
||||
|
||||
if (user.supportsImageParams) {
|
||||
url += "&height=" + (userButtonHeight * Math.max(devicePixelRatio || 1, 2));
|
||||
html += '<img src="' + url + '" style="border-radius: 1000px; height:' + userButtonHeight + 'px;" />';
|
||||
} else {
|
||||
html += '<div class="fa fa-user"></div>';
|
||||
}
|
||||
|
||||
html += '<img src="' + url + '" style="border-radius: 1000px; height:' + userButtonHeight + 'px;" />';
|
||||
} else {
|
||||
html += '<div class="fa fa-user"></div>';
|
||||
html += '</a>';
|
||||
}
|
||||
|
||||
html += '</a>';
|
||||
|
||||
if (user.canManageServer) {
|
||||
html += '<a href="dashboard.html" class="headerButton headerButtonRight dashboardEntryHeaderButton"><div class="fa fa-cog"></div></a>';
|
||||
}
|
||||
|
@ -19,6 +19,15 @@
|
||||
window.location = 'index.html';
|
||||
}
|
||||
break;
|
||||
case MediaBrowser.ConnectionState.ServerSignIn:
|
||||
{
|
||||
if (Dashboard.isRunningInCordova()) {
|
||||
window.location = 'connectlogin.html?mode=serversignin&serverid=' + result.Servers[0].Id;
|
||||
} else {
|
||||
showServerConnectionFailure();
|
||||
}
|
||||
}
|
||||
break;
|
||||
default:
|
||||
showServerConnectionFailure();
|
||||
break;
|
||||
@ -326,11 +335,19 @@
|
||||
|
||||
function loadInvitations(page) {
|
||||
|
||||
ConnectionManager.getUserInvitations().done(function (list) {
|
||||
if (ConnectionManager.isLoggedIntoConnect()) {
|
||||
|
||||
renderInvitations(page, list);
|
||||
ConnectionManager.getUserInvitations().done(function (list) {
|
||||
|
||||
renderInvitations(page, list);
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
renderInvitations(page, []);
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function loadPage(page) {
|
||||
@ -345,6 +362,14 @@
|
||||
});
|
||||
|
||||
loadInvitations(page);
|
||||
|
||||
if (Dashboard.isRunningInCordova()) {
|
||||
$('.newServer', page).show();
|
||||
$('.connectLogin', page).show();
|
||||
} else {
|
||||
$('.newServer', page).hide();
|
||||
$('.connectLogin', page).hide();
|
||||
}
|
||||
}
|
||||
|
||||
$(document).on('pageshow', "#selectServerPage", function () {
|
||||
|
@ -42,8 +42,22 @@ var Dashboard = {
|
||||
$.mobile.panel.prototype.options.classes.panel = "largePanel ui-panel";
|
||||
},
|
||||
|
||||
isConnectMode: function () {
|
||||
|
||||
return true;
|
||||
if (Dashboard.isRunningInCordova()) {
|
||||
return true;
|
||||
}
|
||||
|
||||
var url = getWindowUrl().toLowerCase();
|
||||
|
||||
return url.indexOf('mediabrowser.tv') != -1 ||
|
||||
url.indexOf('emby.media') != -1;
|
||||
},
|
||||
|
||||
isRunningInCordova: function () {
|
||||
|
||||
return true;
|
||||
return window.appMode == 'cordova';
|
||||
},
|
||||
|
||||
@ -185,18 +199,6 @@ var Dashboard = {
|
||||
Dashboard.getUserPromise = null;
|
||||
},
|
||||
|
||||
isConnectMode: function () {
|
||||
|
||||
if (Dashboard.isRunningInCordova()) {
|
||||
return true;
|
||||
}
|
||||
|
||||
var url = getWindowUrl().toLowerCase();
|
||||
|
||||
return url.indexOf('mediabrowser.tv') != -1 ||
|
||||
url.indexOf('emby.media') != -1;
|
||||
},
|
||||
|
||||
logout: function (logoutWithServer) {
|
||||
|
||||
store.removeItem("userId");
|
||||
@ -1648,18 +1650,6 @@ $(document).on('pagecreate', ".page", function () {
|
||||
|
||||
var page = $(this);
|
||||
|
||||
var isConnectMode = Dashboard.isConnectMode();
|
||||
|
||||
if (isConnectMode && !page.hasClass('connectLoginPage')) {
|
||||
|
||||
if (!ConnectionManager.isLoggedIntoConnect()) {
|
||||
|
||||
console.log('Not logged into connect. Redirecting to login.');
|
||||
Dashboard.logout();
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
var apiClient = ConnectionManager.currentApiClient();
|
||||
|
||||
if (Dashboard.getAccessToken() && Dashboard.getCurrentUserId()) {
|
||||
@ -1686,6 +1676,16 @@ $(document).on('pagecreate', ".page", function () {
|
||||
|
||||
else {
|
||||
|
||||
var isConnectMode = Dashboard.isConnectMode();
|
||||
|
||||
if (isConnectMode) {
|
||||
|
||||
if (!Dashboard.isServerlessPage()) {
|
||||
Dashboard.logout();
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (this.id !== "loginPage" && !page.hasClass('forgotPasswordPage') && !page.hasClass('wizardPage') && !isConnectMode) {
|
||||
|
||||
console.log('Not logged into server. Redirecting to login.');
|
||||
|
@ -400,7 +400,9 @@
|
||||
|
||||
var page = this;
|
||||
|
||||
showSyncButtonsPerUser(page);
|
||||
if (!Dashboard.isServerlessPage()) {
|
||||
showSyncButtonsPerUser(page);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
@ -19,6 +19,13 @@
|
||||
</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}
|
||||
|
Loading…
Reference in New Issue
Block a user