{"version":3,"file":"recorded_voice_controller-DYq4K8eT.js","sources":["../../../app/javascript/controllers/editor/recorded_voice_controller.js"],"sourcesContent":["import {DirectUpload} from \"@rails/activestorage\";\nimport interact from \"interactjs\"\n\nimport ApplicationController from \"../application_controller\"\nimport { useRemove } from \"../mixins/useRemove\"\n\nexport default class extends ApplicationController {\n  static values = {\n    audioUrl: String,\n    duration: Number\n  }\n\n  static targets = [\"playButton\", \"pauseButton\", \"audio\", \"progress\", \"durationLabel\", \"pointer\", \"bar\", \"input\", \"overlay\", \"overlayActions\"]\n\n  initialize() {\n    this.durationLabelTarget.innerText = this.formatDuration(this.durationValue)\n    this.upload = new DirectUpload(this.inputTarget.files[0], this.inputTarget.dataset.directUploadUrl, this)\n  }\n\n  connect() {\n    this.audioTarget.src = this.audioUrlValue\n    this.audioTarget.load()\n\n    this.audioTarget.addEventListener(\"loadedmetadata\", this.onAudioMetadataLoaded.bind(this))\n    this.audioTarget.addEventListener(\"play\", this.onAudioPlay.bind(this))\n    this.audioTarget.addEventListener(\"pause\", this.onAudioPause.bind(this))\n\n    useRemove(this, {\n      stopEventPropagation: true,\n      after: this.dispatchRemoveEvent.bind(this)\n    })\n\n    this.startUpload()\n\n    interact(this.pointerTarget).draggable({\n      restrict: {\n        restriction: this.barTarget,\n        elementRect: { top: 0, left: 0, bottom: 1, right: 1 },\n        endOnly: true\n      },\n      inertia: true,\n      modifiers: [\n        interact.modifiers.restrictRect({\n          restriction: this.barTarget,\n          endOnly: true\n        })\n      ],\n      onstart: (event) => {\n        event.target.style.zIndex = '9999';\n      },\n      onmove: (event) => {\n        const newX = (parseFloat(event.target.getAttribute('data-x')) || 0) + event.dx;\n        const maxX = this.barTarget.clientWidth - event.target.clientWidth;\n\n        if(newX < 0 || newX > maxX) return;\n\n        this.progressTarget.style.width = `${(newX / maxX) * 100}%`;\n\n        event.target.setAttribute('data-x', newX);\n\n        const percentage = newX / maxX;\n        const newTime = this.audioTarget.duration * percentage;\n        this.audioTarget.currentTime = newTime;\n        this.durationLabelTarget.innerText = this.formatDuration(newTime * 1000)\n      }\n    });\n\n    this.element.querySelectorAll(\"input\").forEach(input => {\n      this.enable(input)\n    })\n  }\n\n  disconnect() {\n    this.dispatchRemoveEvent()\n  }\n\n  onAudioTimeUpdate() {\n    const { currentTime, duration } = this.audioTarget\n\n    if(this.isPlaying) {\n      this.durationLabelTarget.innerText = this.formatDuration(currentTime * 1000)\n      this.progressTarget.style.width = `${(currentTime / duration) * 100}%`\n      this.progressTarget.style.minWidth = \"8%\"\n\n      if (currentTime === duration) {\n        this.onAudioEnd()\n      }\n    }\n  }\n\n  onAudioMetadataLoaded() {\n    const { duration } = this.audioTarget\n\n    if (duration === Infinity || isNaN(duration)) {\n      this.audioTarget.currentTime = 10000000;\n      this.delayed(() => this.audioTarget.currentTime = 0, 1000)\n    }\n\n    this.audioTarget.addEventListener(\"timeupdate\", this.onAudioTimeUpdate.bind(this))\n  }\n\n  onAudioPlay() {\n    this.show(this.pauseButtonTarget)\n    this.hide(this.playButtonTarget)\n\n    this.isPlaying = true\n  }\n\n  onAudioPause() {\n    this.show(this.playButtonTarget)\n    this.hide(this.pauseButtonTarget)\n\n    this.isPlaying = false\n  }\n\n  onAudioEnd() {\n    this.audioTarget.pause()\n\n    this.delayed(() => {\n      this.show(this.playButtonTarget)\n      this.hide(this.pauseButtonTarget)\n\n      this.isPlaying = false\n      this.audioTarget.currentTime = 0\n\n      this.progressTarget.style.removeProperty(\"width\")\n      this.progressTarget.style.removeProperty(\"min-width\")\n    }, 500)\n  }\n\n  formatDuration(duration = this.durationValue) {\n    const totalSeconds = Math.floor(duration / 1000)\n    const minutes = Math.floor(totalSeconds / 60)\n    const seconds = Math.floor(totalSeconds % 60)\n\n    return `${minutes.toString().padStart(2, \"0\")}:${seconds.toString().padStart(2, \"0\")}`\n  }\n\n  play() {\n    this.audioTarget.play()\n  }\n\n  pause() {\n    this.audioTarget.pause()\n  }\n\n  startUpload() {\n    this.element.setAttribute(\"data-uploading\", \"\")\n\n    this.upload.create((error, blob) => {\n      if (error) {\n        this.element.removeAttribute(\"data-uploading\")\n        this.element.setAttribute(\"data-upload-error\", \"\")\n\n        this.hide(this.overlayTarget.querySelector('[data-spinner]'))\n        this.show(this.overlayActionsTarget)\n      } else {\n        this.element.removeAttribute(\"data-uploading\")\n        this.element.removeAttribute(\"data-upload-error\")\n\n        this.hide(this.overlayTarget)\n\n        let hiddenField = document.createElement('input')\n        hiddenField.type = \"hidden\"\n        hiddenField.value = blob.signed_id;\n        hiddenField.name = \"message[voice][signed_id]\"\n\n        this.element.appendChild(hiddenField)\n      }\n    })\n  }\n\n  retryUpload() {\n    this.show(this.overlayTarget.querySelector('[data-spinner]'))\n    this.hide(this.overlayActionsTarget)\n\n    this.startUpload()\n  }\n\n  dispatchRemoveEvent() {\n    this.dispatch(\"remove\", {\n      target: document.getElementById(\"editor--voice-tool\")\n    })\n  }\n\n  enable() {\n    this.element.removeAttribute('data-disabled')\n    super.enable(this.playButtonTarget)\n\n    interact(this.pointerTarget).draggable(true)\n  }\n\n  disable() {\n    this.element.setAttribute('data-disabled', '')\n    super.disable(this.playButtonTarget)\n\n    interact(this.pointerTarget).draggable(false)\n  }\n}\n"],"names":["recorded_voice_controller","ApplicationController","DirectUpload","useRemove","interact","event","newX","maxX","percentage","newTime","input","currentTime","duration","totalSeconds","minutes","seconds","error","blob","hiddenField","__publicField"],"mappings":"sWAMe,MAAKA,UAASC,CAAsB,CAQjD,YAAa,CACX,KAAK,oBAAoB,UAAY,KAAK,eAAe,KAAK,aAAa,EAC3E,KAAK,OAAS,IAAIC,EAAa,KAAK,YAAY,MAAM,CAAC,EAAG,KAAK,YAAY,QAAQ,gBAAiB,IAAI,CAC5G,CAEE,SAAU,CACR,KAAK,YAAY,IAAM,KAAK,cAC5B,KAAK,YAAY,KAAI,EAErB,KAAK,YAAY,iBAAiB,iBAAkB,KAAK,sBAAsB,KAAK,IAAI,CAAC,EACzF,KAAK,YAAY,iBAAiB,OAAQ,KAAK,YAAY,KAAK,IAAI,CAAC,EACrE,KAAK,YAAY,iBAAiB,QAAS,KAAK,aAAa,KAAK,IAAI,CAAC,EAEvEC,EAAU,KAAM,CACd,qBAAsB,GACtB,MAAO,KAAK,oBAAoB,KAAK,IAAI,CAC1C,CAAA,EAED,KAAK,YAAW,EAEhBC,EAAS,KAAK,aAAa,EAAE,UAAU,CACrC,SAAU,CACR,YAAa,KAAK,UAClB,YAAa,CAAE,IAAK,EAAG,KAAM,EAAG,OAAQ,EAAG,MAAO,CAAG,EACrD,QAAS,EACV,EACD,QAAS,GACT,UAAW,CACTA,EAAS,UAAU,aAAa,CAC9B,YAAa,KAAK,UAClB,QAAS,EACV,CAAA,CACF,EACD,QAAUC,GAAU,CAClBA,EAAM,OAAO,MAAM,OAAS,MAC7B,EACD,OAASA,GAAU,CACjB,MAAMC,GAAQ,WAAWD,EAAM,OAAO,aAAa,QAAQ,CAAC,GAAK,GAAKA,EAAM,GACtEE,EAAO,KAAK,UAAU,YAAcF,EAAM,OAAO,YAEvD,GAAGC,EAAO,GAAKA,EAAOC,EAAM,OAE5B,KAAK,eAAe,MAAM,MAAQ,GAAID,EAAOC,EAAQ,GAAG,IAExDF,EAAM,OAAO,aAAa,SAAUC,CAAI,EAExC,MAAME,EAAaF,EAAOC,EACpBE,EAAU,KAAK,YAAY,SAAWD,EAC5C,KAAK,YAAY,YAAcC,EAC/B,KAAK,oBAAoB,UAAY,KAAK,eAAeA,EAAU,GAAI,CAC/E,CACA,CAAK,EAED,KAAK,QAAQ,iBAAiB,OAAO,EAAE,QAAQC,GAAS,CACtD,KAAK,OAAOA,CAAK,CAClB,CAAA,CACL,CAEE,YAAa,CACX,KAAK,oBAAmB,CAC5B,CAEE,mBAAoB,CAClB,KAAM,CAAE,YAAAC,EAAa,SAAAC,CAAU,EAAG,KAAK,YAEpC,KAAK,YACN,KAAK,oBAAoB,UAAY,KAAK,eAAeD,EAAc,GAAI,EAC3E,KAAK,eAAe,MAAM,MAAQ,GAAIA,EAAcC,EAAY,GAAG,IACnE,KAAK,eAAe,MAAM,SAAW,KAEjCD,IAAgBC,GAClB,KAAK,WAAU,EAGvB,CAEE,uBAAwB,CACtB,KAAM,CAAE,SAAAA,CAAU,EAAG,KAAK,aAEtBA,IAAa,KAAY,MAAMA,CAAQ,KACzC,KAAK,YAAY,YAAc,IAC/B,KAAK,QAAQ,IAAM,KAAK,YAAY,YAAc,EAAG,GAAI,GAG3D,KAAK,YAAY,iBAAiB,aAAc,KAAK,kBAAkB,KAAK,IAAI,CAAC,CACrF,CAEE,aAAc,CACZ,KAAK,KAAK,KAAK,iBAAiB,EAChC,KAAK,KAAK,KAAK,gBAAgB,EAE/B,KAAK,UAAY,EACrB,CAEE,cAAe,CACb,KAAK,KAAK,KAAK,gBAAgB,EAC/B,KAAK,KAAK,KAAK,iBAAiB,EAEhC,KAAK,UAAY,EACrB,CAEE,YAAa,CACX,KAAK,YAAY,MAAK,EAEtB,KAAK,QAAQ,IAAM,CACjB,KAAK,KAAK,KAAK,gBAAgB,EAC/B,KAAK,KAAK,KAAK,iBAAiB,EAEhC,KAAK,UAAY,GACjB,KAAK,YAAY,YAAc,EAE/B,KAAK,eAAe,MAAM,eAAe,OAAO,EAChD,KAAK,eAAe,MAAM,eAAe,WAAW,CAC1D,EAAO,GAAG,CACV,CAEE,eAAeA,EAAW,KAAK,cAAe,CAC5C,MAAMC,EAAe,KAAK,MAAMD,EAAW,GAAI,EACzCE,EAAU,KAAK,MAAMD,EAAe,EAAE,EACtCE,EAAU,KAAK,MAAMF,EAAe,EAAE,EAE5C,MAAO,GAAGC,EAAQ,SAAU,EAAC,SAAS,EAAG,GAAG,CAAC,IAAIC,EAAQ,SAAU,EAAC,SAAS,EAAG,GAAG,CAAC,EACxF,CAEE,MAAO,CACL,KAAK,YAAY,KAAI,CACzB,CAEE,OAAQ,CACN,KAAK,YAAY,MAAK,CAC1B,CAEE,aAAc,CACZ,KAAK,QAAQ,aAAa,iBAAkB,EAAE,EAE9C,KAAK,OAAO,OAAO,CAACC,EAAOC,IAAS,CAClC,GAAID,EACF,KAAK,QAAQ,gBAAgB,gBAAgB,EAC7C,KAAK,QAAQ,aAAa,oBAAqB,EAAE,EAEjD,KAAK,KAAK,KAAK,cAAc,cAAc,gBAAgB,CAAC,EAC5D,KAAK,KAAK,KAAK,oBAAoB,MAC9B,CACL,KAAK,QAAQ,gBAAgB,gBAAgB,EAC7C,KAAK,QAAQ,gBAAgB,mBAAmB,EAEhD,KAAK,KAAK,KAAK,aAAa,EAE5B,IAAIE,EAAc,SAAS,cAAc,OAAO,EAChDA,EAAY,KAAO,SACnBA,EAAY,MAAQD,EAAK,UACzBC,EAAY,KAAO,4BAEnB,KAAK,QAAQ,YAAYA,CAAW,CAC5C,CACK,CAAA,CACL,CAEE,aAAc,CACZ,KAAK,KAAK,KAAK,cAAc,cAAc,gBAAgB,CAAC,EAC5D,KAAK,KAAK,KAAK,oBAAoB,EAEnC,KAAK,YAAW,CACpB,CAEE,qBAAsB,CACpB,KAAK,SAAS,SAAU,CACtB,OAAQ,SAAS,eAAe,oBAAoB,CACrD,CAAA,CACL,CAEE,QAAS,CACP,KAAK,QAAQ,gBAAgB,eAAe,EAC5C,MAAM,OAAO,KAAK,gBAAgB,EAElCd,EAAS,KAAK,aAAa,EAAE,UAAU,EAAI,CAC/C,CAEE,SAAU,CACR,KAAK,QAAQ,aAAa,gBAAiB,EAAE,EAC7C,MAAM,QAAQ,KAAK,gBAAgB,EAEnCA,EAAS,KAAK,aAAa,EAAE,UAAU,EAAK,CAChD,CACA,CA/LEe,EADkBnB,EACX,SAAS,CACd,SAAU,OACV,SAAU,MACd,GAEEmB,EANkBnB,EAMX,UAAU,CAAC,aAAc,cAAe,QAAS,WAAY,gBAAiB,UAAW,MAAO,QAAS,UAAW,gBAAgB"}