import dialogHelper from"./../dialoghelper/dialoghelper.js";import globalize from"./../common/globalize.js";import events from"./../emby-apiclient/events.js";import dom from"./../dom.js";import layoutManager from"./../layoutmanager.js";import playbackManager from"./../common/playback/playbackmanager.js";import"./../emby-elements/emby-button/emby-button.js";import"./../emby-elements/emby-button/paper-icon-button-light.js";import"./../emby-elements/emby-dialogclosebutton/emby-dialogclosebutton.js";import"./../emby-elements/emby-slider/emby-slider.js";function SubtitleOffsetDialog(options){this.options=options}require(["material-icons","formDialogStyle"]);let IncrementStepMs=100;function onStepUpClick(){playbackManager.incrementSubtitleOffset(IncrementStepMs,this.options.player)}function onStepDownClick(){playbackManager.incrementSubtitleOffset(-1*IncrementStepMs,this.options.player)}function getEditorHtml(){var html="",buttonClass=layoutManager.tv?" hide":"";return html+'<div class="formDialogContent">'+'<div style="padding-top:.5em;" class="verticalFieldItems dialogContentInner dialogContentInner-normalbottompadding dialog-content-centered dialog-content-centered-mini padded-left padded-right">'+'<h3 class="subtitleOverlayOffsetText verticalFieldItem secondaryText" style="margin:0; text-align:center;"><span class="offsetValue"></span></h3>'+'<div class="flex align-items-center verticalFieldItem buttonItems focuscontainer-x" style="margin:1.25em 0;">'+('<button is="paper-icon-button-light" type="button" class="buttonItems-item flex-shrink-zero btnStepDown'+buttonClass+'" title="'+globalize.translate("Down")+'" aria-label="'+globalize.translate("Down")+'"><i class="md-icon autortl md-icon-fill">&#xe020;</i></button>')+'<div class="buttonItems-item subtitleOffsetSliderContainer sliderContainer flex-grow">'+('<input type="range" is="emby-slider" step="'+IncrementStepMs+'" min="-120000" max="120000" value="0" class="autofocus subtitleOffsetSlider" data-bubble="false" />')+"</div>"+('<button is="paper-icon-button-light" type="button" class="buttonItems-item flex-shrink-zero btnStepUp'+buttonClass+'" title="'+globalize.translate("Up")+'" aria-label="'+globalize.translate("Up")+'"><i class="md-icon autortl md-icon-fill">&#xe01f;</i></button>')+"</div>"+'<div class="buttonItems verticalFieldItem flex align-items-center justify-content-center" style="margin-bottom:.75em;">'+('<button is="emby-button" type="button" class="flex-shrink-zero btnReset raised raised-mini nobackdropfilter" title="'+globalize.translate("Reset")+'" aria-label="'+globalize.translate("Reset")+'">'+globalize.translate("Reset")+"</button>")+"</div>"+"</div>"+"</div>"}function onDialogClosed(){return unbindEvents(this,this.options.player),Promise.resolve()}function onResetButtonClick(e){playbackManager.setSubtitleOffset(0,this.options.player)}function onSliderChange(e){e=e.target,e=parseInt(e.value);console.log("slider value: "+e+" - "+typeof e),playbackManager.setSubtitleOffset(e,this.options.player)}function renderData(instance,offsetValue){instance.dlg.querySelector(".offsetValue").innerHTML=getBubbleText(offsetValue),setSliderValue(instance.dlg.querySelector(".subtitleOffsetSlider"),offsetValue)}function refreshData(instance,player){renderData(instance,playbackManager.getSubtitleOffset(player))}function bindEvents(instance,player){function localOnSubtitleOffsetChange(e){refreshData(instance,player)}instance.localOnSubtitleOffsetChange=localOnSubtitleOffsetChange,events.on(player,"subtitleoffsetchange",localOnSubtitleOffsetChange)}function unbindEvents(instance,player){instance=instance.localOnSubtitleOffsetChange;instance&&events.off(player,"subtitleoffsetchange",instance)}function setSliderValue(slider,value){slider.dragging||(slider.setValue?slider.setValue(value):slider.waitForCustomElementUpgrade().then(function(){slider.setValue(value)}))}function getTimeInSeconds(ms){return 1e3<=Math.abs(ms)?(ms/=1e3).toFixed(1)+" seconds":ms+" ms"}function getBubbleText(value){return getTimeInSeconds(value)}SubtitleOffsetDialog.prototype.show=function(){this.dlg||(dialogOptions={removeOnClose:!0,scrollY:!1,transparentBackground:!0,positionTo:this.options.positionTo,positionX:this.options.positionX,positionY:this.options.positionY,transformOrigin:this.options.transformOrigin,lowResAutoHeight:!0,skipAutoFocusIfNotEnabled:!1,autoCenter:!1},(dialogOptions=dialogHelper.createDialog(dialogOptions)).classList.add("formDialog","subtitleOffsetDialog"),dom.allowBackdropFilter()&&dialogOptions.classList.add("dialog-blur"),html="",html=(html=(html='<div class="formDialogHeader"><button type="button" is="emby-dialogclosebutton" closetype="done"></button>')+'<h3 class="formDialogHeaderTitle">'+globalize.translate("HeaderSubtitleOffset")+"</h3></div>")+getEditorHtml(),dialogOptions.innerHTML=html,dialogOptions.style.minWidth="initial",html=(this.dlg=dialogOptions).querySelector(".subtitleOffsetSlider"),boundOnSliderChange=onSliderChange.bind(this),html.addEventListener("change",boundOnSliderChange),html.addEventListener("input",boundOnSliderChange),dialogOptions.querySelector(".btnStepDown").addEventListener("click",onStepDownClick.bind(this)),dialogOptions.querySelector(".btnStepUp").addEventListener("click",onStepUpClick.bind(this)),html.getBubbleText=getBubbleText,dialogOptions.querySelector(".btnReset").addEventListener("click",onResetButtonClick.bind(this))),bindEvents(this,this.options.player),refreshData(this,this.options.player);var dialogOptions,html,boundOnSliderChange=onDialogClosed.bind(this);return dialogHelper.open(this.dlg).then(boundOnSliderChange,boundOnSliderChange)},SubtitleOffsetDialog.prototype.close=function(){var dlg=this.dlg;dlg&&dialogHelper.close(dlg)},SubtitleOffsetDialog.prototype.destroy=function(){this.close(),this.options=null,this.dlg=null};export default SubtitleOffsetDialog;