jellyfin-web/dashboard-ui/dlnaprofile.html
2014-04-08 22:12:17 -04:00

442 lines
25 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>DLNA</title>
</head>
<body>
<div id="dlnaProfilePage" data-role="page" class="page type-interior adminPage dlnaPage">
<div data-role="content">
<div class="content-primary">
<div data-role="controlgroup" data-type="horizontal" class="localnav" data-mini="true">
<a href="dlnasettings.html" data-role="button">${TabSettings}</a>
<a href="dlnaprofiles.html" data-role="button" class="ui-btn-active">${TabProfiles}</a>
</div>
<form class="dlnaProfileForm" style="max-width: 650px;">
<p>Profile Information</p>
<div data-role="controlgroup" data-type="horizontal" data-mini="true">
<input type="radio" name="radioProfileTab" class="radioTabButton" id="radioInfo" value="tabInfo">
<label for="radioInfo">Info</label>
<input type="radio" name="radioProfileTab" class="radioTabButton" id="radioIdentification" value="tabIdentification">
<label for="radioIdentification">Identification</label>
<input type="radio" name="radioProfileTab" class="radioTabButton" id="radioDirectPlay" value="tabDirectPlayProfiles">
<label for="radioDirectPlay">Direct Play</label>
<input type="radio" name="radioProfileTab" class="radioTabButton" id="radioTranscoding" value="tabTranscodingProfiles">
<label for="radioTranscoding">Transcoding</label>
<input type="radio" name="radioProfileTab" class="radioTabButton" id="radioContainers" value="tabContainerProfiles">
<label for="radioContainers">Containers</label>
<input type="radio" name="radioProfileTab" class="radioTabButton" id="radioCodecs" value="tabCodecProfiles">
<label for="radioCodecs">Codecs</label>
<input type="radio" name="radioProfileTab" class="radioTabButton" id="radioMediaProfiles" value="tabMediaProfiles">
<label for="radioMediaProfiles">Responses</label>
</div>
<br />
<div class="tabContent tabInfo">
<ul data-role="listview" class="ulForm">
<li>
<label for="txtName">Name</label>
<input type="text" id="txtName" data-mini="true" required="required" />
</li>
</ul>
<fieldset data-role="controlgroup">
<legend>Supported Media Types:</legend>
<input type="checkbox" data-mini="true" id="chkAudio" data-value="Audio" class="chkMediaType" />
<label for="chkAudio">Audio</label>
<input type="checkbox" data-mini="true" id="chkPhoto" data-value="Photo" class="chkMediaType" />
<label for="chkPhoto">Photo</label>
<input type="checkbox" data-mini="true" id="chkVideo" data-value="Video" class="chkMediaType" />
<label for="chkVideo">Video</label>
</fieldset>
<br />
<ul data-role="listview" class="ulForm">
<li>
<label for="chkEnableAlbumArtInDidl">Embed album art in Didl</label>
<input type="checkbox" id="chkEnableAlbumArtInDidl" data-mini="true" />
<div class="fieldDescription">Some devices prefer this method for obtaining album art. Others may fail to play with this option enabled.</div>
</li>
</ul>
</div>
<div class="tabContent tabIdentification">
<p>Devices have two forms of identification, device properties and HTTP request headers. At least one form should be supplied.</p>
<br />
<ul data-role="listview" class="ulForm">
<li>
<label for="txtIdFriendlyName">Friendly name</label>
<input type="text" id="txtIdFriendlyName" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdManufacturer">Manufacturer</label>
<input type="text" id="txtIdManufacturer" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdManufacturerUrl">Manufacturer url</label>
<input type="text" id="txtIdManufacturerUrl" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdModelName">Model name</label>
<input type="text" id="txtIdModelName" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdModelNumber">Model number</label>
<input type="text" id="txtIdModelNumber" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdModelDesription">Model description</label>
<input type="text" id="txtIdModelDesription" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdModelUrl">Model url</label>
<input type="text" id="txtIdModelUrl" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdSerialNumber">Serial number</label>
<input type="text" id="txtIdSerialNumber" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
<li>
<label for="txtIdDeviceDescription">Device description</label>
<input type="text" id="txtIdDeviceDescription" data-mini="true" />
<div class="fieldDescription">A case-insensitive substring or regex expression.</div>
</li>
</ul>
</div>
<div class="tabContent tabDirectPlayProfiles">
<p>Add direct play profiles to indicate which formats the device can handle natively.</p>
<button class="btnAddDirectPlayProfile" type="button" data-mini="true" data-icon="plus">New</button>
<br />
<div class="directPlayProfiles"></div>
</div>
<div class="tabContent tabTranscodingProfiles">
<p>Add transcoding profiles to indicate which formats should be used when transcoding is required.</p>
<button class="btnAddTranscodingProfile" type="button" data-mini="true" data-icon="plus">New</button>
<br />
<div class="transcodingProfiles"></div>
</div>
<div class="tabContent tabContainerProfiles">
<p>Container profiles indicate the limitations of a device when playing specific formats. If a limitation applies then the media will be transcoded, even if the format is configured for direct play.</p>
<button class="btnAddContainerProfile" type="button" data-mini="true" data-icon="plus">New</button>
<br />
<div class="containerProfiles"></div>
</div>
<div class="tabContent tabCodecProfiles">
<p>Codec profiles indicate the limitations of a device when playing specific codecs. If a limitation applies then the media will be transcoded, even if the codec is configured for direct play.</p>
<button class="btnAddCodecProfile" type="button" data-mini="true" data-icon="plus">New</button>
<br />
<div class="codecProfiles"></div>
</div>
<div class="tabContent tabMediaProfiles">
<p>Response profiles provide a way to customize information sent to the device when playing certain kinds of media.</p>
<button class="btnAddResponseProfile" type="button" data-mini="true" data-icon="plus">New</button>
<br />
<div class="mediaProfiles"></div>
</div>
<br />
<ul data-role="listview" class="ulForm">
<li>
<button class="btnSave" style="display: none;" type="submit" data-theme="b" data-icon="check" data-mini="true">
Save
</button>
<button type="button" onclick="Dashboard.navigate('dlnaprofiles.html');" data-icon="delete" data-mini="true">
Cancel
</button>
</li>
</ul>
</form>
</div>
</div>
<div data-role="popup" data-transition="slidefade" id="popupEditDirectPlayProfile" class="popup">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>Direct Play Profile</h3>
</div>
<div data-role="content">
<form class="editDirectPlayProfileForm">
<div style="margin: 1em 0;">
<label for="selectDirectPlayProfileType">Type:</label>
<select id="selectDirectPlayProfileType" data-mini="true">
<option value="Audio">Audio</option>
<option value="Photo">Photo</option>
<option value="Video">Video</option>
</select>
</div>
<div style="margin: 1em 0;">
<label for="txtDirectPlayContainer">Container:</label>
<input type="text" id="txtDirectPlayContainer" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all containers</div>
</div>
<div id="fldDirectPlayVideoCodec" style="margin: 1em 0;">
<label for="txtDirectPlayVideoCodec">Video codecs:</label>
<input type="text" id="txtDirectPlayVideoCodec" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all containers</div>
</div>
<div id="fldDirectPlayAudioCodec" style="margin: 1em 0 2em;">
<label for="txtDirectPlayAudioCodec">Audio codecs:</label>
<input type="text" id="txtDirectPlayAudioCodec" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all containers</div>
</div>
<p>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
Ok
</button>
<button type="button" data-icon="delete" onclick="$(this).parents('.popup').popup('close');" data-mini="true">
Cancel
</button>
</p>
</form>
</div>
</div>
<div data-role="popup" data-transition="slidefade" id="transcodingProfilePopup" class="popup">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>Transcoding Profile</h3>
</div>
<div data-role="content">
<form class="transcodingProfileForm" style="min-width: 250px;">
<div data-role="controlgroup" data-type="horizontal" data-mini="true">
<input type="radio" name="radioTranscodingTab" class="radioTabButton" id="radioTranscodingBasics" value="tabTranscodingBasics">
<label for="radioTranscodingBasics">Info</label>
<input type="radio" name="radioTranscodingTab" class="radioTabButton" id="radioTranscodingAdvanced" value="tabTranscodingAdvanced">
<label for="radioTranscodingAdvanced">${TabAdvanced}</label>
</div>
<div class="tabContent tabTranscodingBasics" style="display: none;">
<div style="margin: 1em 0;">
<label for="selectTranscodingProfileType">Type:</label>
<select id="selectTranscodingProfileType" data-mini="true">
<option value="Audio">Audio</option>
<option value="Photo">Photo</option>
<option value="Video">Video</option>
</select>
</div>
<div style="margin: 1em 0;">
<label for="txtTranscodingContainer">Containers:</label>
<input type="text" id="txtTranscodingContainer" data-mini="true" required="required" />
</div>
<div id="fldTranscodingVideoCodec" style="margin: 1em 0;">
<label for="txtTranscodingVideoCodec">Video codec:</label>
<input type="text" id="txtTranscodingVideoCodec" data-mini="true" />
</div>
<div id="fldTranscodingAudioCodec" style="margin: 1em 0;">
<label for="txtTranscodingAudioCodec">Audio codec:</label>
<input type="text" id="txtTranscodingAudioCodec" data-mini="true" />
</div>
</div>
<div class="tabContent tabTranscodingAdvanced" style="display: none;">
<div id="fldVideoProfile" style="margin: 1em 0;">
<label for="txtTranscodingVideoProfile">Video profile:</label>
<input type="text" id="txtTranscodingVideoProfile" data-mini="true" />
</div>
<div id="fldEnableMpegtsM2TsMode" style="margin: 1em 0;">
<label for="chkEnableMpegtsM2TsMode">Enable M2ts mode</label>
<input type="checkbox" id="chkEnableMpegtsM2TsMode" data-mini="true" />
<div class="fieldDescription">Enable m2ts mode when encoding to mpegts.</div>
</div>
<div id="fldEstimateContentLength" style="margin: 1em 0;">
<label for="chkEstimateContentLength">Estimate content length when transcoding</label>
<input type="checkbox" id="chkEstimateContentLength" data-mini="true" />
</div>
<div id="fldReportByteRangeRequests" style="margin: 1em 0;">
<label for="chkReportByteRangeRequests">Report that the server supports byte seeking when transcoding</label>
<input type="checkbox" id="chkReportByteRangeRequests" data-mini="true" />
<div class="fieldDescription">This is required for some devices that don't time seek very well.</div>
</div>
</div>
<p>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
Ok
</button>
<button type="button" data-icon="delete" onclick="$(this).parents('.popup').popup('close');" data-mini="true">
Cancel
</button>
</p>
</form>
</div>
</div>
<div data-role="popup" data-transition="slidefade" id="containerProfilePopup" class="popup">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>Container Profile</h3>
</div>
<div data-role="content">
<form class="containerProfileForm" style="min-width: 250px;">
<p>Define additional conditions that must be met in order for a file to be direct played.</p>
<!-- <div data-role="controlgroup" data-type="horizontal" data-mini="true">
<input type="radio" name="radioContainerProfileTab" class="radioTabButton" id="radioContainerProfileInfo" value="tabContainerBasics">
<label for="radioContainerProfileInfo">Info</label>
<input type="radio" name="radioContainerProfileTab" class="radioTabButton" id="radioContainerProfileConditions" value="tabContainerConditions">
<label for="radioContainerProfileConditions">Conditions</label>
</div>-->
<div class="tabContent tabContainerBasics">
<div style="margin: 1em 0;">
<label for="selectContainerProfileType">Type:</label>
<select id="selectContainerProfileType" data-mini="true">
<option value="Photo">Photo</option>
<option value="Video">Video</option>
</select>
</div>
<div style="margin: 1em 0;">
<label for="txtContainerProfileContainer">Containers:</label>
<input type="text" id="txtContainerProfileContainer" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all containers</div>
</div>
</div>
<div class="tabContent tabContainerConditions" style="display: none;">
</div>
<p>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
Ok
</button>
<button type="button" data-icon="delete" onclick="$(this).parents('.popup').popup('close');" data-mini="true">
Cancel
</button>
</p>
</form>
</div>
</div>
<div data-role="popup" data-transition="slidefade" id="codecProfilePopup" class="popup">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>Codec Profile</h3>
</div>
<div data-role="content">
<form class="codecProfileForm" style="min-width: 250px;">
<p>Define additional conditions that must be met in order for a codec to be direct played.</p>
<div style="margin: 1em 0;">
<label for="selectCodecProfileType">Type:</label>
<select id="selectCodecProfileType" data-mini="true">
<option value="Video">Video</option>
<option value="VideoAudio">Video Audio</option>
<option value="Audio">Audio</option>
</select>
</div>
<div style="margin: 1em 0;">
<label for="txtCodecProfileCodec">Codecs:</label>
<input type="text" id="txtCodecProfileCodec" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all codecs</div>
</div>
<p>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
Ok
</button>
<button type="button" data-icon="delete" onclick="$(this).parents('.popup').popup('close');" data-mini="true">
Cancel
</button>
</p>
</form>
</div>
</div>
<div data-role="popup" data-transition="slidefade" id="responseProfilePopup" class="popup">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>Response Profile</h3>
</div>
<div data-role="content">
<form class="editResponseProfileForm">
<div style="margin: 1em 0;">
<label for="selectResponseProfileType">Type:</label>
<select id="selectResponseProfileType" data-mini="true">
<option value="Audio">Audio</option>
<option value="Photo">Photo</option>
<option value="Video">Video</option>
</select>
</div>
<div style="margin: 1em 0;">
<label for="txtResponseProfileContainer">Container:</label>
<input type="text" id="txtResponseProfileContainer" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all containers</div>
</div>
<div id="fldResponseProfileVideoCodec" style="margin: 1em 0;">
<label for="txtResponseProfileVideoCodec">Video codecs:</label>
<input type="text" id="txtResponseProfileVideoCodec" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all codecs</div>
</div>
<div id="fldResponseProfileAudioCodec" style="margin: 1em 0 2em;">
<label for="txtResponseProfileAudioCodec">Audio codecs:</label>
<input type="text" id="txtResponseProfileAudioCodec" data-mini="true" />
<div>Separated by comma. This can be left empty to apply to all codecs</div>
</div>
<p>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
Ok
</button>
<button type="button" data-icon="delete" onclick="$(this).parents('.popup').popup('close');" data-mini="true">
Cancel
</button>
</p>
</form>
</div>
</div>
<script type="text/javascript">
$('.dlnaProfileForm').off('submit', DlnaProfilePage.onSubmit).on('submit', DlnaProfilePage.onSubmit);
$('.editDirectPlayProfileForm').off('submit', DlnaProfilePage.onDirectPlayFormSubmit).on('submit', DlnaProfilePage.onDirectPlayFormSubmit);
$('.transcodingProfileForm').off('submit', DlnaProfilePage.onTranscodingProfileFormSubmit).on('submit', DlnaProfilePage.onTranscodingProfileFormSubmit);
$('.containerProfileForm').off('submit', DlnaProfilePage.onContainerProfileFormSubmit).on('submit', DlnaProfilePage.onContainerProfileFormSubmit);
$('.codecProfileForm').off('submit', DlnaProfilePage.onCodecProfileFormSubmit).on('submit', DlnaProfilePage.onCodecProfileFormSubmit);
$('.editResponseProfileForm').off('submit', DlnaProfilePage.onResponseProfileFormSubmit).on('submit', DlnaProfilePage.onResponseProfileFormSubmit);
</script>
</div>
</body>
</html>