mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update connect
This commit is contained in:
parent
640d5c802a
commit
f019697eb9
5 changed files with 324 additions and 20 deletions
|
@ -20,6 +20,11 @@
|
||||||
|
|
||||||
<ul data-role="listview" class="ulForm">
|
<ul data-role="listview" class="ulForm">
|
||||||
<li>
|
<li>
|
||||||
|
<label for="txtCustomName">${LabelCustomDeviceDisplayName}</label>
|
||||||
|
<input type="text" id="txtCustomName" data-mini="true" />
|
||||||
|
<div class="fieldDescription">${LabelCustomDeviceDisplayNameHelp}</div>
|
||||||
|
</li>
|
||||||
|
<li id="fldCameraUploadPath" style="display:none;">
|
||||||
<label for="txtUploadPath">${LabelCameraUploadPath}</label>
|
<label for="txtUploadPath">${LabelCameraUploadPath}</label>
|
||||||
<div style="display: inline-block; width: 92%;">
|
<div style="display: inline-block; width: 92%;">
|
||||||
<input type="text" id="txtUploadPath" data-mini="true" />
|
<input type="text" id="txtUploadPath" data-mini="true" />
|
||||||
|
@ -45,6 +50,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$('.deviceForm').off('submit', DevicePage.onSubmit).on('submit', DevicePage.onSubmit);
|
||||||
|
</script>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
@ -22,7 +22,7 @@
|
||||||
<p class="noDevices" style="display:none;color:red;">${MessageNoDevicesSupportCameraUpload}</p>
|
<p class="noDevices" style="display:none;color:red;">${MessageNoDevicesSupportCameraUpload}</p>
|
||||||
|
|
||||||
<br />
|
<br />
|
||||||
<form class="devicesUploadForm">
|
<form class="devicesUploadForm" style="display:none;">
|
||||||
|
|
||||||
<div class="devicesList">
|
<div class="devicesList">
|
||||||
|
|
||||||
|
|
|
@ -1 +1,94 @@
|
||||||
|
(function () {
|
||||||
|
|
||||||
|
function load(page, device, capabilities) {
|
||||||
|
|
||||||
|
if (capabilities.SupportsContentUploading) {
|
||||||
|
$('.fldCameraUploadPath', page).show();
|
||||||
|
} else {
|
||||||
|
$('.fldCameraUploadPath', page).hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#txtCustomName', page).val(device.CustomName || '');
|
||||||
|
}
|
||||||
|
|
||||||
|
function loadData(page) {
|
||||||
|
|
||||||
|
Dashboard.showLoadingMsg();
|
||||||
|
|
||||||
|
var id = getParameterByName('id');
|
||||||
|
|
||||||
|
var promise1 = ApiClient.getJSON(ApiClient.getUrl('Devices/Info', { Id: id }));
|
||||||
|
var promise2 = ApiClient.getJSON(ApiClient.getUrl('Devices/Capabilities', { Id: id }));
|
||||||
|
|
||||||
|
$.when(promise1, promise2).done(function (response1, response2) {
|
||||||
|
|
||||||
|
load(page, response1[0], response2[0]);
|
||||||
|
|
||||||
|
Dashboard.hideLoadingMsg();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function save(page) {
|
||||||
|
|
||||||
|
var id = getParameterByName('id');
|
||||||
|
|
||||||
|
ApiClient.ajax({
|
||||||
|
|
||||||
|
url: ApiClient.getUrl('Devices/Options', { Id: id }),
|
||||||
|
type: 'POST',
|
||||||
|
data: JSON.stringify({
|
||||||
|
|
||||||
|
CustomName: $('#txtCustomName', page).val(),
|
||||||
|
CameraUploadPath: $('#txtUploadPath', page).val()
|
||||||
|
|
||||||
|
}),
|
||||||
|
contentType: "application/json"
|
||||||
|
|
||||||
|
}).done(Dashboard.processServerConfigurationUpdateResult);
|
||||||
|
}
|
||||||
|
|
||||||
|
$(document).on('pageinit', "#devicePage", function () {
|
||||||
|
|
||||||
|
var page = this;
|
||||||
|
|
||||||
|
$('#btnSelectUploadPath', page).on("click.selectDirectory", function () {
|
||||||
|
|
||||||
|
var picker = new DirectoryBrowser(page);
|
||||||
|
|
||||||
|
picker.show({
|
||||||
|
|
||||||
|
callback: function (path) {
|
||||||
|
|
||||||
|
if (path) {
|
||||||
|
$('#txtUploadPath', page).val(path);
|
||||||
|
}
|
||||||
|
picker.close();
|
||||||
|
},
|
||||||
|
|
||||||
|
header: Globalize.translate('HeaderSelectUploadPath')
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
}).on('pageshow', "#devicePage", function () {
|
||||||
|
|
||||||
|
var page = this;
|
||||||
|
|
||||||
|
loadData(page);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
window.DevicePage = {
|
||||||
|
|
||||||
|
onSubmit: function () {
|
||||||
|
|
||||||
|
var form = this;
|
||||||
|
var page = $(form).parents('.page');
|
||||||
|
|
||||||
|
save(page);
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
})();
|
|
@ -15,7 +15,7 @@
|
||||||
|
|
||||||
ApiClient.deleteUser(id).done(function () {
|
ApiClient.deleteUser(id).done(function () {
|
||||||
|
|
||||||
loadUsers(page);
|
loadData(page);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -23,10 +23,6 @@
|
||||||
}).popup('close');
|
}).popup('close');
|
||||||
}
|
}
|
||||||
|
|
||||||
function closeUserMenu(page) {
|
|
||||||
$('.userMenu', page).popup('close').remove();
|
|
||||||
}
|
|
||||||
|
|
||||||
function showUserMenu(elem) {
|
function showUserMenu(elem) {
|
||||||
|
|
||||||
var card = $(elem).parents('.card');
|
var card = $(elem).parents('.card');
|
||||||
|
@ -141,20 +137,145 @@
|
||||||
return html;
|
return html;
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderUsers(page, users) {
|
function renderUsersIntoElement(elem, users) {
|
||||||
|
|
||||||
var html = '';
|
var html = getUserSectionHtml(users);
|
||||||
|
|
||||||
html += getUserSectionHtml(users);
|
elem.html(html).trigger('create');
|
||||||
|
|
||||||
var elem = $('.users', page).html(html).trigger('create');
|
|
||||||
|
|
||||||
$('.btnUserMenu', elem).on('click', function () {
|
$('.btnUserMenu', elem).on('click', function () {
|
||||||
showUserMenu(this);
|
showUserMenu(this);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function loadUsers(page) {
|
function renderUsers(page, users) {
|
||||||
|
|
||||||
|
renderUsersIntoElement($('.users', page), users);
|
||||||
|
}
|
||||||
|
|
||||||
|
function showPendingUserMenu(elem) {
|
||||||
|
|
||||||
|
var card = $(elem).parents('.card');
|
||||||
|
var page = $(elem).parents('.page');
|
||||||
|
var id = card.attr('data-id');
|
||||||
|
|
||||||
|
$('.userMenu', page).popup("close").remove();
|
||||||
|
|
||||||
|
var html = '<div data-role="popup" class="userMenu" data-history="false" data-theme="a">';
|
||||||
|
|
||||||
|
html += '<ul data-role="listview" style="min-width: 180px;">';
|
||||||
|
html += '<li data-role="list-divider">' + Globalize.translate('HeaderMenu') + '</li>';
|
||||||
|
|
||||||
|
html += '<li><a href="#" class="btnDelete" data-id="' + id + '">' + Globalize.translate('ButtonCancel') + '</a></li>';
|
||||||
|
|
||||||
|
html += '</ul>';
|
||||||
|
|
||||||
|
html += '</div>';
|
||||||
|
|
||||||
|
page.append(html);
|
||||||
|
|
||||||
|
var flyout = $('.userMenu', page).popup({ positionTo: elem || "window" }).trigger('create').popup("open").on("popupafterclose", function () {
|
||||||
|
|
||||||
|
$(this).off("popupafterclose").remove();
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.btnDelete', flyout).on('click', function () {
|
||||||
|
cancelAuthorization(page, this.getAttribute('data-id'));
|
||||||
|
$('.userMenu', page).popup("close").remove();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function getPendingUserHtml(user) {
|
||||||
|
|
||||||
|
var html = '';
|
||||||
|
|
||||||
|
var cssClass = "card homePageSquareCard alternateHover bottomPaddedCard";
|
||||||
|
|
||||||
|
html += "<div data-id='" + user.Id + "' class='" + cssClass + "'>";
|
||||||
|
|
||||||
|
html += '<div class="cardBox visualCardBox">';
|
||||||
|
html += '<div class="cardScalable">';
|
||||||
|
|
||||||
|
html += '<div class="cardPadder"></div>';
|
||||||
|
|
||||||
|
var href = "#";
|
||||||
|
html += '<a class="cardContent" href="' + href + '">';
|
||||||
|
|
||||||
|
var imgUrl = user.ImageUrl || 'css/images/userflyoutdefault.png';
|
||||||
|
|
||||||
|
html += '<div class="cardImage" style="background-image:url(\'' + imgUrl + '\');">';
|
||||||
|
|
||||||
|
html += "</div>";
|
||||||
|
|
||||||
|
// cardContent
|
||||||
|
html += "</a>";
|
||||||
|
|
||||||
|
// cardScalable
|
||||||
|
html += "</div>";
|
||||||
|
|
||||||
|
html += '<div class="cardFooter">';
|
||||||
|
|
||||||
|
html += '<div class="cardText" style="text-align:right; float:right;">';
|
||||||
|
|
||||||
|
html += '<button class="btnUserMenu" type="button" data-inline="true" data-iconpos="notext" data-icon="ellipsis-v" style="margin: 2px 0 0;"></button>';
|
||||||
|
html += "</div>";
|
||||||
|
|
||||||
|
html += '<div class="cardText" style="margin-right: 30px; padding: 11px 0 10px;">';
|
||||||
|
html += user.UserName;
|
||||||
|
html += "</div>";
|
||||||
|
|
||||||
|
// cardFooter
|
||||||
|
html += "</div>";
|
||||||
|
|
||||||
|
// cardBox
|
||||||
|
html += "</div>";
|
||||||
|
|
||||||
|
// card
|
||||||
|
html += "</div>";
|
||||||
|
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderPendingGuests(page, users) {
|
||||||
|
|
||||||
|
if (users.length) {
|
||||||
|
$('.sectionPendingGuests', page).show();
|
||||||
|
} else {
|
||||||
|
$('.sectionPendingGuests', page).hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
var html = users.map(getPendingUserHtml).join('');
|
||||||
|
|
||||||
|
var elem = $('.pending', page).html(html).trigger('create');
|
||||||
|
|
||||||
|
$('.btnUserMenu', elem).on('click', function () {
|
||||||
|
showPendingUserMenu(this);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function cancelAuthorization(page, id) {
|
||||||
|
|
||||||
|
Dashboard.showLoadingMsg();
|
||||||
|
|
||||||
|
// Add/Update connect info
|
||||||
|
ApiClient.ajax({
|
||||||
|
|
||||||
|
type: "DELETE",
|
||||||
|
url: ApiClient.getUrl('Connect/Pending', {
|
||||||
|
|
||||||
|
Id: id
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
}).done(function () {
|
||||||
|
|
||||||
|
loadData(page);
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function loadData(page) {
|
||||||
|
|
||||||
Dashboard.showLoadingMsg();
|
Dashboard.showLoadingMsg();
|
||||||
|
|
||||||
|
@ -162,14 +283,57 @@
|
||||||
renderUsers(page, users);
|
renderUsers(page, users);
|
||||||
Dashboard.hideLoadingMsg();
|
Dashboard.hideLoadingMsg();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
ApiClient.getJSON(ApiClient.getUrl('Connect/Pending')).done(function(pending) {
|
||||||
|
|
||||||
|
renderPendingGuests(page, pending);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function inviteUser(page) {
|
||||||
|
|
||||||
|
Dashboard.showLoadingMsg();
|
||||||
|
|
||||||
|
// Add/Update connect info
|
||||||
|
ApiClient.ajax({
|
||||||
|
|
||||||
|
type: "POST",
|
||||||
|
url: ApiClient.getUrl('Connect/Invite', {
|
||||||
|
|
||||||
|
ConnectUsername: $('#txtConnectUsername', page).val(),
|
||||||
|
SendingUserId: Dashboard.getCurrentUserId()
|
||||||
|
|
||||||
|
}),
|
||||||
|
dataType: 'json'
|
||||||
|
|
||||||
|
}).done(function (result) {
|
||||||
|
|
||||||
|
$('#popupInvite').popup('close');
|
||||||
|
loadData(page);
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
$(document).on('pagebeforeshow', "#userProfilesPage", function () {
|
$(document).on('pagebeforeshow', "#userProfilesPage", function () {
|
||||||
|
|
||||||
var page = this;
|
var page = this;
|
||||||
|
|
||||||
loadUsers(page);
|
loadData(page);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
window.UserProfilesPage = {
|
||||||
|
|
||||||
|
onSubmit: function () {
|
||||||
|
|
||||||
|
var form = this;
|
||||||
|
|
||||||
|
var page = $(form).parents('.page');
|
||||||
|
|
||||||
|
inviteUser(page);
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
})(document, window, jQuery);
|
})(document, window, jQuery);
|
|
@ -15,21 +15,60 @@
|
||||||
|
|
||||||
<div class="readOnlyContent">
|
<div class="readOnlyContent">
|
||||||
<div>
|
<div>
|
||||||
<a data-role="button" data-icon="plus" href="useredit.html" data-inline="true">
|
<a data-role="button" data-icon="plus" href="#popupInvite" data-rel="popup" data-position-to="window" data-inline="true">
|
||||||
${ButtonAddUser}
|
${ButtonInviteUser}
|
||||||
|
</a>
|
||||||
|
<a data-role="button" data-icon="plus" href="useredit.html" data-inline="true">
|
||||||
|
${ButtonAddLocalUser}
|
||||||
</a>
|
</a>
|
||||||
<!--<a data-role="button" data-icon="plus" href="useredit.html" data-inline="true">
|
|
||||||
${ButtonInviteMediaBrowserUser}
|
|
||||||
</a>-->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="itemsContainer users" style="text-align:left;">
|
<div class="itemsContainer users" style="text-align:left;">
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<br />
|
||||||
|
<div class="sectionPendingGuests" style="display:none;">
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
<div class="ui-bar-a" style="padding: 0 1em;"><h3>Pending Invitations</h3></div>
|
||||||
|
<div class="itemsContainer pending" style="text-align:left;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div data-role="popup" id="popupInvite" data-theme="a">
|
||||||
|
|
||||||
|
<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">${ButtonClose}</a>
|
||||||
|
|
||||||
|
<div class="ui-bar-a" style="text-align: center; padding: 5px 20px;">
|
||||||
|
<h3 style="margin: .5em;">${HeaderInviteUser}</h3>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="padding:10px 20px;">
|
||||||
|
|
||||||
|
<p>${HeaderInviteUserHelp}</p>
|
||||||
|
<form class="addUserForm">
|
||||||
|
<div>
|
||||||
|
<label for="txtConnectUsername">${LabelConnectUserName}</label>
|
||||||
|
<input type="text" id="txtConnectUsername" value="" placeholder="Username" required="required">
|
||||||
|
<div class="fieldDescription">
|
||||||
|
<div>${LabelConnectInviteHelp}</div>
|
||||||
|
<div style="margin-top: .75em;"><a href="http://mediabrowser.tv/connect" target="_blank">${ButtonLearnMoreAboutMediaBrowserConnect}</a></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<br />
|
||||||
|
<button type="submit" data-icon="mail">${ButtonSendInvitation}</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<script type="text/javascript">
|
||||||
|
$('.addUserForm').off('submit', UserProfilesPage.onSubmit).on('submit', UserProfilesPage.onSubmit);
|
||||||
|
</script>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue