vislite 0.5.0 → 0.5.2-alpha.0

package/uni-app/ui-canvas.vue

@@ -1,222 +1,226 @@
-<template>
-  <view :class="cover || isH5 ? 'cover-view' : 'normal-view'">
-    <view :class="'view-img view-' + uniqueid" @touchstart="doitstart">
-      <image :style="{ width: width + 'px', height: height + 'px' }" :src="viewImg"></image>
-    </view>
-
-    <!-- #ifdef MP-ALIPAY -->
-    <canvas class="painter" :id="'painter-' + uniqueid" @touchstart="doitstart"
-      :style="{ width: width + 'px', height: height + 'px' }"></canvas>
-    <canvas v-if="region" class="region" :id="'region-' + uniqueid"
-      :style="{ width: width + 'px', height: height + 'px' }"></canvas>
-    <!-- #endif -->
-    <!-- #ifdef MP-WEIXIN -->
-    <canvas class="painter" canvas-id="painter" @touchstart="doitstart"
-      :style="{ width: width + 'px', height: height + 'px' }"></canvas>
-    <canvas v-if="region" class="region" canvas-id="region"
-      :style="{ width: width + 'px', height: height + 'px' }"></canvas>
-    <!-- #endif -->
-    <!-- #ifndef MP-WEIXIN||MP-ALIPAY -->
-    <canvas class="painter" :canvas-id="'painter-' + uniqueid" @touchstart="doitstart"
-      :style="{ width: width + 'px', height: height + 'px' }"></canvas>
-    <canvas v-if="region" class="region" :canvas-id="'region-' + uniqueid"
-      :style="{ width: width + 'px', height: height + 'px' }"></canvas>
-    <!-- #endif -->
-  </view>
-</template>
-<script>
-import OralCanvas from "../lib/OralCanvas/index.es.js";
-export default {
-  data() {
-    return {
-      uniqueid: (Math.random() * 10000).toFixed(0),
-      help: {},
-      viewImg: "",
-      // #ifdef H5
-      isH5: true,
-      // #endif
-      // #ifndef H5
-      isH5: false,
-      // #endif
-    };
-  },
-  props: {
-    width: {
-      type: Number,
-      default: 300,
-    },
-    height: {
-      type: Number,
-      default: 150,
-    },
-    touchstart: {
-      type: Function,
-      default: () => { },
-    },
-    cover: {
-      type: Boolean,
-      default: true,
-    },
-    region: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  methods: {
-    fetch() {
-      let painter, region, painterid, regionid;
-      // #ifdef MP-WEIXIN
-      painter = uni.createCanvasContext("painter", this);
-      if (this.region) region = uni.createCanvasContext("region", this);
-      painterid = "painter";
-      regionid = "region";
-      // #endif
-      // #ifndef MP-WEIXIN
-      painter = uni.createCanvasContext("painter-" + this.uniqueid, this);
-      if (this.region) region = uni.createCanvasContext("region-" + this.uniqueid, this);
-      painterid = "painter-" + this.uniqueid;
-      regionid = "region-" + this.uniqueid;
-      // #endif
-
-      let _this = this;
-      this.help.instance = new OralCanvas(
-        {
-          getContext() {
-            return painter;
-          },
-        },
-        _this.region ? {
-          getContext() {
-            // #ifdef MP-ALIPAY
-            let getImageData = region.getImageData;
-            // #endif
-            region.getImageData = (x, y, width, height) => {
-              return new Promise((resolve, reject) => {
-                let options = {
-                  x,
-                  y,
-                  width,
-                  height,
-                  canvasId: regionid,
-                  success: function success(res) {
-                    resolve(res.data);
-                  },
-                  fail: function fail(error) {
-                    reject(error);
-                  },
-                };
-
-                // #ifdef MP-ALIPAY
-                getImageData(options, _this);
-                // #endif
-                // #ifndef MP-ALIPAY
-                uni.canvasGetImageData(options, _this);
-                // #endif
-              });
-            };
-            return region;
-          },
-        } : null
-      );
-      this.help.instance.draw = (reserve = false, callback = () => { }) => {
-        painter.draw(reserve, () => {
-
-          // 如果不使用原生渲染
-          if (!this.cover && !this.isH5) {
-            uni.canvasToTempFilePath(
-              {
-                canvasId: painterid,
-                success: (e) => {
-                  this.viewImg = e.tempFilePath;
-                  if (_this.region) region.draw(reserve);
-                  callback();
-                },
-              },
-              this
-            );
-          } else {
-            if (_this.region) region.draw(reserve);
-            callback();
-          }
-        });
-
-      };
-      return new Promise((resolve, reject) => {
-        this.help.instance.toDataURL = () => {
-          return new Promise((resolveUrl) => {
-            uni.canvasToTempFilePath(
-              {
-                canvasId: painterid,
-                success: function (e) {
-                  resolveUrl(e.tempFilePath);
-                },
-              },
-              this
-            );
-          });
-        };
-
-        resolve(this.help.instance);
-      });
-    },
-    doit(event, doback) {
-      let doRun = (x, y) => {
-        this.help.instance.getRegion(x, y).then((regionName) => {
-          // 兼容旧语法
-          if (typeof doback == "function") doback(regionName);
-
-          this.$emit("dotouchstart", {
-            name: regionName,
-            x: x,
-            y: y,
-          });
-        });
-      };
-
-      if (this.cover || this.isH5) {
-        let x = event.touches[0].x;
-        let y = event.touches[0].y;
-        doRun(x, y);
-      } else {
-        uni
-          .createSelectorQuery()
-          .selectViewport()
-          .scrollOffset()
-          .exec((ret) => {
-            uni
-              .createSelectorQuery()
-              .in(this)
-              .select(".view-" + this.uniqueid)
-              .boundingClientRect((data) => {
-                doRun(
-                  event.touches[0].pageX - data.left - ret[0].scrollLeft,
-                  event.touches[0].pageY - data.top - ret[0].scrollTop
-                );
-              })
-              .exec();
-          });
-      }
-    },
-    doitstart(event) {
-      this.doit(event, this.touchstart);
-    },
-  },
-};
-</script>
-
-<style lang="css" scoped>
-/* 辅助的区域不应该可以看见 */
-.region {
-  position: fixed;
-  left: 50000px;
-}
-
-.cover-view .view-img {
-  display: none;
-}
-
-.normal-view .painter {
-  position: fixed;
-  left: 50000px;
-}
-</style>
+<template>
+    <view :class="cover || isH5 ? 'cover-view' : 'normal-view'">
+      <view :class="'view-img view-' + uniqueid" @touchstart="doitstart">
+        <image :style="{ width: width + 'px', height: height + 'px' }" :src="viewImg"></image>
+      </view>
+
+      <!-- #ifdef MP-ALIPAY -->
+      <canvas class="painter" :id="'painter-' + uniqueid" @touchstart="doitstart"
+        :style="{ width: width + 'px', height: height + 'px' }"></canvas>
+      <canvas v-if="region" class="region" :id="'region-' + uniqueid"
+        :style="{ width: width + 'px', height: height + 'px' }"></canvas>
+      <!-- #endif -->
+      <!-- #ifdef MP-WEIXIN -->
+      <canvas class="painter" canvas-id="painter" @touchstart="doitstart"
+        :style="{ width: width + 'px', height: height + 'px' }"></canvas>
+      <canvas v-if="region" class="region" canvas-id="region"
+        :style="{ width: width + 'px', height: height + 'px' }"></canvas>
+      <!-- #endif -->
+      <!-- #ifndef MP-WEIXIN||MP-ALIPAY -->
+      <canvas class="painter" :canvas-id="'painter-' + uniqueid" @touchstart="doitstart"
+        :style="{ width: width + 'px', height: height + 'px' }"></canvas>
+      <canvas v-if="region" class="region" :canvas-id="'region-' + uniqueid"
+        :style="{ width: width + 'px', height: height + 'px' }"></canvas>
+      <!-- #endif -->
+    </view>
+  </template>
+  <script>
+  import OralCanvas from "../lib/OralCanvas/index.es.js";
+  export default {
+    data() {
+      return {
+        uniqueid: (Math.random() * 10000).toFixed(0),
+        help: {},
+        viewImg: "",
+        // #ifdef H5
+        isH5: true,
+        // #endif
+        // #ifndef H5
+        isH5: false,
+        // #endif
+      };
+    },
+    props: {
+      width: {
+        type: Number,
+        default: 300,
+      },
+      height: {
+        type: Number,
+        default: 150,
+      },
+      touchstart: {
+        type: Function,
+        default: () => { },
+      },
+      cover: {
+        type: Boolean,
+        default: true,
+      },
+      region: {
+        type: Boolean,
+        default: true,
+      },
+    },
+    methods: {
+      fetch() {
+        let painter, region, painterid, regionid;
+        // #ifdef MP-WEIXIN
+        painter = uni.createCanvasContext("painter", this);
+        if (this.region) region = uni.createCanvasContext("region", this);
+        painterid = "painter";
+        regionid = "region";
+        // #endif
+        // #ifndef MP-WEIXIN
+        painter = uni.createCanvasContext("painter-" + this.uniqueid, this);
+        if (this.region) region = uni.createCanvasContext("region-" + this.uniqueid, this);
+        painterid = "painter-" + this.uniqueid;
+        regionid = "region-" + this.uniqueid;
+        // #endif
+
+        let _this = this;
+        this.help.instance = new OralCanvas(
+          {
+            getContext() {
+              return painter;
+            },
+          },
+          _this.region ? {
+            getContext() {
+              // #ifdef MP-ALIPAY
+              let getImageData = region.getImageData;
+              // #endif
+              region.getImageData = (x, y, width, height) => {
+                return new Promise((resolve, reject) => {
+                  let options = {
+                    x,
+                    y,
+                    width,
+                    height,
+                    canvasId: regionid,
+                    success: function success(res) {
+                      resolve(res.data);
+                    },
+                    fail: function fail(error) {
+                      reject(error);
+                    },
+                  };
+
+                  // #ifdef MP-ALIPAY
+                  getImageData(options);
+                  // #endif
+                  // #ifndef MP-ALIPAY
+                  uni.canvasGetImageData(options, _this);
+                  // #endif
+                });
+              };
+              return region;
+            },
+          } : null
+        );
+        this.help.instance.draw = (reserve = false, callback = () => { }) => {
+          painter.draw(reserve, () => {
+
+            // 如果不使用原生渲染
+            if (!this.cover && !this.isH5) {
+              uni.canvasToTempFilePath(
+                {
+                  canvasId: painterid,
+                  success: (e) => {
+                    this.viewImg = e.tempFilePath;
+                    if (_this.region) region.draw(reserve);
+                    callback();
+                  },
+                }
+                // #ifndef MP-ALIPAY
+                , this
+                // #endif
+              );
+            } else {
+              if (_this.region) region.draw(reserve);
+              callback();
+            }
+          });
+
+        };
+        return new Promise((resolve, reject) => {
+          this.help.instance.toDataURL = () => {
+            return new Promise((resolveUrl) => {
+              uni.canvasToTempFilePath(
+                {
+                  canvasId: painterid,
+                  success: function (e) {
+                    resolveUrl(e.tempFilePath);
+                  },
+                }
+                // #ifndef MP-ALIPAY
+                , this
+                // #endif
+              );
+            });
+          };
+
+          resolve(this.help.instance);
+        });
+      },
+      doit(event, doback) {
+        let doRun = (x, y) => {
+          this.help.instance.getRegion(x, y).then((regionName) => {
+            // 兼容旧语法
+            if (typeof doback == "function") doback(regionName);
+
+            this.$emit("dotouchstart", {
+              name: regionName,
+              x: x,
+              y: y,
+            });
+          });
+        };
+
+        if (this.cover || this.isH5) {
+          let x = event.touches[0].x;
+          let y = event.touches[0].y;
+          doRun(x, y);
+        } else {
+          uni
+            .createSelectorQuery()
+            .selectViewport()
+            .scrollOffset()
+            .exec((ret) => {
+              uni
+                .createSelectorQuery()
+                .in(this)
+                .select(".view-" + this.uniqueid)
+                .boundingClientRect((data) => {
+                  doRun(
+                    event.touches[0].pageX - data.left - ret[0].scrollLeft,
+                    event.touches[0].pageY - data.top - ret[0].scrollTop
+                  );
+                })
+                .exec();
+            });
+        }
+      },
+      doitstart(event) {
+        this.doit(event, this.touchstart);
+      },
+    },
+  };
+  </script>
+
+  <style lang="css" scoped>
+  /* 辅助的区域不应该可以看见 */
+  .region {
+    position: fixed;
+    left: 50000px;
+  }
+
+  .cover-view .view-img {
+    display: none;
+  }
+
+  .normal-view .painter {
+    position: fixed;
+    left: 50000px;
+  }
+  </style>

package/lib/Buffer/index.umd.js

@@ -1,55 +0,0 @@
-/*!
-* VISLite JavaScript Library v0.5.0
-* git+https://github.com/oi-contrib/VISLite.git
-*
-* Copyright zxl20070701
-* Released under the MIT license
-* https://zxl20070701.github.io/notebook/home.html
-*
-* Publish Date:  Sat Sep 30 2023 19:14:04 GMT+0800 (中国标准时间)
-*/
-(function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
-    typeof define === 'function' && define.amd ? define(factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.VISLite_Buffer = factory());
-})(this, (function () { 'use strict';
-
-    var newBuffer = function (painter) {
-        return painter.createBuffer();
-    };
-    var writeBuffer = function (painter, data, isElement, usage) {
-        var TYPE = isElement ? painter.ELEMENT_ARRAY_BUFFER : painter.ARRAY_BUFFER;
-        painter.bufferData(TYPE, data, usage);
-    };
-    var useBuffer = function (painter, location, size, type, stride, offset, normalized) {
-        painter.vertexAttribPointer(location, size, type, normalized, stride, offset);
-        painter.enableVertexAttribArray(location);
-    };
-    var BufferObject = (function () {
-        function BufferObject(painter, isElement) {
-            if (isElement === void 0) { isElement = false; }
-            this.__painter = painter;
-            this.__isElement = isElement;
-            this.__buffer = newBuffer(painter);
-            this.__type = isElement ? painter.ELEMENT_ARRAY_BUFFER : painter.ARRAY_BUFFER;
-        }
-        BufferObject.prototype.use = function () {
-            this.__painter.bindBuffer(this.__type, this.__buffer);
-            return this;
-        };
-        BufferObject.prototype.write = function (data) {
-            writeBuffer(this.__painter, data, this.__isElement, this.__painter.STATIC_DRAW);
-            this.__fsize = data.BYTES_PER_ELEMENT;
-            return this;
-        };
-        BufferObject.prototype.divide = function (location, size, stride, offset) {
-            if (offset === void 0) { offset = 0; }
-            useBuffer(this.__painter, location, size, this.__painter.FLOAT, stride * this.__fsize, offset * this.__fsize, false);
-            return this;
-        };
-        return BufferObject;
-    }());
-
-    return BufferObject;
-
-}));

package/lib/Buffer/index.umd.min.js

@@ -1,11 +0,0 @@
-/*!
-* VISLite JavaScript Library v0.5.0
-* git+https://github.com/oi-contrib/VISLite.git
-*
-* Copyright zxl20070701
-* Released under the MIT license
-* https://zxl20070701.github.io/notebook/home.html
-*
-* Publish Date:  Sat Sep 30 2023 19:14:04 GMT+0800 (中国标准时间)
-*/
-var t,e;t=this,e=function(){"use strict";return function(){function t(t,e){void 0===e&&(e=!1),this.__painter=t,this.__isElement=e,this.__buffer=function(t){return t.createBuffer()}(t),this.__type=e?t.ELEMENT_ARRAY_BUFFER:t.ARRAY_BUFFER}return t.prototype.use=function(){return this.__painter.bindBuffer(this.__type,this.__buffer),this},t.prototype.write=function(t){return function(t,e,i,n){var r=i?t.ELEMENT_ARRAY_BUFFER:t.ARRAY_BUFFER;t.bufferData(r,e,n)}(this.__painter,t,this.__isElement,this.__painter.STATIC_DRAW),this.__fsize=t.BYTES_PER_ELEMENT,this},t.prototype.divide=function(t,e,i,n){return void 0===n&&(n=0),function(t,e,i,n,r,_,f){t.vertexAttribPointer(e,i,n,f,r,_),t.enableVertexAttribArray(e)}(this.__painter,t,e,this.__painter.FLOAT,i*this.__fsize,n*this.__fsize,!1),this},t}()},"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).VISLite_Buffer=e();