{"version":3,"sources":["https://lively-kernel.org/lively4/lively4-bp2019/src/components/d3/d3-graphviz.js"],"names":["Morph","D3Component","d3v5","debounce","D3GraphViz","initialize","options","loaded","Promise","resolve","self","d3","select","graphviz","window","Viz","lively","loadJavaScriptThroughDOM","lively4url","updateViz","addEventListener","evt","onExtentChanged","getDotData","dotData","setDotData","data","dataEdgeColor","source","target","objToAttributes","obj","Object","keys","map","key","join","pxToInch","number","ifValueDo","value","func","undefined","setData","nodes","relations","Map","nodesSource","walkTreeData","d","hidden","set","id","attributes","shape","fontname","label","name","dataWidth","width","dataHeight","height","dataFontsize","fontsize","relationsSource","ea","get","e","Error","svgContainer","style","bounds","getBoundingClientRect","div","innerHTML","graph","console","warn","fade","zoom","engine","transition","ease","easeLinear","delay","duration","on","setupEvents","renderDot","vis","selectAll","onNodeClick","event","update","config","forEach","livelyInspect","contentNode","inspector","appendChild","display","livelyExample","livelyMigrate","other"],"mappings":"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","file":"d3-graphviz.js","sourcesContent":["import Morph from \"src/components/widgets/lively-morph.js\"\nimport D3Component from \"./d3-component.js\"\nimport d3v5 from \"src/external/d3.v5.js\"\nimport { debounce } from \"utils\";\nimport \"src/external/d3-selection-multi.v1.js\"\n\n/*\n *\n */\nexport default class D3GraphViz extends D3Component {\n\n  async initialize() {\n    this.options = {}\n    this.loaded = new Promise(async (resolve) => {\n\n      if (!self.d3 || !self.d3.select().graphviz) {\n        self.d3 = d3v5 // because we go global here...? and it will be replaced...\n      }\n      if (!window.Viz) {\n        await lively.loadJavaScriptThroughDOM(\"GraphViz\", lively4url + \"/src/external/viz.js\", true)\n      }\n      //  \"javascript/worker\"\n\n      if (!d3.select().graphviz) {\n        await lively.loadJavaScriptThroughDOM(\"D3GraphViz\", lively4url + \"/src/external/d3-graphviz.js\", true)\n      }\n      this.updateViz()\n      this.addEventListener('extent-changed', ((evt) => {\n        this.onExtentChanged(evt);\n      })::debounce(500));\n\n      this.d3 = d3\n\n      resolve()\n    })\n  }\n\n  \n  getDotData() {\n    return this.dotData\n  }\n\n  async setDotData(data) {\n    this.dotData = data;\n    await this.updateViz()\n  }\n  \n  dataEdgeColor(source, target) {\n    return \"#aaaaaa\"\n  }\n  \n  \n  objToAttributes(obj) {\n    return Object.keys(obj).map(key => {\n      return `${key}=\"${obj[key]}\"`\n    }).join(\" \")\n  }\n  \n  pxToInch(number) {\n    return number * 0.75 / 72 // px to pt to inch\n  }\n  \n  ifValueDo(value, func) {\n    if (value !== undefined) {\n      func(value)\n    }\n  }\n  \n  async setData(data) {\n    this.data = data\n    if (!data) return // do data... no cockies! ;-)\n    if (data.nodes && data.relations) {\n      var nodes = new Map()\n      this.nodes = nodes\n      \n      var nodesSource = \"\"\n      // Bundleview like data...\n      this.walkTreeData(data.nodes, d =>  {\n        if (!d.hidden) {\n          nodes.set(d.id, d)\n          var attributes = {\n            shape: \"rectangle\", \n            fontname: \"Arial\",\n            label: d.name\n          }\n          this.ifValueDo(this.dataWidth(d), width => attributes.width = this.pxToInch(width))\n          this.ifValueDo(this.dataHeight(d), height => attributes.height = this.pxToInch(height))\n          this.ifValueDo(this.dataFontsize(d), fontsize => attributes.fontsize = fontsize)\n          \n          nodesSource += `${d.id} [${this.objToAttributes(attributes)}];`\n        }\n      })\n\n      var relationsSource = data.relations.map(ea => {\n        let source = nodes.get(ea.source) // objects vs. explicit references through IDs that have first to be resolved...\n        let target = nodes.get(ea.target)\n        return `${ea.source} -> ${ea.target} [color=\"${this.dataEdgeColor(source, target)}\"]`\n      }).join(\";\")\n      var source = `digraph { ${relationsSource} ${nodesSource}}` // edges before nodes helps the layouter...\n\n      try {\n       await this.setDotData(source)\n        \n      } catch(e) {\n        throw new Error(\"D3 GraphViz, could not render: \" + source, e)\n      }\n    }\n  }\n  \n\n  async updateViz() {\n    var svgContainer = this.get(\"#container\")\n    svgContainer.style.width = this.style.width // hard to find out how to do this in CSS, ... with \"relative\"\n    svgContainer.style.height = this.style.height\n    \n    var bounds = this.getBoundingClientRect()\n    var div = this.get(\"#graph\")\n    div.innerHTML = \"\"\n\n    var data = this.getDotData()\n    if (!data) {\n      div.innerHTML = \"no data\"\n      return\n    }\n    \n    var graph = d3.select(div)\n    this.graph = graph\n    if (!graph.graphviz) {\n      debugger\n      console.warn(\"d3-graphviz: graph.graphviz undefined\")\n      return\n    }\n    \n    \n    var graphviz = graph.graphviz(false) // default is work, \"false\" -> no worker\n      .fade(false)\n      .zoom(true)\n      .engine(this.engine || \"dot\")\n  \n    // if (this.transition) {\n      graphviz = graphviz.transition(() => {\n        // #Important, the transition must select the root in the shadow...\n        return d3.select(div).transition(\"main\") \n            .ease(d3.easeLinear)\n            .delay(0)\n            .duration(1000);\n        })\n        .on(\"end\",  () => {\n          this.setupEvents()        \n        });\n    //}\n    \n    \n    this.graphviz = graphviz\n    \n    graphviz.renderDot(data);\n    \n    // this.setupEvents()\n  }\n  \n  setupEvents() {\n    var vis = this;\n    this.graph.selectAll(\"g.node\")\n      // .attr(\"stroke\", \"red\")\n      .on(\"click\", function(d) {\n        vis.onNodeClick(d, d3.event, this)\n      })\n  }\n  \n\n  async update(data) {\n    if (!this.graphviz) {\n      await this.updateViz()\n    }\n    this.graphviz.renderDot(data);\n    // this.setupEvents()\n  }\n  \n  config(config) {\n    Object.keys(config).forEach(key => {\n      this.options[key] = config[key] // we could check them here...      \n    })\n  }\n\n  livelyInspect(contentNode, inspector) {\n    if (this.dotData) {\n      contentNode.appendChild(inspector.display(this.dotData, false, \"#dot-data\", this));\n    }\n  }\n\n  onExtentChanged() {\n    // this.updateViz()\n  }\n\n  async livelyExample() {\n    await this.loaded\n    this.setDotData('digraph  {a -> b; b -> c; c -> a}')\n  }\n\n  livelyMigrate(other) {\n    this.dotData = other.dotData\n    this.options = other.options\n  }\n\n}\n"]}