{"version":3,"sources":["webpack:///./src/components2/exposures/Network.vue?6af5","webpack:///src/components2/exposures/Network.vue","webpack:///./src/components2/exposures/Network.vue?7de9","webpack:///./src/components2/exposures/Network.vue","webpack:///./src/components2/exposures/Network.vue?5db6"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","attrs","on","$event","fit","_v","staticRenderFns","props","mounted","data","intialized","computed","network","details","methods","createNetwork","graph","nodeCanvasObject","node","outerCircle","ctx","beginPath","arc","x","y","Math","PI","strokeStyle","lineWidth","globalScale","stroke","font","fillStyle","textBaseline","textAlign","fillText","icon_code","label","setIconStyles","nodes","graphData","zoomToFit","forEach","node_style","d","color","icon_color","node_styles","watch","show","val","setTimeout","component","VBtn","VCard"],"mappings":"gJAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,SAAS,CAACE,YAAY,uBAAuBC,MAAM,CAAC,KAAO,GAAG,MAAQ,YAAY,CAACH,EAAG,MAAM,CAACE,YAAY,mBAAmB,CAACF,EAAG,QAAQ,CAACE,YAAY,sBAAsBC,MAAM,CAAC,UAAU,GAAG,MAAQ,UAAU,KAAO,IAAIC,GAAG,CAAC,MAAQ,SAASC,GAAQ,OAAOT,EAAIU,SAAS,CAACV,EAAIW,GAAG,SAASP,EAAG,MAAM,CAACE,YAAY,OAAOC,MAAM,CAAC,GAAK,cAAc,MACpbK,EAAkB,G,8CCmBtB,GACEC,MAAO,CAAC,UAAW,QAEnBC,QAHF,aAKEC,KALF,WAMI,MAAO,CACLC,YAAY,IAIhBC,SAAU,CACRC,QADJ,WAEM,OAAOjB,KAAKkB,QAAQD,UAIxBE,QAAS,CACPC,cADJ,WAEM,IAAN,qCAGMpB,KAAKqB,MAAQ,OAAnB,OAAmB,GAAnB,GAJA,IAMA,gBAEA,sBAEMrB,KAAKqB,MACX,UACA,SACA,iCAAQ,MAAR,WACA,4BAEMrB,KAAKqB,MAAMC,kBAAiB,SAAlC,OAEYC,EAAKC,cACPC,EAAIC,YACJD,EAAIE,IAAIJ,EAAKK,EAAGL,EAAKM,EAAG,GAAI,EAAG,EAAIC,KAAKC,IAAI,GAC5CN,EAAIO,YAAcT,EAAKC,YACvBC,EAAIQ,UAAY,IAAMC,EACtBT,EAAIU,UAINV,EAAIW,KAAO,kBACXX,EAAIY,UAAY,QAChBZ,EAAIa,aAAe,SACnBb,EAAIc,UAAY,SAChBd,EAAIe,SAASjB,EAAKkB,UAAWlB,EAAKK,EAAGL,EAAKM,GAG1CJ,EAAIW,KAAO,iBACXX,EAAIY,UAAY,QAChBZ,EAAIc,UAAY,SAChBd,EAAIa,aAAe,SACnBb,EAAIe,SAASjB,EAAKmB,MAAOnB,EAAKK,EAAGL,EAAKM,EAAI,MAI5C7B,KAAK2C,cAAc3C,KAAKiB,QAAQ2B,OAGhC5C,KAAKqB,MAAMwB,UAAU7C,KAAKiB,UAG5BR,IAjDJ,WAkDMT,KAAKqB,MAAMyB,UAAU,IAAK,KAG5BH,cArDJ,SAqDA,GACM,IAAN,qBAEMC,EAAMG,SAAQ,SAApB,GACQ,IAAR,iBAEYC,GACFC,EAAEC,MAAQF,EAAWE,MACrBD,EAAER,UAAYO,EAAWP,UACzBQ,EAAEE,WAAaH,EAAWG,aAE1BF,EAAEC,MAAQE,EAAY,WAAWF,MACjCD,EAAER,UAAYW,EAAY,WAAWX,UACrCQ,EAAEE,WAAaC,EAAY,WAAWD,iBAM9CE,MAAO,CACLC,KADJ,SACA,cACUC,IAAQvD,KAAKe,aACff,KAAKoB,gBAELoC,YAAW,WACT,EAAV,0BACA,MAEQxD,KAAKe,YAAa,MCtHsU,I,qECQ5V0C,EAAY,eACd,EACA3D,EACAa,GACA,EACA,KACA,WACA,MAIa,aAAA8C,EAAiB,QAMhC,IAAkBA,EAAW,CAACC,OAAA,KAAKC,QAAA,Q,oCCzBnC","file":"js/chunk-29501a65.700371e0.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('v-card',{staticClass:\"mt-6 mx-9 rounded-lg\",attrs:{\"flat\":\"\",\"color\":\"#f5f7f7\"}},[_c('div',{staticClass:\"network-wrapper\"},[_c('v-btn',{staticClass:\"network-control-fit\",attrs:{\"x-small\":\"\",\"color\":\"#616161\",\"dark\":\"\"},on:{\"click\":function($event){return _vm.fit()}}},[_vm._v(\"fit\")]),_c('div',{staticClass:\"mt-2\",attrs:{\"id\":\"graph2d\"}})],1)])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <v-card flat class=\"mt-6 mx-9 rounded-lg\" color=\"#f5f7f7\">\n    <div class=\"network-wrapper\">\n      <v-btn\n        class=\"network-control-fit\"\n        x-small\n        @click=\"fit()\"\n        color=\"#616161\"\n        dark\n        >fit</v-btn\n      >\n      <div id=\"graph2d\" class=\"mt-2\"></div>\n    </div>\n  </v-card>\n</template>\n\n<script>\nimport ForceGraph from \"force-graph\";\nimport config from \"@/assets/config\";\n\nexport default {\n  props: [\"details\", \"show\"],\n\n  mounted() {},\n\n  data() {\n    return {\n      intialized: false\n    };\n  },\n\n  computed: {\n    network() {\n      return this.details.network;\n    }\n  },\n\n  methods: {\n    createNetwork() {\n      const el = document.getElementById(\"graph2d\");\n\n      // initialize\n      this.graph = ForceGraph()(el);\n\n      const { clientWidth: width } = el;\n\n      const height = this.details.height;\n\n      this.graph\n        .height(height)\n        .width(width)\n        .nodeCanvasObjectMode(() => \"after\")\n        .linkDirectionalParticles(1);\n\n      this.graph.nodeCanvasObject((node, ctx, globalScale) => {\n        // outer circle\n        if (node.outerCircle) {\n          ctx.beginPath();\n          ctx.arc(node.x, node.y, 10, 0, 2 * Math.PI, false);\n          ctx.strokeStyle = node.outerCircle;\n          ctx.lineWidth = 1.5 / globalScale;\n          ctx.stroke();\n        }\n\n        // icon\n        ctx.font = \"3px FontAwesome\";\n        ctx.fillStyle = \"white\";\n        ctx.textBaseline = \"middle\";\n        ctx.textAlign = \"center\";\n        ctx.fillText(node.icon_code, node.x, node.y);\n\n        // label\n        ctx.font = `3px Sans-Serif`;\n        ctx.fillStyle = \"black\";\n        ctx.textAlign = \"center\";\n        ctx.textBaseline = \"middle\";\n        ctx.fillText(node.label, node.x, node.y + 7);\n      });\n\n      // style nodes\n      this.setIconStyles(this.network.nodes);\n\n      // set data\n      this.graph.graphData(this.network);\n    },\n\n    fit() {\n      this.graph.zoomToFit(250, 50);\n    },\n\n    setIconStyles(nodes) {\n      const node_styles = config.node_styles;\n\n      nodes.forEach((d) => {\n        const node_style = node_styles[d.node_type];\n\n        if (node_style) {\n          d.color = node_style.color;\n          d.icon_code = node_style.icon_code;\n          d.icon_color = node_style.icon_color;\n        } else {\n          d.color = node_styles[\"default\"].color;\n          d.icon_code = node_styles[\"default\"].icon_code;\n          d.icon_color = node_styles[\"default\"].icon_color;\n        }\n      });\n    }\n  },\n\n  watch: {\n    show(val) {\n      if (val && !this.intialized) {\n        this.createNetwork();\n\n        setTimeout(() => {\n          this.graph.zoomToFit(250, 20);\n        }, 1500);\n\n        this.intialized = true;\n      }\n    }\n  }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.network-wrapper {\n  position: relative;\n}\n\n.network-control-fit {\n  position: absolute;\n  top: 10px;\n  right: 10px;\n  z-index: 2;\n}\n</style>\n","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Network.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Network.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Network.vue?vue&type=template&id=16c43f4d&scoped=true&\"\nimport script from \"./Network.vue?vue&type=script&lang=js&\"\nexport * from \"./Network.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Network.vue?vue&type=style&index=0&id=16c43f4d&lang=scss&scoped=true&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"16c43f4d\",\n  null\n  \n)\n\nexport default component.exports\n\n/* vuetify-loader */\nimport installComponents from \"!../../../node_modules/vuetify-loader/lib/runtime/installComponents.js\"\nimport { VBtn } from 'vuetify/lib/components/VBtn';\nimport { VCard } from 'vuetify/lib/components/VCard';\ninstallComponents(component, {VBtn,VCard})\n","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Network.vue?vue&type=style&index=0&id=16c43f4d&lang=scss&scoped=true&\""],"sourceRoot":""}