{"version":3,"sources":["https://lively-kernel.org/lively4/lively4-markus/demos/visualizations/scriptapp.js"],"names":["moment","Strings","Colors","d3","ScriptApp","getEngine","engine","setEngine","graphviz","setAttribute","dataClick","data","element","create","ctx","container","get","containerContent","updateExtent","lively","removeEventListener","addEventListener","style","document","createElement","textContent","div","result","id","appendChild","updateViz","Error","updateSVG","svg","warn","zoomElement","createElementNS","zoomG","select","svgOuter","svgGraph","call","zoom","scaleExtent","on","trans","event","transform","attr","shadowRoot","querySelectorAll","forEach","ea","evt","key","querySelector","graph","dataById","shiftKey","openInspector","lastSelectedNode","selectedNode","extent","getExtent","width","x","height","y","connectInput","initValue","update","value","query"],"mappings":"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","file":"scriptapp.js","sourcesContent":["\n// Simple Apps that are created inside a script tag in a MarkDown file\n// a) Reason: Code reuse?\n// b) #FutureWork How does it relate to Components, Objects, HTML and MarkdDown files\n\n// #ResearchQuestion \"What is the unit of a Program/Tool/Application in Lively4?\"  -> Object, MarkdownFile, Component ?\n\n\nimport moment from \"src/external/moment.js\";  \nimport Strings from 'src/client/strings.js'  \nimport Colors from \"src/external/tinycolor.js\"\nimport d3 from \"src/external/d3.v5.js\"\n  \nexport default class ScriptApp {\n  \n  static getEngine() {\n    return this.engine || \"dot\"\n  }\n\n  static setEngine(engine) {\n    this.engine = engine\n    if (this.graphviz) {\n      this.graphviz.setAttribute(\"engine\", engine);\n    }\n    return engine\n  }\n\n  dataClick(data, element) {\n    // subclass responsibility\n  }\n  \n  \n  static async create(ctx) {\n    \n    this.ctx = ctx\n\n    this.container = this.get(\"lively-container\");\n    this.containerContent = this.container.get(\"#container-content\")\n    this.graphviz = await (<graphviz-dot engine={this.getEngine()} server=\"true\" ></graphviz-dot>) // \n\n    this.updateExtent()\n\n    lively.removeEventListener(\"graphvizContent\", this.container)\n    lively.addEventListener(\"graphvizContent\", this.container, \"extent-changed\", () => {\n      this.updateExtent()\n    });\n\n    var style = document.createElement(\"style\")\n    style.textContent = `\n      td.comment {\n        max-width: 300px\n      }\n      div#root {\n        overflow: visible;\n      }\n\n      #graphviz {\n        position: absolute;\n        top: 0px\n        left: 0px;\n\n      }\n    `\n\n    var div = document.createElement(\"div\")\n    this.result = div\n    div.id = \"root\"\n\n    div.appendChild(style)\n    div.appendChild(<div>\n      <button click={() => this.updateViz()}>update</button>\n    </div>)\n    div.appendChild(this.graphviz)\n    return div\n  }\n  \n  static updateViz() {\n    throw new Error(\"subclass responsibility\")\n  }\n  \n  static updateSVG() {\n    var svg = this.graphviz.get(\"svg\")\n    if (!svg) {\n      lively.warn(\"no svg found\") // should we wait?\n      return\n    }\n\n    var zoomElement = document.createElementNS(\"http://www.w3.org/2000/svg\", \"g\")  \n    var zoomG = d3.select(zoomElement)\n\n    var svgOuter = d3.select(svg)\n    var svgGraph = d3.select(this.graphviz.get(\"#graph0\"))\n\n    svgOuter\n      .style(\"pointer-events\", \"all\")        \n      .call(d3.zoom()\n          .scaleExtent([1 / 30, 30])\n          .on(\"zoom\", () => {\n            var trans = d3.event.transform\n            zoomG.attr(\"transform\", trans);\n          }));        \n    svg.appendChild(zoomElement)\n    zoomElement.appendChild(this.graphviz.get(\"#graph0\"))\n\n\n    this.graphviz.shadowRoot.querySelectorAll(\"g.node\").forEach(ea => {\n      d3.select(ea).style(\"pointer-events\", \"all\")\n      ea.addEventListener(\"click\", async (evt) => {\n        // lively.showElement(ea)\n        var key = ea.querySelector('title').textContent\n        var data = this.graph.dataById.get(key)\n\n        if (evt.shiftKey) {\n          lively.openInspector({\n            element: ea,\n            key: key,\n            data: data\n          })\n          return\n        }\n        var data = this.graph.dataById(key)\n        if (data) {\n          this.dataClick(data, ea)\n        }\n        \n        this.lastSelectedNode = this.selectedNode\n        this.selectedNode = ea\n      })\n    })\n  }\n  \n  static updateExtent() {\n    var extent = lively.getExtent(this.containerContent)\n    this.graphviz.width = extent.x - 40\n    this.graphviz.height = extent.y - 40\n\n  }\n  \n  static connectInput(element, initValue, update) {\n    element.value = initValue\n    element.addEventListener(\"change\", function(evt) {\n        update(this.value)\n    })\n  }\n \n  static get(query) {\n    return lively.query(this.ctx, query)\n  }  \n}"]}