jellyfin-web/dashboard-ui/edititemimages.html
2013-06-27 14:40:50 -04:00

94 lines
4.4 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Media Browser</title>
</head>
<body>
<div id="editItemImagesPage" data-role="page" class="page libraryPage" data-theme="a">
<div class="ui-bar-c parentName" style="display: none;">
</div>
<div data-role="content">
<div class="ehsContent">
<h1 class="itemName detailPageName"></h1>
<br />
<div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
<a href="#" data-role="button" onclick="Dashboard.navigate('edititemmetadata.html', true);">Metadata</a>
<a id="peopleTab" style="display: none;" href="#" data-role="button" onclick="Dashboard.navigate('edititempeople.html', true);">People</a>
<a href="#" data-role="button" class="ui-btn-active">Images</a>
</div>
<div style="text-align: center; margin: -25px 0 1em;">
<a href="#popupUpload" data-rel="popup" data-role="button" data-inline="true" data-icon="plus" data-mini="true" data-transition="pop">Upload Image</a>
</div>
<div id="imagesContainer" style="display: none;">
<div data-role="collapsible" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Images</h3>
<div id="images">
</div>
</div>
</div>
<div id="backdropsContainer" style="display: none;">
<div data-role="collapsible" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Backdrops</h3>
<div id="backdrops">
</div>
</div>
</div>
<div id="screenshotsContainer" style="display: none;">
<div data-role="collapsible" data-mini="true" data-collapsed="false" data-corners="false">
<h3>Screenshots</h3>
<div id="screenshots">
</div>
</div>
</div>
</div>
</div>
<div data-role="popup" id="popupUpload" class="ui-corner-all" data-theme="c">
<form id="uploadItemImageForm" style="max-width: 100%; margin: 0 1.5em 1.5em;">
<h2>Add/Update Image</h2>
<div>
<p>JPG/PNG only.</p>
<input type="file" accept="image/*" id="uploadImage" name="uploadImage" data-theme="c" />
<div id="imageDropZone" class="imageDropZone">
<h3>Drop Image Here</h3>
<output id="imageOutput"></output>
</div>
<div id="fldUpload" style="display: none;">
<p data-role="fieldcontain">
<label for="selectImageType">Image Type:</label>
<select id="selectImageType" name="selectImageType" data-theme="c">
<option value="Primary">Primary</option>
<option value="Art">Art</option>
<option value="Backdrop">Backdrop</option>
<option value="Banner">Banner</option>
<option value="Box">Box</option>
<option value="BoxRear">Box rear</option>
<option value="Disc">Disc</option>
<option value="Logo">Logo</option>
<option value="Menu">Menu</option>
<option value="Screenshot">Screenshot</option>
<option value="Thumb">Thumb</option>
</select>
</p>
<button type="submit" data-icon="picture" data-theme="b">Upload</button>
</div>
<a data-role="button" data-rel="back" data-icon="delete" data-theme="c" onclick="$('#uploadImage').val('').trigger('change');">Cancel</a>
</div>
</form>
</div>
<script type="text/javascript">
$('#uploadItemImageForm').on('submit', EditItemImagesPage.onSubmit);
</script>
</div>
</body>
</html>