mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Remove jquery from autoorganize scripts

Browse source
This commit is contained in:
softworkz 2016-08-15 05:09:08 +02:00
parent b7eaf270a1
commit cbc8ff2aed
8 changed files with 308 additions and 194 deletions
Download patch file Download diff file Expand all files Collapse all files

9
dashboard-ui/autoorganizelog.html
View file

@ -1,9 +1,8 @@
<div id="libraryFileOrganizerLogPage" data-role="page" class="page type-interior organizePage withTabs fullWidthContent" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Auto-Organize" data-require="jqmtable,scripts/autoorganizelog,detailtablecss">
<div id="libraryFileOrganizerLogPage" data-role="page" class="page type-interior organizePage withTabs fullWidthContent" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Auto-Organize">
<div data-role="content">
<div class="content-primary">
<div>
<div style="text-align:right;" class="organizeTaskPanel hide">
<button is="emby-button" type="button" class="btnClearLog raised subdued">
<i class="md-icon">clear_all</i><span>${ButtonClear}</span>
@ -13,8 +12,9 @@
</div>
<div class="listTopPaging">
</div>
</div>
<table data-role="table" data-mode="reflow" class="tblOrganizationResults stripedTable ui-responsive table-stroke">
<div class="autoorganizetable">
<table class="tblOrganizationResults table" style="border-collapse:collapse;">
<thead>
<tr>
<th data-priority="1"></th>
@ -26,6 +26,7 @@
</thead>
<tbody class="resultBody"></tbody>
</table>
</div>
<br />
<div style="text-align: right;vertical-align:middle;" class="legend">
<div style="display: inline-block; height: 10px; width: 10px; background: green;margin-right:1px;"></div>

2
dashboard-ui/autoorganizesmart.html
View file

@ -1,4 +1,4 @@
<div id="libraryFileOrganizerSmartMatchPage" data-role="page" class="page type-interior organizePage withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Auto-Organize" data-require="scripts/autoorganizesmart">
<div id="libraryFileOrganizerSmartMatchPage" data-role="page" class="page type-interior organizePage withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Auto-Organize">
<div data-role="content">
<div class="content-primary">

3
dashboard-ui/autoorganizetv.html
View file

@ -1,5 +1,4 @@
<div id="libraryFileOrganizerPage" data-role="page" class="page type-interior organizePage withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Auto-Organize" data-require="emby-collapse,jqmtable,scripts/autoorganizetv,paper-input,paper-checkbox">
<div id="libraryFileOrganizerPage" data-role="page" class="page type-interior organizePage withTabs" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Auto-Organize">
<div data-role="content">
<div class="content-primary">

68
dashboard-ui/css/autoorganizetable.css Normal file
View file

@ -0,0 +1,68 @@
.autoorganizetable > .table {
width: 100%;
}
.autoorganizetable > .table > tbody > tr > td {
padding: 0.4em;
}
.autoorganizetable .fileCell {
word-wrap: break-word;
word-break: break-all;
}
.autoorganizetable > .table > thead > th {
text-align: left;
}
.autoorganizetable tbody tr:nth-child(odd) td,
.autoorganizetable tbody tr:nth-child(odd) th {
background-color: #eeeeee; /* non-RGBA fallback */
background-color: rgba(0,0,0,.04);
}
@media screen and (max-width: 800px) {
.autoorganizetable > .table {
margin-bottom: 0;
background-color: transparent;
}
.autoorganizetable .spinnerCell {
display: none !important;
}
.autoorganizetable > .table > thead,
.autoorganizetable > .table > tfoot {
display: none;
}
.autoorganizetable > .table > tbody {
display: block;
}
.autoorganizetable > .table > tbody > tr {
display: block;
border: 1px solid #e0e0e0;
border-radius: 2px;
margin-bottom: 1.6rem;
}
.autoorganizetable > .table > tbody > tr > td {
background-color: #eeeeee; /* non-RGBA fallback */
background-color: rgba(0,0,0,.04);
display: block;
vertical-align: middle;
text-align: left;
text-overflow: ellipsis;
padding: 0.4em;
}
.autoorganizetable > .table > tbody > tr > td[data-title]:before {
content: attr(data-title);
float: left;
font-size: inherit;
font-weight: bold;
min-width: 20%;
}
}

146
dashboard-ui/scripts/autoorganizelog.js
View file

@ -1,4 +1,4 @@
define(['jQuery', 'serverNotifications', 'events', 'scripts/taskbutton', 'datetime', 'paper-icon-button-light'], function ($, serverNotifications, events, taskButton, datetime) {
define(['serverNotifications', 'events', 'scripts/taskbutton', 'datetime', 'paper-icon-button-light'], function (serverNotifications, events, taskButton, datetime) {
var query = {
@ -7,6 +7,20 @@
};
var currentResult;
var page;
function parentWithClass(elem, className) {
while (!elem.classList || !elem.classList.contains(className)) {
elem = elem.parentNode;
if (!elem) {
return null;
}
}
return elem;
}
function showStatusMessage(id) {
@ -167,28 +181,10 @@
return html;
}).join('');
var elem = $('.resultBody', page).html(rows).parents('.tblOrganizationResults').table('refresh').trigger('create');
var resultBody = page.querySelector('.resultBody');
resultBody.innerHTML = rows;
$('.btnShowStatusMessage', elem).on('click', function () {
var id = this.getAttribute('data-resultid');
showStatusMessage(id);
});
$('.btnProcessResult', elem).on('click', function () {
var id = this.getAttribute('data-resultid');
organizeFile(page, id);
});
$('.btnDeleteResult', elem).on('click', function () {
var id = this.getAttribute('data-resultid');
deleteOriginalFile(page, id);
});
resultBody.addEventListener('click', handleItemClick);
var pagingHtml = LibraryBrowser.getQueryPagingHtml({
startIndex: query.StartIndex,
@ -198,32 +194,43 @@
updatePageSizeSetting: false
});
$(page)[0].querySelector('.listTopPaging').innerHTML = pagingHtml;
var topPaging = page.querySelector('.listTopPaging');
topPaging.innerHTML = pagingHtml;
if (result.TotalRecordCount > query.Limit && result.TotalRecordCount > 50) {
var bottomPaging = page.querySelector('.listBottomPaging');
bottomPaging.innerHTML = pagingHtml;
$('.listBottomPaging', page).html(pagingHtml).trigger('create');
} else {
$('.listBottomPaging', page).empty();
}
$('.btnNextPage', page).on('click', function () {
var btnNextTop = topPaging.querySelector(".btnNextPage");
var btnNextBottom = bottomPaging.querySelector(".btnNextPage");
var btnPrevTop = topPaging.querySelector(".btnPreviousPage");
var btnPrevBottom = bottomPaging.querySelector(".btnPreviousPage");
btnNextTop.addEventListener('click', function () {
query.StartIndex += query.Limit;
reloadItems(page, true);
});
$('.btnPreviousPage', page).on('click', function () {
btnNextBottom.addEventListener('click', function () {
query.StartIndex += query.Limit;
reloadItems(page, true);
});
btnPrevTop.addEventListener('click', function () {
query.StartIndex -= query.Limit;
reloadItems(page, true);
});
btnPrevBottom.addEventListener('click', function () {
query.StartIndex -= query.Limit;
reloadItems(page, true);
});
var btnClearLog = page.querySelector('.btnClearLog');
if (result.TotalRecordCount) {
page.querySelector('.btnClearLog').classList.remove('hide');
btnClearLog.classList.remove('hide');
} else {
page.querySelector('.btnClearLog').classList.add('hide');
btnClearLog.classList.add('hide');
}
}
@ -236,12 +243,12 @@
html += '<img src="css/images/throbber.gif" alt="" class="syncSpinner' + hide + '" style="vertical-align: middle;" />';
html += '</td>';
html += '<td>';
html += '<td data-title="Date">';
var date = datetime.parseISO8601Date(item.Date, true);
html += date.toLocaleDateString();
html += '</td>';
html += '<td>';
html += '<td data-title="Source" class="fileCell">';
var status = item.Status;
if (item.IsInProgress) {
@ -265,7 +272,7 @@
}
html += '</td>';
html += '<td>';
html += '<td data-title="Destination" class="fileCell">';
html += item.TargetPath || '';
html += '</td>';
@ -282,9 +289,33 @@
return html;
}
function onServerEvent(e, apiClient, data) {
function handleItemClick(e) {
var page = $.mobile.activePage;
var id;
var buttonStatus = parentWithClass(e.target, 'btnShowStatusMessage');
if (buttonStatus) {
id = buttonStatus.getAttribute('data-resultid');
showStatusMessage(id);
}
var buttonOrganize = parentWithClass(e.target, 'btnProcessResult');
if (buttonOrganize) {
id = buttonOrganize.getAttribute('data-resultid');
organizeFile(e.view, id);
}
var buttonDelete = parentWithClass(e.target, 'btnDeleteResult');
if (buttonDelete) {
id = buttonDelete.getAttribute('data-resultid');
deleteOriginalFile(e.view, id);
}
}
function onServerEvent(e, apiClient, data) {
if (data) {
@ -322,49 +353,48 @@
}];
}
$(document).on('pageinit', "#libraryFileOrganizerLogPage", function () {
var page = this;
return function (view, params) {
$('.btnClearLog', page).on('click', function () {
page = view;
var clearButton = view.querySelector('.btnClearLog');
clearButton.addEventListener('click', function () {
ApiClient.clearOrganizationLog().then(function () {
reloadItems(page, true);
reloadItems(view, true);
}, Dashboard.processErrorResponse);
});
}).on('pageshow', '#libraryFileOrganizerLogPage', function () {
view.addEventListener('viewshow', function (e) {
LibraryMenu.setTabs('autoorganize', 0, getTabs);
var page = this;
reloadItems(view, true);
reloadItems(page, true);
events.on(serverNotifications, 'AutoOrganizeUpdate', onServerEvent);
// on here
taskButton({
mode: 'on',
progressElem: page.querySelector('.organizeProgress'),
panel: page.querySelector('.organizeTaskPanel'),
progressElem: view.querySelector('.organizeProgress'),
panel: view.querySelector('.organizeTaskPanel'),
taskKey: 'AutoOrganize',
button: page.querySelector('.btnOrganize')
button: view.querySelector('.btnOrganize')
});
});
events.on(serverNotifications, 'AutoOrganizeUpdate', onServerEvent);
}).on('pagebeforehide', '#libraryFileOrganizerLogPage', function () {
var page = this;
view.addEventListener('viewhide', function (e) {
currentResult = null;
events.off(serverNotifications, 'AutoOrganizeUpdate', onServerEvent);
// off here
taskButton({
mode: 'off',
button: page.querySelector('.btnOrganize')
button: view.querySelector('.btnOrganize')
});
events.off(serverNotifications, 'AutoOrganizeUpdate', onServerEvent);
});
};
});

52
dashboard-ui/scripts/autoorganizesmart.js
View file

@ -1,4 +1,4 @@
define(['jQuery', 'listViewStyle'], function ($) {
define(['listViewStyle'], function () {
var query = {
@ -8,6 +8,19 @@
var currentResult;
function parentWithClass(elem, className) {
while (!elem.classList || !elem.classList.contains(className)) {
elem = elem.parentNode;
if (!elem) {
return null;
}
}
return elem;
}
function reloadList(page) {
Dashboard.showLoadingMsg();
@ -93,7 +106,8 @@
html += "</div>";
}
$('.divMatchInfos', page).html(html);
var matchInfos = page.querySelector('.divMatchInfos');
matchInfos.innerHTML = html;
}
function getTabs() {
@ -112,13 +126,18 @@
}];
}
$(document).on('pageinit', "#libraryFileOrganizerSmartMatchPage", function () {
return function (view, params) {
var page = this;
var self = this;
$('.divMatchInfos', page).on('click', '.btnDeleteMatchEntry', function () {
var divInfos = view.querySelector('.divMatchInfos');
divInfos.addEventListener('click', function (e) {
var button = parentWithClass(e.target, 'btnDeleteMatchEntry');
if (button) {
var button = this;
var index = parseInt(button.getAttribute('data-index'));
var matchIndex = parseInt(button.getAttribute('data-matchindex'));
@ -131,26 +150,23 @@
ApiClient.deleteSmartMatchEntries(entries).then(function () {
reloadList(page);
reloadList(view);
}, Dashboard.processErrorResponse);
}
});
}).on('pageshow', "#libraryFileOrganizerSmartMatchPage", function () {
var page = this;
view.addEventListener('viewshow', function (e) {
LibraryMenu.setTabs('autoorganize', 2, getTabs);
Dashboard.showLoadingMsg();
reloadList(page);
}).on('pagebeforehide', "#libraryFileOrganizerSmartMatchPage", function () {
var page = this;
currentResult = null;
reloadList(view);
});
view.addEventListener('viewhide', function (e) {
currentResult = null;
});
};
});

146
dashboard-ui/scripts/autoorganizetv.js
View file

@ -1,13 +1,4 @@
define(['jQuery'], function ($) {
function updateSeasonPatternHelp(page, value) {
var resultValue = value.replace('%s', '1').replace('%0s', '01').replace('%00s', '001');
var replacementHtmlResult = Globalize.translate('OrganizePatternResult').replace('{0}', resultValue);
$('.seasonFolderFieldDescription', page).html(replacementHtmlResult);
}
define([], function () {
function getEpisodeFileName(value, enableMultiEpisode) {
@ -38,70 +29,50 @@
.replace('%00e', '004');
}
function updateEpisodePatternHelp(page, value) {
value = getEpisodeFileName(value, false);
var replacementHtmlResult = Globalize.translate('OrganizePatternResult').replace('{0}', value);
$('.episodePatternDescription', page).html(replacementHtmlResult);
}
function updateMultiEpisodePatternHelp(page, value) {
value = getEpisodeFileName(value, true);
var replacementHtmlResult = Globalize.translate('OrganizePatternResult').replace('{0}', value);
$('.multiEpisodePatternDescription', page).html(replacementHtmlResult);
}
function loadPage(page, config) {
function loadPage(view, config) {
var tvOptions = config.TvOptions;
$('#chkEnableTvSorting', page).checked(tvOptions.IsEnabled);
$('#chkOverwriteExistingEpisodes', page).checked(tvOptions.OverwriteExistingEpisodes);
$('#chkDeleteEmptyFolders', page).checked(tvOptions.DeleteEmptyFolders);
view.querySelector('#chkEnableTvSorting').checked = tvOptions.IsEnabled;
view.querySelector('#chkOverwriteExistingEpisodes').checked = tvOptions.OverwriteExistingEpisodes;
view.querySelector('#chkDeleteEmptyFolders').checked = tvOptions.DeleteEmptyFolders;
$('#txtMinFileSize', page).val(tvOptions.MinFileSizeMb);
$('#txtSeasonFolderPattern', page).val(tvOptions.SeasonFolderPattern).trigger('change');
$('#txtSeasonZeroName', page).val(tvOptions.SeasonZeroFolderName);
$('#txtWatchFolder', page).val(tvOptions.WatchLocations[0] || '');
view.querySelector('#txtMinFileSize').value = tvOptions.MinFileSizeMb;
view.querySelector('#txtSeasonFolderPattern').value = tvOptions.SeasonFolderPattern;
view.querySelector('#txtSeasonZeroName').value = tvOptions.SeasonZeroFolderName;
view.querySelector('#txtWatchFolder').value = tvOptions.WatchLocations[0] || '';
$('#txtEpisodePattern', page).val(tvOptions.EpisodeNamePattern).trigger('change');
$('#txtMultiEpisodePattern', page).val(tvOptions.MultiEpisodeNamePattern).trigger('change');
view.querySelector('#txtEpisodePattern').value = tvOptions.EpisodeNamePattern;
view.querySelector('#txtMultiEpisodePattern').value = tvOptions.MultiEpisodeNamePattern;
$('#txtDeleteLeftOverFiles', page).val(tvOptions.LeftOverFileExtensionsToDelete.join(';'));
$('#copyOrMoveFile', page).val(tvOptions.CopyOriginalFile.toString());
view.querySelector('#txtDeleteLeftOverFiles').value = tvOptions.LeftOverFileExtensionsToDelete.join(';');
view.querySelector('#copyOrMoveFile').value = tvOptions.CopyOriginalFile.toString();
}
function onSubmit() {
var form = this;
function onSubmit(view) {
ApiClient.getNamedConfiguration('autoorganize').then(function (config) {
var tvOptions = config.TvOptions;
tvOptions.IsEnabled = $('#chkEnableTvSorting', form).checked();
tvOptions.OverwriteExistingEpisodes = $('#chkOverwriteExistingEpisodes', form).checked();
tvOptions.DeleteEmptyFolders = $('#chkDeleteEmptyFolders', form).checked();
tvOptions.IsEnabled = view.querySelector('#chkEnableTvSorting').checked;
tvOptions.OverwriteExistingEpisodes = view.querySelector('#chkOverwriteExistingEpisodes').checked;
tvOptions.DeleteEmptyFolders = view.querySelector('#chkDeleteEmptyFolders').checked;
tvOptions.MinFileSizeMb = $('#txtMinFileSize', form).val();
tvOptions.SeasonFolderPattern = $('#txtSeasonFolderPattern', form).val();
tvOptions.SeasonZeroFolderName = $('#txtSeasonZeroName', form).val();
tvOptions.MinFileSizeMb = view.querySelector('#txtMinFileSize').value;
tvOptions.SeasonFolderPattern = view.querySelector('#txtSeasonFolderPattern').value;
tvOptions.SeasonZeroFolderName = view.querySelector('#txtSeasonZeroName').value;
tvOptions.EpisodeNamePattern = $('#txtEpisodePattern', form).val();
tvOptions.MultiEpisodeNamePattern = $('#txtMultiEpisodePattern', form).val();
tvOptions.EpisodeNamePattern = view.querySelector('#txtEpisodePattern').value;
tvOptions.MultiEpisodeNamePattern = view.querySelector('#txtMultiEpisodePattern').value;
tvOptions.LeftOverFileExtensionsToDelete = $('#txtDeleteLeftOverFiles', form).val().split(';');
tvOptions.LeftOverFileExtensionsToDelete = view.querySelector('#txtDeleteLeftOverFiles').value.split(';');
var watchLocation = $('#txtWatchFolder', form).val();
var watchLocation = view.querySelector('#txtWatchFolder').value;
tvOptions.WatchLocations = watchLocation ? [watchLocation] : [];
tvOptions.CopyOriginalFile = $('#copyOrMoveFile', form).val();
tvOptions.CopyOriginalFile = view.querySelector('#copyOrMoveFile').value;
ApiClient.updateNamedConfiguration('autoorganize', config).then(Dashboard.processServerConfigurationUpdateResult, Dashboard.processErrorResponse);
});
@ -125,29 +96,40 @@
}];
}
$(document).on('pageinit', "#libraryFileOrganizerPage", function () {
return function (view, params) {
var page = this;
$('#txtSeasonFolderPattern', page).on('change keyup', function () {
function updateSeasonPatternHelp() {
updateSeasonPatternHelp(page, this.value);
var value = view.querySelector('#txtSeasonFolderPattern').value;
value = value.replace('%s', '1').replace('%0s', '01').replace('%00s', '001');
});
var replacementHtmlResult = Globalize.translate('OrganizePatternResult').replace('{0}', value);
$('#txtEpisodePattern', page).on('change keyup', function () {
view.querySelector('.seasonFolderFieldDescription').innerHTML = replacementHtmlResult;
}
updateEpisodePatternHelp(page, this.value);
function updateEpisodePatternHelp() {
});
var value = view.querySelector('#txtEpisodePattern').value;
var fileName = getEpisodeFileName(value, false);
$('#txtMultiEpisodePattern', page).on('change keyup', function () {
var replacementHtmlResult = Globalize.translate('OrganizePatternResult').replace('{0}', fileName);
updateMultiEpisodePatternHelp(page, this.value);
view.querySelector('.episodePatternDescription').innerHTML = replacementHtmlResult;
}
});
function updateMultiEpisodePatternHelp() {
$('#btnSelectWatchFolder', page).on("click.selectDirectory", function () {
var value = view.querySelector('#txtMultiEpisodePattern').value;
var fileName = getEpisodeFileName(value, false);
var replacementHtmlResult = Globalize.translate('OrganizePatternResult').replace('{0}', fileName);
view.querySelector('.multiEpisodePatternDescription').innerHTML = replacementHtmlResult;
}
function selectWatchFolder(e) {
require(['directorybrowser'], function (directoryBrowser) {
@ -158,28 +140,42 @@
callback: function (path) {
if (path) {
$('#txtWatchFolder', page).val(path);
view.querySelector('#txtWatchFolder').value = path;
}
picker.close();
},
header: Globalize.translate('HeaderSelectWatchFolder'),
instruction: Globalize.translate('HeaderSelectWatchFolderHelp')
});
});
}
view.querySelector('#txtSeasonFolderPattern').addEventListener('change', updateSeasonPatternHelp);
view.querySelector('#txtSeasonFolderPattern').addEventListener('keyup', updateSeasonPatternHelp);
view.querySelector('#txtEpisodePattern').addEventListener('change', updateEpisodePatternHelp);
view.querySelector('#txtEpisodePattern').addEventListener('keyup', updateEpisodePatternHelp);
view.querySelector('#txtMultiEpisodePattern').addEventListener('change', updateMultiEpisodePatternHelp);
view.querySelector('#txtMultiEpisodePattern').addEventListener('keyup', updateMultiEpisodePatternHelp);
view.querySelector('#btnSelectWatchFolder').addEventListener('click', selectWatchFolder);
view.querySelector('.libraryFileOrganizerForm').addEventListener('submit', function (e) {
e.preventDefault();
onSubmit(view);
return false;
});
$('.libraryFileOrganizerForm').off('submit', onSubmit).on('submit', onSubmit);
}).on('pageshow', "#libraryFileOrganizerPage", function () {
var page = this;
view.addEventListener('viewshow', function (e) {
LibraryMenu.setTabs('autoorganize', 1, getTabs);
ApiClient.getNamedConfiguration('autoorganize').then(function (config) {
loadPage(page, config);
loadPage(view, config);
updateSeasonPatternHelp();
updateEpisodePatternHelp();
updateMultiEpisodePatternHelp();
});
});
};
});

8
dashboard-ui/scripts/site.js
View file

@ -1758,6 +1758,7 @@ var AppInfo = {};
define("livetvcss", ['css!css/livetv.css']);
define("detailtablecss", ['css!css/detailtable.css']);
define("autoorganizetablecss", ['css!css/autoorganizetable.css']);
define("buttonenabled", ["legacy/buttonenabled"]);
@ -1905,20 +1906,23 @@ var AppInfo = {};
defineRoute({
path: '/autoorganizelog.html',
dependencies: [],
dependencies: ['scripts/taskbutton', 'autoorganizetablecss'],
controller: 'scripts/autoorganizelog',
roles: 'admin'
});
defineRoute({
path: '/autoorganizesmart.html',
dependencies: [],
controller: 'scripts/autoorganizesmart',
autoFocus: false,
roles: 'admin'
});
defineRoute({
path: '/autoorganizetv.html',
dependencies: [],
dependencies: ['jqmtable', 'paper-input', 'paper-checkbox'],
controller: 'scripts/autoorganizetv',
autoFocus: false,
roles: 'admin'
});