watermark-js-plus 0.9.8 → 0.9.9

package/dist/index.cjs.min.js

@@ -1 +1 @@
-"use strict";var t=function(e,i){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])},t(e,i)};function e(t,e,i,a){return new(i||(i=Promise))((function(n,o){function r(t){try{l(a.next(t))}catch(t){o(t)}}function s(t){try{l(a.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?n(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,s)}l((a=a.apply(t,e||[])).next())}))}function i(t,e){var i,a,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(i)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(r=0)),r;)try{if(i=1,a&&(n=2&s[0]?a.return:s[0]?a.throw||((n=a.return)&&n.call(a),0):a.next)&&!(n=n.call(a,s[1])).done)return n;switch(a=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++,a=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],a=0}finally{i=n=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,l])}}}var a=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,i){void 0===e&&(e={}),void 0===i&&(i="http://www.w3.org/2000/svg");var a=document.createElementNS(i,t);for(var n in e)a.setAttribute(n,e[n]);return a},s=function(t,e){return o(t)?e:t},l=function(t,e,i){void 0===e&&(e=void 0),void 0===i&&(i=void 0);var a=new Image;return a.setAttribute("crossOrigin","Anonymous"),!o(e)&&(a.width=e),!o(i)&&(a.height=i),a.src=t,new Promise((function(t){a.onload=function(){t(a)}}))},d={width:300,height:300,rotate:45,layout:"default",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,i){var a=t.getContext("2d");if(null===a)throw new Error("get context error");a.font="".concat(e.fontStyle," ").concat(e.fontVariant," ").concat(e.fontWeight," ").concat(e.fontSize," ").concat(e.fontFamily),a.filter=e.filter,(null==e?void 0:e.rotate)&&(e.rotate=(360-e.rotate%360)*(Math.PI/180)),o(i.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,i){for(var a=[],n="",o=0,r=e.length;o<r;o++)n+=e.charAt(o),t.measureText(n).width>i&&(a.push(n.substring(0,n.length-1)),n="",o--);return a.push(n),a}(a,e.content,e.textRowMaxWidth)}var r=e.width/2,s=e.height/2,l="middle",d="center";switch(o(null==i?void 0:i.translateX)||o(null==i?void 0:i.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==i?void 0:i.translateX,s=null==i?void 0:i.translateY,l="top",d="left"),i.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==i?void 0:i.textBaseline)&&(e.textBaseline=l),o(null==i?void 0:i.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(t,e){var i,a,n,o,r,s;this.options=t,this.partialWidth=this.options.width,this.partialHeight=this.options.height,this.rows=(null===(i=this.options.gridLayoutOptions)||void 0===i?void 0:i.rows)||1,this.cols=(null===(a=this.options.gridLayoutOptions)||void 0===a?void 0:a.cols)||1,this.matrix=(null===(n=this.options.gridLayoutOptions)||void 0===n?void 0:n.matrix)||(o=this.rows,r=this.cols,s=1,Array.from({length:o},(function(){return new Array(r).fill(s)}))),this.partialCanvas=e}return t.prototype.draw=function(){for(var t=v.createCanvas(this.partialWidth*this.rows,this.partialHeight*this.cols),e=t.getContext("2d"),i=0;i<this.rows;i++)for(var a=0;a<this.cols;a++)this.matrix[i][a]&&(null==e||e.drawImage(this.partialCanvas,this.partialWidth*i,this.partialHeight*a,this.partialWidth,this.partialHeight));return t},t}(),v=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 i,a=window.devicePixelRatio||1,n=document.createElement("canvas");return n.width=t*a,n.height=e*a,n.style.width="".concat(t,"px"),n.style.height="".concat(e,"px"),null===(i=n.getContext("2d"))||void 0===i||i.setTransform(a,0,0,a,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,r,s,l,d;return e(this,void 0,void 0,(function(){var e,c,v,u;return i(this,(function(i){switch(i.label){case 0:return this.validateUnique()&&this.validateContent()?(e=o(this.watermarkDom),[4,this.draw()]):[2];case 1:if(i.sent(),this.layoutCanvas=(p=this.options,m=this.canvas,"grid"===p.layout?new h(p,m).draw():m),c=a(this.layoutCanvas),this.clearCanvas(),this.watermarkDom=document.createElement("div"),v=document.createElement("div"),this.watermarkDom.__WATERMARK__="watermark",this.watermarkDom.__WATERMARK__INSTANCE__=this,u=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"===u?"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    "),v.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"===u?"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(c,")!important;background-repeat:").concat(this.options.backgroundRepeat,"!important;\n      background-size:").concat(this.options.width*((null===(t=this.options.gridLayoutOptions)||void 0===t?void 0:t.rows)||1),"px ").concat(this.options.height*((null===(n=this.options.gridLayoutOptions)||void 0===n?void 0:n.cols)||1),"px!important;background-position:").concat(this.options.backgroundPosition,"!important;\n    "),this.watermarkDom.append(v),this.parentElement.appendChild(this.watermarkDom),this.options.mutationObserve)try{this.bindMutationObserve()}catch(t){null===(s=(r=this.options).onObserveError)||void 0===s||s.call(r)}return e&&(null===(d=(l=this.options).onSuccess)||void 0===d||d.call(l)),[2]}var p,m}))}))},t.prototype.destroy=function(){var t,e,i,a,n,r,s;null===(e=(t=this.options).onBeforeDestroy)||void 0===e||e.call(t),null===(i=this.observer)||void 0===i||i.disconnect(),null===(a=this.parentObserve)||void 0===a||a.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(){return e(this,void 0,void 0,(function(){return i(this,(function(t){switch(t.label){case 0:return document.body.contains(this.watermarkDom)?[3,2]:(this.destroy(),[4,this.create()]);case 1:t.sent(),t.label=2;case 2:return[2]}}))}))},t.prototype.initConfigData=function(e,i){var a=this;void 0===i&&(i="overwrite"),this.props=e,"overwrite"===i?this.options=Object.assign({},d,e):Object.keys(e).forEach((function(t){a.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(i){switch(t.options.contentType){case"text":t.drawText(e,i);break;case"image":t.drawImage(e,i);break;case"multi-line-text":t.drawMultiLineText(e,i);break;case"rich-text":t.drawRichText(e,i)}}))},t.prototype.setStyle=function(t){var e,i="fillStyle";"stroke"===this.options.textType&&(i="strokeStyle");var a=this.options.fontColor;if(null===(e=this.options)||void 0===e?void 0:e.advancedStyle)switch(this.options.advancedStyle.type){case"linear":a=this.createLinearGradient(t);break;case"radial":a=this.createRadialGradient(t);break;case"conic":a=this.createConicGradient(t);break;case"pattern":a=this.createPattern(t)}t[i]&&a&&(t[i]=a),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,i,a,n,o,r,l,d,c,h,v,u,p,m,y,f=t.createLinearGradient(s(null===(a=null===(i=null===(e=this.options.advancedStyle)||void 0===e?void 0:e.params)||void 0===i?void 0:i.linear)||void 0===a?void 0:a.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===(u=null===(v=null===(h=this.options.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.linear)||void 0===u?void 0:u.y1,0));return null===(y=null===(m=null===(p=this.options)||void 0===p?void 0:p.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,i,a,n,o,r,l,d,c,h,v,u,p,m,y,f=t.createConicGradient(s(null===(n=null===(a=null===(i=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===i?void 0:i.params)||void 0===a?void 0:a.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===(u=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===u?void 0:u.y,this.recommendOptions.advancedStyleParams.conic.y));return null===(y=null===(m=null===(p=this.options)||void 0===p?void 0:p.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,i,a,n,o,r,l,d,c,h,v,u,p,m,y,f,g,w,x,b,S,P,k,O,L,C,E,T=t.createRadialGradient(s(null===(n=null===(a=null===(i=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===i?void 0:i.params)||void 0===a?void 0:a.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===(u=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===u?void 0:u.r0,this.recommendOptions.advancedStyleParams.radial.r0),s(null===(f=null===(y=null===(m=null===(p=this.options)||void 0===p?void 0:p.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===(x=null===(w=null===(g=this.options)||void 0===g?void 0:g.advancedStyle)||void 0===w?void 0:w.params)||void 0===x?void 0:x.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===(E=null===(C=null===(L=this.options)||void 0===L?void 0:L.advancedStyle)||void 0===C?void 0:C.colorStops)||void 0===E||E.forEach((function(t){T.addColorStop(t.offset,t.color)})),T},t.prototype.createPattern=function(t){var e,i,a,n,o,r,s,l;return t.createPattern(null===(n=null===(a=null===(i=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===i?void 0:i.params)||void 0===a?void 0:a.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 i="fillText";"stroke"===this.options.textType&&(i="strokeText"),t[i]&&t[i](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 i=this;l(this.options.image).then((function(a){var n=i.getImageRect(a),o=n.width,r=n.height,s=i.getDrawImagePosition(o,r);t.drawImage(a,s.x,s.y,o,r),e(t.canvas)}))},t.prototype.drawMultiLineText=function(t,e){var i=this,a=this.recommendOptions.textLine.data,n=this.recommendOptions.textLine.yOffsetValue;a.forEach((function(e,a){i.setText(t,{text:e,x:0,y:i.options.lineHeight*a-n})})),e(t.canvas)},t.prototype.drawRichText=function(t,e){var i,a,n=this,o=function(t,e){var i=r("svg",{xmlns:"http://www.w3.org/2000/svg"}),a=document.createElement("div");a.setAttribute("xmlns","http://www.w3.org/1999/xhtml"),a.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"),a.innerHTML='<div class="rich-text-content">'.concat(e.content,"</div>"),document.body.appendChild(a);var n=a.querySelector(".rich-text-content"),o=n.offsetHeight,s=n.offsetWidth;document.body.removeChild(a);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(a),i.appendChild(c),{element:i,width:l,height:d}}(t,this.options);l((i=o.element,a=i.outerHTML.replace(/\n/g,"").replace(/\t/g,"").replace(/#/g,"%23"),"data:image/svg+xml;charset=utf-8,".concat(a)),o.width,o.height).then((function(i){var a=n.getDrawImagePosition(i.width,i.height);t.drawImage(i,a.x,a.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 i,a,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===(i=this.props)||void 0===i?void 0:i.translateX)&&(n.x=0),!o(null===(a=this.props)||void 0===a?void 0:a.translateY)&&(n.y=0),n},t.prototype.checkParentElementType=function(){return["html","body"].includes(this.parentElement.tagName.toLocaleLowerCase())?"root":"custom"},t.prototype.checkWatermarkElement=function(){return e(this,void 0,void 0,(function(){return i(this,(function(t){switch(t.label){case 0:return document.body.contains(this.watermarkDom)?[3,2]:(this.destroy(),[4,this.create()]);case 1:t.sent(),t.label=2;case 2:return this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this)),[2]}}))}))},t.prototype.bindMutationObserve=function(){var t=this;this.watermarkDom&&(this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this)),this.observer=new MutationObserver((function(a){return e(t,void 0,void 0,(function(){return i(this,(function(t){switch(t.label){case 0:return a.length>0?(this.destroy(),[4,this.create()]):[3,2];case 1:t.sent(),t.label=2;case 2:return[2]}}))}))})),this.observer.observe(this.watermarkDom,{attributes:!0,childList:!0,subtree:!0,characterData:!0}),this.parentObserve=new MutationObserver((function(a){return e(t,void 0,void 0,(function(){var t,e,n,o;return i(this,(function(i){switch(i.label){case 0:t=0,e=a,i.label=1;case 1:return t<e.length?(null==(n=e[t])?void 0:n.target)===this.watermarkDom||(null===(o=null==n?void 0:n.removedNodes)||void 0===o?void 0:o[0])===this.watermarkDom||"childList"===n.type&&n.target===this.parentElement&&n.target.lastChild!==this.watermarkDom?(this.destroy(),[4,this.create()]):[3,3]:[3,4];case 2:i.sent(),i.label=3;case 3:return t++,[3,1];case 4:return[2]}}))}))})),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}(),u=function(e){function i(t){return void 0===t&&(t={}),t.globalAlpha=.005,t.mode="blind",e.call(this,t)||this}return function(e,i){if("function"!=typeof i&&null!==i)throw new TypeError("Class extends value "+String(i)+" is not a constructor or null");function a(){this.constructor=e}t(e,i),e.prototype=null===i?Object.create(i):(a.prototype=i.prototype,new a)}(i,e),i.decode=function(t){var e=Object.assign({url:"",fillColor:"#000",compositeOperation:"color-burn",mode:"canvas"},t);if(e.url&&"canvas"===e.mode){var i=new Image;i.src=e.url,i.onload=function(){var t,o=i.width,r=i.height,s=v.createCanvas(o,r),l=s.getContext("2d");if(null===l)throw new Error("get context error");l.drawImage(i,0,0,o,r),l.globalCompositeOperation=e.compositeOperation,l.fillStyle=e.fillColor,l.fillRect(0,0,o,r);var d=a(s);e.onSuccess&&n(e.onSuccess)&&(null===(t=e.onSuccess)||void 0===t||t.call(e,d))}}},i}(v);exports.BlindWatermark=u,exports.Watermark=v;
+"use strict";var t=function(e,i){return t=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(t[i]=e[i])},t(e,i)};function e(t,e,i,a){return new(i||(i=Promise))((function(n,o){function r(t){try{l(a.next(t))}catch(t){o(t)}}function s(t){try{l(a.throw(t))}catch(t){o(t)}}function l(t){var e;t.done?n(t.value):(e=t.value,e instanceof i?e:new i((function(t){t(e)}))).then(r,s)}l((a=a.apply(t,e||[])).next())}))}function i(t,e){var i,a,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(i)throw new TypeError("Generator is already executing.");for(;o&&(o=0,s[0]&&(r=0)),r;)try{if(i=1,a&&(n=2&s[0]?a.return:s[0]?a.throw||((n=a.return)&&n.call(a),0):a.next)&&!(n=n.call(a,s[1])).done)return n;switch(a=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++,a=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],a=0}finally{i=n=0}if(5&s[0])throw s[1];return{value:s[0]?s[1]:void 0,done:!0}}([s,l])}}}var a=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,i){void 0===e&&(e={}),void 0===i&&(i="http://www.w3.org/2000/svg");var a=document.createElementNS(i,t);for(var n in e)a.setAttribute(n,e[n]);return a},s=function(t,e){return o(t)?e:t},l=function(t,e,i){void 0===e&&(e=void 0),void 0===i&&(i=void 0);var a=new Image;return a.setAttribute("crossOrigin","Anonymous"),!o(e)&&(a.width=e),!o(i)&&(a.height=i),a.src=t,new Promise((function(t){a.onload=function(){t(a)}}))},d={width:300,height:300,rotate:45,layout:"default",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,i){var a=t.getContext("2d");if(null===a)throw new Error("get context error");a.font="".concat(e.fontStyle," ").concat(e.fontVariant," ").concat(e.fontWeight," ").concat(e.fontSize," ").concat(e.fontFamily),a.filter=e.filter,(null==e?void 0:e.rotate)&&(e.rotate=(360-e.rotate%360)*(Math.PI/180)),o(i.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,i){for(var a=[],n="",o=0,r=e.length;o<r;o++)n+=e.charAt(o),t.measureText(n).width>i&&(a.push(n.substring(0,n.length-1)),n="",o--);return a.push(n),a}(a,e.content,e.textRowMaxWidth)}var r=e.width/2,s=e.height/2,l="middle",d="center";switch(o(null==i?void 0:i.translateX)||o(null==i?void 0:i.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==i?void 0:i.translateX,s=null==i?void 0:i.translateY,l="top",d="left"),i.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==i?void 0:i.textBaseline)&&(e.textBaseline=l),o(null==i?void 0:i.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(t,e){var i,a,n,o,r,s,l;this.options=t,this.partialWidth=this.options.width,this.partialHeight=this.options.height,this.rows=(null===(i=this.options.gridLayoutOptions)||void 0===i?void 0:i.rows)||1,this.cols=(null===(a=this.options.gridLayoutOptions)||void 0===a?void 0:a.cols)||1,this.matrix=(null===(n=this.options.gridLayoutOptions)||void 0===n?void 0:n.matrix)||(r=this.rows,s=this.cols,l=1,Array.from({length:r},(function(){return new Array(s).fill(l)}))),this.gap=(null===(o=this.options.gridLayoutOptions)||void 0===o?void 0:o.gap)||[0,0],this.partialCanvas=e}return t.prototype.draw=function(){for(var t,e,i=v.createCanvas(this.partialWidth*this.cols+this.gap[0]*this.cols,this.partialHeight*this.rows+this.gap[1]*this.rows),a=i.getContext("2d"),n=0;n<this.rows;n++)for(var o=0;o<this.cols;o++)(null===(e=null===(t=this.matrix)||void 0===t?void 0:t[n])||void 0===e?void 0:e[o])&&(null==a||a.drawImage(this.partialCanvas,this.partialWidth*o+this.gap[0]*o,this.partialHeight*n+this.gap[1]*n,this.partialWidth,this.partialHeight));return i},t}(),v=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 i,a=window.devicePixelRatio||1,n=document.createElement("canvas");return n.width=t*a,n.height=e*a,n.style.width="".concat(t,"px"),n.style.height="".concat(e,"px"),null===(i=n.getContext("2d"))||void 0===i||i.setTransform(a,0,0,a,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,r,s;return e(this,void 0,void 0,(function(){var e,l,d,c,v;return i(this,(function(i){switch(i.label){case 0:return this.validateUnique()&&this.validateContent()?(e=o(this.watermarkDom),[4,this.draw()]):[2];case 1:if(i.sent(),this.layoutCanvas=(u=this.options,p=this.canvas,"grid"===u.layout?new h(u,p).draw():p),l=a(this.layoutCanvas),this.clearCanvas(),this.watermarkDom=document.createElement("div"),d=document.createElement("div"),this.watermarkDom.__WATERMARK__="watermark",this.watermarkDom.__WATERMARK__INSTANCE__=this,c=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"===c?"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    "),v=function(t){var e,i,a;if("grid"===t.layout){var n=(null===(e=t.gridLayoutOptions)||void 0===e?void 0:e.cols)||1,o=(null===(i=t.gridLayoutOptions)||void 0===i?void 0:i.rows)||1,r=(null===(a=t.gridLayoutOptions)||void 0===a?void 0:a.gap)||[0,0];return[t.width*n+r[0]*n,t.height*o+r[1]*o]}return[t.width,t.height]}(this.options),d.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"===c?"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(l,")!important;background-repeat:").concat(this.options.backgroundRepeat,"!important;\n      background-size:").concat(v[0],"px ").concat(v[1],"px!important;background-position:").concat(this.options.backgroundPosition,"!important;\n    "),this.watermarkDom.append(d),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 e&&(null===(s=(r=this.options).onSuccess)||void 0===s||s.call(r)),[2]}var u,p}))}))},t.prototype.destroy=function(){var t,e,i,a,n,r,s;null===(e=(t=this.options).onBeforeDestroy)||void 0===e||e.call(t),null===(i=this.observer)||void 0===i||i.disconnect(),null===(a=this.parentObserve)||void 0===a||a.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(){return e(this,void 0,void 0,(function(){return i(this,(function(t){switch(t.label){case 0:return document.body.contains(this.watermarkDom)?[3,2]:(this.destroy(),[4,this.create()]);case 1:t.sent(),t.label=2;case 2:return[2]}}))}))},t.prototype.initConfigData=function(e,i){var a=this;void 0===i&&(i="overwrite"),this.props=e,"overwrite"===i?this.options=Object.assign({},d,e):Object.keys(e).forEach((function(t){a.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(i){switch(t.options.contentType){case"text":t.drawText(e,i);break;case"image":t.drawImage(e,i);break;case"multi-line-text":t.drawMultiLineText(e,i);break;case"rich-text":t.drawRichText(e,i)}}))},t.prototype.setStyle=function(t){var e,i="fillStyle";"stroke"===this.options.textType&&(i="strokeStyle");var a=this.options.fontColor;if(null===(e=this.options)||void 0===e?void 0:e.advancedStyle)switch(this.options.advancedStyle.type){case"linear":a=this.createLinearGradient(t);break;case"radial":a=this.createRadialGradient(t);break;case"conic":a=this.createConicGradient(t);break;case"pattern":a=this.createPattern(t)}t[i]&&a&&(t[i]=a),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,i,a,n,o,r,l,d,c,h,v,u,p,m,y,g=t.createLinearGradient(s(null===(a=null===(i=null===(e=this.options.advancedStyle)||void 0===e?void 0:e.params)||void 0===i?void 0:i.linear)||void 0===a?void 0:a.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===(u=null===(v=null===(h=this.options.advancedStyle)||void 0===h?void 0:h.params)||void 0===v?void 0:v.linear)||void 0===u?void 0:u.y1,0));return null===(y=null===(m=null===(p=this.options)||void 0===p?void 0:p.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,i,a,n,o,r,l,d,c,h,v,u,p,m,y,g=t.createConicGradient(s(null===(n=null===(a=null===(i=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===i?void 0:i.params)||void 0===a?void 0:a.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===(u=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===u?void 0:u.y,this.recommendOptions.advancedStyleParams.conic.y));return null===(y=null===(m=null===(p=this.options)||void 0===p?void 0:p.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,i,a,n,o,r,l,d,c,h,v,u,p,m,y,g,f,w,x,b,S,P,k,O,L,C,E,T=t.createRadialGradient(s(null===(n=null===(a=null===(i=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===i?void 0:i.params)||void 0===a?void 0:a.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===(u=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===u?void 0:u.r0,this.recommendOptions.advancedStyleParams.radial.r0),s(null===(g=null===(y=null===(m=null===(p=this.options)||void 0===p?void 0:p.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),s(null===(b=null===(x=null===(w=null===(f=this.options)||void 0===f?void 0:f.advancedStyle)||void 0===w?void 0:w.params)||void 0===x?void 0:x.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===(E=null===(C=null===(L=this.options)||void 0===L?void 0:L.advancedStyle)||void 0===C?void 0:C.colorStops)||void 0===E||E.forEach((function(t){T.addColorStop(t.offset,t.color)})),T},t.prototype.createPattern=function(t){var e,i,a,n,o,r,s,l;return t.createPattern(null===(n=null===(a=null===(i=null===(e=this.options)||void 0===e?void 0:e.advancedStyle)||void 0===i?void 0:i.params)||void 0===a?void 0:a.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 i="fillText";"stroke"===this.options.textType&&(i="strokeText"),t[i]&&t[i](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 i=this;l(this.options.image).then((function(a){var n=i.getImageRect(a),o=n.width,r=n.height,s=i.getDrawImagePosition(o,r);t.drawImage(a,s.x,s.y,o,r),e(t.canvas)}))},t.prototype.drawMultiLineText=function(t,e){var i=this,a=this.recommendOptions.textLine.data,n=this.recommendOptions.textLine.yOffsetValue;a.forEach((function(e,a){i.setText(t,{text:e,x:0,y:i.options.lineHeight*a-n})})),e(t.canvas)},t.prototype.drawRichText=function(t,e){var i,a,n=this,o=function(t,e){var i=r("svg",{xmlns:"http://www.w3.org/2000/svg"}),a=document.createElement("div");a.setAttribute("xmlns","http://www.w3.org/1999/xhtml"),a.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"),a.innerHTML='<div class="rich-text-content">'.concat(e.content,"</div>"),document.body.appendChild(a);var n=a.querySelector(".rich-text-content"),o=n.offsetHeight,s=n.offsetWidth;document.body.removeChild(a);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(a),i.appendChild(c),{element:i,width:l,height:d}}(t,this.options);l((i=o.element,a=i.outerHTML.replace(/\n/g,"").replace(/\t/g,"").replace(/#/g,"%23"),"data:image/svg+xml;charset=utf-8,".concat(a)),o.width,o.height).then((function(i){var a=n.getDrawImagePosition(i.width,i.height);t.drawImage(i,a.x,a.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 i,a,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===(i=this.props)||void 0===i?void 0:i.translateX)&&(n.x=0),!o(null===(a=this.props)||void 0===a?void 0:a.translateY)&&(n.y=0),n},t.prototype.checkParentElementType=function(){return["html","body"].includes(this.parentElement.tagName.toLocaleLowerCase())?"root":"custom"},t.prototype.checkWatermarkElement=function(){return e(this,void 0,void 0,(function(){return i(this,(function(t){switch(t.label){case 0:return document.body.contains(this.watermarkDom)?[3,2]:(this.destroy(),[4,this.create()]);case 1:t.sent(),t.label=2;case 2:return this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this)),[2]}}))}))},t.prototype.bindMutationObserve=function(){var t=this;this.watermarkDom&&(this.checkWatermarkElementRequestID=requestAnimationFrame(this.checkWatermarkElement.bind(this)),this.observer=new MutationObserver((function(a){return e(t,void 0,void 0,(function(){return i(this,(function(t){switch(t.label){case 0:return a.length>0?(this.destroy(),[4,this.create()]):[3,2];case 1:t.sent(),t.label=2;case 2:return[2]}}))}))})),this.observer.observe(this.watermarkDom,{attributes:!0,childList:!0,subtree:!0,characterData:!0}),this.parentObserve=new MutationObserver((function(a){return e(t,void 0,void 0,(function(){var t,e,n,o;return i(this,(function(i){switch(i.label){case 0:t=0,e=a,i.label=1;case 1:return t<e.length?(null==(n=e[t])?void 0:n.target)===this.watermarkDom||(null===(o=null==n?void 0:n.removedNodes)||void 0===o?void 0:o[0])===this.watermarkDom||"childList"===n.type&&n.target===this.parentElement&&n.target.lastChild!==this.watermarkDom?(this.destroy(),[4,this.create()]):[3,3]:[3,4];case 2:i.sent(),i.label=3;case 3:return t++,[3,1];case 4:return[2]}}))}))})),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}(),u=function(e){function i(t){return void 0===t&&(t={}),t.globalAlpha=.005,t.mode="blind",e.call(this,t)||this}return function(e,i){if("function"!=typeof i&&null!==i)throw new TypeError("Class extends value "+String(i)+" is not a constructor or null");function a(){this.constructor=e}t(e,i),e.prototype=null===i?Object.create(i):(a.prototype=i.prototype,new a)}(i,e),i.decode=function(t){var e=Object.assign({url:"",fillColor:"#000",compositeOperation:"color-burn",mode:"canvas"},t);if(e.url&&"canvas"===e.mode){var i=new Image;i.src=e.url,i.onload=function(){var t,o=i.width,r=i.height,s=v.createCanvas(o,r),l=s.getContext("2d");if(null===l)throw new Error("get context error");l.drawImage(i,0,0,o,r),l.globalCompositeOperation=e.compositeOperation,l.fillStyle=e.fillColor,l.fillRect(0,0,o,r);var d=a(s);e.onSuccess&&n(e.onSuccess)&&(null===(t=e.onSuccess)||void 0===t||t.call(e,d))}}},i}(v);exports.BlindWatermark=u,exports.Watermark=v;

package/dist/index.esm.js

@@ -444,24 +444,26 @@ var bootstrap = (function () {
 
 var GridLayout = /** @class */ (function () {
     function GridLayout(args, partialCanvas) {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         this.options = args;
         this.partialWidth = this.options.width;
         this.partialHeight = this.options.height;
         this.rows = ((_a = this.options.gridLayoutOptions) === null || _a === void 0 ? void 0 : _a.rows) || 1;
         this.cols = ((_b = this.options.gridLayoutOptions) === null || _b === void 0 ? void 0 : _b.cols) || 1;
         this.matrix = ((_c = this.options.gridLayoutOptions) === null || _c === void 0 ? void 0 : _c.matrix) || generateMatrix(this.rows, this.cols, 1);
+        this.gap = ((_d = this.options.gridLayoutOptions) === null || _d === void 0 ? void 0 : _d.gap) || [0, 0];
         this.partialCanvas = partialCanvas;
     }
     GridLayout.prototype.draw = function () {
-        var layoutCanvas = Watermark.createCanvas(this.partialWidth * this.rows, this.partialHeight * this.cols);
+        var _a, _b;
+        var layoutCanvas = Watermark.createCanvas(this.partialWidth * this.cols + this.gap[0] * this.cols, this.partialHeight * this.rows + this.gap[1] * this.rows);
         var layoutContext = layoutCanvas.getContext('2d');
         for (var rowIndex = 0; rowIndex < this.rows; rowIndex++) {
             for (var colIndex = 0; colIndex < this.cols; colIndex++) {
-                if (!this.matrix[rowIndex][colIndex]) {
+                if (!((_b = (_a = this.matrix) === null || _a === void 0 ? void 0 : _a[rowIndex]) === null || _b === void 0 ? void 0 : _b[colIndex])) {
                     continue;
                 }
-                layoutContext === null || layoutContext === void 0 ? void 0 : layoutContext.drawImage(this.partialCanvas, this.partialWidth * rowIndex, this.partialHeight * colIndex, this.partialWidth, this.partialHeight);
+                layoutContext === null || layoutContext === void 0 ? void 0 : layoutContext.drawImage(this.partialCanvas, this.partialWidth * colIndex + this.gap[0] * colIndex, this.partialHeight * rowIndex + this.gap[1] * rowIndex, this.partialWidth, this.partialHeight);
             }
         }
         return layoutCanvas;
@@ -477,6 +479,26 @@ var renderLayout = function (options, partialCanvas) {
             return partialCanvas;
     }
 };
+var generateBackgroundSize = function (options) {
+    var _a, _b, _c;
+    switch (options.layout) {
+        case 'grid':
+            {
+                var cols = ((_a = options.gridLayoutOptions) === null || _a === void 0 ? void 0 : _a.cols) || 1;
+                var rows = ((_b = options.gridLayoutOptions) === null || _b === void 0 ? void 0 : _b.rows) || 1;
+                var gap = ((_c = options.gridLayoutOptions) === null || _c === void 0 ? void 0 : _c.gap) || [0, 0];
+                return [
+                    options.width * cols + gap[0] * cols,
+                    options.height * rows + gap[1] * rows
+                ];
+            }
+        default:
+            return [
+                options.width,
+                options.height
+            ];
+    }
+};
 
 /**
  * Watermark class
@@ -521,11 +543,11 @@ var Watermark = /** @class */ (function () {
      * Creating a watermark.
      */
     Watermark.prototype.create = function () {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d;
         return __awaiter(this, void 0, void 0, function () {
-            var firstDraw, image, watermarkInnerDom, parentElementType;
-            return __generator(this, function (_g) {
-                switch (_g.label) {
+            var firstDraw, image, watermarkInnerDom, parentElementType, backgroundSize;
+            return __generator(this, function (_e) {
+                switch (_e.label) {
                     case 0:
                         if (!this.validateUnique()) {
                             return [2 /*return*/];
@@ -536,7 +558,7 @@ var Watermark = /** @class */ (function () {
                         firstDraw = isUndefined(this.watermarkDom);
                         return [4 /*yield*/, this.draw()];
                     case 1:
-                        _g.sent();
+                        _e.sent();
                         this.layoutCanvas = renderLayout(this.options, this.canvas);
                         image = convertImage(this.layoutCanvas);
                         this.clearCanvas();
@@ -546,7 +568,8 @@ var Watermark = /** @class */ (function () {
                         this.watermarkDom.__WATERMARK__INSTANCE__ = this;
                         parentElementType = this.checkParentElementType();
                         this.watermarkDom.style.cssText = "\n      z-index: ".concat(this.options.zIndex, "!important;display:block!important;visibility:visible!important;transform:none!important;scale:none!important;\n      ").concat(parentElementType === 'custom' ? 'top:0!important;bottom:0!important;left:0!important;right:0!important;height:100%!important;pointer-events:none!important;position:absolute!important;' : 'position:relative!important;', "\n    ");
-                        watermarkInnerDom.style.cssText = "\n      display:block!important;visibility:visible!important;pointer-events:none;top:0;bottom:0;left:0;right:0;transform:none!important;scale:none!important;\n      position:".concat(parentElementType === 'root' ? 'fixed' : 'absolute', "!important;-webkit-print-color-adjust:exact!important;width:100%!important;height:100%!important;\n      z-index:").concat(this.options.zIndex, "!important;background-image:url(").concat(image, ")!important;background-repeat:").concat(this.options.backgroundRepeat, "!important;\n      background-size:").concat(this.options.width * (((_a = this.options.gridLayoutOptions) === null || _a === void 0 ? void 0 : _a.rows) || 1), "px ").concat(this.options.height * (((_b = this.options.gridLayoutOptions) === null || _b === void 0 ? void 0 : _b.cols) || 1), "px!important;background-position:").concat(this.options.backgroundPosition, "!important;\n    ");
+                        backgroundSize = generateBackgroundSize(this.options);
+                        watermarkInnerDom.style.cssText = "\n      display:block!important;visibility:visible!important;pointer-events:none;top:0;bottom:0;left:0;right:0;transform:none!important;scale:none!important;\n      position:".concat(parentElementType === 'root' ? 'fixed' : 'absolute', "!important;-webkit-print-color-adjust:exact!important;width:100%!important;height:100%!important;\n      z-index:").concat(this.options.zIndex, "!important;background-image:url(").concat(image, ")!important;background-repeat:").concat(this.options.backgroundRepeat, "!important;\n      background-size:").concat(backgroundSize[0], "px ").concat(backgroundSize[1], "px!important;background-position:").concat(this.options.backgroundPosition, "!important;\n    ");
                         this.watermarkDom.append(watermarkInnerDom);
                         this.parentElement.appendChild(this.watermarkDom);
                         if (this.options.mutationObserve) {
@@ -554,10 +577,10 @@ var Watermark = /** @class */ (function () {
                                 this.bindMutationObserve();
                             }
                             catch (e) {
-                                (_d = (_c = this.options).onObserveError) === null || _d === void 0 ? void 0 : _d.call(_c);
+                                (_b = (_a = this.options).onObserveError) === null || _b === void 0 ? void 0 : _b.call(_a);
                             }
                         }
-                        firstDraw && ((_f = (_e = this.options).onSuccess) === null || _f === void 0 ? void 0 : _f.call(_e));
+                        firstDraw && ((_d = (_c = this.options).onSuccess) === null || _d === void 0 ? void 0 : _d.call(_c));
                         return [2 /*return*/];
                 }
             });