first commit

modules/metadataeditor/externalideditor.js

@@ -0,0 +1 @@
+define(["exports","./../common/globalize.js","./../emby-elements/emby-input/emby-input.js","./../emby-elements/emby-select/emby-select.js","./../emby-elements/emby-button/emby-button.js","./../emby-elements/emby-button/paper-icon-button-light.js","./../emby-elements/emby-scroller/emby-scroller.js","./../emby-elements/emby-dialogclosebutton/emby-dialogclosebutton.js"],function(_exports,_globalize,_embyInput,_embySelect,_embyButton,_paperIconButtonLight,_embyScroller,_embyDialogclosebutton){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,require(["formDialogStyle"]);_exports.default={embed:function(context,item,externalIds){for(var html="",providerIds=item.ProviderIds||{},keys=Object.keys(providerIds),i=0,length=externalIds.length;i<length;i++){var idInfo=externalIds[i],id="txt1"+idInfo.Key,formatString=idInfo.UrlFormatString||"",labelText=_globalize.default.translate("LabelDynamicExternalId").replace("{0}",idInfo.Name),value=(html=html+'<div class="inputContainer">'+'<div class="flex align-items-center">',providerIds[function(keys,key){var keyLower=key.toLowerCase();return keys.filter(function(k){return k.toLowerCase()===keyLower})[0]||key}(keys,idInfo.Key)]||""),html=(html+='<div class="flex-grow">')+('<input is="emby-input" class="txtExternalId '+id+'" value="'+value+'" data-providerkey="'+idInfo.Key+'" data-formatstring="'+formatString+'" label="'+labelText+'"/>')+"</div>";formatString&&(html+='<button type="button" is="paper-icon-button-light" class="btnOpenExternalId align-self-flex-end md-icon" data-fieldid="'+id+'">open_in_browser</button>'),html=html+"</div>"+"</div>"}context.querySelector(".externalIds",context).innerHTML=html,externalIds.length?context.classList.remove("hide"):context.classList.add("hide")},updateObjectFromElements:function(context,item){context=context.querySelectorAll(".txtExternalId"),Array.prototype.map.call(context,function(idElem){var providerKey=idElem.getAttribute("data-providerkey");item.ProviderIds[providerKey]=idElem.value})}}});

modules/metadataeditor/metadataeditor.css

@@ -0,0 +1 @@
+.checkboxContainer-lockedfield{margin-bottom:0!important;width:auto!important}.checkboxContainer-lockedfield-standalone{-webkit-margin-start:auto;margin-inline-start:auto}.checkboxLabel-lockedfield{-webkit-padding-end:0!important;padding-inline-end:0!important;width:2.8em;height:2.8em;-webkit-margin-end:0!important;margin-inline-end:0!important;margin-top:0!important}.checkboxLabel-lockedfield-embeddedintofield{width:3.2em;box-sizing:border-box;border-top-left-radius:0!important;border-bottom-left-radius:0!important;border-start-start-radius:0!important;border-end-start-radius:0!important;border-inline-start-width:.15em!important;border-inline-end-width:0!important;border-inline-start-style:solid;border-top-style:solid;border-bottom-style:solid;border-top-color:transparent!important;border-bottom-color:transparent!important}.checkboxLabel-lockedfield-embeddedintofield,.checkboxLabel-lockedfield-embeddedintoselect{height:3em}.checkboxLabel-lockedfield::before{display:none!important}.checkboxLabel-lockedfield::after{display:none!important}.checkboxLabel-lockedfield-standalone{border-radius:100em!important;border-width:0!important}.txtInput-withlockedfield,.select-withlockedfield{border-top-right-radius:0!important;border-bottom-right-radius:0!important;border-start-end-radius:0!important;border-end-end-radius:0!important}.lockedfield-lockicon{position:absolute;font-size:124%;top:0;bottom:0;left:0;right:0;inset-inline-start:0;inset-inline-end:0;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;cursor:pointer;z-index:1}.chkLockedField:not(:checked)~.lockedfield-lockicon-lock{display:none}.chkLockedField:checked~.lockedfield-lockicon-unlock{display:none}.chkLockedField~.emby-checkbox-focusoutline{display:none!important}.chkLockedField:checked~.lockedfield-lockicon{color:#fff!important}.inputContainer-withlockedfield{margin-bottom:0!important}

modules/metadataeditor/metadataeditor.template.html

@@ -0,0 +1,354 @@
+<div class="formDialogHeader">
+    <button type="button" is="emby-dialogclosebutton"></button>
+    <h3 class="formDialogHeaderTitle">
+        ${Edit}
+    </h3>
+    <div style="margin-inline-start: auto;" class="flex align-items-center justify-content-center">
+        <button is="emby-button" type="button" class="btnHeaderSave raised raised-mini hide" tabindex="-1">
+            <i class="md-icon button-icon button-icon-left">&#xe5ca;</i>
+            <span>${Save}</span>
+        </button>
+        <button is="paper-icon-button-light" class="btnMore hide" tabindex="-1">
+            <i class="md-icon">more_horiz</i>
+        </button>
+    </div>
+</div>
+
+<div is="emby-scroller" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" class="formDialogContent">
+    <div class="scrollSlider">
+        <form class="editItemMetadataForm editMetadataForm dialogContentInner dialog-content-centered padded-left padded-right" style="padding-top:0;">
+            <div class="metadataFormFields">
+
+                <div class="fldPath inputContainer">
+                    <div class="inputLabel inputLabelUnfocused hide">${LabelPath}</div>
+                    <div class="txtPath fieldDescription"></div>
+                </div>
+                <div class="inputContainer flex align-items-flex-end">
+                    <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                        <input is="emby-input" class="txtName txtInput-withlockedfield" type="text" label="${LabelTitle}" required="required" />
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="Name" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="fldOriginalName inputContainer flex align-items-flex-end">
+                    <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                        <input is="emby-input" class="txtOriginalName txtInput-withlockedfield" type="text" label="${LabelOriginalTitle}" />
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="OriginalTitle" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="inputContainer flex align-items-flex-end fldSortName hide">
+                    <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                        <input is="emby-input" class="txtSortName txtInput-withlockedfield" type="text" label="${LabelSortTitle}" required="required" />
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="SortName" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="inputContainer flex align-items-flex-end fldChannelNumber hide">
+                    <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                        <input is="emby-input" class="txtChannelNumber txtInput-withlockedfield" type="text" label="${LabelChannelNumber}" />
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="ChannelNumber" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="fldDateAdded hide inputContainer">
+                    <input is="emby-input" class="txtDateAdded" type="datetime-local" label="${LabelDateAdded}" step="1" />
+                    <div class="fieldDescription">${ConfigureDateAdded}</div>
+                </div>
+                <div class="fldFileOrder selectContainer hide">
+                    <select is="emby-select" class="selectFileOrder" label="${LabelFileOrder}"></select>
+                    <div class="fieldDescription">${SeriesDisplayOrderHelp}</div>
+                </div>
+
+                <div class="fldStatus hide selectContainer">
+                    <select is="emby-select" class="selectStatus" label="${LabelStatus}"></select>
+                </div>
+                <div class="fldArtist hide inputContainer">
+                    <input is="emby-input" class="txtArtist" type="text" label="${Artists}" />
+                    <div class="fieldDescription">${LabelArtistsHelp}</div>
+                </div>
+                <div class="fldAlbumArtist hide inputContainer">
+                    <input is="emby-input" class="txtAlbumArtist" type="text" label="${LabelAlbumArtists}" />
+                    <div class="fieldDescription">${LabelArtistsHelp}</div>
+                </div>
+                <div class="fldComposer hide inputContainer">
+                    <input is="emby-input" class="txtComposer" type="text" label="${Composers}" />
+                    <div class="fieldDescription">${LabelArtistsHelp}</div>
+                </div>
+                <div class="fldAlbum hide inputContainer">
+                    <input is="emby-input" class="txtAlbum" type="text" label="${LabelAlbum}" />
+                </div>
+                <div class="fldParentIndexNumber hide inputContainer">
+                    <input is="emby-input" class="txtParentIndexNumber" type="number" inputmode="numeric" />
+                </div>
+                <div class="fldIndexNumber hide inputContainer">
+                    <input is="emby-input" class="txtIndexNumber" type="number" inputmode="numeric" />
+                </div>
+                <div class="fldCommunityRating inputContainer flex align-items-flex-end">
+                    <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                        <input is="emby-input" class="txtCommunityRating txtInput-withlockedfield" type="number" inputmode="decimal" step=".1" min="0" max="10" label="${LabelCommunityRating}" />
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="CommunityRating" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="fldCriticRating inputContainer flex align-items-flex-end">
+                    <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                        <input is="emby-input" class="txtCriticRating txtInput-withlockedfield" type="number" inputmode="decimal" step=".1" label="${LabelCriticRating}" />
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="CriticRating" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="fldTagline inputContainer flex align-items-flex-end">
+                    <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                        <input is="emby-input" class="txtTagline txtInput-withlockedfield" type="text" label="${Tagline}" />
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="Tagline" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="inputContainer overviewContainer flex align-items-flex-end">
+                    <label class="flex-grow inputContainer inputContainer-withlockedfield">
+                        <textarea is="emby-textarea" class="txtOverview txtInput-withlockedfield" label="${LabelOverview}" style="height:13em;resize:none;"></textarea>
+                    </label>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="Overview" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield" style="height:13em;"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="inputContainer overviewContainer hide">
+                    <label>
+                        <textarea is="emby-textarea" class="txtOverview" label="${LabelOverview}"></textarea>
+                    </label>
+                </div>
+                <div class="fldPremiereDate inputContainer">
+                    <input is="emby-input" class="txtPremiereDate" label="${LabelReleaseDate}" type="date" />
+                </div>
+                <div class="fldYear hide inputContainer">
+                    <input is="emby-input" class="txtProductionYear" type="number" inputmode="numeric" label="${Year}" />
+                </div>
+                <div class="fldPlaceOfBirth hide inputContainer">
+                    <input is="emby-input" class="txtPlaceOfBirth" type="text" label="${LabelPlaceOfBirth}" />
+                </div>
+                <div class="fldEndDate inputContainer">
+                    <input is="emby-input" class="txtEndDate" label="${LabelEndDate}" type="date" />
+                </div>
+                <div class="fldSeriesRuntime inputContainer hide">
+                    <input is="emby-input" class="txtSeriesRuntime" type="number" inputmode="numeric" label="${LabelRuntimeMinutes}" />
+                </div>
+                <div class="fldOfficialRating inputContainer flex align-items-flex-end hide">
+                    <div class="selectContainer flex-grow inputContainer-withlockedfield">
+                        <select is="emby-select" class="selectOfficialRating select-withlockedfield" label="${LabelParentalRating}"></select>
+                    </div>
+                    <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                        <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="OfficialRating" aria-label="${LockThisField}" />
+                        <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield checkboxLabel-lockedfield-embeddedintoselect"></span>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                        <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                    </label>
+                </div>
+                <div class="fldCustomRating selectContainer hide">
+                    <select is="emby-select" class="selectCustomRating" label="${LabelCustomRating}"></select>
+                    <div class="fieldDescription">${CustomRatingHelp}</div>
+                </div>
+                <div class="fld3dFormat selectContainer hide">
+                    <select is="emby-select" class="select3dFormat" label="${Label3DFormat}">
+                        <option value=""></option>
+                        <option value="HalfSideBySide">HSBS</option>
+                        <option value="HalfTopAndBottom">HTAB</option>
+                        <option value="FullSideBySide">FSBS</option>
+                        <option value="FullTopAndBottom">FTAB</option>
+                        <option value="MVC">MVC</option>
+                    </select>
+                </div>
+
+                <div class="fldDisplayOrder fldDisplaySetting selectContainer hide">
+                    <select is="emby-select" class="selectDisplayOrder" label="${LabelDisplayOrder}"></select>
+                </div>
+
+                <div class="detailSection channelMappingSection hide">
+                    <div class="selectContainer">
+                        <select is="emby-select" class="selectGuideDataProvider" label="${GuideDataSource}"></select>
+                    </div>
+                    <div class="selectContainer fldGuideChannelId hide">
+                        <select is="emby-select" class="selectGuideChannel" label="${LabelGuideDataChannel}"></select>
+                    </div>
+                </div>
+
+                <div class="detailSection hide collapsibleSpecialEpisodeInfo">
+                    <h2>
+                        ${HeaderSpecialEpisodeInfo}
+                    </h2>
+                    <div class="specialEpisodeNumbers">
+                        <div class="inputContainer flex align-items-flex-end">
+                            <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                                <input is="emby-input" class="txtDisplaySeason txtInput-withlockedfield" type="text" label="${LabelAirsDuringSeason}" />
+                            </div>
+                            <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                                <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="SortParentIndexNumber" aria-label="${LockThisField}" />
+                                <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                                <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                                <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                            </label>
+                        </div>
+
+                        <div class="inputContainer flex align-items-flex-end">
+                            <div class="inputContainer flex-grow inputContainer-withlockedfield">
+                                <input is="emby-input" class="txtDisplayEpisode txtInput-withlockedfield" type="text" label="${LabelAirsBeforeEpisode}" />
+                            </div>
+                            <label class="checkboxContainer checkboxContainer-lockedfield" title="${LockThisField}">
+                                <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="SortIndexNumber" aria-label="${LockThisField}" />
+                                <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-embeddedintofield"></span>
+                                <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                                <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                            </label>
+                        </div>
+                    </div>
+                </div>
+
+                <div class="detailSection externalIdsSection hide">
+                    <h2>
+                        ${HeaderExternalIds}
+                    </h2>
+                    <div class="externalIds editorFieldset">
+                    </div>
+                </div>
+
+                <div class="genresCollapsible editableListviewContainer hide" style="margin-top: 3em;">
+                    <div class="flex align-items-center padded-bottom">
+                        <h2 style="margin:0;">
+                            ${Genres}
+                        </h2>
+                        <button is="emby-button" type="button" class="raised raised-mini btnAddTextItem submit" data-label="${Genre}" data-field="GenreItems" style="margin: 0 1em;" title="${Add}">
+                            <i class="md-icon button-icon button-icon-left">&#xe145;</i>
+                            <span>${Add}</span>
+                        </button>
+
+                        <label class="checkboxContainer checkboxContainer-lockedfield checkboxContainer-lockedfield-standalone" title="${LockThisField}">
+                            <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="Genres" aria-label="${LockThisField}" />
+                            <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-standalone"></span>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                        </label>
+                    </div>
+                    <div class="genresItemsContainer vertical-list" is="emby-itemscontainer"></div>
+                </div>
+                <div class="peopleCollapsible hide" style="margin-top: 3em;">
+                    <div class="flex align-items-center padded-bottom">
+                        <h2 style="margin:0;">
+                            ${People}
+                        </h2>
+                        <button is="emby-button" type="button" class="raised raised-mini btnAddPerson submit" style="margin: 0 1em;" title="${Add}">
+                            <i class="md-icon button-icon button-icon-left">&#xe145;</i>
+                            <span>${Add}</span>
+                        </button>
+
+                        <label class="checkboxContainer checkboxContainer-lockedfield checkboxContainer-lockedfield-standalone" title="${LockThisField}">
+                            <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="Cast" aria-label="${LockThisField}" />
+                            <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-standalone"></span>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                        </label>
+                    </div>
+                    <div class="peopleItemsContainer vertical-list" is="emby-itemscontainer">
+                    </div>
+                </div>
+                <div class="studiosCollapsible editableListviewContainer hide" style="margin-top: 3em;">
+                    <div class="flex align-items-center padded-bottom">
+                        <h2 style="margin:0;">
+                            ${Studios}
+                        </h2>
+                        <button is="emby-button" type="button" class="raised raised-mini btnAddTextItem submit" data-label="${Studio}" data-field="Studios" style="margin: 0 1em;" title="${Add}">
+                            <i class="md-icon button-icon button-icon-left">&#xe145;</i>
+                            <span>${Add}</span>
+                        </button>
+
+                        <label class="checkboxContainer checkboxContainer-lockedfield checkboxContainer-lockedfield-standalone" title="${LockThisField}">
+                            <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="Studios" aria-label="${LockThisField}" />
+                            <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-standalone"></span>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                        </label>
+                    </div>
+                    <div class="studiosItemsContainer vertical-list" is="emby-itemscontainer"></div>
+                </div>
+                <div class="tagsCollapsible editableListviewContainer hide" style="margin-top: 3em;">
+                    <div class="flex align-items-center padded-bottom">
+                        <h2 style="margin:0;">
+                            ${Tags}
+                        </h2>
+                        <button is="emby-button" type="button" class="raised raised-mini btnAddTextItem submit" data-label="${Tag}" data-field="TagItems" style="margin: 0 1em;" title="${Add}">
+                            <i class="md-icon button-icon button-icon-left">&#xe145;</i>
+                            <span>${Add}</span>
+                        </button>
+
+                        <label class="checkboxContainer checkboxContainer-lockedfield checkboxContainer-lockedfield-standalone" title="${LockThisField}">
+                            <input type="checkbox" is="emby-checkbox" class="chkLockedField" data-field="Tags" aria-label="${LockThisField}" />
+                            <span class="checkboxLabel-lockedfield checkboxLabel-lockedfield-standalone"></span>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-lock secondaryText">lock</i>
+                            <i class="md-icon lockedfield-lockicon lockedfield-lockicon-unlock secondaryText">lock_open</i>
+                        </label>
+                    </div>
+
+                    <div class="tagsItemsContainer vertical-list" is="emby-itemscontainer"></div>
+                </div>
+                <div class="metadataSettingsCollapsible hide" style="margin-top: 2em;">
+                    <h2>${HeaderMetadataSettings}</h2>
+                    <div>
+                        <div class="selectContainer">
+                            <select is="emby-select" class="selectLanguage" label="${LabelMetadataDownloadLanguage}"></select>
+                            <div class="fieldDescription editorfieldDescription">${MessageLeaveEmptyToInherit}</div>
+                        </div>
+                        <div class="selectContainer">
+                            <select is="emby-select" class="selectCountry" label="${LabelCountry}"></select>
+                            <div class="fieldDescription editorfieldDescription">${MessageLeaveEmptyToInherit}</div>
+                        </div>
+
+                        <label class="toggleContainer">
+                            <input type="checkbox" is="emby-toggle" class="chkLockData" />
+                            <span>${LabelLockItemToPreventChanges}</span>
+                        </label>
+
+                        <div class="providerSettingsContainer checkboxList hide">
+                        </div>
+                    </div>
+                </div>
+
+                <div class="formDialogFooter hide">
+                    <button is="emby-button" type="submit" class="raised button-submit block btnSave formDialogFooterItem">
+                        <span>${Save}</span>
+                    </button>
+                </div>
+
+            </div>
+        </form>
+    </div>
+</div>

modules/metadataeditor/metadataeditor_nontv.css

@@ -0,0 +1 @@
+@media all and (pointer:fine){.checkboxLabel-lockedfield-embeddedintofield,.checkboxLabel-lockedfield-embeddedintoselect{height:2.4em}}

modules/metadataeditor/personeditor.js

@@ -0,0 +1 @@
+define(["exports","./../dialoghelper/dialoghelper.js","./../layoutmanager.js","./../common/globalize.js","./../emby-elements/emby-input/emby-input.js","./../emby-elements/emby-select/emby-select.js","./../emby-elements/emby-button/emby-button.js","./../emby-elements/emby-button/paper-icon-button-light.js","./../emby-elements/emby-scroller/emby-scroller.js","./../emby-elements/emby-dialogclosebutton/emby-dialogclosebutton.js"],function(_exports,_dialoghelper,_layoutmanager,_globalize,_embyInput,_embySelect,_embyButton,_paperIconButtonLight,_embyScroller,_embyDialogclosebutton){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,require(["formDialogStyle"]);_exports.default={show:function(person){return require(["text!modules/metadataeditor/personeditor.template.html"]).then(function(responses){var responses=responses[0],dialogOptions={removeOnClose:!0,scrollY:!1},dlg=(_layoutmanager.default.tv?dialogOptions.size="fullscreen":dialogOptions.size="medium-tall",_dialoghelper.default.createDialog(dialogOptions)),dialogOptions=(dlg.classList.add("formDialog"),""),submitted=!1;return dialogOptions+=_globalize.default.translateDocument(responses,"sharedcomponents"),dlg.innerHTML=dialogOptions,person.Name?dlg.querySelector(".formDialogHeaderTitle").innerHTML=_globalize.default.translate("Edit"):dlg.querySelector(".formDialogHeaderTitle").innerHTML=_globalize.default.translate("Add"),dlg.querySelector(".txtPersonName",dlg).value=person.Name||"",dlg.querySelector(".selectPersonType",dlg).value=person.Type||"",dlg.querySelector(".txtPersonRole",dlg).value=person.Role||"",dlg.querySelector(".selectPersonType").addEventListener("change",function(e){"Actor"===this.value?dlg.querySelector(".fldRole").classList.remove("hide"):dlg.querySelector(".fldRole").classList.add("hide")}),dlg.querySelector("form").addEventListener("submit",function(e){return submitted=!0,person.Name=dlg.querySelector(".txtPersonName",dlg).value,person.Type=dlg.querySelector(".selectPersonType",dlg).value,person.Role=dlg.querySelector(".txtPersonRole",dlg).value||null,_dialoghelper.default.close(dlg),e.preventDefault(),!1}),dlg.querySelector(".selectPersonType").dispatchEvent(new CustomEvent("change",{bubbles:!0})),_dialoghelper.default.open(dlg).then(function(){return submitted?Promise.resolve(person):Promise.reject()})})}}});

modules/metadataeditor/personeditor.template.html

@@ -0,0 +1,40 @@
+<div class="formDialogHeader">
+    <button type="button" is="emby-dialogclosebutton"></button>
+    <h3 class="formDialogHeaderTitle">
+        ${Edit}
+    </h3>
+</div>
+
+<div is="emby-scroller" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" class="formDialogContent">
+    <div class="scrollSlider">
+        <form class="popupEditPersonForm dialogContentInner dialog-content-centered padded-left padded-right">
+
+            <div class="inputContainer">
+                <input type="text" is="emby-input" class="txtPersonName" required="required" label="${LabelName}" />
+            </div>
+
+            <div class="selectContainer">
+                <select is="emby-select" class="selectPersonType" label="${LabelType}">
+                    <option value=""></option>
+                    <option value="Actor">${Actor}</option>
+                    <option value="Composer">${Composer}</option>
+                    <option value="Director">${Director}</option>
+                    <option value="GuestStar">${GuestStar}</option>
+                    <option value="Producer">${Producer}</option>
+                    <option value="Writer">${Writer}</option>
+                </select>
+            </div>
+            <div class="inputContainer fldRole hide">
+                <input is="emby-input" type="text" class="txtPersonRole" label="${LabelPersonRole}" />
+                <div class="fieldDescription">${LabelPersonRoleHelp}</div>
+            </div>
+
+            <div class="formDialogFooter">
+                <button is="emby-button" type="submit" class="raised button-submit block formDialogFooterItem">
+                    <span>${Save}</span>
+                </button>
+            </div>
+
+        </form>
+    </div>
+</div>