@94ai/nf-audio 3.3.67 → 3.3.68

package/lib/nf-audio.cjs.js

@@ -388,6 +388,15 @@ const _sfc_main = {
       this.$refs.progressBar.style.left = this.$refs.progressContainer.clientWidth - this.$refs.progressBar.clientWidth / 2 + "px";
       this.pause();
     },
+    getOffsetX(ev) {
+      const e = ev || window.event;
+      const srcObj = e.target || e.srcElement;
+      if (e.offsetX) {
+        return e.offsetX;
+      }
+      const rect = srcObj.getBoundingClientRect();
+      return e.clientX - rect.left;
+    },
     //点击进度条更新进度
     clickProgress(e) {
       if (!this.disabled) {
@@ -399,8 +408,8 @@ const _sfc_main = {
           this.betweenPlaying = false;
           return false;
         }
-        this.updateProgress(e.offsetX);
-        this.$emit("updateProgress", e.offsetX);
+        this.updateProgress(this.getOffsetX(e));
+        this.$emit("updateProgress", this.getOffsetX(e));
       }
     },
     //更新进度
@@ -438,8 +447,8 @@ const _sfc_main = {
         this.paused = true;
         this.betweenPlaying = false;
         const progressContainer = this.$refs.progressContainer;
-        this.moveMin = progressContainer.offsetParent.offsetLeft + progressContainer.offsetLeft;
-        this.moveMax = progressContainer.offsetParent.offsetLeft + progressContainer.offsetLeft + progressContainer.clientWidth;
+        this.moveMin = progressContainer.getBoundingClientRect().left;
+        this.moveMax = progressContainer.getBoundingClientRect().left + progressContainer.clientWidth;
         this.progressBarWidth = this.$refs.progressBar.clientWidth / 2;
         document.addEventListener("mousemove", this.moveX);
         document.addEventListener("mouseup", () => {

package/lib/nf-audio.esm-bundler.js

@@ -386,6 +386,15 @@ const _sfc_main = {
       this.$refs.progressBar.style.left = this.$refs.progressContainer.clientWidth - this.$refs.progressBar.clientWidth / 2 + "px";
       this.pause();
     },
+    getOffsetX(ev) {
+      const e = ev || window.event;
+      const srcObj = e.target || e.srcElement;
+      if (e.offsetX) {
+        return e.offsetX;
+      }
+      const rect = srcObj.getBoundingClientRect();
+      return e.clientX - rect.left;
+    },
     //点击进度条更新进度
     clickProgress(e) {
       if (!this.disabled) {
@@ -397,8 +406,8 @@ const _sfc_main = {
           this.betweenPlaying = false;
           return false;
         }
-        this.updateProgress(e.offsetX);
-        this.$emit("updateProgress", e.offsetX);
+        this.updateProgress(this.getOffsetX(e));
+        this.$emit("updateProgress", this.getOffsetX(e));
       }
     },
     //更新进度
@@ -436,8 +445,8 @@ const _sfc_main = {
         this.paused = true;
         this.betweenPlaying = false;
         const progressContainer = this.$refs.progressContainer;
-        this.moveMin = progressContainer.offsetParent.offsetLeft + progressContainer.offsetLeft;
-        this.moveMax = progressContainer.offsetParent.offsetLeft + progressContainer.offsetLeft + progressContainer.clientWidth;
+        this.moveMin = progressContainer.getBoundingClientRect().left;
+        this.moveMax = progressContainer.getBoundingClientRect().left + progressContainer.clientWidth;
         this.progressBarWidth = this.$refs.progressBar.clientWidth / 2;
         document.addEventListener("mousemove", this.moveX);
         document.addEventListener("mouseup", () => {

package/package/nf-audio.vue

@@ -43,7 +43,7 @@
       </slot>
 
       <!--      快退-->
-      <slot name="fastBack" v-if="backSecond" >
+      <slot name="fastBack" v-if="backSecond">
         <el-tooltip class="nf-audio-pre"
                     placement="top"
                     :disabled="disabled"
@@ -173,7 +173,7 @@ export default {
       default: false
     },
     size: {
-      type: String,
+      type: String
     },
     speedDesc: {
       type: String,
@@ -341,7 +341,7 @@ export default {
     try {
       this.audioCtx?.close()
     } catch (e) {
-    //
+      //
     } finally {
       this.audioCtx = undefined
     }
@@ -415,7 +415,7 @@ export default {
       if (!this.disabled) {
         if (this.audio.readyState >= 2) {
           // 如果音频资源已加载元数据或更多，可以播放
-          if(this.audio.paused) {
+          if (this.audio.paused) {
             this.playAudio()
           } else {
             this.pauseAudio()
@@ -433,7 +433,7 @@ export default {
     },
     suspendAudioCtx() {
       try {
-        this.processor?.port?.postMessage({ command: 'end' });
+        this.processor?.port?.postMessage({ command: 'end' })
       } catch (e) {
         //
       }
@@ -453,11 +453,11 @@ export default {
       if (this.isHighPrecision()) {
         try {
           if (!this.audioCtx) {
-            this.audioCtx = new (window.AudioContext || window.webkitAudioContext)();
-            this.audioSource = this.audioCtx.createMediaElementSource(this.audio);
-            await this.audioCtx.audioWorklet?.addModule('data:application/javascript,' + encodeURIComponent(this.audioWorkletProcessor));
-            this.processor = new AudioWorkletNode(this.audioCtx, 'tick');
-            this.audioSource.connect(this.processor).connect(this.audioCtx.destination);
+            this.audioCtx = new (window.AudioContext || window.webkitAudioContext)()
+            this.audioSource = this.audioCtx.createMediaElementSource(this.audio)
+            await this.audioCtx.audioWorklet?.addModule('data:application/javascript,' + encodeURIComponent(this.audioWorkletProcessor))
+            this.processor = new AudioWorkletNode(this.audioCtx, 'tick')
+            this.audioSource.connect(this.processor).connect(this.audioCtx.destination)
             if (this.processor?.port) {
               this.processor.port.onmessage = (event) => {
                 if (event.data.command === 'tick') {
@@ -472,15 +472,15 @@ export default {
                     }
                   }
                 }
-              };
+              }
             }
           } else {
             this.audioCtx.resume()
           }
-        } catch(e) {
+        } catch (e) {
           console.log(e)
         }
-        this.processor.port.postMessage({ command: 'start' });
+        this.processor.port.postMessage({ command: 'start' })
       }
     },
     pause() {
@@ -552,6 +552,15 @@ export default {
       this.$refs.progressBar.style.left = this.$refs.progressContainer.clientWidth - (this.$refs.progressBar.clientWidth / 2) + 'px'
       this.pause()
     },
+    getOffsetX(ev) {
+      const e = ev || window.event
+      const srcObj = e.target || e.srcElement
+      if (e.offsetX) {
+        return e.offsetX
+      }
+      const rect = srcObj.getBoundingClientRect()
+      return e.clientX - rect.left
+    },
     //点击进度条更新进度
     clickProgress(e) {
       if (!this.disabled) {
@@ -563,8 +572,8 @@ export default {
           this.betweenPlaying = false
           return false
         }
-        this.updateProgress(e.offsetX)
-        this.$emit('updateProgress', e.offsetX)
+        this.updateProgress(this.getOffsetX(e))
+        this.$emit('updateProgress', this.getOffsetX(e))
       }
     },
     //更新进度
@@ -606,9 +615,9 @@ export default {
         this.betweenPlaying = false
         const progressContainer = this.$refs.progressContainer
         //进度条 左 边距离页面左边的距离 移动最小值
-        this.moveMin = progressContainer.offsetParent.offsetLeft + progressContainer.offsetLeft
+        this.moveMin = progressContainer.getBoundingClientRect().left
         //进度条 右 边距离页面左边的距离 移动最大值
-        this.moveMax = progressContainer.offsetParent.offsetLeft + progressContainer.offsetLeft + progressContainer.clientWidth
+        this.moveMax = progressContainer.getBoundingClientRect().left + progressContainer.clientWidth
         //progressBar的宽度
         this.progressBarWidth = (this.$refs.progressBar.clientWidth / 2)
         //获取当前鼠标的位置 X

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@94ai/nf-audio",
-  "version": "3.3.67",
+  "version": "3.3.68",
   "description": "> TODO: description",
   "keywords": [],
   "author": "liuxiangxiang <liuxiangxiang@94ai.com>",
@@ -14,7 +14,7 @@
     "url": "http://94ai.gitlab.com/zoujiahe/common-ui.git"
   },
   "dependencies": {
-    "@94ai/nf-theme-chalk": "^3.3.67",
+    "@94ai/nf-theme-chalk": "^3.3.68",
     "vue-demi": "^0.14.5"
   },
   "peerDependenciesMeta": {