diff --git a/IMFePIit29P.ttf b/IMFePIit29P.ttf new file mode 100644 index 0000000..5572611 Binary files /dev/null and b/IMFePIit29P.ttf differ diff --git a/IMFePIsc29P.ttf b/IMFePIsc29P.ttf new file mode 100644 index 0000000..44ee75e Binary files /dev/null and b/IMFePIsc29P.ttf differ diff --git a/img/gretchen.jpg b/img/gretchen.jpg new file mode 100644 index 0000000..304e857 Binary files /dev/null and b/img/gretchen.jpg differ diff --git a/src/display.js b/src/display.js index 6f1efed..98cba1e 100644 --- a/src/display.js +++ b/src/display.js @@ -35,8 +35,8 @@ export class Display { target.addEventListener('drop', e => { let target = findA(e.target) if (!target || !target.draggable) return - e.preventDefault() dispatch({ action: 'link', from: e.dataTransfer.getData("application/prs.x"), to: target.dataset['id']}) + && e.preventDefault() }) this.graph = new Springy.Graph() @@ -58,7 +58,9 @@ export class Display { graph.addNode(new Springy.Node(item.id, item)) } for (const item of state.links) { - graph.addEdge(new Springy.Edge(item.id, graph.nodeSet[item.from], graph.nodeSet[item.to], {})) + graph.addEdge(new Springy.Edge(item.id, graph.nodeSet[item.from], graph.nodeSet[item.to], { + text: state.items[item.from].linkable.filter(i => state.items[item.to].linkable.includes(i)).join(', ') + })) } let currentBB = this.layout.getBoundingBox() let width = this.target.scrollWidth || 100 @@ -70,12 +72,6 @@ export class Display { return new Springy.Vector(sx, sy); }; - var fromScreen = function(s) { - var size = currentBB.topright.subtract(currentBB.bottomleft); - var px = (s.x / canvas.width) * size.x + currentBB.bottomleft.x; - var py = (s.y / canvas.height) * size.y + currentBB.bottomleft.y; - return new Springy.Vector(px, py); - }; var renderer = new Springy.Renderer( this.layout, () => { @@ -86,7 +82,7 @@ export class Display { }, function drawEdge(edge, p1, p2) { const dom = document.createElement('span') - dom.innerText = 'text' + dom.innerText = edge.data.text p1 = toScreen(p1) p2 = toScreen(p2) if (p1.y > p2.y) [p1, p2] = [p2, p1] @@ -96,22 +92,17 @@ export class Display { let rad = Math.atan(b / a) if (negative) rad = rad + Math.PI if (rad > Math.PI / 2) { - console.warn(negative) rad += Math.PI ;[p2, p1] = [p1, p2] - } else if (negative) { console.warn(false) } + } - dom.style.transformOrigin = '0 0' + dom.className = 'line' dom.style.transform = 'rotate(' + rad + 'rad) translateY(-1em)' - dom.style.position = 'absolute' dom.style.left = p1.x + 'px' dom.style.top = p1.y + 'px' dom.style.right = p2.x + 'px' dom.style.bottom = p2.y + 'px' dom.style.width = Math.sqrt(Math.pow(a, 2) + Math.pow(b, 2)) + 'px' - dom.style.height = '1em' - dom.style.borderBottom = '3px solid black' - dom.style.textAlign = 'center' // FIXME eigentlich falsches parent field.appendChild(dom) }, @@ -145,8 +136,18 @@ export class Display { if (state.show !== null) { const wrapper = document.createElement('a') wrapper.href = '/' - const fullview = document.createElement('div') wrapper.className = 'fullview' + const fullview = document.createElement('div') + const name = 'Gretchen' + const desc = 'Näherin, 20' + const img = '/img/gretchen.jpg' + const text = '
Text
More text text text
' + fullview.innerHTML = ` +${desc}
+