mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
add device upload options
This commit is contained in:
Luke Pulverenti
parent
8ff293076b
commit
9ae5d347c1
8 changed files with 327 additions and 2 deletions
|
|
@ -9,6 +9,7 @@
|
|||
|
||||
|
||||
|
||||
|
||||
<webMarkupMin xmlns="http://tempuri.org/WebMarkupMin.Configuration.xsd">
|
||||
<core>
|
||||
<css>
|
||||
|
|
|
|||
28
dashboard-ui/devices.html
Normal file
28
dashboard-ui/devices.html
Normal file
|
|
@ -0,0 +1,28 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>${TitleDevices}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="devicesPage" data-role="page" class="page type-interior devicesPage">
|
||||
|
||||
<div data-role="content">
|
||||
<div class="content-primary">
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
|
||||
<a href="#" data-role="button" class="ui-btn-active">${TabDevices}</a>
|
||||
<a href="devicesupload.html" data-role="button">${TabCameraUpload}</a>
|
||||
</div>
|
||||
|
||||
<div class="readOnlyContent">
|
||||
<div class="devicesList">
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
63
dashboard-ui/devicesupload.html
Normal file
63
dashboard-ui/devicesupload.html
Normal file
|
|
@ -0,0 +1,63 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>${TitleDevices}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="devicesUploadPage" data-role="page" class="page type-interior devicesPage">
|
||||
|
||||
<div data-role="content">
|
||||
<div class="content-primary">
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
|
||||
<a href="devices.html" data-role="button">${TabDevices}</a>
|
||||
<a href="#" data-role="button" class="ui-btn-active">${TabCameraUpload}</a>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="readOnlyContent">
|
||||
|
||||
<p>${HeaderCameraUploadHelp}</p>
|
||||
|
||||
<p class="noDevices" style="display:none;color:red;">${MessageNoDevicesSupportCameraUpload}</p>
|
||||
|
||||
<br />
|
||||
<form class="devicesUploadForm">
|
||||
|
||||
<div class="devicesList">
|
||||
|
||||
</div>
|
||||
|
||||
<br /><br />
|
||||
<ul data-role="listview" class="ulForm">
|
||||
<li>
|
||||
<label for="txtUploadPath">${LabelUploadPath}</label>
|
||||
<div style="display: inline-block; width: 92%;">
|
||||
<input type="text" id="txtUploadPath" data-mini="true" />
|
||||
</div>
|
||||
<button id="btnSelectUploadPath" type="button" data-icon="search" data-iconpos="notext" data-inline="true">${ButtonSelectDirectory}</button>
|
||||
<div class="fieldDescription">${LabelUploadPathHelp}</div>
|
||||
</li>
|
||||
|
||||
</ul><br />
|
||||
<ul data-role="listview" class="ulForm">
|
||||
<li>
|
||||
<button type="submit" data-theme="b" data-icon="check">
|
||||
${ButtonSave}
|
||||
</button>
|
||||
<button type="button" onclick="Dashboard.navigate('dashboard.html');" data-icon="delete">
|
||||
${ButtonCancel}
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$('.devicesUploadForm').off('submit', DevicesUploadPage.onSubmit).on('submit', DevicesUploadPage.onSubmit);
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -56,7 +56,6 @@
|
|||
<input type="password" id="txtOpenSubtitlePassword" data-mini="true" />
|
||||
</li>
|
||||
</ul>
|
||||
<br />
|
||||
<ul data-role="listview" class="ulForm">
|
||||
<li>
|
||||
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
|
||||
|
|
|
|||
90
dashboard-ui/scripts/devices.js
Normal file
90
dashboard-ui/scripts/devices.js
Normal file
|
|
@ -0,0 +1,90 @@
|
|||
(function () {
|
||||
|
||||
function deleteDevice(page, id) {
|
||||
|
||||
var msg = Globalize.translate('DeleteDeviceConfirmation');
|
||||
|
||||
Dashboard.confirm(msg, Globalize.translate('HeaderDeleteDevice'), function (result) {
|
||||
|
||||
if (result) {
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
ApiClient.ajax({
|
||||
type: "DELETE",
|
||||
url: ApiClient.getUrl('Devices', {
|
||||
Id: id
|
||||
})
|
||||
|
||||
}).done(function () {
|
||||
|
||||
loadData(page);
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function load(page, devices) {
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<ul data-role="listview" data-inset="true" data-split-icon="minus">';
|
||||
|
||||
html += devices.map(function (d) {
|
||||
|
||||
var deviceHtml = '';
|
||||
deviceHtml += '<li>';
|
||||
|
||||
deviceHtml += '<a href="#">';
|
||||
|
||||
deviceHtml += '<h3>';
|
||||
deviceHtml += d.Name;
|
||||
deviceHtml += '</h3>';
|
||||
|
||||
if (d.LastUserName) {
|
||||
deviceHtml += '<p style="color:green;">';
|
||||
deviceHtml += Globalize.translate('DeviceLastUsedByUserName', d.LastUserName);
|
||||
deviceHtml += '</p>';
|
||||
}
|
||||
|
||||
deviceHtml += '</a>';
|
||||
|
||||
deviceHtml += '<a href="#" data-icon="minus" class="btnDeleteDevice" data-id="' + d.Id + '">';
|
||||
deviceHtml += Globalize.translate('Delete');
|
||||
deviceHtml += '</a>';
|
||||
|
||||
|
||||
deviceHtml += '</li>';
|
||||
return deviceHtml;
|
||||
|
||||
}).join('');
|
||||
|
||||
html += '</ul>';
|
||||
|
||||
var elem = $('.devicesList', page).html(html).trigger('create');
|
||||
|
||||
$('.btnDeleteDevice', elem).on('click', function () {
|
||||
|
||||
deleteDevice(page, this.getAttribute('data-id'));
|
||||
});
|
||||
}
|
||||
|
||||
function loadData(page) {
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
ApiClient.getJSON(ApiClient.getUrl('Devices')).done(function (devices) {
|
||||
|
||||
load(page, devices);
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
|
||||
$(document).on('pageshow', "#devicesPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
loadData(page);
|
||||
|
||||
});
|
||||
|
||||
})();
|
||||
140
dashboard-ui/scripts/devicesupload.js
Normal file
140
dashboard-ui/scripts/devicesupload.js
Normal file
|
|
@ -0,0 +1,140 @@
|
|||
(function () {
|
||||
|
||||
function load(page, devices, config) {
|
||||
|
||||
if (devices.length) {
|
||||
$('.noDevices', page).hide();
|
||||
$('.devicesUploadForm', page).show();
|
||||
} else {
|
||||
$('.noDevices', page).show();
|
||||
$('.devicesUploadForm', page).hide();
|
||||
}
|
||||
|
||||
$('#txtUploadPath', page).val(config.CameraUploadPath || '');
|
||||
|
||||
loadDeviceList(page, devices, config);
|
||||
}
|
||||
|
||||
function loadDeviceList(page, devices, config) {
|
||||
|
||||
var html = '';
|
||||
|
||||
html += '<fieldset data-role="controlgroup">';
|
||||
|
||||
html += '<legend>';
|
||||
html += Globalize.translate('LabelEnableCameraUploadFor');
|
||||
html += '</legend>';
|
||||
|
||||
var index = 0;
|
||||
html += devices.map(function (d) {
|
||||
|
||||
var deviceHtml = '';
|
||||
|
||||
var id = "chk" + index;
|
||||
|
||||
deviceHtml += '<label for="' + id + '">';
|
||||
deviceHtml += d.Name;
|
||||
deviceHtml += '</label>';
|
||||
|
||||
var isChecked = config.EnabledCameraUploadDevices.indexOf(d.Id) != -1;
|
||||
var checkedHtml = isChecked ? ' checked="checked"' : '';
|
||||
|
||||
deviceHtml += '<input type="checkbox" id="' + id + '" class="chkDevice" data-id="' + d.Id + '"' + checkedHtml + ' />';
|
||||
|
||||
index++;
|
||||
|
||||
return deviceHtml;
|
||||
|
||||
}).join('');
|
||||
|
||||
html += '</fieldset>';
|
||||
|
||||
html += '<div class="fieldDescription">';
|
||||
html += Globalize.translate('LabelEnableCameraUploadForHelp');
|
||||
html += '</div>';
|
||||
|
||||
$('.devicesList', page).html(html).trigger('create');
|
||||
}
|
||||
|
||||
function loadData(page) {
|
||||
|
||||
Dashboard.showLoadingMsg();
|
||||
|
||||
var promise1 = ApiClient.getNamedConfiguration("devices");
|
||||
var promise2 = ApiClient.getJSON(ApiClient.getUrl('Devices', {
|
||||
|
||||
SupportsContentUploading: true
|
||||
|
||||
}));
|
||||
|
||||
$.when(promise1, promise2).done(function (response1, response2) {
|
||||
|
||||
|
||||
load(page, response2[0], response1[0]);
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
});
|
||||
}
|
||||
|
||||
function save(page) {
|
||||
|
||||
ApiClient.getNamedConfiguration("devices").done(function (config) {
|
||||
|
||||
config.CameraUploadPath = $('#txtUploadPath', page).val();
|
||||
|
||||
config.EnabledCameraUploadDevices = $('.chkDevice:checked', page).get().map(function (c) {
|
||||
|
||||
return c.getAttribute('data-id');
|
||||
|
||||
});
|
||||
|
||||
ApiClient.updateNamedConfiguration("devices", config).done(Dashboard.processServerConfigurationUpdateResult);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
$(document).on('pageinit', "#devicesUploadPage", 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', "#devicesUploadPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
loadData(page);
|
||||
|
||||
});
|
||||
|
||||
window.DevicesUploadPage = {
|
||||
|
||||
onSubmit: function () {
|
||||
|
||||
var form = this;
|
||||
var page = $(form).parents('.page');
|
||||
|
||||
save(page);
|
||||
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
})();
|
||||
|
|
@ -678,6 +678,10 @@ var Dashboard = {
|
|||
name: Globalize.translate('TabServer'),
|
||||
href: "dashboard.html",
|
||||
selected: page.hasClass("dashboardHomePage")
|
||||
}, {
|
||||
name: Globalize.translate('TabDevices'),
|
||||
href: "devices.html",
|
||||
selected: page.hasClass("devicesPage")
|
||||
}, {
|
||||
name: Globalize.translate('TabUsers'),
|
||||
href: "userprofiles.html",
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<packages>
|
||||
<package id="MediaBrowser.ApiClient.Javascript" version="3.0.249" targetFramework="net45" />
|
||||
<package id="WebMarkupMin.Core" version="0.9.6" targetFramework="net45" />
|
||||
<package id="WebMarkupMin.Core" version="0.9.7" targetFramework="net45" />
|
||||
</packages>
|
||||
Loading…
Add table
Add a link
Reference in a new issue