jellyfin-web/dashboard-ui/edititemimages.html
2015-03-02 00:16:29 -05:00

156 lines
8.2 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>${TitleMediaBrowser}</title>
</head>
<body>
<div id="editItemImagesPage" data-role="page" class="page libraryPage metadataEditorPage" data-contextname="${HeaderMetadataManager}">
<div data-role="content editPageContent">
<div class="editPageSidebar">
<div class="libraryTree">
<ul></ul>
</div>
</div>
<div class="editPageInnerContent">
<h1 class="itemName editPageName">&nbsp;</h1>
<br />
<div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
<a href="#" data-role="button" id="btnEditMetadata">${TabMetadata}</a>
<a id="btnEditSubtitles" style="display: none;" href="#" data-role="button">${TabSubtitles}</a>
<a id="btnEditCollectionTitles" style="display: none;" href="#" data-role="button">${TabCollectionTitles}</a>
<a href="#" data-role="button" class="ui-btn-active">${TabImages}</a>
</div>
<div style="margin: -25px 0 1em;">
<div style="display: inline-block;">
<a class="lnkBrowseImages lnkBrowseAllImages hide" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-icon="cloud" data-mini="true">${ButtonBrowseImages}</a>
</div>
<div style="display: inline-block;">
<a href="#popupUpload" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-icon="plus" data-mini="true">${ButtonUpload}</a>
</div>
</div>
<div id="imagesContainer" style="display: none;">
<div data-role="collapsible" data-mini="true" data-collapsed="false" class="imageEditorCollapsible" data-content-theme="false">
<h3>${HeaderImages}</h3>
<div id="images">
</div>
</div>
</div>
<div id="backdropsContainer" style="display: none;">
<div data-role="collapsible" data-mini="true" data-collapsed="false" class="imageEditorCollapsible" data-content-theme="false">
<h3>${HeaderBackdrops}</h3>
<div id="backdrops">
</div>
</div>
</div>
<div id="screenshotsContainer" style="display: none;">
<div data-role="collapsible" data-mini="true" data-collapsed="false" class="imageEditorCollapsible" data-content-theme="false">
<h3>${Screenshots}</h3>
<div id="screenshots">
</div>
</div>
</div>
</div>
</div>
<div data-role="popup" id="popupUpload" data-theme="a">
<form id="uploadItemImageForm" style="max-width: 100%; margin: 0 1.5em 1.5em;">
<h2>${HeaderAddUpdateImage}</h2>
<div>
<p>${LabelJpgPngOnly}</p>
<input type="file" accept="image/*" id="uploadImage" name="uploadImage" />
<div id="imageDropZone" class="imageDropZone">
<h3>${LabelDropImageHere}</h3>
<output id="imageOutput"></output>
</div>
<div id="fldUpload" style="display: none;">
<p data-role="fieldcontain">
<label for="selectImageType">${LabelImageType}</label>
<select id="selectImageType" name="selectImageType">
<option value="Primary">${OptionPrimary}</option>
<option value="Art">${OptionArt}</option>
<option value="Backdrop">${OptionBackdrop}</option>
<option value="Banner">${OptionBanner}</option>
<option value="Box">${OptionBox}</option>
<option value="BoxRear">${OptionBoxRear}</option>
<option value="Disc">${OptionDisc}</option>
<option value="Icon">${OptionIcon}</option>
<option value="Logo">${OptionLogo}</option>
<option value="Menu">${OptionMenu}</option>
<option value="Screenshot">${OptionScreenshot}</option>
<option value="Thumb">${OptionThumb}</option>
</select>
</p>
<button type="submit" data-icon="check" data-theme="b">${ButtonUpload}</button>
</div>
<a data-role="button" data-rel="back" data-icon="delete" onclick="$('#uploadImage').val('').trigger('change');">${ButtonCancel}</a>
</div>
</form>
</div>
<div data-role="popup" class="popup popupDownload" data-theme="a">
<a href="#" data-rel="back" data-role="button" data-icon="delete" data-iconpos="notext" class="ui-btn-right" data-theme="b">${ButtonClose}</a>
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>${HeaderBrowseOnlineImages}</h3>
</div>
<div data-role="content">
<div style="text-align: center;">
<div style="margin: 0; display: inline-block;">
<label for="selectImageProvider">${LabelSource}</label>
</div>
<div style="margin: 0; display: inline-block;">
<select id="selectImageProvider" name="selectImageProvider" data-mini="true" data-inline="true">
<option value="">${OptionAll}</option>
</select>
</div>
<div style="margin: 0; display: inline-block;">
<label for="selectBrowsableImageType">${LabelImage}</label>
</div>
<div style="margin: 0; display: inline-block;">
<select id="selectBrowsableImageType" name="selectBrowsableImageType" data-mini="true" data-inline="true">
<option value="Primary">${OptionPrimary}</option>
<option value="Art">${OptionArt}</option>
<option value="Backdrop">${OptionBackdrop}</option>
<option value="Banner">${OptionBanner}</option>
<option value="Box">${OptionBox}</option>
<option value="BoxRear">${OptionBoxRear}</option>
<option value="Disc">${OptionDisc}</option>
<option value="Icon">${OptionIcon}</option>
<option value="Logo">${OptionLogo}</option>
<option value="Menu">${OptionMenu}</option>
<option value="Screenshot">${OptionScreenshot}</option>
<option value="Thumb">${OptionThumb}</option>
</select>
</div>
<div class="availableImagesPaging" style="margin: 0; display: inline-block;"></div>
<div style="margin: 0; display: inline-block; vertical-align: middle; margin-left: 10px;">
<label for="chkAllLanguages">${LabelAllLanguages}</label>
<input type="checkbox" id="chkAllLanguages" data-mini="true" />
</div>
</div>
<div class="availableImagesList"></div>
<div style="text-align: center;">
<a href="#" data-rel="back" data-role="button" data-mini="true" data-inline="true" data-icon="delete">${ButtonClose}</a>
</div>
</div>
</div>
<script type="text/javascript">
$('#uploadItemImageForm').on('submit', EditItemImagesPage.onSubmit);
</script>
</div>
</body>
</html>