{"version":3,"file":"video-volume.vue2.cjs","sources":["../../../components/video/video-volume.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Icon } from '@/components/icon'\nimport { Slider } from '@/components/slider'\n\nimport { computed, inject, ref, watch } from 'vue'\n\nimport { useIcons, useNameHelper } from '@vexip-ui/config'\nimport VideoControl from './video-control.vue'\nimport { mergeIconScale } from './helper'\nimport { VIDEO_STATE } from './symbol'\n\ndefineOptions({ name: 'VideoVolume' })\n\nconst props = defineProps({\n  volume: {\n    type: Number,\n    default: 1,\n  },\n})\n\nconst emit = defineEmits(['change'])\n\nconst nh = useNameHelper('video')\nconst icons = useIcons()\n\nconst videoState = inject(VIDEO_STATE)!\n\nconst currentVolume = ref(props.volume)\nconst muted = ref(false)\n// const visible = ref(true)\n\nconst volumeIcon = computed(() => {\n  return muted.value\n    ? icons.value.volumeMute\n    : currentVolume.value < 0.5\n      ? icons.value.volumeLow\n      : icons.value.volume\n})\n\nwatch(\n  () => props.volume,\n  value => {\n    currentVolume.value = value\n  },\n)\n\ndefineExpose({ toggleMute })\n\nlet prevVolume = currentVolume.value\n\nfunction toggleMute() {\n  if (muted.value) {\n    currentVolume.value = prevVolume <= 0 ? 0.5 : prevVolume\n  } else {\n    prevVolume = currentVolume.value\n    currentVolume.value = 0\n  }\n\n  muted.value = !muted.value\n\n  emit('change', currentVolume.value)\n}\n\nfunction handleSlide(value: number) {\n  value /= 100\n  prevVolume = value\n  currentVolume.value = value\n  muted.value = value <= 0\n\n  emit('change', currentVolume.value)\n}\n</script>\n\n<template>\n  <VideoControl\n    :class=\"nh.be('volume')\"\n    type=\"panel\"\n    :tip-class=\"nh.be('volume-panel')\"\n    @click=\"toggleMute\"\n  >\n    <Icon v-bind=\"mergeIconScale(videoState.iconScale, volumeIcon)\"></Icon>\n    <template #panel>\n      <div :class=\"nh.be('volume-text')\">\n        {{ (currentVolume * 100).toFixed() }}\n      </div>\n      <Slider\n        :value=\"currentVolume * 100\"\n        :class=\"nh.be('volume-slider')\"\n        :min=\"0\"\n        :max=\"100\"\n        vertical\n        hide-tip\n        reverse\n        :range=\"false\"\n        @input=\"handleSlide\"\n      ></Slider>\n    </template>\n  </VideoControl>\n</template>\n"],"names":["props","__props","emit","__emit","nh","useNameHelper","icons","useIcons","videoState","inject","VIDEO_STATE","currentVolume","ref","muted","volumeIcon","computed","watch","value","__expose","toggleMute","prevVolume","handleSlide","_createBlock","VideoControl","_normalizeClass","_unref","_createElementVNode","_toDisplayString","_createVNode","Slider","mergeIconScale"],"mappings":"6dAaA,MAAMA,EAAQC,EAORC,EAAOC,EAEPC,EAAKC,gBAAc,OAAO,EAC1BC,EAAQC,EAAAA,SAAS,EAEjBC,EAAaC,SAAOC,aAAW,EAE/BC,EAAgBC,EAAAA,IAAIZ,EAAM,MAAM,EAChCa,EAAQD,MAAI,EAAK,EAGjBE,EAAaC,EAAAA,SAAS,IACnBF,EAAM,MACTP,EAAM,MAAM,WACZK,EAAc,MAAQ,GACpBL,EAAM,MAAM,UACZA,EAAM,MAAM,MACnB,EAEDU,EAAA,MACE,IAAMhB,EAAM,OACHiB,GAAA,CACPN,EAAc,MAAQM,CAAA,CAE1B,EAEaC,EAAA,CAAE,WAAAC,EAAY,EAE3B,IAAIC,EAAaT,EAAc,MAE/B,SAASQ,GAAa,CAChBN,EAAM,MACMF,EAAA,MAAQS,GAAc,EAAI,GAAMA,GAE9CA,EAAaT,EAAc,MAC3BA,EAAc,MAAQ,GAGlBE,EAAA,MAAQ,CAACA,EAAM,MAEhBX,EAAA,SAAUS,EAAc,KAAK,CAAA,CAGpC,SAASU,EAAYJ,EAAe,CACzBA,GAAA,IACIG,EAAAH,EACbN,EAAc,MAAQM,EACtBJ,EAAM,MAAQI,GAAS,EAElBf,EAAA,SAAUS,EAAc,KAAK,CAAA,6BAKlCW,EAAA,YAuBeC,EAAA,CAtBZ,MAAKC,EAAE,eAAAC,EAAA,MAAErB,CAAA,EAAC,GAAE,QAAA,CAAA,EACb,KAAK,QACJ,YAAWqB,EAAAA,MAAErB,CAAA,EAAC,GAAE,cAAA,EAChB,QAAOe,CAAA,GAGG,gBACT,IAEM,CAFNO,EAAAA,mBAEM,MAAA,CAFA,MAAKF,EAAE,eAAAC,EAAA,MAAErB,CAAA,EAAC,GAAE,aAAA,CAAA,CAAA,EACZuB,EAAAA,iBAAAhB,EAAA,WAAqB,QAAO,CAAA,EAAA,CAAA,EAElCiB,cAUUH,EAAAA,MAAAI,CAAA,EAAA,CATP,MAAOlB,EAAa,MAAA,IACpB,MAAKa,EAAE,eAAAC,EAAA,MAAErB,CAAA,EAAC,GAAE,eAAA,CAAA,EACZ,IAAK,EACL,IAAK,IACN,SAAA,GACA,WAAA,GACA,QAAA,GACC,MAAO,GACP,QAAOiB,iDAdZ,IAAuE,CAAvEO,cAAuEH,iDAAzDA,QAAcK,gBAAA,EAACL,WAAW,UAAWX,EAAU,KAAA,CAAA,CAAA,EAAA,KAAA,EAAA,CAAA"}