{"version":3,"file":"audio_controller-BRdlOqRA.js","sources":["../../../app/javascript/controllers/message/audio_controller.js"],"sourcesContent":["import interact from \"interactjs\"\n\nimport ApplicationController from \"../application_controller\"\n\nexport default class extends ApplicationController {\n  static values = {\n    duration: { type: Number, default: 0 }\n  }\n\n  static targets = [\"playButton\", \"pauseButton\", \"audio\", \"progress\", \"durationLabel\", \"pointer\", \"bar\", \"input\"]\n\n  initialize() {\n    if(this.durationValue) {\n      this.durationLabelTarget.innerText = this.formatDuration(this.durationValue)\n    }\n  }\n\n  connect() {\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    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\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\n      this.delayed(() => {\n        this.audioTarget.currentTime = 0\n        this.durationValue = this.audioTarget.duration\n        this.durationLabelTarget.innerText = this.formatDuration(this.audioTarget.duration * 1000)\n      }, 1000)\n\n    } else {\n      this.durationValue = duration\n      this.durationLabelTarget.innerText = this.formatDuration(duration * 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.dispatch('play', {\n      target: document.documentElement,\n      detail: { audio: this.audioTarget }\n    })\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({ type, detail }) {\n    if(type === 'click' || type !== 'click' && detail.audio !== this.audioTarget) {\n      this.audioTarget.pause()\n    }\n  }\n}\n"],"names":["audio_controller","ApplicationController","interact","event","newX","maxX","percentage","newTime","currentTime","duration","totalSeconds","minutes","seconds","type","detail","__publicField"],"mappings":"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"}