{"version":3,"sources":["https://lively-kernel.org/lively4/lively4-petrinet/src/components/demo/lively-snapshot.js"],"names":["Morph","Rasterize","CloneDeepHTML","domtoimage","LivelySnapshot","initialize","registerButtons","rasterize","target","plain","appendChild","canvas","getElementById","ctx","getContext","data","that","DOMURL","window","img","Image","svg","Blob","type","url","createObjectURL","drawImage","revokeObjectURL","onSnapshotButton","domToImage","HTMLElement","container","get","toPng","dataUrl","createElement","error","toJpeg","quality","link","click","onPlusButton","elementToCanvas","onMinusButton","livelyPrepareSave","setAttribute","livelyPreMigrate","livelyMigrate","other","livelyInspect","contentNode","inspector","livelyExample"],"mappings":"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","file":"lively-snapshot.js","sourcesContent":["\"enable aexpr\";\n\nimport Morph from 'src/components/widgets/lively-morph.js';\nimport Rasterize, { CloneDeepHTML } from 'src/client/rasterize.js';\nimport domtoimage from 'https://raw.githubusercontent.com/tsayen/dom-to-image/master/dist/dom-to-image.min.js';\n\nexport default class LivelySnapshot extends Morph {\n  async initialize() {\n    this.windowTitle = \"LivelySnapshot\";\n    this.registerButtons();\n  }\n\n  rasterize(target) {\n    return ;\n  }\n\n  plain(target) {\n    target.innerHTML = ''\n    target.appendChild(<canvas id=\"canvas\" style=\"border:2px solid black;\" width=\"500\" height=\"500\"></canvas>\n\n    // ---\n\n\n    );var canvas = document.getElementById('canvas');\n    var ctx = canvas.getContext('2d');\n\n    //\n    // import * as rasterizeHTML from 'https://cburgmer.github.io/rasterizeHTML.js/rasterizeHTML.allinone.js'\n    // rasterizeHTML.drawDocument( that, canvas); 1;\n    //END\n    var data = '<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"200\" height=\"200\">' + '<foreignObject width=\"100%\" height=\"100%\">' + '<div xmlns=\"http://www.w3.org/1999/xhtml\" style=\"font-size:40px\">' + that.outerHTML + '</div>' + '</foreignObject>' + '</svg>';\n\n    var DOMURL = window.URL || window.webkitURL || window;\n\n    var img = new Image();\n    var svg = new Blob([data], { type: 'image/svg+xml;charset=utf-8' });\n    var url = DOMURL.createObjectURL(svg);\n\n    img.onload = function () {\n      ctx.drawImage(img, 0, 0);\n      DOMURL.revokeObjectURL(url);\n    };\n\n    img.src = url;\n  }\n  async onSnapshotButton() {\n    const target = that;\n    this.domToImage(target);\n  }\n\n  // this method is automatically registered as handler through ``registerButtons``\n\n  async domToImage(target) {\n    if (target instanceof HTMLElement) {\n      // const image = await Rasterize.asImage(target);\n      const container = this.get('#imageContainer');\n      container.innerHTML = ''; // clear contents\n      // container.appendChild(image);\n      // const clone = CloneDeepHTML.deepCopyAsHTML(target);\n      await domtoimage.toPng(target).then(function (dataUrl) {\n        var img = document.createElement(\"img\");\n        container.appendChild(img);\n        img.src = dataUrl;\n      }).catch(function (error) {\n        console.error('oops, something went wrong!', error);\n      });\n      domtoimage.toJpeg(target, { quality: 0.95 }).then(function (dataUrl) {\n        var link = document.createElement('a');\n        link.download = 'my-image-name.jpeg';\n        link.href = dataUrl;\n        link.click();\n      });\n      // container.appendChild(clone);\n    }\n  }\n\n  onPlusButton() {\n    Rasterize.elementToCanvas();\n    this.get(\"#textField\").value = parseFloat(this.get(\"#textField\").value) + 1;\n  }\n\n  onMinusButton() {\n    this.get(\"#textField\").value = parseFloat(this.get(\"#textField\").value) - 1;\n  }\n\n  /* Lively-specific API */\n\n  // store something that would be lost\n  livelyPrepareSave() {\n    this.setAttribute(\"data-mydata\", this.get(\"#textField\").value);\n  }\n\n  livelyPreMigrate() {\n    // is called on the old object before the migration\n  }\n\n  livelyMigrate(other) {\n    // whenever a component is replaced with a newer version during development\n    // this method is called on the new object during migration, but before initialization\n    this.someJavaScriptProperty = other.someJavaScriptProperty;\n  }\n\n  livelyInspect(contentNode, inspector) {\n    // do nothing\n  }\n\n  async livelyExample() {\n    // this customizes a default instance to a pretty example\n    // this is used by the \n    this.style.backgroundColor = \"lightgray\";\n    this.someJavaScriptProperty = 42;\n    this.appendChild(<div>This is my content</div>);\n  }\n\n}"]}