jellyfin-web/dashboard-ui/edititemmetadata.html
2015-09-01 15:18:25 -04:00

694 lines
42 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Emby</title>
</head>
<body>
<div id="editItemMetadataPage" data-role="page" class="page libraryPage metadataEditorPage noSecondaryNavPage" data-contextname="${HeaderMetadataManager}" data-require="jqmpopup,scripts/editorsidebar,scripts/edititemmetadata,jqmicons,scripts/edititemsubtitles,scripts/editcollectionitems,scripts/edititemimages">
<div>
<div class="editPageSidebar" style="overflow:auto;">
<div class="libraryTree">
<ul></ul>
</div>
</div>
<div class="editPageInnerContent" style="visibility:hidden;">
<h1 class="itemName editPageName">&nbsp;</h1>
<br />
<paper-tabs hidescrollbuttons noink>
<paper-tab class="metadataTabButton">${TabMetadata}</paper-tab>
<paper-tab class="subtitleTabButton hide">${TabSubtitles}</paper-tab>
<paper-tab class="collectionItemsTabButton hide">${TabCollectionTitles}</paper-tab>
<paper-tab class="imagesTabButton">${TabImages}</paper-tab>
</paper-tabs>
<div class="editorTab">
<form class="editItemMetadataForm editMetadataForm">
<div class="metadataFormFields">
<div style="margin:2em 0 .5em;text-align:center;">
<paper-button raised class="submit">
<button class="btnSave clearButton" type="submit" data-role="none" style="display:inline-block;">
<iron-icon icon="check"></iron-icon><span>${ButtonSave}</span>
</button>
</paper-button>
<paper-button raised class="subdued btnRefresh btnSimpleRefresh" style="background-color:#673AB7;"><iron-icon icon="refresh"></iron-icon><span>${ButtonRefresh}</span></paper-button>
<paper-button id="btnIdentify" raised style="background-color:#009688;"><iron-icon icon="info"></iron-icon><span>${ButtonIdentify}</span></paper-button>
<paper-button raised class="subdued notext btnMore"><iron-icon icon="more-vert"></iron-icon></paper-button>
</div>
<div style="padding: 0 0 10px;">
<div id="fldContentType" style="display:none;">
<label for="selectContentType">${LabelContentType}</label>
<select id="selectContentType" data-mini="true"></select>
</div>
<div id="fldPath">
<paper-input id="txtPath" type="text" label="${LabelPath}" readonly></paper-input>
</div>
<div>
<paper-input id="txtName" type="text" label="${LabelName}" required="required"></paper-input>
</div>
<div id="fldSortName" style="display: none;">
<paper-input id="txtSortName" type="text" label="${LabelSortName}"></paper-input>
</div>
<div id="fldDateAdded" style="display: none;">
<paper-input id="txtDateAdded" type="date" label="${LabelDateAdded}"></paper-input>
</div>
<div id="fldStatus" style="display: none;margin:1em 0;">
<label for="selectStatus">${LabelStatus}</label>
<select id="selectStatus" data-mini="true"></select>
</div>
<div id="fldArtist" style="display: none;">
<paper-input id="txtArtist" type="text" label="${LabelArtists}" placeholder="${LabelArtistsHelp}"></paper-input>
</div>
<div id="fldAlbumArtist" style="display: none;">
<paper-input id="txtAlbumArtist" type="text" label="${LabelAlbumArtists}" placeholder="${LabelArtistsHelp}"></paper-input>
</div>
<div id="fldAlbum" style="display: none;">
<paper-input id="txtAlbum" type="text" label="${LabelAlbum}"></paper-input>
</div>
<div id="fldParentIndexNumber" style="display: none;">
<paper-input id="txtParentIndexNumber" type="number"></paper-input>
</div>
<div id="fldIndexNumber" style="display: none;">
<paper-input id="txtIndexNumber" type="number" pattern="[0-9]*"></paper-input>
</div>
<div id="fldCommunityRating" style="display: none;">
<paper-input id="txtCommunityRating" type="number" step=".1" min="0" max="10" label="${LabelCommunityRating}"></paper-input>
</div>
<div id="fldCommunityVoteCount" style="display: none;">
<paper-input id="txtCommunityVoteCount" type="number" step="1" label="${LabelVoteCount}"></paper-input>
</div>
<div id="fldMetascore" style="display: none;">
<paper-input id="txtMetascore" type="number" step="1" min="0" max="100" label="${LabelMetascore}"></paper-input>
</div>
<div id="fldCriticRating" style="display: none;">
<paper-input id="txtCriticRating" type="number" step=".1" label="${LabelCriticRating}"></paper-input>
</div>
<div id="fldCriticRatingSummary" style="display: none;">
<paper-input id="txtCriticRatingSummary" type="text" label="${LabelCriticRatingSummary}"></paper-input>
</div>
<div id="fldAwardSummary" style="display: none;">
<paper-input id="txtAwardSummary" type="text" label="${LabelAwardSummary}"></paper-input>
</div>
<div>
<paper-input id="txtHomePageUrl" type="text" label="${LabelWebsite}"></paper-input>
</div>
<div id="fldTagline" style="display: none;">
<paper-input id="txtTagline" type="text" label="${LabelTagline}"></paper-input>
</div>
<div>
<label for="txtOverview" class="likePaperLabel">${LabelOverview}</label>
<textarea id="txtOverview" class="likePaperText" data-role="none"></textarea>
<br />
</div>
<div id="fldShortOverview" style="display: none;">
<paper-input id="txtShortOverview" type="text" label="${LabelShortOverview}"></paper-input>
</div>
<div id="fldPremiereDate" style="display: none;">
<label for="txtPremiereDate" class="likePaperLabel">${LabelReleaseDate}</label>
<input id="txtPremiereDate" type="date" class="likePaperText" data-role="none" />
</div>
<div id="fldYear" style="display: none;">
<paper-input id="txtProductionYear" type="number" label="${LabelYear}"></paper-input>
</div>
<div id="fldPlaceOfBirth" style="display: none;">
<paper-input id="txtPlaceOfBirth" type="text" label="${LabelPlaceOfBirth}"></paper-input>
</div>
<div id="fldEndDate" style="display: none;">
<label for="txtEndDate" class="likePaperLabel">${LabelEndDate}</label>
<input id="txtEndDate" type="date" class="likePaperText" data-role="none" />
</div>
<div id="fldAirDays" style="display: none;">
<p>${LabelAirDays}</p>
<div>
<paper-checkbox class="chkAirDay" data-day="Sunday">${OptionSunday}</paper-checkbox>
<paper-checkbox class="chkAirDay" data-day="Monday">${OptionMonday}</paper-checkbox>
<paper-checkbox class="chkAirDay" data-day="Tuesday">${OptionTuesday}</paper-checkbox>
<paper-checkbox class="chkAirDay" data-day="Wednesday">${OptionWednesday}</paper-checkbox>
<paper-checkbox class="chkAirDay" data-day="Thursday">${OptionThursday}</paper-checkbox>
<paper-checkbox class="chkAirDay" data-day="Friday">${OptionFriday}</paper-checkbox>
<paper-checkbox class="chkAirDay" data-day="Saturday">${OptionSaturday}</paper-checkbox>
</div>
<br />
</div>
<div id="fldAirTime" style="display: none;">
<paper-input id="txtAirTime" type="text" label="${LabelAirTime}"></paper-input>
</div>
<div id="fldSeriesRuntime" style="display: none;">
<paper-input id="txtSeriesRuntime" type="number" label="${LabelRuntimeMinutes}"></paper-input>
</div>
<div id="fldOfficialRating" style="display: none;">
<br />
<label for="selectOfficialRating">${LabelParentalRating}</label>
<select id="selectOfficialRating" data-mini="true"></select>
</div>
<div id="fldCustomRating" style="display: none;">
<br />
<label for="selectCustomRating">${LabelCustomRating}</label>
<select id="selectCustomRating" data-mini="true"></select>
</div>
<div id="fldBudget" style="display: none;">
<paper-input id="txtBudget" type="number" label="${LabelBudget}"></paper-input>
</div>
<div id="fldRevenue" style="display: none;">
<paper-input id="txtRevenue" type="number" label="${LabelRevenue}"></paper-input>
</div>
<div id="fldOriginalAspectRatio" style="display: none;">
<paper-input id="txtOriginalAspectRatio" type="text" label="${LabelOriginalAspectRatio}"></paper-input>
</div>
<div id="fldPlayers" style="display: none;">
<paper-input id="txtPlayers" type="number" pattern="[0-9]*" label="${LabelPlayers}"></paper-input>
</div>
<div id="fld3dFormat" style="display: none;">
<br />
<label for="select3dFormat">${Label3DFormat}</label>
<select id="select3dFormat" data-mini="true">
<option value=""></option>
<option value="HalfSideBySide">HSBS</option>
<option value="HalfTopAndBottom">HTAB</option>
<option value="FullSideBySide">FSBS</option>
<option value="FullTopAndBottom">FTAB</option>
</select>
</div>
</div>
<br />
<div class="detailSection" id="collapsibleDvdEpisodeInfo" style="display: none;">
<h1>
${HeaderAlternateEpisodeNumbers}
</h1>
<div class="detailSectionContent">
<div>
<paper-input id="txtDvdSeasonNumber" type="number" pattern="[0-9]*" label="${LabelDvdSeasonNumber}"></paper-input>
</div>
<div>
<paper-input id="txtDvdEpisodeNumber" type="number" pattern="[0-9]*" label="${LabelDvdEpisodeNumber}"></paper-input>
</div>
<div>
<paper-input id="txtAbsoluteEpisodeNumber" type="number" pattern="[0-9]*" label="${LabelAbsoluteEpisodeNumber}"></paper-input>
</div>
</div>
</div>
<div class="detailSection" id="collapsibleSpecialEpisodeInfo" style="display: none;">
<h1>
${HeaderSpecialEpisodeInfo}
</h1>
<div class="detailSectionContent">
<div>
<paper-input id="txtAirsBeforeSeason" type="number" pattern="[0-9]*" label="${LabelAirsBeforeSeason}"></paper-input>
</div>
<div>
<paper-input id="txtAirsAfterSeason" type="number" pattern="[0-9]*" label="${LabelAirsAfterSeason}"></paper-input>
</div>
<div>
<paper-input id="txtAirsBeforeEpisode" type="number" pattern="[0-9]*" label="${LabelAirsBeforeEpisode}"></paper-input>
</div>
</div>
</div>
<div class="detailSection">
<h1>
${HeaderExternalIds}
</h1>
<div class="detailSectionContent">
<div class="externalIds editorFieldset">
</div>
</div>
</div>
<div class="detailSection" id="collapsibleDisplaySettings" style="display:none;">
<h1>
${HeaderDisplaySettings}
</h1>
<div class="detailSectionContent">
<div id="fldSourceType" style="display: none;" class="fldDisplaySetting">
<paper-input id="txtDisplayMediaType" type="text" label="${LabelTreatImageAs}"></paper-input>
</div>
<div id="fldDisplaySpecialsInline" class="fldDisplaySetting">
<br />
<paper-checkbox id="chkDisplaySpecialsInline">${LabelDisplaySpecialsWithinSeasons}</paper-checkbox>
</div>
<div id="fldDisplayOrder" class="fldDisplaySetting">
<label for="selectDisplayOrder" id="labelDisplayOrder">${LabelDisplayOrder}</label>
<select id="selectDisplayOrder" data-mini="true"></select>
</div>
</div>
</div>
<div data-role="collapsible" data-mini="true" id="countriesCollapsible" style="display: none; margin-top: 1em;">
<h3>${HeaderCountries}</h3>
<div data-role="editableListviewContainer">
<div>
<div style="display: inline-block; width: 80%;">
<input type="text" class="txtEditableListview" />
</div>
<a data-role="button" data-inline="true" data-mini="true" data-icon="plus" data-iconpos="notext" onclick="EditItemMetadataPage.addElementToEditableListview(this)" style="vertical-align: top;">${ButtonAdd}</a>
</div>
<ul data-role="listview" data-inset="true" data-split-icon="delete" id="listCountries"></ul>
</div>
</div>
<div data-role="collapsible" data-mini="true" id="genresCollapsible" style="display: none; margin-top: 1em;">
<h3>${HeaderGenres}</h3>
<div data-role="editableListviewContainer">
<div>
<div style="display: inline-block; width: 80%;">
<input type="text" class="txtEditableListview" />
</div>
<a data-role="button" data-inline="true" data-mini="true" data-icon="plus" data-iconpos="notext" onclick="EditItemMetadataPage.addElementToEditableListview(this)" style="vertical-align: top;">${ButtonAdd}</a>
</div>
<ul data-role="listview" data-inset="true" data-split-icon="delete" id="listGenres"></ul>
</div>
</div>
<div data-mini="true" data-role="collapsible" id="peopleCollapsible" style="display: none; margin-top: 1em;">
<h3>${HeaderPeople}</h3>
<div>
<br />
<button type="button" id="btnAddPerson" data-icon="plus" data-mini="true" data-theme="a">${ButtonAdd}</button>
<br />
<ul data-role="listview" data-inset="true" data-split-icon="delete" id="peopleList"></ul>
</div>
</div>
<div data-mini="true" data-role="collapsible" id="keywordsCollapsible" style="display: none; margin-top: 1em;">
<h3>${HeaderPlotKeywords}</h3>
<div data-role="editableListviewContainer">
<div>
<div style="display: inline-block; width: 80%;">
<input type="text" class="txtEditableListview" />
</div>
<a data-role="button" data-inline="true" data-mini="true" data-icon="plus" data-iconpos="notext" onclick="EditItemMetadataPage.addElementToEditableListview(this)" style="vertical-align: top;">${ButtonAdd}</a>
</div>
<ul data-role="listview" data-inset="true" data-split-icon="delete" id="listKeywords"></ul>
</div>
</div>
<div data-role="collapsible" data-mini="true" id="studiosCollapsible" style="display: none; margin-top: 1em;">
<h3>${HeaderStudios}</h3>
<div data-role="editableListviewContainer">
<div>
<div style="display: inline-block; width: 80%;">
<input type="text" class="txtEditableListview" />
</div>
<a data-role="button" data-inline="true" data-mini="true" data-icon="plus" data-iconpos="notext" onclick="EditItemMetadataPage.addElementToEditableListview(this)" style="vertical-align: top;">${ButtonAdd}</a>
</div>
<ul data-role="listview" data-inset="true" data-split-icon="delete" id="listStudios"></ul>
</div>
</div>
<div data-mini="true" data-role="collapsible" id="tagsCollapsible" style="display: none; margin-top: 1em;">
<h3>${HeaderTags}</h3>
<div data-role="editableListviewContainer">
<div>
<div style="display: inline-block; width: 80%;">
<input type="text" class="txtEditableListview" />
</div>
<a data-role="button" data-inline="true" data-mini="true" data-icon="plus" data-iconpos="notext" onclick="EditItemMetadataPage.addElementToEditableListview(this)" style="vertical-align: top;">${ButtonAdd}</a>
</div>
<ul data-role="listview" data-inset="true" data-split-icon="delete" id="listTags"></ul>
</div>
</div>
<div id="metadataSettingsCollapsible" style="display: none; margin-top: 3em;">
<h1>${HeaderMetadataSettings}</h1>
<div>
<div>
<label for="selectLanguage">${LabelMetadataDownloadLanguage}</label>
<select id="selectLanguage" data-mini="true"></select>
</div>
<div class="fieldDescription editorfieldDescription">${MessageLeaveEmptyToInherit}</div>
<br />
<div>
<label for="selectCountry">${LabelCountry}</label>
<select id="selectCountry" data-mini="true"></select>
</div>
<div class="fieldDescription editorfieldDescription">${MessageLeaveEmptyToInherit}</div>
<div>
<br /><br />
<paper-checkbox id="chkLockData" onchange="EditItemMetadataPage.setProviderSettingsContainerVisibility(this)">${LabelLockItemToPreventChanges}</paper-checkbox>
</div>
<br />
<div id="providerSettingsContainer" style="display: none">
</div>
</div>
</div>
<br />
<button type="submit" data-role="none" class="clearButton btnSave">
<paper-button raised class="submit block"><iron-icon icon="check"></iron-icon><span>${ButtonSave}</span></paper-button>
</button>
</div>
</form>
</div>
<div class="editorTab subtitleTabContent">
<br />
<div class="readOnlyContent" style="max-width: 700px;">
<div class="subtitleList"></div>
</div>
<br />
<h1>${HeaderSearchForSubtitles}</h1>
<form class="subtitleSearchForm">
<div style="display: inline-block; width: 85%;">
<label for="selectLanguage">${LabelLanguage}</label>
<select id="selectLanguage" required="required" data-mini="true"></select>
</div>
<button type="submit" data-icon="search" class="btnSearchSubtitles" data-inline="true" data-iconpos="notext" data-mini="true" style="vertical-align: bottom;">${ButtonSearch}</button>
</form>
<br />
<div class="readOnlyContent" style="max-width: 700px;">
<div class="subtitleResults"></div>
<div class="noSearchResults" style="display: none;">
${MessageNoSubtitleSearchResultsFound}
</div>
</div>
</div>
<div class="editorTab collectionItemsTabContent">
<p style="margin:1.5em 0;">
${EditCollectionItemsHelp}
</p>
<div>
<button type="button" id="btnAddItem" data-icon="plus" data-inline="true" data-mini="true">${ButtonAdd}</button>
<button type="button" id="btnRemoveItems" data-icon="delete" data-inline="true" data-mini="true" disabled="disabled">${ButtonRemove}</button>
</div>
<br />
<div class="collectionItems"></div>
</div>
<div class="editorTab imageEditorTab">
<div style="margin:2em 0 .5em;text-align:center;">
<paper-button raised class="subdued btnBrowseAllImages"><iron-icon icon="cloud"></iron-icon><span>${ButtonBrowseImages}</span></paper-button>
<paper-button raised class="subdued btnOpenUploadMenu"><iron-icon icon="add"></iron-icon><span>${ButtonUpload}</span></paper-button>
</div>
<div id="imagesContainer" style="display: none;">
<h1>${HeaderImages}</h1>
<div id="images">
</div>
<br />
</div>
<div id="backdropsContainer" style="display: none;">
<h1>${HeaderBackdrops}</h1>
<div id="backdrops">
</div>
<br />
</div>
<div id="screenshotsContainer" style="display: none;">
<h1>${Screenshots}</h1>
<div id="screenshots">
</div>
</div>
</div>
</div>
</div>
<div data-role="content">
</div>
<div data-role="popup" class="popupIdentify popupIdentifyItem popup" data-theme="a">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px; position: relative;">
<button type="button" data-icon="back" data-mini="true" data-inline="true" data-iconpos="notext" style="position: absolute; top: 8px; left: 10px; margin: 0;" class="btnIdentifyBack">${ButtonSearch}</button>
<h3 class="identificationHeader">${HeaderIdentifyItem}</h3>
</div>
<div data-role="content">
<form class="popupIdentifyForm" style="max-width: initial;">
<p>${HeaderIdentifyItemHelp}</p>
<div>
<label for="txtLookupName">${LabelName}</label>
<input type="text" id="txtLookupName" class="identifyField" data-lookup="Name" />
</div>
<div class="fldLookupYear">
<label for="txtLookupYear">${LabelYear}</label>
<input type="number" id="txtLookupYear" class="identifyField" data-lookup="Year" pattern="[0-9]*" min="1800" />
</div>
<div class="identifyProviderIds">
</div>
<p>
<button type="submit" data-theme="b" data-icon="search" data-mini="true">
${ButtonSearch}
</button>
<button type="button" data-icon="delete" data-mini="true" onclick="$(this).parents('.popup').popup('close');">
${ButtonCancel}
</button>
</p>
</form>
<div class="identificationSearchResults">
<div class="identificationSearchResultList"></div>
</div>
<form class="identifyOptionsForm" style="max-width:initial;">
<h1 style="margin-top:.25em;">${HeaderIdentificationResult}</h1>
<div class="selectedSearchResult"></div>
<h1>${HeaderOptions}</h1>
<div>
<label for="chkIdentifyReplaceImages">${OptionReplaceExistingImages}</label>
<input id="chkIdentifyReplaceImages" type="checkbox" checked="checked" data-mini="true" />
</div>
<br />
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
${ButtonSubmit}
</button>
<button type="button" data-icon="delete" data-mini="true" onclick="$(this).parents('.popup').popup('close');">
${ButtonCancel}
</button>
</form>
</div>
</div>
<div data-role="popup" id="popupEditPerson" class="popup" data-theme="a">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>${HeaderPersonInfo}</h3>
</div>
<div data-role="content">
<form class="popupEditPersonForm">
<div>
<label for="txtPersonName">${LabelName}</label>
<input type="text" id="txtPersonName" required="required" />
</div>
<div>
<label for="selectPersonType">${LabelType}</label>
<select id="selectPersonType" data-mini="true">
<option value=""></option>
<option value="Actor">${OptionActor}</option>
<option value="Composer">${OptionComposer}</option>
<option value="Director">${OptionDirector}</option>
<option value="GuestStar">${OptionGuestStar}</option>
<option value="Producer">${OptionProducer}</option>
<option value="Writer">${OptionWriter}</option>
</select>
</div>
<div>
<label for="txtPersonRole">${LabelPersonRole}</label>
<input type="text" id="txtPersonRole" />
<div class="fieldDescription">${LabelPersonRoleHelp}</div>
</div>
<br />
<input type="hidden" id="fldPersonIndex" />
<p>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
${ButtonOk}
</button>
<button type="button" data-icon="delete" onclick="$(this).parents('.popup').popup('close');" data-mini="true">
${ButtonCancel}
</button>
</p>
</form>
</div>
</div>
<div data-role="popup" class="popup popupAdvancedRefresh" data-theme="a">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>${HeaderRefreshMetadata}</h3>
</div>
<div data-role="content">
<form class="popupAdvancedRefreshForm" style="min-width: 200px;">
<br />
<div>
<label for="selectMetadataRefreshMode">${LabelMetadataRefreshMode}</label>
<select id="selectMetadataRefreshMode" data-mini="true">
<option value="">${OptionNone}</option>
<option value="local">${OptionLocalRefreshOnly}</option>
<option value="missing">${OptionAddMissingDataOnly}</option>
<option value="all">${OptionRefreshAllData}</option>
</select>
</div>
<br />
<div>
<label for="selectImageRefreshMode">${LabelImageRefreshMode}</label>
<select id="selectImageRefreshMode" data-mini="true">
<option value="">${OptionNone}</option>
<option value="missing">${OptionDownloadMissingImages}</option>
<option value="all">${OptionReplaceExistingImages}</option>
</select>
</div>
<br />
<p>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
${ButtonOk}
</button>
<button type="button" data-icon="delete" onclick="$(this).parents('.popup').popup('close');" data-mini="true">
${ButtonCancel}
</button>
</p>
</form>
</div>
</div>
<div data-role="popup" class="popup popupSubtitleViewer">
<a href="#" data-rel="back" data-role="button" class="ui-btn ui-corner-all ui-shadow ui-btn-b ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
<div class="subtitleViewerContent">
<pre class="subtitleContent" style="margin: 0; border-radius: 0;"></pre>
</div>
</div>
<div data-role="popup" class="popupIdentifyCollection popup popupIdentify" data-theme="a">
<div class="ui-bar-a" style="text-align: center; padding: 0 20px;">
<h3>
${HeaderAddTitles}
</h3>
</div>
<div data-role="content">
<form class="collectionItemSearchForm" style="max-width: initial;">
<div>
<label for="txtLookupName">${LabelName}</label>
<div style="display: inline-block; width: 75%;">
<input type="text" id="txtLookupName" required="required" />
</div>
<button type="submit" data-icon="search" data-mini="true" data-inline="true" data-iconpos="notext">
${ButtonSearch}
</button>
</div>
<div class="collectionItemSearchResults">
</div>
<button id="btnAddItems" type="button" data-icon="plus" data-mini="true">
${ButtonAdd}
</button>
</form>
</div>
</div>
<div data-role="popup" id="popupUpload" data-theme="a">
<form class="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="Events.trigger($('#uploadImage').val('')[0], '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>
</div>
</body>
</html>