From d7884f0f0c0527f8c086751992d9d35d576211f5 Mon Sep 17 00:00:00 2001
From: Fabien Benetou <fabien-services@benetou.fr>
Date: Mon, 16 Jan 2023 14:48:38 +0100
Subject: [PATCH] respositionning node, once

---
 index.html | 34 ++++++++++++++++++++++++++++++----
 1 file changed, 30 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 443cac1..5e993bb 100644
--- a/index.html
+++ b/index.html
@@ -2083,21 +2083,43 @@ function stableGraph(){
   // run on entire wiki though whereas previous D3 instance limited to 10 pages and their targets
 }
 
+let edges_to_display = []
 function displayLeafs(graph, graphEl, rootId, rootEl, depth=3){
 	console.log( graph[rootId].Id )
 	if (depth<1) return
 	graph[rootId].Targets.map( l => {
 		console.log( "-", graph[l].Id )
 		let x = addNodeFromGraph(graph[l].Id, "" + (Math.random()*2) + " " + (Math.random()*2) + " -" + (Math.random()*2) )
-		//nodes.push(x)
+		x.setAttribute('update-links-on-pinchended', true)
 		console.log("linking:", rootEl, x)
-		setTimeout( _ => { addEdgeBetweenNodesFromGraph(graphEl, rootEl, x) }, 2000) // otherwise null positions
-		// might need to delay that differently
-		//edges.push({source:root, target:x})
+		edges_to_display.push({graphel:graphEl, source:rootEl, target:x})
 		displayLeafs( graph, graphEl, graph[l].Id, x, --depth)
 	})
 }
 
+AFRAME.registerComponent('update-links-on-pinchended', {
+	init: function(){
+		let rootEl = document.querySelector("#graphroot")
+		let el = this.el
+		this.el.addEventListener('released', function (event) {
+			Object.keys( rootEl.components ) // get all links
+				.filter( i => i.indexOf(el.id) > -1 ) // keeps links related to the moved node
+				.map( i => { // for each link
+					let newpos = el.getAttribute("position")
+					let [src,tgt] = i.replace("line__","").split("__to__");
+					srcpos = AFRAME.utils.coordinates.stringify( rootEl.getAttribute(i).start )
+					tgtpos = AFRAME.utils.coordinates.stringify( rootEl.getAttribute(i).end )
+					if (src==el.id){
+						rootEl.setAttribute(i, { start: newpos, end: tgtpos })
+					} else {
+						rootEl.setAttribute(i, { start: srcpos, end: newpos })
+					}
+					// somehow works once...
+				})
+		})
+	}
+})
+
 fetch('https://vatelier.benetou.fr/MyDemo/newtooling/wiki_graph.json').then( r => r.json() ).then( r => displayGraph(r.Nodes) );
 function displayGraph(mynodes){
 	// add few nodes with few edges for testing
@@ -2107,13 +2129,17 @@ function displayGraph(mynodes){
 	let root = mynodes[startingNode]
 
 	let graphEl = document.createElement("a-entity")
+	graphEl.id = "graphroot"
 	AFRAME.scenes[0].appendChild( graphEl )
 	let nodes = []
 	let edges = []
 	let node_names = Object.keys( mynodes )
 
 	let rootEl = addNodeFromGraph(root.Id, "" + (Math.random()*2) + " " + (Math.random()*2) + " -" + (Math.random()*2) )
+	rootEl.setAttribute('update-links-on-pinchended', true)
 	displayLeafs( mynodes, graphEl, root.Id, rootEl, 2)
+	setTimeout( _ => { edges_to_display.map( i => addEdgeBetweenNodesFromGraph( i.graphel, i.source, i.target ))}, 2000 )
+	// quite unreliable
 	
 	// random graph, no preferential attachement
 	/*