watermark-js-plus 0.8.12 → 0.8.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/src/core/watermark.d.ts +3 -0
  2. package/dist/src/types/index.d.ts +1 -0
  3. package/dist/src/utils/initialization.d.ts +1 -0
  4. package/dist/watermark.esm.js +34 -7
  5. package/dist/watermark.esm.min.js +1 -1
  6. package/dist/watermark.umd.js +34 -7
  7. package/dist/watermark.umd.min.js +1 -1
  8. package/package.json +6 -6
package/dist/src/core/watermark.d.ts CHANGED
@@ -11,6 +11,7 @@ export default class Watermark {
11
11
  private props?;
12
12
  private canvas;
13
13
  private recommendOptions;
14
+ private checkWatermarkElementRequestID?;
14
15
  /**
15
16
  * Watermark constructor
16
17
  * @param args - watermark args
@@ -31,6 +32,7 @@ export default class Watermark {
31
32
  * Delete this watermark.
32
33
  */
33
34
  destroy(): void;
35
+ check(): void;
34
36
  private initConfigData;
35
37
  private changeParentElement;
36
38
  private validateUnique;
@@ -49,6 +51,7 @@ export default class Watermark {
49
51
  private getImageRect;
50
52
  private getDrawImagePosition;
51
53
  private checkParentElementType;
54
+ private checkWatermarkElement;
52
55
  private bindMutationObserve;
53
56
  private clearCanvas;
54
57
  }
package/dist/src/types/index.d.ts CHANGED
@@ -51,6 +51,7 @@ export interface WatermarkOptions {
51
51
  onSuccess: Function;
52
52
  onBeforeDestroy: Function;
53
53
  onDestroyed: Function;
54
+ onObserveError: Function;
54
55
  }
55
56
  export interface DecodeBlindWatermarkOptions {
56
57
  url: string;
package/dist/src/utils/initialization.d.ts CHANGED
@@ -29,6 +29,7 @@ export declare const initialOptions: {
29
29
  onSuccess: () => void;
30
30
  onBeforeDestroy: () => void;
31
31
  onDestroyed: () => void;
32
+ onObserveError: () => void;
32
33
  };
33
34
  export declare const generateRecommendOptions: (canvas: HTMLCanvasElement, options: WatermarkOptions, args: Partial<WatermarkOptions>) => {
34
35
  image: {
package/dist/watermark.esm.js CHANGED
@@ -180,7 +180,8 @@ var initialOptions = {
180
180
  parent: 'body',
181
181
  onSuccess: function () { },
182
182
  onBeforeDestroy: function () { },
183
- onDestroyed: function () { }
183
+ onDestroyed: function () { },
184
+ onObserveError: function () { }
184
185
  };
185
186
  var generateRecommendOptions = function (canvas, options, args) {
186
187
  var ctx = canvas.getContext('2d');
@@ -430,6 +431,10 @@ var bootstrap = (function () {
430
431
  writable: false,
431
432
  configurable: false
432
433
  });
434
+ Object.defineProperty(window, 'requestAnimationFrame', {
435
+ writable: false,
436
+ configurable: false
437
+ });
433
438
  }
434
439
  });
435
440
 
@@ -476,11 +481,11 @@ var Watermark = /** @class */ (function () {
476
481
  * Creating a watermark.
477
482
  */
478
483
  Watermark.prototype.create = function () {
479
- var _a, _b;
484
+ var _a, _b, _c, _d;
480
485
  return __awaiter(this, void 0, void 0, function () {
481
486
  var image, watermarkInnerDom, parentElementType;
482
- return __generator(this, function (_c) {
483
- switch (_c.label) {
487
+ return __generator(this, function (_e) {
488
+ switch (_e.label) {
484
489
  case 0:
485
490
  if (!this.validateUnique()) {
486
491
  return [2 /*return*/];
@@ -490,7 +495,7 @@ var Watermark = /** @class */ (function () {
490
495
  }
491
496
  return [4 /*yield*/, this.draw()];
492
497
  case 1:
493
- _c.sent();
498
+ _e.sent();
494
499
  image = convertImage(this.canvas);
495
500
  this.clearCanvas();
496
501
  this.watermarkDom = document.createElement('div');
@@ -503,9 +508,14 @@ var Watermark = /** @class */ (function () {
503
508
  this.watermarkDom.append(watermarkInnerDom);
504
509
  this.parentElement.appendChild(this.watermarkDom);
505
510
  if (this.options.mutationObserve) {
506
- this.bindMutationObserve();
511
+ try {
512
+ this.bindMutationObserve();
513
+ }
514
+ catch (e) {
515
+ (_b = (_a = this.options).onObserveError) === null || _b === void 0 ? void 0 : _b.call(_a);
516
+ }
507
517
  }
508
- (_b = (_a = this.options).onSuccess) === null || _b === void 0 ? void 0 : _b.call(_a);
518
+ (_d = (_c = this.options).onSuccess) === null || _d === void 0 ? void 0 : _d.call(_c);
509
519
  return [2 /*return*/];
510
520
  }
511
521
  });
@@ -519,9 +529,18 @@ var Watermark = /** @class */ (function () {
519
529
  (_b = (_a = this.options).onBeforeDestroy) === null || _b === void 0 ? void 0 : _b.call(_a);
520
530
  (_c = this.observer) === null || _c === void 0 ? void 0 : _c.disconnect();
521
531
  (_d = this.parentObserve) === null || _d === void 0 ? void 0 : _d.disconnect();
532
+ if (!isUndefined(this.checkWatermarkElementRequestID)) {
533
+ cancelAnimationFrame(this.checkWatermarkElementRequestID);
534
+ }
522
535
  (_e = this.watermarkDom) === null || _e === void 0 ? void 0 : _e.remove();
523
536
  (_g = (_f = this.options).onDestroyed) === null || _g === void 0 ? void 0 : _g.call(_f);
524
537
  };
538
+ Watermark.prototype.check = function () {
539
+ if (!document.body.contains(this.watermarkDom)) {
540
+ this.destroy();
541
+ this.create();
542
+ }
543
+ };
525
544
  Watermark.prototype.initConfigData = function (args, mode) {
526
545
  var _this = this;
527
546
  if (mode === void 0) { mode = 'overwrite'; }
@@ -805,11 +824,19 @@ var Watermark = /** @class */ (function () {
805
824
  }
806
825
  return 'custom';
807
826
  };
827
+ Watermark.prototype.checkWatermarkElement = function () {
828
+ if (!document.body.contains(this.watermarkDom)) {
829
+ this.destroy();
830
+ this.create();
831
+ }
832
+ this.checkWatermarkElementRequestID = requestAnimationFrame(this.checkWatermarkElement.bind(this));
833
+ };
808
834
  Watermark.prototype.bindMutationObserve = function () {
809
835
  var _this = this;
810
836
  if (!this.watermarkDom) {
811
837
  return;
812
838
  }
839
+ this.checkWatermarkElementRequestID = requestAnimationFrame(this.checkWatermarkElement.bind(this));
813
840
  this.observer = new MutationObserver(function (mutationsList) {
814
841
  if (mutationsList.length > 0) {
815
842
  _this.destroy();
package/dist/watermark.esm.min.js CHANGED
@@ -1 +1 @@
1
- var t=function(e,a){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&(t[a]=e[a])},t(e,a)};function e(t,e,a,i){return new(a||(a=Promise))((function(n,o){function r(t){try{d(i.next(t))}catch(t){o(t)}}function l(t){try{d(i.throw(t))}catch(t){o(t)}}function d(t){var e;t.done?n(t.value):(e=t.value,e instanceof a?e:new a((function(t){t(e)}))).then(r,l)}d((i=i.apply(t,e||[])).next())}))}function a(t,e){var a,i,n,o,r={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return o={next:l(0),throw:l(1),return:l(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function l(l){return function(d){return function(l){if(a)throw new TypeError("Generator is already executing.");for(;o&&(o=0,l[0]&&(r=0)),r;)try{if(a=1,i&&(n=2&l[0]?i.return:l[0]?i.throw||((n=i.return)&&n.call(i),0):i.next)&&!(n=n.call(i,l[1])).done)return n;switch(i=0,n&&(l=[2&l[0],n.value]),l[0]){case 0:case 1:n=l;break;case 4:return r.label++,{value:l[1],done:!1};case 5:r.label++,i=l[1],l=[0];continue;case 7:l=r.ops.pop(),r.trys.pop();continue;default:if(!(n=r.trys,(n=n.length>0&&n[n.length-1])||6!==l[0]&&2!==l[0])){r=0;continue}if(3===l[0]&&(!n||l[1]>n[0]&&l[1]<n[3])){r.label=l[1];break}if(6===l[0]&&r.label<n[1]){r.label=n[1],n=l;break}if(n&&r.label<n[2]){r.label=n[2],r.ops.push(l);break}n[2]&&r.ops.pop(),r.trys.pop();continue}l=e.call(t,r)}catch(t){l=[6,t],i=0}finally{a=n=0}if(5&l[0])throw l[1];return{value:l[0]?l[1]:void 0,done:!0}}([l,d])}}}var i=function(t){return t.toDataURL("image/png",1)},n=function(t){return"function"==typeof t},o=function(t){return void 0===t},r=function(t,e,a){void 0===e&&(e={}),void 0===a&&(a="http://www.w3.org/2000/svg");var i=document.createElementNS(a,t);for(var n in e)i.setAttribute(n,e[n]);return i},l=function(t,e){return o(t)?e:t},d=function(t,e,a){void 0===e&&(e=void 0),void 0===a&&(a=void 0);var i=new Image;return i.setAttribute("crossOrigin","Anonymous"),!o(e)&&(i.width=e),!o(a)&&(i.height=a),i.src=t,new Promise((function(t){i.onload=function(){t(i)}}))},s={width:300,height:300,rotate:45,auxiliaryLine:!1,translatePlacement:"middle",contentType:"text",content:"hello watermark-js-plus",textType:"fill",imageWidth:0,imageHeight:0,lineHeight:30,zIndex:2147483647,backgroundPosition:"0 0, 0 0",backgroundRepeat:"repeat",fontSize:"20px",fontFamily:"sans-serif",fontStyle:"",fontVariant:"",fontColor:"#000",fontWeight:"normal",filter:"none",globalAlpha:.5,mode:"default",mutationObserve:!0,unique:!0,parent:"body",onSuccess:function(){},onBeforeDestroy:function(){},onDestroyed:function(){}},c=function(t,e,a){var i=t.getContext("2d");if(null===i)throw new Error("get context error");i.font="".concat(e.fontStyle," ").concat(e.fontVariant," ").concat(e.fontWeight," ").concat(e.fontSize," ").concat(e.fontFamily),i.filter=e.filter,(null==e?void 0:e.rotate)&&(e.rotate=(360-e.rotate%360)*(Math.PI/180)),o(a.textRowMaxWidth)&&(e.textRowMaxWidth=e.width);var n={image:{rect:{width:e.imageWidth,height:e.imageHeight},position:{x:0,y:0}},textLine:{data:[],yOffsetValue:0},advancedStyleParams:{linear:{x0:0,x1:0},radial:{x0:0,y0:0,r0:0,x1:0,y1:0,r1:0},conic:{x:0,y:0,startAngle:0},pattern:{}}};switch(e.contentType){case"text":n.textLine.data=[e.content];break;case"multi-line-text":n.textLine.data=function(t,e,a){for(var i=[],n="",o=0,r=e.length;o<r;o++)n+=e.charAt(o),t.measureText(n).width>a&&(i.push(n.substring(0,n.length-1)),n="",o--);return i.push(n),i}(i,e.content,e.textRowMaxWidth)}var r=e.width/2,l=e.height/2,d="middle",s="center";switch(o(null==a?void 0:a.translateX)||o(null==a?void 0:a.translateY)?(n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.r0=0,n.advancedStyleParams.radial.r1=e.width/2):(r=null==a?void 0:a.translateX,l=null==a?void 0:a.translateY,d="top",s="left"),a.translatePlacement){case"top":r=e.width/2,l=0,d="top",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-start":r=0,l=0,d="top",s="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-end":r=e.width,l=0,d="top",s="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"bottom":r=e.width/2,l=e.height,d="bottom",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=0,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-start":r=0,l=e.height,d="bottom",s="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-end":r=e.width,l=e.height,d="bottom",s="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"left":r=0,l=e.height/2,s="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=0;break;case"right":r=e.width,l=e.height/2,s="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=0}if(e.translateX=r,e.translateY=l,o(null==a?void 0:a.textBaseline)&&(e.textBaseline=d),o(null==a?void 0:a.textAlign)&&(e.textAlign=s),"multi-line-text"===e.contentType)switch(e.textBaseline){case"middle":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight/2;break;case"bottom":case"alphabetic":case"ideographic":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight;break;case"top":case"hanging":n.textLine.yOffsetValue=0}return n},h=function(){function t(e){void 0===e&&(e={}),this.parentElement=document.body,this.props=e,this.options=Object.assign({},s,e),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=c(this.canvas,this.options,this.props),"undefined"!=typeof window&&Object.defineProperty(window,"MutationObserver",{writable:!1,configurable:!1})}return t.createCanvas=function(t,e){var a,i=window.devicePixelRatio||1,n=document.createElement("canvas");return n.width=t*i,n.height=e*i,n.style.width="".concat(t,"px"),n.style.height="".concat(e,"px"),null===(a=n.getContext("2d"))||void 0===a||a.setTransform(i,0,0,i,0,0),n},t.prototype.changeOptions=function(t,e){void 0===t&&(t={}),void 0===e&&(e="overwrite"),this.initConfigData(t,e)},t.prototype.create=function(){var t,n;return e(this,void 0,void 0,(function(){var e,o,r;return a(this,(function(a){switch(a.label){case 0:return this.validateUnique()&&this.validateContent()?[4,this.draw()]:[2];case 1:return a.sent(),e=i(this.canvas),this.clearCanvas(),this.watermarkDom=document.createElement("div"),o=document.createElement("div"),this.watermarkDom.__WATERMARK__="watermark",this.watermarkDom.__WATERMARK__INSTANCE__=this,r=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("custom"===r?"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 "),o.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("root"===r?"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(e,")!important;background-repeat:").concat(this.options.backgroundRepeat,"!important;\n background-size:").concat(this.options.width,"px ").concat(this.options.height,"px!important;background-position:").concat(this.options.backgroundPosition,"!important;\n "),this.watermarkDom.append(o),this.parentElement.appendChild(this.watermarkDom),this.options.mutationObserve&&this.bindMutationObserve(),null===(n=(t=this.options).onSuccess)||void 0===n||n.call(t),[2]}}))}))},t.prototype.destroy=function(){var t,e,a,i,n,o,r;null===(e=(t=this.options).onBeforeDestroy)||void 0===e||e.call(t),null===(a=this.observer)||void 0===a||a.disconnect(),null===(i=this.parentObserve)||void 0===i||i.disconnect(),null===(n=this.watermarkDom)||void 0===n||n.remove(),null===(r=(o=this.options).onDestroyed)||void 0===r||r.call(o)},t.prototype.initConfigData=function(e,a){var i=this;void 0===a&&(a="overwrite"),this.props=e,"overwrite"===a?this.options=Object.assign({},s,e):Object.keys(e).forEach((function(t){i.options[t]=e[t]})),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=c(this.canvas,this.options,this.props)},t.prototype.changeParentElement=function(t){if("string"==typeof t){var e=document.querySelector(t);e&&(this.parentElement=e)}else this.parentElement=t},t.prototype.validateUnique=function(){var t=!0;return this.options.unique&&this.parentElement.childNodes.forEach((function(e){t&&Object.hasOwnProperty.call(e,"__WATERMARK__")&&(t=!1)})),t},t.prototype.validateContent=function(){switch(this.options.contentType){case"image":return Object.hasOwnProperty.call(this.options,"image");case"multi-line-text":case"rich-text":case"text":return this.options.content.length>0}return!1},t.prototype.draw=function(){var t=this,e=this.canvas.getContext("2d");if(null===e)throw new Error("get context error");return this.options.auxiliaryLine&&(e.beginPath(),e.rect(1,1,this.options.width,this.options.height),e.lineWidth=1,e.strokeStyle="#000",e.stroke(),e.closePath(),e.beginPath(),e.rect(this.options.translateX,this.options.translateY,1,1),e.lineWidth=1,e.strokeStyle="#f00",e.stroke(),e.closePath()),this.setStyle(e),e.save(),e.translate(this.options.translateX,this.options.translateY),e.rotate(this.options.rotate),new Promise((function(a){switch(t.options.contentType){case"text":t.drawText(e,a);break;case"image":t.drawImage(e,a);break;case"multi-line-text":t.drawMultiLineText(e,a);break;case"rich-text":t.drawRichText(e,a)}}))},t.prototype.setStyle=function(t){var e,a="fillStyle";"stroke"===this.options.textType&&(a="strokeStyle");var i=this.options.fontColor;if(null===(e=this.options)||void 0===e?void 0:e.advancedStyle)switch(this.options.advancedStyle.type){case"linear":i=this.createLinearGradient(t);break;case"radial":i=this.createRadialGradient(t);break;case"conic":i=this.createConicGradient(t);break;case"pattern":i=this.createPattern(t)}t[a]&&i&&(t[a]=i),this.options.textAlign&&(t.textAlign=this.options.textAlign),this.options.textBaseline&&(t.textBaseline=this.options.textBaseline),t.globalAlpha=this.options.globalAlpha,this.options.shadowStyle&&(t.shadowBlur=l(this.options.shadowStyle.shadowBlur,0),t.shadowColor=l(this.options.shadowStyle.shadowColor,"#00000000"),t.shadowOffsetX=l(this.options.shadowStyle.shadowOffsetX,0),t.shadowOffsetY=l(this.options.shadowStyle.shadowOffsetY,0)),n(this.options.extraDrawFunc)&&this.options.extraDrawFunc(t)},t.prototype.createLinearGradient=function(t){var e,a,i,n,o,r,d,s,c,h,v,p,u,m,y,g=t.createLinearGradient(l(null===(i=null===(a=null===(e=this.options.advancedStyle)||void 0===e?void 0:e.params)||void 0===a?void 0:a.linear)||void 0===i?void 0:i.x0,this.recommendOptions.advancedStyleParams.linear.x0),l(null===(r=null===(o=null===(n=this.options.advancedStyle)||void 0===n?void 0:n.params)||void 0===o?void 0:o.linear)||void 0===r?void 0:r.y0,0),l(null===(c=null===(s=null===(d=this.options.advancedStyle)||void 0===d?void 0:d.params)||void 0===s?void 0:s.linear)||void 0===c?void 0:c.x1,this.recommendOptions.advancedStyleParams.linear.x1),l(null===(p=null===(v=null===(h=this.options.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.linear)||void 0===p?void 0:p.y1,0));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){g.addColorStop(t.offset,t.color)})),g},t.prototype.createConicGradient=function(t){var e,a,i,n,o,r,d,s,c,h,v,p,u,m,y,g=t.createConicGradient(l(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.conic)||void 0===n?void 0:n.startAngle,0),l(null===(s=null===(d=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===d?void 0:d.conic)||void 0===s?void 0:s.x,this.recommendOptions.advancedStyleParams.conic.x),l(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.conic)||void 0===p?void 0:p.y,this.recommendOptions.advancedStyleParams.conic.y));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){g.addColorStop(t.offset,t.color)})),g},t.prototype.createRadialGradient=function(t){var e,a,i,n,o,r,d,s,c,h,v,p,u,m,y,g,f,x,w,S,b,P,k,O,L,C,T,E=t.createRadialGradient(l(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.radial)||void 0===n?void 0:n.x0,this.recommendOptions.advancedStyleParams.radial.x0),l(null===(s=null===(d=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===d?void 0:d.radial)||void 0===s?void 0:s.y0,this.recommendOptions.advancedStyleParams.radial.y0),l(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.radial)||void 0===p?void 0:p.r0,this.recommendOptions.advancedStyleParams.radial.r0),l(null===(g=null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.params)||void 0===y?void 0:y.radial)||void 0===g?void 0:g.x1,this.recommendOptions.advancedStyleParams.radial.x1),l(null===(S=null===(w=null===(x=null===(f=this.options)||void 0===f?void 0:f.advancedStyle)||void 0===x?void 0:x.params)||void 0===w?void 0:w.radial)||void 0===S?void 0:S.y1,this.recommendOptions.advancedStyleParams.radial.y1),l(null===(O=null===(k=null===(P=null===(b=this.options)||void 0===b?void 0:b.advancedStyle)||void 0===P?void 0:P.params)||void 0===k?void 0:k.radial)||void 0===O?void 0:O.r1,this.recommendOptions.advancedStyleParams.radial.r1));return null===(T=null===(C=null===(L=this.options)||void 0===L?void 0:L.advancedStyle)||void 0===C?void 0:C.colorStops)||void 0===T||T.forEach((function(t){E.addColorStop(t.offset,t.color)})),E},t.prototype.createPattern=function(t){var e,a,i,n,o,r,l,d;return t.createPattern(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.pattern)||void 0===n?void 0:n.image,(null===(d=null===(l=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===l?void 0:l.pattern)||void 0===d?void 0:d.repetition)||"")},t.prototype.setText=function(t,e){var a="fillText";"stroke"===this.options.textType&&(a="strokeText"),t[a]&&t[a](e.text,e.x,e.y,e.maxWidth)},t.prototype.drawText=function(t,e){this.setText(t,{text:this.options.content,x:0,y:0,maxWidth:this.options.textRowMaxWidth||this.options.width}),e(t.canvas)},t.prototype.drawImage=function(t,e){var a=this;d(this.options.image).then((function(i){var n=a.getImageRect(i),o=n.width,r=n.height,l=a.getDrawImagePosition(o,r);t.drawImage(i,l.x,l.y,o,r),e(t.canvas)}))},t.prototype.drawMultiLineText=function(t,e){var a=this,i=this.recommendOptions.textLine.data,n=this.recommendOptions.textLine.yOffsetValue;i.forEach((function(e,i){a.setText(t,{text:e,x:0,y:a.options.lineHeight*i-n})})),e(t.canvas)},t.prototype.drawRichText=function(t,e){var a,i,n=this,o=function(t,e){var a=r("svg",{xmlns:"http://www.w3.org/2000/svg"}),i=document.createElement("div");i.setAttribute("xmlns","http://www.w3.org/1999/xhtml"),i.style.cssText="\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n font: ".concat(t.font,";\n color: ").concat(e.fontColor,";\n"),i.innerHTML='<div class="rich-text-content">'.concat(e.content,"</div>"),document.body.appendChild(i);var n=i.querySelector(".rich-text-content"),o=n.offsetHeight,l=n.offsetWidth;document.body.removeChild(i);var d=e.richTextWidth||l||e.width,s=e.richTextHeight||o||e.height,c=r("foreignObject",{width:d.toString(),height:s.toString()});return c.appendChild(i),a.appendChild(c),{element:a,width:d,height:s}}(t,this.options);d((a=o.element,i=a.outerHTML.replace(/\n/g,"").replace(/\t/g,"").replace(/#/g,"%23"),"data:image/svg+xml;charset=utf-8,".concat(i)),o.width,o.height).then((function(a){var i=n.getDrawImagePosition(a.width,a.height);t.drawImage(a,i.x,i.y,t.canvas.width,t.canvas.height),e(t.canvas)}))},t.prototype.getImageRect=function(t){var e={width:this.options.imageWidth||0,height:this.options.imageHeight||0};switch(!0){case 0!==e.width&&0===e.height:e.height=e.width*t.height/t.width;break;case 0===e.width&&0!==e.height:e.width=e.height*t.width/t.height;break;case 0===e.width&&0===e.height:e.width=t.width,e.height=t.height}return e},t.prototype.getDrawImagePosition=function(t,e){var a,i,n={x:-t/2,y:-e/2};switch(this.options.translatePlacement){case"top":n.x=-t/2,n.y=0;break;case"top-start":n.x=0,n.y=0;break;case"top-end":n.x=-t,n.y=0;break;case"bottom":n.x=-t/2,n.y=-e;break;case"bottom-start":n.x=0,n.y=-e;break;case"bottom-end":n.x=-t,n.y=-e;break;case"left":n.x=0,n.y=-e/2;break;case"right":n.x=-t,n.y=-e/2}return!o(null===(a=this.props)||void 0===a?void 0:a.translateX)&&(n.x=0),!o(null===(i=this.props)||void 0===i?void 0:i.translateY)&&(n.y=0),n},t.prototype.checkParentElementType=function(){return["html","body"].includes(this.parentElement.tagName.toLocaleLowerCase())?"root":"custom"},t.prototype.bindMutationObserve=function(){var t=this;this.watermarkDom&&(this.observer=new MutationObserver((function(e){e.length>0&&(t.destroy(),t.create())})),this.observer.observe(this.watermarkDom,{attributes:!0,childList:!0,subtree:!0,characterData:!0}),this.parentObserve=new MutationObserver((function(e){e.forEach((function(e){var a;((null==e?void 0:e.target)===t.watermarkDom||(null===(a=null==e?void 0:e.removedNodes)||void 0===a?void 0:a[0])===t.watermarkDom||"childList"===e.type&&e.target===t.parentElement&&e.target.lastChild!==t.watermarkDom)&&(t.destroy(),t.create())}))})),this.parentObserve.observe(this.parentElement,{attributes:!0,childList:!0,subtree:!0,characterData:!0}))},t.prototype.clearCanvas=function(){var t=this.canvas.getContext("2d");if(null===t)throw new Error("get context error");t.restore(),t.clearRect(0,0,this.canvas.width,this.canvas.height)},t}(),v=function(e){function a(t){return void 0===t&&(t={}),t.globalAlpha=.005,t.mode="blind",e.call(this,t)||this}return function(e,a){if("function"!=typeof a&&null!==a)throw new TypeError("Class extends value "+String(a)+" is not a constructor or null");function i(){this.constructor=e}t(e,a),e.prototype=null===a?Object.create(a):(i.prototype=a.prototype,new i)}(a,e),a.decode=function(t){var e=Object.assign({url:"",fillColor:"#000",compositeOperation:"color-burn",mode:"canvas"},t);if(e.url&&"canvas"===e.mode){var a=new Image;a.src=e.url,a.onload=function(){var t,o=a.width,r=a.height,l=h.createCanvas(o,r),d=l.getContext("2d");if(null===d)throw new Error("get context error");d.drawImage(a,0,0,o,r),d.globalCompositeOperation=e.compositeOperation,d.fillStyle=e.fillColor,d.fillRect(0,0,o,r);var s=i(l);e.onSuccess&&n(e.onSuccess)&&(null===(t=e.onSuccess)||void 0===t||t.call(e,s))}}},a}(h);export{v as BlindWatermark,h as Watermark};
1
+ var t=function(e,a){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&(t[a]=e[a])},t(e,a)};function e(t,e,a,i){return new(a||(a=Promise))((function(n,o){function r(t){try{l(i.next(t))}catch(t){o(t)}}function s(t){try{l(i.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?n(t.value):(e=t.value,e instanceof a?e:new a((function(t){t(e)}))).then(r,s)}l((i=i.apply(t,e||[])).next())}))}function a(t,e){var a,i,n,o,r={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return o={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function s(s){return function(l){return function(s){if(a)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(r=0)),r;)try{if(a=1,i&&(n=2&s[0]?i.return:s[0]?i.throw||((n=i.return)&&n.call(i),0):i.next)&&!(n=n.call(i,s[1])).done)return n;switch(i=0,n&&(s=[2&s[0],n.value]),s[0]){case 0:case 1:n=s;break;case 4:return r.label++,{value:s[1],done:!1};case 5:r.label++,i=s[1],s=[0];continue;case 7:s=r.ops.pop(),r.trys.pop();continue;default:if(!(n=r.trys,(n=n.length>0&&n[n.length-1])||6!==s[0]&&2!==s[0])){r=0;continue}if(3===s[0]&&(!n||s[1]>n[0]&&s[1]<n[3])){r.label=s[1];break}if(6===s[0]&&r.label<n[1]){r.label=n[1],n=s;break}if(n&&r.label<n[2]){r.label=n[2],r.ops.push(s);break}n[2]&&r.ops.pop(),r.trys.pop();continue}s=e.call(t,r)}catch(t){s=[6,t],i=0}finally{a=n=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,l])}}}var i=function(t){return t.toDataURL("image/png",1)},n=function(t){return"function"==typeof t},o=function(t){return void 0===t},r=function(t,e,a){void 0===e&&(e={}),void 0===a&&(a="http://www.w3.org/2000/svg");var i=document.createElementNS(a,t);for(var n in e)i.setAttribute(n,e[n]);return i},s=function(t,e){return o(t)?e:t},l=function(t,e,a){void 0===e&&(e=void 0),void 0===a&&(a=void 0);var i=new Image;return i.setAttribute("crossOrigin","Anonymous"),!o(e)&&(i.width=e),!o(a)&&(i.height=a),i.src=t,new Promise((function(t){i.onload=function(){t(i)}}))},d={width:300,height:300,rotate:45,auxiliaryLine:!1,translatePlacement:"middle",contentType:"text",content:"hello watermark-js-plus",textType:"fill",imageWidth:0,imageHeight:0,lineHeight:30,zIndex:2147483647,backgroundPosition:"0 0, 0 0",backgroundRepeat:"repeat",fontSize:"20px",fontFamily:"sans-serif",fontStyle:"",fontVariant:"",fontColor:"#000",fontWeight:"normal",filter:"none",globalAlpha:.5,mode:"default",mutationObserve:!0,unique:!0,parent:"body",onSuccess:function(){},onBeforeDestroy:function(){},onDestroyed:function(){},onObserveError:function(){}},c=function(t,e,a){var i=t.getContext("2d");if(null===i)throw new Error("get context error");i.font="".concat(e.fontStyle," ").concat(e.fontVariant," ").concat(e.fontWeight," ").concat(e.fontSize," ").concat(e.fontFamily),i.filter=e.filter,(null==e?void 0:e.rotate)&&(e.rotate=(360-e.rotate%360)*(Math.PI/180)),o(a.textRowMaxWidth)&&(e.textRowMaxWidth=e.width);var n={image:{rect:{width:e.imageWidth,height:e.imageHeight},position:{x:0,y:0}},textLine:{data:[],yOffsetValue:0},advancedStyleParams:{linear:{x0:0,x1:0},radial:{x0:0,y0:0,r0:0,x1:0,y1:0,r1:0},conic:{x:0,y:0,startAngle:0},pattern:{}}};switch(e.contentType){case"text":n.textLine.data=[e.content];break;case"multi-line-text":n.textLine.data=function(t,e,a){for(var i=[],n="",o=0,r=e.length;o<r;o++)n+=e.charAt(o),t.measureText(n).width>a&&(i.push(n.substring(0,n.length-1)),n="",o--);return i.push(n),i}(i,e.content,e.textRowMaxWidth)}var r=e.width/2,s=e.height/2,l="middle",d="center";switch(o(null==a?void 0:a.translateX)||o(null==a?void 0:a.translateY)?(n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.r0=0,n.advancedStyleParams.radial.r1=e.width/2):(r=null==a?void 0:a.translateX,s=null==a?void 0:a.translateY,l="top",d="left"),a.translatePlacement){case"top":r=e.width/2,s=0,l="top",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-start":r=0,s=0,l="top",d="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-end":r=e.width,s=0,l="top",d="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"bottom":r=e.width/2,s=e.height,l="bottom",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=0,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-start":r=0,s=e.height,l="bottom",d="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-end":r=e.width,s=e.height,l="bottom",d="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"left":r=0,s=e.height/2,d="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=0;break;case"right":r=e.width,s=e.height/2,d="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=0}if(e.translateX=r,e.translateY=s,o(null==a?void 0:a.textBaseline)&&(e.textBaseline=l),o(null==a?void 0:a.textAlign)&&(e.textAlign=d),"multi-line-text"===e.contentType)switch(e.textBaseline){case"middle":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight/2;break;case"bottom":case"alphabetic":case"ideographic":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight;break;case"top":case"hanging":n.textLine.yOffsetValue=0}return n},h=function(){function t(e){void 0===e&&(e={}),this.parentElement=document.body,this.props=e,this.options=Object.assign({},d,e),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=c(this.canvas,this.options,this.props),"undefined"!=typeof window&&(Object.defineProperty(window,"MutationObserver",{writable:!1,configurable:!1}),Object.defineProperty(window,"requestAnimationFrame",{writable:!1,configurable:!1}))}return t.createCanvas=function(t,e){var a,i=window.devicePixelRatio||1,n=document.createElement("canvas");return n.width=t*i,n.height=e*i,n.style.width="".concat(t,"px"),n.style.height="".concat(e,"px"),null===(a=n.getContext("2d"))||void 0===a||a.setTransform(i,0,0,i,0,0),n},t.prototype.changeOptions=function(t,e){void 0===t&&(t={}),void 0===e&&(e="overwrite"),this.initConfigData(t,e)},t.prototype.create=function(){var t,n,o,r;return e(this,void 0,void 0,(function(){var e,s,l;return a(this,(function(a){switch(a.label){case 0:return this.validateUnique()&&this.validateContent()?[4,this.draw()]:[2];case 1:if(a.sent(),e=i(this.canvas),this.clearCanvas(),this.watermarkDom=document.createElement("div"),s=document.createElement("div"),this.watermarkDom.__WATERMARK__="watermark",this.watermarkDom.__WATERMARK__INSTANCE__=this,l=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("custom"===l?"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 "),s.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("root"===l?"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(e,")!important;background-repeat:").concat(this.options.backgroundRepeat,"!important;\n background-size:").concat(this.options.width,"px ").concat(this.options.height,"px!important;background-position:").concat(this.options.backgroundPosition,"!important;\n "),this.watermarkDom.append(s),this.parentElement.appendChild(this.watermarkDom),this.options.mutationObserve)try{this.bindMutationObserve()}catch(e){null===(n=(t=this.options).onObserveError)||void 0===n||n.call(t)}return null===(r=(o=this.options).onSuccess)||void 0===r||r.call(o),[2]}}))}))},t.prototype.destroy=function(){var t,e,a,i,n,r,s;null===(e=(t=this.options).onBeforeDestroy)||void 0===e||e.call(t),null===(a=this.observer)||void 0===a||a.disconnect(),null===(i=this.parentObserve)||void 0===i||i.disconnect(),o(this.checkWatermarkElementRequestID)||cancelAnimationFrame(this.checkWatermarkElementRequestID),null===(n=this.watermarkDom)||void 0===n||n.remove(),null===(s=(r=this.options).onDestroyed)||void 0===s||s.call(r)},t.prototype.check=function(){document.body.contains(this.watermarkDom)||(this.destroy(),this.create())},t.prototype.initConfigData=function(e,a){var i=this;void 0===a&&(a="overwrite"),this.props=e,"overwrite"===a?this.options=Object.assign({},d,e):Object.keys(e).forEach((function(t){i.options[t]=e[t]})),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=c(this.canvas,this.options,this.props)},t.prototype.changeParentElement=function(t){if("string"==typeof t){var e=document.querySelector(t);e&&(this.parentElement=e)}else this.parentElement=t},t.prototype.validateUnique=function(){var t=!0;return this.options.unique&&this.parentElement.childNodes.forEach((function(e){t&&Object.hasOwnProperty.call(e,"__WATERMARK__")&&(t=!1)})),t},t.prototype.validateContent=function(){switch(this.options.contentType){case"image":return Object.hasOwnProperty.call(this.options,"image");case"multi-line-text":case"rich-text":case"text":return this.options.content.length>0}return!1},t.prototype.draw=function(){var t=this,e=this.canvas.getContext("2d");if(null===e)throw new Error("get context error");return this.options.auxiliaryLine&&(e.beginPath(),e.rect(1,1,this.options.width,this.options.height),e.lineWidth=1,e.strokeStyle="#000",e.stroke(),e.closePath(),e.beginPath(),e.rect(this.options.translateX,this.options.translateY,1,1),e.lineWidth=1,e.strokeStyle="#f00",e.stroke(),e.closePath()),this.setStyle(e),e.save(),e.translate(this.options.translateX,this.options.translateY),e.rotate(this.options.rotate),new Promise((function(a){switch(t.options.contentType){case"text":t.drawText(e,a);break;case"image":t.drawImage(e,a);break;case"multi-line-text":t.drawMultiLineText(e,a);break;case"rich-text":t.drawRichText(e,a)}}))},t.prototype.setStyle=function(t){var e,a="fillStyle";"stroke"===this.options.textType&&(a="strokeStyle");var i=this.options.fontColor;if(null===(e=this.options)||void 0===e?void 0:e.advancedStyle)switch(this.options.advancedStyle.type){case"linear":i=this.createLinearGradient(t);break;case"radial":i=this.createRadialGradient(t);break;case"conic":i=this.createConicGradient(t);break;case"pattern":i=this.createPattern(t)}t[a]&&i&&(t[a]=i),this.options.textAlign&&(t.textAlign=this.options.textAlign),this.options.textBaseline&&(t.textBaseline=this.options.textBaseline),t.globalAlpha=this.options.globalAlpha,this.options.shadowStyle&&(t.shadowBlur=s(this.options.shadowStyle.shadowBlur,0),t.shadowColor=s(this.options.shadowStyle.shadowColor,"#00000000"),t.shadowOffsetX=s(this.options.shadowStyle.shadowOffsetX,0),t.shadowOffsetY=s(this.options.shadowStyle.shadowOffsetY,0)),n(this.options.extraDrawFunc)&&this.options.extraDrawFunc(t)},t.prototype.createLinearGradient=function(t){var e,a,i,n,o,r,l,d,c,h,v,p,u,m,y,f=t.createLinearGradient(s(null===(i=null===(a=null===(e=this.options.advancedStyle)||void 0===e?void 0:e.params)||void 0===a?void 0:a.linear)||void 0===i?void 0:i.x0,this.recommendOptions.advancedStyleParams.linear.x0),s(null===(r=null===(o=null===(n=this.options.advancedStyle)||void 0===n?void 0:n.params)||void 0===o?void 0:o.linear)||void 0===r?void 0:r.y0,0),s(null===(c=null===(d=null===(l=this.options.advancedStyle)||void 0===l?void 0:l.params)||void 0===d?void 0:d.linear)||void 0===c?void 0:c.x1,this.recommendOptions.advancedStyleParams.linear.x1),s(null===(p=null===(v=null===(h=this.options.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.linear)||void 0===p?void 0:p.y1,0));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){f.addColorStop(t.offset,t.color)})),f},t.prototype.createConicGradient=function(t){var e,a,i,n,o,r,l,d,c,h,v,p,u,m,y,f=t.createConicGradient(s(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.conic)||void 0===n?void 0:n.startAngle,0),s(null===(d=null===(l=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===l?void 0:l.conic)||void 0===d?void 0:d.x,this.recommendOptions.advancedStyleParams.conic.x),s(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.conic)||void 0===p?void 0:p.y,this.recommendOptions.advancedStyleParams.conic.y));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){f.addColorStop(t.offset,t.color)})),f},t.prototype.createRadialGradient=function(t){var e,a,i,n,o,r,l,d,c,h,v,p,u,m,y,f,g,x,w,b,S,P,k,O,E,L,C,T=t.createRadialGradient(s(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.radial)||void 0===n?void 0:n.x0,this.recommendOptions.advancedStyleParams.radial.x0),s(null===(d=null===(l=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===l?void 0:l.radial)||void 0===d?void 0:d.y0,this.recommendOptions.advancedStyleParams.radial.y0),s(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.radial)||void 0===p?void 0:p.r0,this.recommendOptions.advancedStyleParams.radial.r0),s(null===(f=null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.params)||void 0===y?void 0:y.radial)||void 0===f?void 0:f.x1,this.recommendOptions.advancedStyleParams.radial.x1),s(null===(b=null===(w=null===(x=null===(g=this.options)||void 0===g?void 0:g.advancedStyle)||void 0===x?void 0:x.params)||void 0===w?void 0:w.radial)||void 0===b?void 0:b.y1,this.recommendOptions.advancedStyleParams.radial.y1),s(null===(O=null===(k=null===(P=null===(S=this.options)||void 0===S?void 0:S.advancedStyle)||void 0===P?void 0:P.params)||void 0===k?void 0:k.radial)||void 0===O?void 0:O.r1,this.recommendOptions.advancedStyleParams.radial.r1));return null===(C=null===(L=null===(E=this.options)||void 0===E?void 0:E.advancedStyle)||void 0===L?void 0:L.colorStops)||void 0===C||C.forEach((function(t){T.addColorStop(t.offset,t.color)})),T},t.prototype.createPattern=function(t){var e,a,i,n,o,r,s,l;return t.createPattern(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.pattern)||void 0===n?void 0:n.image,(null===(l=null===(s=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===s?void 0:s.pattern)||void 0===l?void 0:l.repetition)||"")},t.prototype.setText=function(t,e){var a="fillText";"stroke"===this.options.textType&&(a="strokeText"),t[a]&&t[a](e.text,e.x,e.y,e.maxWidth)},t.prototype.drawText=function(t,e){this.setText(t,{text:this.options.content,x:0,y:0,maxWidth:this.options.textRowMaxWidth||this.options.width}),e(t.canvas)},t.prototype.drawImage=function(t,e){var a=this;l(this.options.image).then((function(i){var n=a.getImageRect(i),o=n.width,r=n.height,s=a.getDrawImagePosition(o,r);t.drawImage(i,s.x,s.y,o,r),e(t.canvas)}))},t.prototype.drawMultiLineText=function(t,e){var a=this,i=this.recommendOptions.textLine.data,n=this.recommendOptions.textLine.yOffsetValue;i.forEach((function(e,i){a.setText(t,{text:e,x:0,y:a.options.lineHeight*i-n})})),e(t.canvas)},t.prototype.drawRichText=function(t,e){var a,i,n=this,o=function(t,e){var a=r("svg",{xmlns:"http://www.w3.org/2000/svg"}),i=document.createElement("div");i.setAttribute("xmlns","http://www.w3.org/1999/xhtml"),i.style.cssText="\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n font: ".concat(t.font,";\n color: ").concat(e.fontColor,";\n"),i.innerHTML='<div class="rich-text-content">'.concat(e.content,"</div>"),document.body.appendChild(i);var n=i.querySelector(".rich-text-content"),o=n.offsetHeight,s=n.offsetWidth;document.body.removeChild(i);var l=e.richTextWidth||s||e.width,d=e.richTextHeight||o||e.height,c=r("foreignObject",{width:l.toString(),height:d.toString()});return c.appendChild(i),a.appendChild(c),{element:a,width:l,height:d}}(t,this.options);l((a=o.element,i=a.outerHTML.replace(/\n/g,"").replace(/\t/g,"").replace(/#/g,"%23"),"data:image/svg+xml;charset=utf-8,".concat(i)),o.width,o.height).then((function(a){var i=n.getDrawImagePosition(a.width,a.height);t.drawImage(a,i.x,i.y,t.canvas.width,t.canvas.height),e(t.canvas)}))},t.prototype.getImageRect=function(t){var e={width:this.options.imageWidth||0,height:this.options.imageHeight||0};switch(!0){case 0!==e.width&&0===e.height:e.height=e.width*t.height/t.width;break;case 0===e.width&&0!==e.height:e.width=e.height*t.width/t.height;break;case 0===e.width&&0===e.height:e.width=t.width,e.height=t.height}return e},t.prototype.getDrawImagePosition=function(t,e){var a,i,n={x:-t/2,y:-e/2};switch(this.options.translatePlacement){case"top":n.x=-t/2,n.y=0;break;case"top-start":n.x=0,n.y=0;break;case"top-end":n.x=-t,n.y=0;break;case"bottom":n.x=-t/2,n.y=-e;break;case"bottom-start":n.x=0,n.y=-e;break;case"bottom-end":n.x=-t,n.y=-e;break;case"left":n.x=0,n.y=-e/2;break;case"right":n.x=-t,n.y=-e/2}return!o(null===(a=this.props)||void 0===a?void 0:a.translateX)&&(n.x=0),!o(null===(i=this.props)||void 0===i?void 0:i.translateY)&&(n.y=0),n},t.prototype.checkParentElementType=function(){return["html","body"].includes(this.parentElement.tagName.toLocaleLowerCase())?"root":"custom"},t.prototype.checkWatermarkElement=function(){document.body.contains(this.watermarkDom)||(this.destroy(),this.create()),this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this))},t.prototype.bindMutationObserve=function(){var t=this;this.watermarkDom&&(this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this)),this.observer=new MutationObserver((function(e){e.length>0&&(t.destroy(),t.create())})),this.observer.observe(this.watermarkDom,{attributes:!0,childList:!0,subtree:!0,characterData:!0}),this.parentObserve=new MutationObserver((function(e){e.forEach((function(e){var a;((null==e?void 0:e.target)===t.watermarkDom||(null===(a=null==e?void 0:e.removedNodes)||void 0===a?void 0:a[0])===t.watermarkDom||"childList"===e.type&&e.target===t.parentElement&&e.target.lastChild!==t.watermarkDom)&&(t.destroy(),t.create())}))})),this.parentObserve.observe(this.parentElement,{attributes:!0,childList:!0,subtree:!0,characterData:!0}))},t.prototype.clearCanvas=function(){var t=this.canvas.getContext("2d");if(null===t)throw new Error("get context error");t.restore(),t.clearRect(0,0,this.canvas.width,this.canvas.height)},t}(),v=function(e){function a(t){return void 0===t&&(t={}),t.globalAlpha=.005,t.mode="blind",e.call(this,t)||this}return function(e,a){if("function"!=typeof a&&null!==a)throw new TypeError("Class extends value "+String(a)+" is not a constructor or null");function i(){this.constructor=e}t(e,a),e.prototype=null===a?Object.create(a):(i.prototype=a.prototype,new i)}(a,e),a.decode=function(t){var e=Object.assign({url:"",fillColor:"#000",compositeOperation:"color-burn",mode:"canvas"},t);if(e.url&&"canvas"===e.mode){var a=new Image;a.src=e.url,a.onload=function(){var t,o=a.width,r=a.height,s=h.createCanvas(o,r),l=s.getContext("2d");if(null===l)throw new Error("get context error");l.drawImage(a,0,0,o,r),l.globalCompositeOperation=e.compositeOperation,l.fillStyle=e.fillColor,l.fillRect(0,0,o,r);var d=i(s);e.onSuccess&&n(e.onSuccess)&&(null===(t=e.onSuccess)||void 0===t||t.call(e,d))}}},a}(h);export{v as BlindWatermark,h as Watermark};
package/dist/watermark.umd.js CHANGED
@@ -186,7 +186,8 @@
186
186
  parent: 'body',
187
187
  onSuccess: function () { },
188
188
  onBeforeDestroy: function () { },
189
- onDestroyed: function () { }
189
+ onDestroyed: function () { },
190
+ onObserveError: function () { }
190
191
  };
191
192
  var generateRecommendOptions = function (canvas, options, args) {
192
193
  var ctx = canvas.getContext('2d');
@@ -436,6 +437,10 @@
436
437
  writable: false,
437
438
  configurable: false
438
439
  });
440
+ Object.defineProperty(window, 'requestAnimationFrame', {
441
+ writable: false,
442
+ configurable: false
443
+ });
439
444
  }
440
445
  });
441
446
 
@@ -482,11 +487,11 @@
482
487
  * Creating a watermark.
483
488
  */
484
489
  Watermark.prototype.create = function () {
485
- var _a, _b;
490
+ var _a, _b, _c, _d;
486
491
  return __awaiter(this, void 0, void 0, function () {
487
492
  var image, watermarkInnerDom, parentElementType;
488
- return __generator(this, function (_c) {
489
- switch (_c.label) {
493
+ return __generator(this, function (_e) {
494
+ switch (_e.label) {
490
495
  case 0:
491
496
  if (!this.validateUnique()) {
492
497
  return [2 /*return*/];
@@ -496,7 +501,7 @@
496
501
  }
497
502
  return [4 /*yield*/, this.draw()];
498
503
  case 1:
499
- _c.sent();
504
+ _e.sent();
500
505
  image = convertImage(this.canvas);
501
506
  this.clearCanvas();
502
507
  this.watermarkDom = document.createElement('div');
@@ -509,9 +514,14 @@
509
514
  this.watermarkDom.append(watermarkInnerDom);
510
515
  this.parentElement.appendChild(this.watermarkDom);
511
516
  if (this.options.mutationObserve) {
512
- this.bindMutationObserve();
517
+ try {
518
+ this.bindMutationObserve();
519
+ }
520
+ catch (e) {
521
+ (_b = (_a = this.options).onObserveError) === null || _b === void 0 ? void 0 : _b.call(_a);
522
+ }
513
523
  }
514
- (_b = (_a = this.options).onSuccess) === null || _b === void 0 ? void 0 : _b.call(_a);
524
+ (_d = (_c = this.options).onSuccess) === null || _d === void 0 ? void 0 : _d.call(_c);
515
525
  return [2 /*return*/];
516
526
  }
517
527
  });
@@ -525,9 +535,18 @@
525
535
  (_b = (_a = this.options).onBeforeDestroy) === null || _b === void 0 ? void 0 : _b.call(_a);
526
536
  (_c = this.observer) === null || _c === void 0 ? void 0 : _c.disconnect();
527
537
  (_d = this.parentObserve) === null || _d === void 0 ? void 0 : _d.disconnect();
538
+ if (!isUndefined(this.checkWatermarkElementRequestID)) {
539
+ cancelAnimationFrame(this.checkWatermarkElementRequestID);
540
+ }
528
541
  (_e = this.watermarkDom) === null || _e === void 0 ? void 0 : _e.remove();
529
542
  (_g = (_f = this.options).onDestroyed) === null || _g === void 0 ? void 0 : _g.call(_f);
530
543
  };
544
+ Watermark.prototype.check = function () {
545
+ if (!document.body.contains(this.watermarkDom)) {
546
+ this.destroy();
547
+ this.create();
548
+ }
549
+ };
531
550
  Watermark.prototype.initConfigData = function (args, mode) {
532
551
  var _this = this;
533
552
  if (mode === void 0) { mode = 'overwrite'; }
@@ -811,11 +830,19 @@
811
830
  }
812
831
  return 'custom';
813
832
  };
833
+ Watermark.prototype.checkWatermarkElement = function () {
834
+ if (!document.body.contains(this.watermarkDom)) {
835
+ this.destroy();
836
+ this.create();
837
+ }
838
+ this.checkWatermarkElementRequestID = requestAnimationFrame(this.checkWatermarkElement.bind(this));
839
+ };
814
840
  Watermark.prototype.bindMutationObserve = function () {
815
841
  var _this = this;
816
842
  if (!this.watermarkDom) {
817
843
  return;
818
844
  }
845
+ this.checkWatermarkElementRequestID = requestAnimationFrame(this.checkWatermarkElement.bind(this));
819
846
  this.observer = new MutationObserver(function (mutationsList) {
820
847
  if (mutationsList.length > 0) {
821
848
  _this.destroy();
package/dist/watermark.umd.min.js CHANGED
@@ -1 +1 @@
1
- !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).watermark={})}(this,(function(t){"use strict";var e=function(t,a){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&(t[a]=e[a])},e(t,a)};function a(t,e,a,i){return new(a||(a=Promise))((function(n,o){function r(t){try{l(i.next(t))}catch(t){o(t)}}function d(t){try{l(i.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?n(t.value):(e=t.value,e instanceof a?e:new a((function(t){t(e)}))).then(r,d)}l((i=i.apply(t,e||[])).next())}))}function i(t,e){var a,i,n,o,r={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return o={next:d(0),throw:d(1),return:d(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function d(d){return function(l){return function(d){if(a)throw new TypeError("Generator is already executing.");for(;o&&(o=0,d[0]&&(r=0)),r;)try{if(a=1,i&&(n=2&d[0]?i.return:d[0]?i.throw||((n=i.return)&&n.call(i),0):i.next)&&!(n=n.call(i,d[1])).done)return n;switch(i=0,n&&(d=[2&d[0],n.value]),d[0]){case 0:case 1:n=d;break;case 4:return r.label++,{value:d[1],done:!1};case 5:r.label++,i=d[1],d=[0];continue;case 7:d=r.ops.pop(),r.trys.pop();continue;default:if(!(n=r.trys,(n=n.length>0&&n[n.length-1])||6!==d[0]&&2!==d[0])){r=0;continue}if(3===d[0]&&(!n||d[1]>n[0]&&d[1]<n[3])){r.label=d[1];break}if(6===d[0]&&r.label<n[1]){r.label=n[1],n=d;break}if(n&&r.label<n[2]){r.label=n[2],r.ops.push(d);break}n[2]&&r.ops.pop(),r.trys.pop();continue}d=e.call(t,r)}catch(t){d=[6,t],i=0}finally{a=n=0}if(5&d[0])throw d[1];return{value:d[0]?d[1]:void 0,done:!0}}([d,l])}}}var n=function(t){return t.toDataURL("image/png",1)},o=function(t){return"function"==typeof t},r=function(t){return void 0===t},d=function(t,e,a){void 0===e&&(e={}),void 0===a&&(a="http://www.w3.org/2000/svg");var i=document.createElementNS(a,t);for(var n in e)i.setAttribute(n,e[n]);return i},l=function(t,e){return r(t)?e:t},s=function(t,e,a){void 0===e&&(e=void 0),void 0===a&&(a=void 0);var i=new Image;return i.setAttribute("crossOrigin","Anonymous"),!r(e)&&(i.width=e),!r(a)&&(i.height=a),i.src=t,new Promise((function(t){i.onload=function(){t(i)}}))},c={width:300,height:300,rotate:45,auxiliaryLine:!1,translatePlacement:"middle",contentType:"text",content:"hello watermark-js-plus",textType:"fill",imageWidth:0,imageHeight:0,lineHeight:30,zIndex:2147483647,backgroundPosition:"0 0, 0 0",backgroundRepeat:"repeat",fontSize:"20px",fontFamily:"sans-serif",fontStyle:"",fontVariant:"",fontColor:"#000",fontWeight:"normal",filter:"none",globalAlpha:.5,mode:"default",mutationObserve:!0,unique:!0,parent:"body",onSuccess:function(){},onBeforeDestroy:function(){},onDestroyed:function(){}},h=function(t,e,a){var i=t.getContext("2d");if(null===i)throw new Error("get context error");i.font="".concat(e.fontStyle," ").concat(e.fontVariant," ").concat(e.fontWeight," ").concat(e.fontSize," ").concat(e.fontFamily),i.filter=e.filter,(null==e?void 0:e.rotate)&&(e.rotate=(360-e.rotate%360)*(Math.PI/180)),r(a.textRowMaxWidth)&&(e.textRowMaxWidth=e.width);var n={image:{rect:{width:e.imageWidth,height:e.imageHeight},position:{x:0,y:0}},textLine:{data:[],yOffsetValue:0},advancedStyleParams:{linear:{x0:0,x1:0},radial:{x0:0,y0:0,r0:0,x1:0,y1:0,r1:0},conic:{x:0,y:0,startAngle:0},pattern:{}}};switch(e.contentType){case"text":n.textLine.data=[e.content];break;case"multi-line-text":n.textLine.data=function(t,e,a){for(var i=[],n="",o=0,r=e.length;o<r;o++)n+=e.charAt(o),t.measureText(n).width>a&&(i.push(n.substring(0,n.length-1)),n="",o--);return i.push(n),i}(i,e.content,e.textRowMaxWidth)}var o=e.width/2,d=e.height/2,l="middle",s="center";switch(r(null==a?void 0:a.translateX)||r(null==a?void 0:a.translateY)?(n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.r0=0,n.advancedStyleParams.radial.r1=e.width/2):(o=null==a?void 0:a.translateX,d=null==a?void 0:a.translateY,l="top",s="left"),a.translatePlacement){case"top":o=e.width/2,d=0,l="top",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-start":o=0,d=0,l="top",s="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-end":o=e.width,d=0,l="top",s="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"bottom":o=e.width/2,d=e.height,l="bottom",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=0,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-start":o=0,d=e.height,l="bottom",s="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-end":o=e.width,d=e.height,l="bottom",s="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"left":o=0,d=e.height/2,s="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=0;break;case"right":o=e.width,d=e.height/2,s="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=0}if(e.translateX=o,e.translateY=d,r(null==a?void 0:a.textBaseline)&&(e.textBaseline=l),r(null==a?void 0:a.textAlign)&&(e.textAlign=s),"multi-line-text"===e.contentType)switch(e.textBaseline){case"middle":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight/2;break;case"bottom":case"alphabetic":case"ideographic":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight;break;case"top":case"hanging":n.textLine.yOffsetValue=0}return n},v=function(){function t(e){void 0===e&&(e={}),this.parentElement=document.body,this.props=e,this.options=Object.assign({},c,e),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=h(this.canvas,this.options,this.props),"undefined"!=typeof window&&Object.defineProperty(window,"MutationObserver",{writable:!1,configurable:!1})}return t.createCanvas=function(t,e){var a,i=window.devicePixelRatio||1,n=document.createElement("canvas");return n.width=t*i,n.height=e*i,n.style.width="".concat(t,"px"),n.style.height="".concat(e,"px"),null===(a=n.getContext("2d"))||void 0===a||a.setTransform(i,0,0,i,0,0),n},t.prototype.changeOptions=function(t,e){void 0===t&&(t={}),void 0===e&&(e="overwrite"),this.initConfigData(t,e)},t.prototype.create=function(){var t,e;return a(this,void 0,void 0,(function(){var a,o,r;return i(this,(function(i){switch(i.label){case 0:return this.validateUnique()&&this.validateContent()?[4,this.draw()]:[2];case 1:return i.sent(),a=n(this.canvas),this.clearCanvas(),this.watermarkDom=document.createElement("div"),o=document.createElement("div"),this.watermarkDom.__WATERMARK__="watermark",this.watermarkDom.__WATERMARK__INSTANCE__=this,r=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("custom"===r?"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 "),o.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("root"===r?"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(a,")!important;background-repeat:").concat(this.options.backgroundRepeat,"!important;\n background-size:").concat(this.options.width,"px ").concat(this.options.height,"px!important;background-position:").concat(this.options.backgroundPosition,"!important;\n "),this.watermarkDom.append(o),this.parentElement.appendChild(this.watermarkDom),this.options.mutationObserve&&this.bindMutationObserve(),null===(e=(t=this.options).onSuccess)||void 0===e||e.call(t),[2]}}))}))},t.prototype.destroy=function(){var t,e,a,i,n,o,r;null===(e=(t=this.options).onBeforeDestroy)||void 0===e||e.call(t),null===(a=this.observer)||void 0===a||a.disconnect(),null===(i=this.parentObserve)||void 0===i||i.disconnect(),null===(n=this.watermarkDom)||void 0===n||n.remove(),null===(r=(o=this.options).onDestroyed)||void 0===r||r.call(o)},t.prototype.initConfigData=function(e,a){var i=this;void 0===a&&(a="overwrite"),this.props=e,"overwrite"===a?this.options=Object.assign({},c,e):Object.keys(e).forEach((function(t){i.options[t]=e[t]})),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=h(this.canvas,this.options,this.props)},t.prototype.changeParentElement=function(t){if("string"==typeof t){var e=document.querySelector(t);e&&(this.parentElement=e)}else this.parentElement=t},t.prototype.validateUnique=function(){var t=!0;return this.options.unique&&this.parentElement.childNodes.forEach((function(e){t&&Object.hasOwnProperty.call(e,"__WATERMARK__")&&(t=!1)})),t},t.prototype.validateContent=function(){switch(this.options.contentType){case"image":return Object.hasOwnProperty.call(this.options,"image");case"multi-line-text":case"rich-text":case"text":return this.options.content.length>0}return!1},t.prototype.draw=function(){var t=this,e=this.canvas.getContext("2d");if(null===e)throw new Error("get context error");return this.options.auxiliaryLine&&(e.beginPath(),e.rect(1,1,this.options.width,this.options.height),e.lineWidth=1,e.strokeStyle="#000",e.stroke(),e.closePath(),e.beginPath(),e.rect(this.options.translateX,this.options.translateY,1,1),e.lineWidth=1,e.strokeStyle="#f00",e.stroke(),e.closePath()),this.setStyle(e),e.save(),e.translate(this.options.translateX,this.options.translateY),e.rotate(this.options.rotate),new Promise((function(a){switch(t.options.contentType){case"text":t.drawText(e,a);break;case"image":t.drawImage(e,a);break;case"multi-line-text":t.drawMultiLineText(e,a);break;case"rich-text":t.drawRichText(e,a)}}))},t.prototype.setStyle=function(t){var e,a="fillStyle";"stroke"===this.options.textType&&(a="strokeStyle");var i=this.options.fontColor;if(null===(e=this.options)||void 0===e?void 0:e.advancedStyle)switch(this.options.advancedStyle.type){case"linear":i=this.createLinearGradient(t);break;case"radial":i=this.createRadialGradient(t);break;case"conic":i=this.createConicGradient(t);break;case"pattern":i=this.createPattern(t)}t[a]&&i&&(t[a]=i),this.options.textAlign&&(t.textAlign=this.options.textAlign),this.options.textBaseline&&(t.textBaseline=this.options.textBaseline),t.globalAlpha=this.options.globalAlpha,this.options.shadowStyle&&(t.shadowBlur=l(this.options.shadowStyle.shadowBlur,0),t.shadowColor=l(this.options.shadowStyle.shadowColor,"#00000000"),t.shadowOffsetX=l(this.options.shadowStyle.shadowOffsetX,0),t.shadowOffsetY=l(this.options.shadowStyle.shadowOffsetY,0)),o(this.options.extraDrawFunc)&&this.options.extraDrawFunc(t)},t.prototype.createLinearGradient=function(t){var e,a,i,n,o,r,d,s,c,h,v,p,u,m,y,f=t.createLinearGradient(l(null===(i=null===(a=null===(e=this.options.advancedStyle)||void 0===e?void 0:e.params)||void 0===a?void 0:a.linear)||void 0===i?void 0:i.x0,this.recommendOptions.advancedStyleParams.linear.x0),l(null===(r=null===(o=null===(n=this.options.advancedStyle)||void 0===n?void 0:n.params)||void 0===o?void 0:o.linear)||void 0===r?void 0:r.y0,0),l(null===(c=null===(s=null===(d=this.options.advancedStyle)||void 0===d?void 0:d.params)||void 0===s?void 0:s.linear)||void 0===c?void 0:c.x1,this.recommendOptions.advancedStyleParams.linear.x1),l(null===(p=null===(v=null===(h=this.options.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.linear)||void 0===p?void 0:p.y1,0));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){f.addColorStop(t.offset,t.color)})),f},t.prototype.createConicGradient=function(t){var e,a,i,n,o,r,d,s,c,h,v,p,u,m,y,f=t.createConicGradient(l(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.conic)||void 0===n?void 0:n.startAngle,0),l(null===(s=null===(d=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===d?void 0:d.conic)||void 0===s?void 0:s.x,this.recommendOptions.advancedStyleParams.conic.x),l(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.conic)||void 0===p?void 0:p.y,this.recommendOptions.advancedStyleParams.conic.y));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){f.addColorStop(t.offset,t.color)})),f},t.prototype.createRadialGradient=function(t){var e,a,i,n,o,r,d,s,c,h,v,p,u,m,y,f,g,x,w,S,b,P,k,O,L,C,T,E=t.createRadialGradient(l(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.radial)||void 0===n?void 0:n.x0,this.recommendOptions.advancedStyleParams.radial.x0),l(null===(s=null===(d=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===d?void 0:d.radial)||void 0===s?void 0:s.y0,this.recommendOptions.advancedStyleParams.radial.y0),l(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.radial)||void 0===p?void 0:p.r0,this.recommendOptions.advancedStyleParams.radial.r0),l(null===(f=null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.params)||void 0===y?void 0:y.radial)||void 0===f?void 0:f.x1,this.recommendOptions.advancedStyleParams.radial.x1),l(null===(S=null===(w=null===(x=null===(g=this.options)||void 0===g?void 0:g.advancedStyle)||void 0===x?void 0:x.params)||void 0===w?void 0:w.radial)||void 0===S?void 0:S.y1,this.recommendOptions.advancedStyleParams.radial.y1),l(null===(O=null===(k=null===(P=null===(b=this.options)||void 0===b?void 0:b.advancedStyle)||void 0===P?void 0:P.params)||void 0===k?void 0:k.radial)||void 0===O?void 0:O.r1,this.recommendOptions.advancedStyleParams.radial.r1));return null===(T=null===(C=null===(L=this.options)||void 0===L?void 0:L.advancedStyle)||void 0===C?void 0:C.colorStops)||void 0===T||T.forEach((function(t){E.addColorStop(t.offset,t.color)})),E},t.prototype.createPattern=function(t){var e,a,i,n,o,r,d,l;return t.createPattern(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.pattern)||void 0===n?void 0:n.image,(null===(l=null===(d=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===d?void 0:d.pattern)||void 0===l?void 0:l.repetition)||"")},t.prototype.setText=function(t,e){var a="fillText";"stroke"===this.options.textType&&(a="strokeText"),t[a]&&t[a](e.text,e.x,e.y,e.maxWidth)},t.prototype.drawText=function(t,e){this.setText(t,{text:this.options.content,x:0,y:0,maxWidth:this.options.textRowMaxWidth||this.options.width}),e(t.canvas)},t.prototype.drawImage=function(t,e){var a=this;s(this.options.image).then((function(i){var n=a.getImageRect(i),o=n.width,r=n.height,d=a.getDrawImagePosition(o,r);t.drawImage(i,d.x,d.y,o,r),e(t.canvas)}))},t.prototype.drawMultiLineText=function(t,e){var a=this,i=this.recommendOptions.textLine.data,n=this.recommendOptions.textLine.yOffsetValue;i.forEach((function(e,i){a.setText(t,{text:e,x:0,y:a.options.lineHeight*i-n})})),e(t.canvas)},t.prototype.drawRichText=function(t,e){var a,i,n=this,o=function(t,e){var a=d("svg",{xmlns:"http://www.w3.org/2000/svg"}),i=document.createElement("div");i.setAttribute("xmlns","http://www.w3.org/1999/xhtml"),i.style.cssText="\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n font: ".concat(t.font,";\n color: ").concat(e.fontColor,";\n"),i.innerHTML='<div class="rich-text-content">'.concat(e.content,"</div>"),document.body.appendChild(i);var n=i.querySelector(".rich-text-content"),o=n.offsetHeight,r=n.offsetWidth;document.body.removeChild(i);var l=e.richTextWidth||r||e.width,s=e.richTextHeight||o||e.height,c=d("foreignObject",{width:l.toString(),height:s.toString()});return c.appendChild(i),a.appendChild(c),{element:a,width:l,height:s}}(t,this.options);s((a=o.element,i=a.outerHTML.replace(/\n/g,"").replace(/\t/g,"").replace(/#/g,"%23"),"data:image/svg+xml;charset=utf-8,".concat(i)),o.width,o.height).then((function(a){var i=n.getDrawImagePosition(a.width,a.height);t.drawImage(a,i.x,i.y,t.canvas.width,t.canvas.height),e(t.canvas)}))},t.prototype.getImageRect=function(t){var e={width:this.options.imageWidth||0,height:this.options.imageHeight||0};switch(!0){case 0!==e.width&&0===e.height:e.height=e.width*t.height/t.width;break;case 0===e.width&&0!==e.height:e.width=e.height*t.width/t.height;break;case 0===e.width&&0===e.height:e.width=t.width,e.height=t.height}return e},t.prototype.getDrawImagePosition=function(t,e){var a,i,n={x:-t/2,y:-e/2};switch(this.options.translatePlacement){case"top":n.x=-t/2,n.y=0;break;case"top-start":n.x=0,n.y=0;break;case"top-end":n.x=-t,n.y=0;break;case"bottom":n.x=-t/2,n.y=-e;break;case"bottom-start":n.x=0,n.y=-e;break;case"bottom-end":n.x=-t,n.y=-e;break;case"left":n.x=0,n.y=-e/2;break;case"right":n.x=-t,n.y=-e/2}return!r(null===(a=this.props)||void 0===a?void 0:a.translateX)&&(n.x=0),!r(null===(i=this.props)||void 0===i?void 0:i.translateY)&&(n.y=0),n},t.prototype.checkParentElementType=function(){return["html","body"].includes(this.parentElement.tagName.toLocaleLowerCase())?"root":"custom"},t.prototype.bindMutationObserve=function(){var t=this;this.watermarkDom&&(this.observer=new MutationObserver((function(e){e.length>0&&(t.destroy(),t.create())})),this.observer.observe(this.watermarkDom,{attributes:!0,childList:!0,subtree:!0,characterData:!0}),this.parentObserve=new MutationObserver((function(e){e.forEach((function(e){var a;((null==e?void 0:e.target)===t.watermarkDom||(null===(a=null==e?void 0:e.removedNodes)||void 0===a?void 0:a[0])===t.watermarkDom||"childList"===e.type&&e.target===t.parentElement&&e.target.lastChild!==t.watermarkDom)&&(t.destroy(),t.create())}))})),this.parentObserve.observe(this.parentElement,{attributes:!0,childList:!0,subtree:!0,characterData:!0}))},t.prototype.clearCanvas=function(){var t=this.canvas.getContext("2d");if(null===t)throw new Error("get context error");t.restore(),t.clearRect(0,0,this.canvas.width,this.canvas.height)},t}(),p=function(t){function a(e){return void 0===e&&(e={}),e.globalAlpha=.005,e.mode="blind",t.call(this,e)||this}return function(t,a){if("function"!=typeof a&&null!==a)throw new TypeError("Class extends value "+String(a)+" is not a constructor or null");function i(){this.constructor=t}e(t,a),t.prototype=null===a?Object.create(a):(i.prototype=a.prototype,new i)}(a,t),a.decode=function(t){var e=Object.assign({url:"",fillColor:"#000",compositeOperation:"color-burn",mode:"canvas"},t);if(e.url&&"canvas"===e.mode){var a=new Image;a.src=e.url,a.onload=function(){var t,i=a.width,r=a.height,d=v.createCanvas(i,r),l=d.getContext("2d");if(null===l)throw new Error("get context error");l.drawImage(a,0,0,i,r),l.globalCompositeOperation=e.compositeOperation,l.fillStyle=e.fillColor,l.fillRect(0,0,i,r);var s=n(d);e.onSuccess&&o(e.onSuccess)&&(null===(t=e.onSuccess)||void 0===t||t.call(e,s))}}},a}(v);t.BlindWatermark=p,t.Watermark=v}));
1
+ !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).watermark={})}(this,(function(t){"use strict";var e=function(t,a){return e=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var a in e)Object.prototype.hasOwnProperty.call(e,a)&&(t[a]=e[a])},e(t,a)};function a(t,e,a,i){return new(a||(a=Promise))((function(n,o){function r(t){try{l(i.next(t))}catch(t){o(t)}}function s(t){try{l(i.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?n(t.value):(e=t.value,e instanceof a?e:new a((function(t){t(e)}))).then(r,s)}l((i=i.apply(t,e||[])).next())}))}function i(t,e){var a,i,n,o,r={label:0,sent:function(){if(1&n[0])throw n[1];return n[1]},trys:[],ops:[]};return o={next:s(0),throw:s(1),return:s(2)},"function"==typeof Symbol&&(o[Symbol.iterator]=function(){return this}),o;function s(s){return function(l){return function(s){if(a)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(r=0)),r;)try{if(a=1,i&&(n=2&s[0]?i.return:s[0]?i.throw||((n=i.return)&&n.call(i),0):i.next)&&!(n=n.call(i,s[1])).done)return n;switch(i=0,n&&(s=[2&s[0],n.value]),s[0]){case 0:case 1:n=s;break;case 4:return r.label++,{value:s[1],done:!1};case 5:r.label++,i=s[1],s=[0];continue;case 7:s=r.ops.pop(),r.trys.pop();continue;default:if(!(n=r.trys,(n=n.length>0&&n[n.length-1])||6!==s[0]&&2!==s[0])){r=0;continue}if(3===s[0]&&(!n||s[1]>n[0]&&s[1]<n[3])){r.label=s[1];break}if(6===s[0]&&r.label<n[1]){r.label=n[1],n=s;break}if(n&&r.label<n[2]){r.label=n[2],r.ops.push(s);break}n[2]&&r.ops.pop(),r.trys.pop();continue}s=e.call(t,r)}catch(t){s=[6,t],i=0}finally{a=n=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,l])}}}var n=function(t){return t.toDataURL("image/png",1)},o=function(t){return"function"==typeof t},r=function(t){return void 0===t},s=function(t,e,a){void 0===e&&(e={}),void 0===a&&(a="http://www.w3.org/2000/svg");var i=document.createElementNS(a,t);for(var n in e)i.setAttribute(n,e[n]);return i},l=function(t,e){return r(t)?e:t},d=function(t,e,a){void 0===e&&(e=void 0),void 0===a&&(a=void 0);var i=new Image;return i.setAttribute("crossOrigin","Anonymous"),!r(e)&&(i.width=e),!r(a)&&(i.height=a),i.src=t,new Promise((function(t){i.onload=function(){t(i)}}))},c={width:300,height:300,rotate:45,auxiliaryLine:!1,translatePlacement:"middle",contentType:"text",content:"hello watermark-js-plus",textType:"fill",imageWidth:0,imageHeight:0,lineHeight:30,zIndex:2147483647,backgroundPosition:"0 0, 0 0",backgroundRepeat:"repeat",fontSize:"20px",fontFamily:"sans-serif",fontStyle:"",fontVariant:"",fontColor:"#000",fontWeight:"normal",filter:"none",globalAlpha:.5,mode:"default",mutationObserve:!0,unique:!0,parent:"body",onSuccess:function(){},onBeforeDestroy:function(){},onDestroyed:function(){},onObserveError:function(){}},h=function(t,e,a){var i=t.getContext("2d");if(null===i)throw new Error("get context error");i.font="".concat(e.fontStyle," ").concat(e.fontVariant," ").concat(e.fontWeight," ").concat(e.fontSize," ").concat(e.fontFamily),i.filter=e.filter,(null==e?void 0:e.rotate)&&(e.rotate=(360-e.rotate%360)*(Math.PI/180)),r(a.textRowMaxWidth)&&(e.textRowMaxWidth=e.width);var n={image:{rect:{width:e.imageWidth,height:e.imageHeight},position:{x:0,y:0}},textLine:{data:[],yOffsetValue:0},advancedStyleParams:{linear:{x0:0,x1:0},radial:{x0:0,y0:0,r0:0,x1:0,y1:0,r1:0},conic:{x:0,y:0,startAngle:0},pattern:{}}};switch(e.contentType){case"text":n.textLine.data=[e.content];break;case"multi-line-text":n.textLine.data=function(t,e,a){for(var i=[],n="",o=0,r=e.length;o<r;o++)n+=e.charAt(o),t.measureText(n).width>a&&(i.push(n.substring(0,n.length-1)),n="",o--);return i.push(n),i}(i,e.content,e.textRowMaxWidth)}var o=e.width/2,s=e.height/2,l="middle",d="center";switch(r(null==a?void 0:a.translateX)||r(null==a?void 0:a.translateY)?(n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.r0=0,n.advancedStyleParams.radial.r1=e.width/2):(o=null==a?void 0:a.translateX,s=null==a?void 0:a.translateY,l="top",d="left"),a.translatePlacement){case"top":o=e.width/2,s=0,l="top",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-start":o=0,s=0,l="top",d="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"top-end":o=e.width,s=0,l="top",d="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=n.textLine.data.length*e.lineHeight/2;break;case"bottom":o=e.width/2,s=e.height,l="bottom",n.advancedStyleParams.linear.x0=-e.width/2,n.advancedStyleParams.linear.x1=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=0,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-start":o=0,s=e.height,l="bottom",d="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"bottom-end":o=e.width,s=e.height,l="bottom",d="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.y0=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.radial.y1=-n.textLine.data.length*e.lineHeight/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=-n.textLine.data.length*e.lineHeight/2;break;case"left":o=0,s=e.height/2,d="start",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=e.width,n.advancedStyleParams.radial.x0=e.width/2,n.advancedStyleParams.radial.x1=e.width/2,n.advancedStyleParams.conic.x=e.width/2,n.advancedStyleParams.conic.y=0;break;case"right":o=e.width,s=e.height/2,d="end",n.advancedStyleParams.linear.x0=0,n.advancedStyleParams.linear.x1=-e.width,n.advancedStyleParams.radial.x0=-e.width/2,n.advancedStyleParams.radial.x1=-e.width/2,n.advancedStyleParams.conic.x=-e.width/2,n.advancedStyleParams.conic.y=0}if(e.translateX=o,e.translateY=s,r(null==a?void 0:a.textBaseline)&&(e.textBaseline=l),r(null==a?void 0:a.textAlign)&&(e.textAlign=d),"multi-line-text"===e.contentType)switch(e.textBaseline){case"middle":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight/2;break;case"bottom":case"alphabetic":case"ideographic":n.textLine.yOffsetValue=(n.textLine.data.length-1)*e.lineHeight;break;case"top":case"hanging":n.textLine.yOffsetValue=0}return n},v=function(){function t(e){void 0===e&&(e={}),this.parentElement=document.body,this.props=e,this.options=Object.assign({},c,e),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=h(this.canvas,this.options,this.props),"undefined"!=typeof window&&(Object.defineProperty(window,"MutationObserver",{writable:!1,configurable:!1}),Object.defineProperty(window,"requestAnimationFrame",{writable:!1,configurable:!1}))}return t.createCanvas=function(t,e){var a,i=window.devicePixelRatio||1,n=document.createElement("canvas");return n.width=t*i,n.height=e*i,n.style.width="".concat(t,"px"),n.style.height="".concat(e,"px"),null===(a=n.getContext("2d"))||void 0===a||a.setTransform(i,0,0,i,0,0),n},t.prototype.changeOptions=function(t,e){void 0===t&&(t={}),void 0===e&&(e="overwrite"),this.initConfigData(t,e)},t.prototype.create=function(){var t,e,o,r;return a(this,void 0,void 0,(function(){var a,s,l;return i(this,(function(i){switch(i.label){case 0:return this.validateUnique()&&this.validateContent()?[4,this.draw()]:[2];case 1:if(i.sent(),a=n(this.canvas),this.clearCanvas(),this.watermarkDom=document.createElement("div"),s=document.createElement("div"),this.watermarkDom.__WATERMARK__="watermark",this.watermarkDom.__WATERMARK__INSTANCE__=this,l=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("custom"===l?"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 "),s.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("root"===l?"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(a,")!important;background-repeat:").concat(this.options.backgroundRepeat,"!important;\n background-size:").concat(this.options.width,"px ").concat(this.options.height,"px!important;background-position:").concat(this.options.backgroundPosition,"!important;\n "),this.watermarkDom.append(s),this.parentElement.appendChild(this.watermarkDom),this.options.mutationObserve)try{this.bindMutationObserve()}catch(a){null===(e=(t=this.options).onObserveError)||void 0===e||e.call(t)}return null===(r=(o=this.options).onSuccess)||void 0===r||r.call(o),[2]}}))}))},t.prototype.destroy=function(){var t,e,a,i,n,o,s;null===(e=(t=this.options).onBeforeDestroy)||void 0===e||e.call(t),null===(a=this.observer)||void 0===a||a.disconnect(),null===(i=this.parentObserve)||void 0===i||i.disconnect(),r(this.checkWatermarkElementRequestID)||cancelAnimationFrame(this.checkWatermarkElementRequestID),null===(n=this.watermarkDom)||void 0===n||n.remove(),null===(s=(o=this.options).onDestroyed)||void 0===s||s.call(o)},t.prototype.check=function(){document.body.contains(this.watermarkDom)||(this.destroy(),this.create())},t.prototype.initConfigData=function(e,a){var i=this;void 0===a&&(a="overwrite"),this.props=e,"overwrite"===a?this.options=Object.assign({},c,e):Object.keys(e).forEach((function(t){i.options[t]=e[t]})),this.changeParentElement(this.options.parent),this.canvas=t.createCanvas(this.options.width,this.options.height),this.recommendOptions=h(this.canvas,this.options,this.props)},t.prototype.changeParentElement=function(t){if("string"==typeof t){var e=document.querySelector(t);e&&(this.parentElement=e)}else this.parentElement=t},t.prototype.validateUnique=function(){var t=!0;return this.options.unique&&this.parentElement.childNodes.forEach((function(e){t&&Object.hasOwnProperty.call(e,"__WATERMARK__")&&(t=!1)})),t},t.prototype.validateContent=function(){switch(this.options.contentType){case"image":return Object.hasOwnProperty.call(this.options,"image");case"multi-line-text":case"rich-text":case"text":return this.options.content.length>0}return!1},t.prototype.draw=function(){var t=this,e=this.canvas.getContext("2d");if(null===e)throw new Error("get context error");return this.options.auxiliaryLine&&(e.beginPath(),e.rect(1,1,this.options.width,this.options.height),e.lineWidth=1,e.strokeStyle="#000",e.stroke(),e.closePath(),e.beginPath(),e.rect(this.options.translateX,this.options.translateY,1,1),e.lineWidth=1,e.strokeStyle="#f00",e.stroke(),e.closePath()),this.setStyle(e),e.save(),e.translate(this.options.translateX,this.options.translateY),e.rotate(this.options.rotate),new Promise((function(a){switch(t.options.contentType){case"text":t.drawText(e,a);break;case"image":t.drawImage(e,a);break;case"multi-line-text":t.drawMultiLineText(e,a);break;case"rich-text":t.drawRichText(e,a)}}))},t.prototype.setStyle=function(t){var e,a="fillStyle";"stroke"===this.options.textType&&(a="strokeStyle");var i=this.options.fontColor;if(null===(e=this.options)||void 0===e?void 0:e.advancedStyle)switch(this.options.advancedStyle.type){case"linear":i=this.createLinearGradient(t);break;case"radial":i=this.createRadialGradient(t);break;case"conic":i=this.createConicGradient(t);break;case"pattern":i=this.createPattern(t)}t[a]&&i&&(t[a]=i),this.options.textAlign&&(t.textAlign=this.options.textAlign),this.options.textBaseline&&(t.textBaseline=this.options.textBaseline),t.globalAlpha=this.options.globalAlpha,this.options.shadowStyle&&(t.shadowBlur=l(this.options.shadowStyle.shadowBlur,0),t.shadowColor=l(this.options.shadowStyle.shadowColor,"#00000000"),t.shadowOffsetX=l(this.options.shadowStyle.shadowOffsetX,0),t.shadowOffsetY=l(this.options.shadowStyle.shadowOffsetY,0)),o(this.options.extraDrawFunc)&&this.options.extraDrawFunc(t)},t.prototype.createLinearGradient=function(t){var e,a,i,n,o,r,s,d,c,h,v,p,u,m,y,f=t.createLinearGradient(l(null===(i=null===(a=null===(e=this.options.advancedStyle)||void 0===e?void 0:e.params)||void 0===a?void 0:a.linear)||void 0===i?void 0:i.x0,this.recommendOptions.advancedStyleParams.linear.x0),l(null===(r=null===(o=null===(n=this.options.advancedStyle)||void 0===n?void 0:n.params)||void 0===o?void 0:o.linear)||void 0===r?void 0:r.y0,0),l(null===(c=null===(d=null===(s=this.options.advancedStyle)||void 0===s?void 0:s.params)||void 0===d?void 0:d.linear)||void 0===c?void 0:c.x1,this.recommendOptions.advancedStyleParams.linear.x1),l(null===(p=null===(v=null===(h=this.options.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.linear)||void 0===p?void 0:p.y1,0));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){f.addColorStop(t.offset,t.color)})),f},t.prototype.createConicGradient=function(t){var e,a,i,n,o,r,s,d,c,h,v,p,u,m,y,f=t.createConicGradient(l(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.conic)||void 0===n?void 0:n.startAngle,0),l(null===(d=null===(s=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===s?void 0:s.conic)||void 0===d?void 0:d.x,this.recommendOptions.advancedStyleParams.conic.x),l(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.conic)||void 0===p?void 0:p.y,this.recommendOptions.advancedStyleParams.conic.y));return null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.colorStops)||void 0===y||y.forEach((function(t){f.addColorStop(t.offset,t.color)})),f},t.prototype.createRadialGradient=function(t){var e,a,i,n,o,r,s,d,c,h,v,p,u,m,y,f,g,x,w,b,S,P,k,O,E,L,C,T=t.createRadialGradient(l(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.radial)||void 0===n?void 0:n.x0,this.recommendOptions.advancedStyleParams.radial.x0),l(null===(d=null===(s=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===s?void 0:s.radial)||void 0===d?void 0:d.y0,this.recommendOptions.advancedStyleParams.radial.y0),l(null===(p=null===(v=null===(h=null===(c=this.options)||void 0===c?void 0:c.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.radial)||void 0===p?void 0:p.r0,this.recommendOptions.advancedStyleParams.radial.r0),l(null===(f=null===(y=null===(m=null===(u=this.options)||void 0===u?void 0:u.advancedStyle)||void 0===m?void 0:m.params)||void 0===y?void 0:y.radial)||void 0===f?void 0:f.x1,this.recommendOptions.advancedStyleParams.radial.x1),l(null===(b=null===(w=null===(x=null===(g=this.options)||void 0===g?void 0:g.advancedStyle)||void 0===x?void 0:x.params)||void 0===w?void 0:w.radial)||void 0===b?void 0:b.y1,this.recommendOptions.advancedStyleParams.radial.y1),l(null===(O=null===(k=null===(P=null===(S=this.options)||void 0===S?void 0:S.advancedStyle)||void 0===P?void 0:P.params)||void 0===k?void 0:k.radial)||void 0===O?void 0:O.r1,this.recommendOptions.advancedStyleParams.radial.r1));return null===(C=null===(L=null===(E=this.options)||void 0===E?void 0:E.advancedStyle)||void 0===L?void 0:L.colorStops)||void 0===C||C.forEach((function(t){T.addColorStop(t.offset,t.color)})),T},t.prototype.createPattern=function(t){var e,a,i,n,o,r,s,l;return t.createPattern(null===(n=null===(i=null===(a=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===a?void 0:a.params)||void 0===i?void 0:i.pattern)||void 0===n?void 0:n.image,(null===(l=null===(s=null===(r=null===(o=this.options)||void 0===o?void 0:o.advancedStyle)||void 0===r?void 0:r.params)||void 0===s?void 0:s.pattern)||void 0===l?void 0:l.repetition)||"")},t.prototype.setText=function(t,e){var a="fillText";"stroke"===this.options.textType&&(a="strokeText"),t[a]&&t[a](e.text,e.x,e.y,e.maxWidth)},t.prototype.drawText=function(t,e){this.setText(t,{text:this.options.content,x:0,y:0,maxWidth:this.options.textRowMaxWidth||this.options.width}),e(t.canvas)},t.prototype.drawImage=function(t,e){var a=this;d(this.options.image).then((function(i){var n=a.getImageRect(i),o=n.width,r=n.height,s=a.getDrawImagePosition(o,r);t.drawImage(i,s.x,s.y,o,r),e(t.canvas)}))},t.prototype.drawMultiLineText=function(t,e){var a=this,i=this.recommendOptions.textLine.data,n=this.recommendOptions.textLine.yOffsetValue;i.forEach((function(e,i){a.setText(t,{text:e,x:0,y:a.options.lineHeight*i-n})})),e(t.canvas)},t.prototype.drawRichText=function(t,e){var a,i,n=this,o=function(t,e){var a=s("svg",{xmlns:"http://www.w3.org/2000/svg"}),i=document.createElement("div");i.setAttribute("xmlns","http://www.w3.org/1999/xhtml"),i.style.cssText="\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n font: ".concat(t.font,";\n color: ").concat(e.fontColor,";\n"),i.innerHTML='<div class="rich-text-content">'.concat(e.content,"</div>"),document.body.appendChild(i);var n=i.querySelector(".rich-text-content"),o=n.offsetHeight,r=n.offsetWidth;document.body.removeChild(i);var l=e.richTextWidth||r||e.width,d=e.richTextHeight||o||e.height,c=s("foreignObject",{width:l.toString(),height:d.toString()});return c.appendChild(i),a.appendChild(c),{element:a,width:l,height:d}}(t,this.options);d((a=o.element,i=a.outerHTML.replace(/\n/g,"").replace(/\t/g,"").replace(/#/g,"%23"),"data:image/svg+xml;charset=utf-8,".concat(i)),o.width,o.height).then((function(a){var i=n.getDrawImagePosition(a.width,a.height);t.drawImage(a,i.x,i.y,t.canvas.width,t.canvas.height),e(t.canvas)}))},t.prototype.getImageRect=function(t){var e={width:this.options.imageWidth||0,height:this.options.imageHeight||0};switch(!0){case 0!==e.width&&0===e.height:e.height=e.width*t.height/t.width;break;case 0===e.width&&0!==e.height:e.width=e.height*t.width/t.height;break;case 0===e.width&&0===e.height:e.width=t.width,e.height=t.height}return e},t.prototype.getDrawImagePosition=function(t,e){var a,i,n={x:-t/2,y:-e/2};switch(this.options.translatePlacement){case"top":n.x=-t/2,n.y=0;break;case"top-start":n.x=0,n.y=0;break;case"top-end":n.x=-t,n.y=0;break;case"bottom":n.x=-t/2,n.y=-e;break;case"bottom-start":n.x=0,n.y=-e;break;case"bottom-end":n.x=-t,n.y=-e;break;case"left":n.x=0,n.y=-e/2;break;case"right":n.x=-t,n.y=-e/2}return!r(null===(a=this.props)||void 0===a?void 0:a.translateX)&&(n.x=0),!r(null===(i=this.props)||void 0===i?void 0:i.translateY)&&(n.y=0),n},t.prototype.checkParentElementType=function(){return["html","body"].includes(this.parentElement.tagName.toLocaleLowerCase())?"root":"custom"},t.prototype.checkWatermarkElement=function(){document.body.contains(this.watermarkDom)||(this.destroy(),this.create()),this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this))},t.prototype.bindMutationObserve=function(){var t=this;this.watermarkDom&&(this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this)),this.observer=new MutationObserver((function(e){e.length>0&&(t.destroy(),t.create())})),this.observer.observe(this.watermarkDom,{attributes:!0,childList:!0,subtree:!0,characterData:!0}),this.parentObserve=new MutationObserver((function(e){e.forEach((function(e){var a;((null==e?void 0:e.target)===t.watermarkDom||(null===(a=null==e?void 0:e.removedNodes)||void 0===a?void 0:a[0])===t.watermarkDom||"childList"===e.type&&e.target===t.parentElement&&e.target.lastChild!==t.watermarkDom)&&(t.destroy(),t.create())}))})),this.parentObserve.observe(this.parentElement,{attributes:!0,childList:!0,subtree:!0,characterData:!0}))},t.prototype.clearCanvas=function(){var t=this.canvas.getContext("2d");if(null===t)throw new Error("get context error");t.restore(),t.clearRect(0,0,this.canvas.width,this.canvas.height)},t}(),p=function(t){function a(e){return void 0===e&&(e={}),e.globalAlpha=.005,e.mode="blind",t.call(this,e)||this}return function(t,a){if("function"!=typeof a&&null!==a)throw new TypeError("Class extends value "+String(a)+" is not a constructor or null");function i(){this.constructor=t}e(t,a),t.prototype=null===a?Object.create(a):(i.prototype=a.prototype,new i)}(a,t),a.decode=function(t){var e=Object.assign({url:"",fillColor:"#000",compositeOperation:"color-burn",mode:"canvas"},t);if(e.url&&"canvas"===e.mode){var a=new Image;a.src=e.url,a.onload=function(){var t,i=a.width,r=a.height,s=v.createCanvas(i,r),l=s.getContext("2d");if(null===l)throw new Error("get context error");l.drawImage(a,0,0,i,r),l.globalCompositeOperation=e.compositeOperation,l.fillStyle=e.fillColor,l.fillRect(0,0,i,r);var d=n(s);e.onSuccess&&o(e.onSuccess)&&(null===(t=e.onSuccess)||void 0===t||t.call(e,d))}}},a}(v);t.BlindWatermark=p,t.Watermark=v}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "watermark-js-plus",
3
- "version": "0.8.12",
3
+ "version": "0.8.13",
4
4
  "description": "watermark for the browser",
5
5
  "scripts": {
6
6
  "test": "echo \"Error: no test specified\" && exit 1",
@@ -48,7 +48,7 @@
48
48
  "@babel/eslint-parser": "^7.21.3",
49
49
  "@babel/plugin-transform-runtime": "^7.21.0",
50
50
  "@babel/preset-env": "^7.20.2",
51
- "@commitlint/cli": "^17.4.4",
51
+ "@commitlint/cli": "^17.5.0",
52
52
  "@commitlint/config-conventional": "^17.4.4",
53
53
  "@element-plus/icons-vue": "^2.1.0",
54
54
  "@rollup/plugin-babel": "^6.0.3",
@@ -74,12 +74,12 @@
74
74
  "lint-staged": "^13.2.0",
75
75
  "lodash": "^4.17.21",
76
76
  "markdown-it": "^13.0.1",
77
- "rollup": "^3.20.0",
77
+ "rollup": "^3.20.2",
78
78
  "rollup-plugin-filesize": "^10.0.0",
79
- "rollup-plugin-your-function": "^0.5.0",
80
- "terser": "^5.16.6",
79
+ "rollup-plugin-your-function": "^0.5.1",
80
+ "terser": "^5.16.8",
81
81
  "typescript": "^5.0.2",
82
82
  "unplugin-element-plus": "^0.7.0",
83
- "vitepress": "^1.0.0-alpha.61"
83
+ "vitepress": "^1.0.0-alpha.62"
84
84
  }
85
85
  }