cnhis-design-vue 3.3.1-beta.54 → 3.3.1-beta.56

package/es/components/audio-sdk/src/utils/recorder/wave.js

@@ -0,0 +1,258 @@
+function useWave(Recorder) {
+  var FrequencyHistogramView = function(set) {
+    return new fn(set);
+  };
+  var ViewTxt = "FrequencyHistogramView";
+  var fn = function(set) {
+    var This = this;
+    var o = {
+      scale: 2,
+      fps: 20,
+      lineCount: 30,
+      widthRatio: 0.6,
+      spaceWidth: 0,
+      minHeight: 0,
+      position: -1,
+      mirrorEnable: false,
+      stripeEnable: true,
+      stripeHeight: 3,
+      stripeMargin: 6,
+      fallDuration: 1e3,
+      stripeFallDuration: 3500,
+      linear: [0, "rgba(0,187,17,1)", 0.5, "rgba(255,215,0,1)", 1, "rgba(255,102,0,1)"],
+      stripeLinear: null,
+      shadowBlur: 0,
+      shadowColor: "#bbb",
+      stripeShadowBlur: -1,
+      stripeShadowColor: "",
+      onDraw: function(frequencyData, sampleRate) {
+      }
+    };
+    for (var k in set) {
+      o[k] = set[k];
+    }
+    This.set = set = o;
+    var elem = set.elem;
+    if (elem) {
+      if (typeof elem == "string") {
+        elem = document.querySelector(elem);
+      } else if (elem.length) {
+        elem = elem[0];
+      }
+    }
+    if (elem) {
+      set.width = elem.offsetWidth;
+      set.height = elem.offsetHeight;
+    }
+    var scale = set.scale;
+    var width = set.width * scale;
+    var height = set.height * scale;
+    if (!width || !height) {
+      throw new Error(ViewTxt + "\u65E0\u5BBD\u9AD8");
+    }
+    var thisElem = This.elem = document.createElement("div");
+    var lowerCss = ["", "transform-origin:0 0;", "transform:scale(" + 1 / scale + ");"];
+    thisElem.innerHTML = '<div style="width:' + set.width + "px;height:" + set.height + 'px;overflow:hidden"><div style="width:' + width + "px;height:" + height + "px;" + lowerCss.join("-webkit-") + lowerCss.join("-ms-") + lowerCss.join("-moz-") + lowerCss.join("") + '"><canvas/></div></div>';
+    var canvas = This.canvas = thisElem.querySelector("canvas");
+    This.ctx = canvas.getContext("2d");
+    canvas.width = width;
+    canvas.height = height;
+    if (elem) {
+      elem.innerHTML = "";
+      elem.appendChild(thisElem);
+    }
+    if (!Recorder.LibFFT) {
+      throw new Error("\u9700\u8981lib.fft.js\u652F\u6301");
+    }
+    This.fft = Recorder.LibFFT(1024);
+    This.lastH = [];
+    This.stripesH = [];
+  };
+  fn.prototype = FrequencyHistogramView.prototype = {
+    genLinear: function(ctx, colors, from, to) {
+      var rtv = ctx.createLinearGradient(0, from, 0, to);
+      for (var i = 0; i < colors.length; ) {
+        rtv.addColorStop(colors[i++], colors[i++]);
+      }
+      return rtv;
+    },
+    input: function(pcmData, powerLevel, sampleRate) {
+      var This = this;
+      This.sampleRate = sampleRate;
+      This.pcmData = pcmData;
+      This.pcmPos = 0;
+      This.inputTime = Date.now();
+      This.schedule();
+    },
+    schedule: function() {
+      var This = this, set = This.set;
+      var interval = Math.floor(1e3 / set.fps);
+      if (!This.timer) {
+        This.timer = setInterval(function() {
+          This.schedule();
+        }, interval);
+      }
+      var now = Date.now();
+      var drawTime = This.drawTime || 0;
+      if (now - This.inputTime > set.stripeFallDuration * 1.3) {
+        clearInterval(This.timer);
+        This.timer = 0;
+        return;
+      }
+      if (now - drawTime < interval) {
+        return;
+      }
+      This.drawTime = now;
+      var bufferSize = This.fft.bufferSize;
+      var pcm = This.pcmData;
+      var pos = This.pcmPos;
+      var arr = new Int16Array(bufferSize);
+      for (var i = 0; i < bufferSize && pos < pcm.length; i++, pos++) {
+        arr[i] = pcm[pos];
+      }
+      This.pcmPos = pos;
+      var frequencyData = This.fft.transform(arr);
+      This.draw(frequencyData, This.sampleRate);
+    },
+    draw: function(frequencyData, sampleRate) {
+      var This = this, set = This.set;
+      var ctx = This.ctx;
+      var scale = set.scale;
+      var width = set.width * scale;
+      var height = set.height * scale;
+      var lineCount = set.lineCount;
+      var bufferSize = This.fft.bufferSize;
+      var position = set.position;
+      var posAbs = Math.abs(set.position);
+      var originY = position == 1 ? 0 : height;
+      var heightY = height;
+      if (posAbs < 1) {
+        heightY = heightY / 2;
+        originY = heightY;
+        heightY = Math.floor(heightY * (1 + posAbs));
+        originY = Math.floor(position > 0 ? originY * (1 - posAbs) : originY * (1 + posAbs));
+      }
+      var lastH = This.lastH;
+      var stripesH = This.stripesH;
+      var speed = Math.ceil(heightY / (set.fallDuration / (1e3 / set.fps)));
+      var stripeSpeed = Math.ceil(heightY / (set.stripeFallDuration / (1e3 / set.fps)));
+      var stripeMargin = set.stripeMargin * scale;
+      var Y0 = 1 << (Math.round(Math.log(bufferSize) / Math.log(2) + 3) << 1);
+      var logY0 = Math.log(Y0) / Math.log(10);
+      var dBmax = 20 * Math.log(32767) / Math.log(10);
+      var fftSize = bufferSize / 2;
+      var fftSize5k = Math.min(fftSize, Math.floor(fftSize * 5e3 / (sampleRate / 2)));
+      var fftSize5kIsAll = fftSize5k == fftSize;
+      var line80 = fftSize5kIsAll ? lineCount : Math.round(lineCount * 0.8);
+      var fftSizeStep1 = fftSize5k / line80;
+      var fftSizeStep2 = fftSize5kIsAll ? 0 : (fftSize - fftSize5k) / (lineCount - line80);
+      var fftIdx = 0;
+      for (var i = 0; i < lineCount; i++) {
+        var start = Math.ceil(fftIdx);
+        if (i < line80) {
+          fftIdx += fftSizeStep1;
+        } else {
+          fftIdx += fftSizeStep2;
+        }
+        var end = Math.min(Math.ceil(fftIdx), fftSize);
+        var maxAmp = 0;
+        for (var j = start; j < end; j++) {
+          maxAmp = Math.max(maxAmp, Math.abs(frequencyData[j]));
+        }
+        var dB = maxAmp > Y0 ? Math.floor((Math.log(maxAmp) / Math.log(10) - logY0) * 17) : 0;
+        var h = heightY * Math.min(dB / dBmax, 1);
+        lastH[i] = (lastH[i] || 0) - speed;
+        if (h < lastH[i]) {
+          h = lastH[i];
+        }
+        if (h < 0) {
+          h = 0;
+        }
+        lastH[i] = h;
+        var shi = stripesH[i] || 0;
+        if (h && h + stripeMargin > shi) {
+          stripesH[i] = h + stripeMargin;
+        } else {
+          var sh = shi - stripeSpeed;
+          if (sh < 0) {
+            sh = 0;
+          }
+          stripesH[i] = sh;
+        }
+      }
+      ctx.clearRect(0, 0, width, height);
+      var linear1 = This.genLinear(ctx, set.linear, originY, originY - heightY);
+      var stripeLinear1 = set.stripeLinear && This.genLinear(ctx, set.stripeLinear, originY, originY - heightY) || linear1;
+      var linear2 = This.genLinear(ctx, set.linear, originY, originY + heightY);
+      var stripeLinear2 = set.stripeLinear && This.genLinear(ctx, set.stripeLinear, originY, originY + heightY) || linear2;
+      ctx.shadowBlur = set.shadowBlur * scale;
+      ctx.shadowColor = set.shadowColor;
+      var mirrorEnable = set.mirrorEnable;
+      var mirrorCount = mirrorEnable ? lineCount * 2 - 1 : lineCount;
+      var widthRatio = set.widthRatio;
+      var spaceWidth = set.spaceWidth * scale;
+      if (spaceWidth != 0) {
+        widthRatio = (width - spaceWidth * (mirrorCount + 1)) / width;
+      }
+      var lineWidth = Math.max(1 * scale, Math.floor(width * widthRatio / mirrorCount));
+      var spaceFloat = (width - mirrorCount * lineWidth) / (mirrorCount + 1);
+      var minHeight = set.minHeight * scale;
+      var mirrorSubX = spaceFloat + lineWidth / 2;
+      var XFloat = mirrorEnable ? width / 2 - mirrorSubX : 0;
+      for (var i = 0, xFloat = XFloat, x, y, h; i < lineCount; i++) {
+        xFloat += spaceFloat;
+        x = Math.floor(xFloat);
+        h = Math.max(lastH[i], minHeight);
+        if (originY != 0) {
+          y = originY - h;
+          ctx.fillStyle = linear1;
+          ctx.fillRect(x, y, lineWidth, h);
+        }
+        if (originY != height) {
+          ctx.fillStyle = linear2;
+          ctx.fillRect(x, originY, lineWidth, h);
+        }
+        xFloat += lineWidth;
+      }
+      if (set.stripeEnable) {
+        var stripeShadowBlur = set.stripeShadowBlur;
+        ctx.shadowBlur = (stripeShadowBlur == -1 ? set.shadowBlur : stripeShadowBlur) * scale;
+        ctx.shadowColor = set.stripeShadowColor || set.shadowColor;
+        var stripeHeight = set.stripeHeight * scale;
+        for (var i = 0, xFloat = XFloat, x, y, h; i < lineCount; i++) {
+          xFloat += spaceFloat;
+          x = Math.floor(xFloat);
+          h = stripesH[i];
+          if (originY != 0) {
+            y = originY - h - stripeHeight;
+            if (y < 0) {
+              y = 0;
+            }
+            ctx.fillStyle = stripeLinear1;
+            ctx.fillRect(x, y, lineWidth, stripeHeight);
+          }
+          if (originY != height) {
+            y = originY + h;
+            if (y + stripeHeight > height) {
+              y = height - stripeHeight;
+            }
+            ctx.fillStyle = stripeLinear2;
+            ctx.fillRect(x, y, lineWidth, stripeHeight);
+          }
+          xFloat += lineWidth;
+        }
+      }
+      if (mirrorEnable) {
+        var srcW = Math.floor(width / 2);
+        ctx.save();
+        ctx.scale(-1, 1);
+        ctx.drawImage(This.canvas, Math.ceil(width / 2), 0, srcW, height, -srcW, 0, srcW, height);
+        ctx.restore();
+      }
+      set.onDraw(frequencyData, sampleRate);
+    }
+  };
+  Recorder[ViewTxt] = FrequencyHistogramView;
+}
+
+export { useWave };

package/es/components/index.js

@@ -105,6 +105,8 @@ export { useScrollLoading } from '../shared/hooks/useScrollLoading.js';
 export { vFlexibleResize } from '../shared/directive/flexibleResize.js';
 export { useGuide } from './guide/src/useGuide.js';
 export { DragScroll, useDragScroll } from './drag-scroll/src/index.js';
+import './audio-sdk/src/utils/recorder/index.js';
+export { default as CRecorder } from './audio-sdk/src/utils/recorder/recorder.js';
 export { useAnchor } from './form-render/src/hooks/useAnchor.js';
 export { BusinessCollector, useBusinessBinding } from './form-render/src/hooks/useBusinessBinding.js';
 export { ContextCollector, useChangeContext } from './form-render/src/hooks/useChangeContext.js';

package/es/shared/package.json.js

@@ -1,5 +1,5 @@
 var name = "@cnhis-design-vue/shared";
-var version = "3.3.1-beta.54";
+var version = "3.3.1-beta.56";
 var main = "index.ts";
 var peerDependencies = {
 	"naive-ui": "^2.30.0",

package/es/shared/utils/index.js

@@ -122,7 +122,7 @@ const charMap = {
   "(": 5.17,
   ")": 5.17,
   "-": 7.51,
-  "+": 7.51,
+  "+": 8.8,
   "/": 4.11,
   "\\": 4.11,
   "%": 12.68,
@@ -130,7 +130,8 @@ const charMap = {
   "\uFF1B": 13.95,
   "\u3001": 13.95,
   "\uFF0C": 13.95,
-  "\u3002": 13.95
+  "\u3002": 13.95,
+  ":": 4.03
 };
 const numberReg = /\d/;
 const chineseReg = /[\u4e00-\u9fa5（）：，。]/;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "cnhis-design-vue",
-	"version": "3.3.1-beta.54",
+	"version": "3.3.1-beta.56",
 	"license": "ISC",
 	"module": "./es/components/index.js",
 	"main": "./es/components/index.js",
@@ -50,7 +50,6 @@
 		"min-dom": "^3.2.1",
 		"moment": "^2.29.1",
 		"naive-ui": "^2.34.0",
-		"recorder-core": "^1.2.23070100",
 		"socket.io-client": "^4.7.3",
 		"sockjs-client": "^1.6.1",
 		"sortablejs": "^1.15.0",