watermark-js-plus 1.3.39 → 1.4.0

package/dist/index.cjs.js

@@ -1,5 +1,5 @@
 /*!
- * watermark-js-plus v1.3.39
+ * watermark-js-plus v1.4.0
  * (c) 2022-2023 Michael Sun
  * Released under the MIT License.
  */
@@ -197,6 +197,7 @@ var initialOptions = {
     fontColor: '#000',
     fontWeight: 'normal',
     filter: 'none',
+    letterSpacing: '0px',
     globalAlpha: 0.5,
     mode: 'default',
     mutationObserve: true,
@@ -214,6 +215,8 @@ var generateRecommendOptions = function (canvas, options, args) {
     }
     ctx.font = "".concat(options.fontStyle, " ").concat(options.fontVariant, " ").concat(options.fontWeight, " ").concat(options.fontSize, " ").concat(options.fontFamily);
     ctx.filter = options.filter;
+    // @ts-ignore
+    ctx.letterSpacing = options.letterSpacing;
     if (options === null || options === void 0 ? void 0 : options.rotate) {
         options.rotate = (360 - options.rotate % 360) * (Math.PI / 180);
     }
@@ -863,7 +866,7 @@ var Watermark = /** @class */ (function () {
                         this.watermarkDom.__WATERMARK__ = 'watermark';
                         this.watermarkDom.__WATERMARK__INSTANCE__ = this;
                         parentElementType = this.checkParentElementType();
-                        this.watermarkDom.style.cssText = "\n      z-index: ".concat(this.options.zIndex, "!important;display:block!important;visibility:visible!important;transform:none!important;scale:none!important;\n      ").concat(parentElementType === 'custom' ? 'top:0!important;bottom:0!important;left:0!important;right:0!important;height:100%!important;pointer-events:none!important;position:absolute!important;' : 'position:relative!important;', "\n    ");
+                        this.watermarkDom.style.cssText = "\n      z-index:".concat(this.options.zIndex, "!important;display:block!important;visibility:visible!important;transform:none!important;scale:none!important;\n      ").concat(parentElementType === 'custom' ? 'top:0!important;bottom:0!important;left:0!important;right:0!important;height:100%!important;pointer-events:none!important;position:absolute!important;' : 'position:relative!important;', "\n    ");
                         backgroundSize = generateBackgroundSize(this.options);
                         watermarkInnerDom.style.cssText = "\n      display:block!important;visibility:visible!important;pointer-events:none;top:0;bottom:0;left:0;right:0;transform:none!important;scale:none!important;\n      position:".concat(parentElementType === 'root' ? 'fixed' : 'absolute', "!important;-webkit-print-color-adjust:exact!important;width:100%!important;height:100%!important;\n      z-index:").concat(this.options.zIndex, "!important;background-image:url(").concat(image, ")!important;background-repeat:").concat(this.options.backgroundRepeat, "!important;\n      background-size:").concat(backgroundSize[0], "px ").concat(backgroundSize[1], "px!important;background-position:").concat(this.options.backgroundPosition, ";\n      ").concat(this.options.movable ? 'animation: 200s ease 0s infinite normal none running watermark !important;' : '', "\n    ");
                         this.watermarkDom.append(watermarkInnerDom);
@@ -1068,47 +1071,42 @@ var BlindWatermark = /** @class */ (function (_super) {
      */
     function BlindWatermark(props) {
         if (props === void 0) { props = {}; }
-        props.globalAlpha = 0.005;
-        props.mode = 'blind';
-        return _super.call(this, props) || this;
+        var defaultProps = {
+            globalAlpha: 0.005,
+            mode: 'blind'
+        };
+        return _super.call(this, __assign(__assign({}, props), defaultProps)) || this;
     }
     /**
      * Decode blind watermark.
      * @param props - decode options
      */
     BlindWatermark.decode = function (props) {
-        var options = Object.assign({
-            url: '',
-            fillColor: '#000',
-            compositeOperation: 'color-burn',
-            mode: 'canvas',
-            compositeTimes: 3
-        }, props);
-        if (!options.url) {
+        var _a = props.url, url = _a === void 0 ? '' : _a, _b = props.fillColor, fillColor = _b === void 0 ? '#000' : _b, _c = props.compositeOperation, compositeOperation = _c === void 0 ? 'color-burn' : _c, _d = props.mode, mode = _d === void 0 ? 'canvas' : _d, _e = props.compositeTimes, compositeTimes = _e === void 0 ? 3 : _e, onSuccess = props.onSuccess;
+        if (!url) {
             return;
         }
-        if (options.mode === 'canvas') {
+        if (mode === 'canvas') {
             var img_1 = new Image();
-            img_1.src = options.url;
-            img_1.onload = function () {
-                var _a;
+            img_1.src = url;
+            img_1.addEventListener('load', function () {
                 var width = img_1.width, height = img_1.height;
                 var canvas = WatermarkCanvas.createCanvas(width, height);
                 var ctx = canvas.getContext('2d');
-                if (ctx === null) {
+                if (!ctx) {
                     throw new Error('get context error');
                 }
                 ctx.drawImage(img_1, 0, 0, width, height);
-                ctx.globalCompositeOperation = options.compositeOperation;
-                ctx.fillStyle = options.fillColor;
-                for (var i = 0; i < options.compositeTimes; i++) {
+                ctx.globalCompositeOperation = compositeOperation;
+                ctx.fillStyle = fillColor;
+                for (var i = 0; i < compositeTimes; i++) {
                     ctx.fillRect(0, 0, width, height);
                 }
                 var resultImage = convertImage(canvas);
-                if (options.onSuccess && isFunction(options.onSuccess)) {
-                    (_a = options.onSuccess) === null || _a === void 0 ? void 0 : _a.call(options, resultImage);
+                if (isFunction(onSuccess)) {
+                    onSuccess === null || onSuccess === void 0 ? void 0 : onSuccess(resultImage);
                 }
-            };
+            });
         }
     };
     return BlindWatermark;