UNPKG

@towavephone/react-watermark-component

Version:

react-watermark-component is a component that can generate a water mark background image.

85 lines (72 loc) 11 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } var SecurityDefense = function SecurityDefense(watermarkDOM, style, securityHooks) { var _this = this; _classCallCheck(this, SecurityDefense); this.getDOM = function (id) { return document.getElementById(id); }; this.registerNodeRemoveListener = function (target) { var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver; var observer = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { if (mutation.type === 'childList') { var removeNodes = mutation.removedNodes; if (removeNodes && removeNodes[0] && removeNodes[0].id) { var id = removeNodes[0].id; if (id && id.indexOf(_this.watermarkId) > -1) { if (_this.securityAlarm) { _this.securityAlarm(); } _this.createWaterMarkDom(target); } } } }); }); var config = { childList: true }; observer.observe(target, config); _this.updateObserver({ DOMRemoveObserver: observer }); }; this.createWaterMarkDom = function (parent) { var newWaterMark = document.createElement('div'); _this.watermarkId = _this.genRandomId('water-mark-dynamic'); newWaterMark.id = _this.watermarkId; _this.waterMarkStyle = _this.waterMarkStyle.concat('background-image: url("' + _this.getImageUrl() + '");'); newWaterMark.style = _this.waterMarkStyle; parent.appendChild(newWaterMark); var newDOM = _this.getDOM(_this.watermarkId); _this.registerNodeAttrChangeListener(newDOM); }; this.registerNodeAttrChangeListener = function (target) { var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver; var observer = new MutationObserver(function (mutations) { mutations.forEach(function (mutation) { if (mutation.type === 'attributes') { target.parentNode.removeChild(target); observer.disconnect(); } }); }); var config = { attributes: true, attributeFilter: ['style'] }; observer.observe(target, config); _this.updateObserver({ DOMAttrModifiedObserver: observer }); }; this.watermarkId = watermarkDOM.watermarkId; this.watermarkWrapperId = watermarkDOM.watermarkWrapperId; this.genRandomId = watermarkDOM.genRandomId; this.waterMarkStyle = style.waterMarkStyle; this.getImageUrl = style.getCanvasUrl; this.securityAlarm = securityHooks.securityAlarm; this.updateObserver = securityHooks.updateObserver; var wrapper = this.getDOM(this.watermarkWrapperId); var watermark = this.getDOM(this.watermarkId); this.registerNodeRemoveListener(wrapper); this.registerNodeAttrChangeListener(watermark); }; exports.default = SecurityDefense; module.exports = exports['default']; //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9TZWN1cml0eURlZmVuc2UuanMiXSwibmFtZXMiOlsiU2VjdXJpdHlEZWZlbnNlIiwid2F0ZXJtYXJrRE9NIiwic3R5bGUiLCJzZWN1cml0eUhvb2tzIiwiZ2V0RE9NIiwiaWQiLCJkb2N1bWVudCIsImdldEVsZW1lbnRCeUlkIiwicmVnaXN0ZXJOb2RlUmVtb3ZlTGlzdGVuZXIiLCJ0YXJnZXQiLCJNdXRhdGlvbk9ic2VydmVyIiwid2luZG93IiwiV2ViS2l0TXV0YXRpb25PYnNlcnZlciIsIk1vek11dGF0aW9uT2JzZXJ2ZXIiLCJvYnNlcnZlciIsIm11dGF0aW9ucyIsImZvckVhY2giLCJtdXRhdGlvbiIsInR5cGUiLCJyZW1vdmVOb2RlcyIsInJlbW92ZWROb2RlcyIsImluZGV4T2YiLCJ3YXRlcm1hcmtJZCIsInNlY3VyaXR5QWxhcm0iLCJjcmVhdGVXYXRlck1hcmtEb20iLCJjb25maWciLCJjaGlsZExpc3QiLCJvYnNlcnZlIiwidXBkYXRlT2JzZXJ2ZXIiLCJET01SZW1vdmVPYnNlcnZlciIsInBhcmVudCIsIm5ld1dhdGVyTWFyayIsImNyZWF0ZUVsZW1lbnQiLCJnZW5SYW5kb21JZCIsIndhdGVyTWFya1N0eWxlIiwiY29uY2F0IiwiZ2V0SW1hZ2VVcmwiLCJhcHBlbmRDaGlsZCIsIm5ld0RPTSIsInJlZ2lzdGVyTm9kZUF0dHJDaGFuZ2VMaXN0ZW5lciIsInBhcmVudE5vZGUiLCJyZW1vdmVDaGlsZCIsImRpc2Nvbm5lY3QiLCJhdHRyaWJ1dGVzIiwiYXR0cmlidXRlRmlsdGVyIiwiRE9NQXR0ck1vZGlmaWVkT2JzZXJ2ZXIiLCJ3YXRlcm1hcmtXcmFwcGVySWQiLCJnZXRDYW52YXNVcmwiLCJ3cmFwcGVyIiwid2F0ZXJtYXJrIl0sIm1hcHBpbmdzIjoiOzs7Ozs7OztJQUFxQkEsZSxHQUNuQix5QkFBWUMsWUFBWixFQUEwQkMsS0FBMUIsRUFBaUNDLGFBQWpDLEVBQWdEO0FBQUE7O0FBQUE7O0FBQUEsT0FpQmhEQyxNQWpCZ0Qs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R0FBMEI3QyxhQUFhNkMsa0JBQXZDO0FBQ0EsT0FBS2IsV0FBTCxHQUFtQmhDLGFBQWFnQyxXQUFoQzs7QUFFQSxPQUFLQyxjQUFMLEdBQXNCaEMsTUFBTWdDLGNBQTVCO0FBQ0EsT0FBS0UsV0FBTCxHQUFtQmxDLE1BQU02QyxZQUF6Qjs7QUFFQSxPQUFLeEIsYUFBTCxHQUFxQnBCLGNBQWNvQixhQUFuQztBQUNBLE9BQUtLLGNBQUwsR0FBc0J6QixjQUFjeUIsY0FBcEM7O0FBRUEsTUFBTW9CLFVBQVUsS0FBSzVDLE1BQUwsQ0FBWSxLQUFLMEMsa0JBQWpCLENBQWhCO0FBQ0EsTUFBTUcsWUFBWSxLQUFLN0MsTUFBTCxDQUFZLEtBQUtrQixXQUFqQixDQUFsQjtBQUNBLE9BQUtkLDBCQUFMLENBQWdDd0MsT0FBaEM7QUFDQSxPQUFLVCw4QkFBTCxDQUFvQ1UsU0FBcEM7QUFDRCxDOztrQkFoQmtCakQsZSIsImZpbGUiOiJTZWN1cml0eURlZmVuc2UuanMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgZGVmYXVsdCBjbGFzcyBTZWN1cml0eURlZmVuc2Uge1xuICBjb25zdHJ1Y3Rvcih3YXRlcm1hcmtET00sIHN0eWxlLCBzZWN1cml0eUhvb2tzKSB7XG4gICAgdGhpcy53YXRlcm1hcmtJZCA9IHdhdGVybWFya0RPTS53YXRlcm1hcmtJZFxuICAgIHRoaXMud2F0ZXJtYXJrV3JhcHBlcklkID0gd2F0ZXJtYXJrRE9NLndhdGVybWFya1dyYXBwZXJJZFxuICAgIHRoaXMuZ2VuUmFuZG9tSWQgPSB3YXRlcm1hcmtET00uZ2VuUmFuZG9tSWRcblxuICAgIHRoaXMud2F0ZXJNYXJrU3R5bGUgPSBzdHlsZS53YXRlck1hcmtTdHlsZVxuICAgIHRoaXMuZ2V0SW1hZ2VVcmwgPSBzdHlsZS5nZXRDYW52YXNVcmxcblxuICAgIHRoaXMuc2VjdXJpdHlBbGFybSA9IHNlY3VyaXR5SG9va3Muc2VjdXJpdHlBbGFybVxuICAgIHRoaXMudXBkYXRlT2JzZXJ2ZXIgPSBzZWN1cml0eUhvb2tzLnVwZGF0ZU9ic2VydmVyXG5cbiAgICBjb25zdCB3cmFwcGVyID0gdGhpcy5nZXRET00odGhpcy53YXRlcm1hcmtXcmFwcGVySWQpXG4gICAgY29uc3Qgd2F0ZXJtYXJrID0gdGhpcy5nZXRET00odGhpcy53YXRlcm1hcmtJZClcbiAgICB0aGlzLnJlZ2lzdGVyTm9kZVJlbW92ZUxpc3RlbmVyKHdyYXBwZXIpXG4gICAgdGhpcy5yZWdpc3Rlck5vZGVBdHRyQ2hhbmdlTGlzdGVuZXIod2F0ZXJtYXJrKVxuICB9XG5cbiAgZ2V0RE9NID0gKGlkKSA9PiB7XG4gICAgcmV0dXJuIGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKGlkKVxuICB9XG5cbiAgcmVnaXN0ZXJOb2RlUmVtb3ZlTGlzdGVuZXIgPSAodGFyZ2V0KSA9PiB7XG4gICAgbGV0IE11dGF0aW9uT2JzZXJ2ZXIgPSB3aW5kb3cuTXV0YXRpb25PYnNlcnZlciB8fCB3aW5kb3cuV2ViS2l0TXV0YXRpb25PYnNlcnZlciB8fCB3aW5kb3cuTW96TXV0YXRpb25PYnNlcnZlclxuICAgIGxldCBvYnNlcnZlciA9IG5ldyBNdXRhdGlvbk9ic2VydmVyKChtdXRhdGlvbnMpID0+IHtcbiAgICAgIG11dGF0aW9ucy5mb3JFYWNoKChtdXRhdGlvbikgPT4ge1xuICAgICAgICBpZiAobXV0YXRpb24udHlwZSA9PT0gJ2NoaWxkTGlzdCcpIHtcbiAgICAgICAgICBjb25zdCByZW1vdmVOb2RlcyA9IG11dGF0aW9uLnJlbW92ZWROb2Rlc1xuICAgICAgICAgIGlmIChyZW1vdmVOb2RlcyAmJiByZW1vdmVOb2Rlc1swXSAmJiByZW1vdmVOb2Rlc1swXS5pZCkge1xuICAgICAgICAgICAgY29uc3QgaWQgPSByZW1vdmVOb2Rlc1swXS5pZFxuICAgICAgICAgICAgaWYgKGlkICYmIGlkLmluZGV4T2YodGhpcy53YXRlcm1hcmtJZCkgPiAtMSkge1xuICAgICAgICAgICAgICBpZiAodGhpcy5zZWN1cml0eUFsYXJtKSB7XG4gICAgICAgICAgICAgICAgdGhpcy5zZWN1cml0eUFsYXJtKClcbiAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICB0aGlzLmNyZWF0ZVdhdGVyTWFya0RvbSh0YXJnZXQpXG4gICAgICAgICAgICB9XG4gICAgICAgICAgfVxuICAgICAgICB9XG4gICAgICB9KVxuICAgIH0pXG4gICAgbGV0IGNvbmZpZyA9IHsgY2hpbGRMaXN0OiB0cnVlIH1cbiAgICBvYnNlcnZlci5vYnNlcnZlKHRhcmdldCwgY29uZmlnKVxuICAgIHRoaXMudXBkYXRlT2JzZXJ2ZXIoeyBET01SZW1vdmVPYnNlcnZlcjogb2JzZXJ2ZXIgfSlcbiAgfVxuXG4gIGNyZWF0ZVdhdGVyTWFya0RvbSA9IChwYXJlbnQpID0+IHtcbiAgICBjb25zdCBuZXdXYXRlck1hcmsgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdkaXYnKVxuICAgIHRoaXMud2F0ZXJtYXJrSWQgPSB0aGlzLmdlblJhbmRvbUlkKCd3YXRlci1tYXJrLWR5bmFtaWMnKVxuICAgIG5ld1dhdGVyTWFyay5pZCA9IHRoaXMud2F0ZXJtYXJrSWRcbiAgICB0aGlzLndhdGVyTWFya1N0eWxlID0gdGhpcy53YXRlck1hcmtTdHlsZS5jb25jYXQoYGJhY2tncm91bmQtaW1hZ2U6IHVybChcIiR7dGhpcy5nZXRJbWFnZVVybCgpfVwiKTtgKVxuICAgIG5ld1dhdGVyTWFyay5zdHlsZSA9IHRoaXMud2F0ZXJNYXJrU3R5bGVcbiAgICBwYXJlbnQuYXBwZW5kQ2hpbGQobmV3V2F0ZXJNYXJrKVxuICAgIGNvbnN0IG5ld0RPTSA9IHRoaXMuZ2V0RE9NKHRoaXMud2F0ZXJtYXJrSWQpXG4gICAgdGhpcy5yZWdpc3Rlck5vZGVBdHRyQ2hhbmdlTGlzdGVuZXIobmV3RE9NKVxuICB9XG5cbiAgcmVnaXN0ZXJOb2RlQXR0ckNoYW5nZUxpc3RlbmVyID0gKHRhcmdldCkgPT4ge1xuICAgIGxldCBNdXRhdGlvbk9ic2VydmVyID0gd2luZG93Lk11dGF0aW9uT2JzZXJ2ZXIgfHwgd2luZG93LldlYktpdE11dGF0aW9uT2JzZXJ2ZXIgfHwgd2luZG93Lk1vek11dGF0aW9uT2JzZXJ2ZXJcbiAgICBsZXQgb2JzZXJ2ZXIgPSBuZXcgTXV0YXRpb25PYnNlcnZlcigobXV0YXRpb25zKSA9PiB7XG4gICAgICBtdXRhdGlvbnMuZm9yRWFjaCgobXV0YXRpb24pID0+IHtcbiAgICAgICAgaWYgKG11dGF0aW9uLnR5cGUgPT09ICdhdHRyaWJ1dGVzJykge1xuICAgICAgICAgIHRhcmdldC5wYXJlbnROb2RlLnJlbW92ZUNoaWxkKHRhcmdldClcbiAgICAgICAgICBvYnNlcnZlci5kaXNjb25uZWN0KClcbiAgICAgICAgfVxuICAgICAgfSlcbiAgICB9KVxuICAgIGxldCBjb25maWcgPSB7IGF0dHJpYnV0ZXM6IHRydWUsIGF0dHJpYnV0ZUZpbHRlcjogWydzdHlsZSddIH1cbiAgICBvYnNlcnZlci5vYnNlcnZlKHRhcmdldCwgY29uZmlnKVxuICAgIHRoaXMudXBkYXRlT2JzZXJ2ZXIoeyBET01BdHRyTW9kaWZpZWRPYnNlcnZlcjogb2JzZXJ2ZXIgfSlcbiAgfVxufVxuIl19