diff options
| -rw-r--r-- | chips.js | 2 | ||||
| -rw-r--r-- | dnd.html | 12 | ||||
| -rw-r--r-- | grapher/index.html | 2 | ||||
| -rw-r--r-- | grapher/script.js | 15 | ||||
| -rw-r--r-- | index.html | 2 | ||||
| -rw-r--r-- | script.js | 4 |
6 files changed, 34 insertions, 3 deletions
@@ -74,8 +74,10 @@ function generateChipHTML(NodeDescs, typeoverride = undefined) { output.append(port, tooltip); } + return root; } + } function ListAllTypes(Nodes) { diff --git a/dnd.html b/dnd.html new file mode 100644 index 0000000..2ac4693 --- /dev/null +++ b/dnd.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <title>Document</title> +</head> +<body> + <div draggable>fucking shitting</div> + <div>shuttjgirongio</div> +</body> +</html>
\ No newline at end of file diff --git a/grapher/index.html b/grapher/index.html index e0990b7..6cec1f0 100644 --- a/grapher/index.html +++ b/grapher/index.html @@ -65,7 +65,7 @@ <hr/> <p>To wire 2 ports to one another, simply click and drag to a port of the same type. All input data ports have a maximum of one connection, as do output execs. - To disconnect a wire, simply click on the end with a maxiumum of one connection. + To disconnect a wire, simply click on the port. </p> <h4>Selecting</h4> <hr> diff --git a/grapher/script.js b/grapher/script.js index 807a88d..9b0be9f 100644 --- a/grapher/script.js +++ b/grapher/script.js @@ -120,12 +120,20 @@ window.onload = async function() { chipcontainer.append(generateChipHTML(v2data.Nodes[data.GUID].NodeDescs)); ne.append(chipcontainer); graph.append(ne); + + let newchipx = -graphPos.x + (graph.getClientRects()[0].width / 2) - (ne.getClientRects()[0].width / 2); + let newchipy = -graphPos.y + (graph.getClientRects()[0].height / 2) - (ne.getClientRects()[0].height / 2); + ne.style.setProperty('--chipOffsetX', newchipx); + ne.style.setProperty('--chipOffsetY', newchipy); + + const chip = { el: ne, typeInfo: types, currentOverrides: [], nd: v2data.Nodes[data.GUID].NodeDescs }; + appendTypeUI(chip); chips.push(chip); console.log(types); @@ -133,7 +141,7 @@ window.onload = async function() { } graph.addEventListener('mousedown', function(e) { - if (e.button == 0) { + if (e.buttons & 1) { start = performance.now(); targ = e.target; if (e.target.parentElement.matches('.input')) { @@ -198,6 +206,11 @@ window.onload = async function() { }); rootel.addEventListener("mousemove", e => { + if (e.buttons & 2) { + mode = ''; + let tmp = connections.pop(); + if ((tmp.i instanceof Element) && (tmp.o instanceof Element)) connections.push(tmp); + } if (e.buttons & 4) { graphPos.x += e.clientX - lastmp.x; graphPos.y += e.clientY - lastmp.y; @@ -37,6 +37,7 @@ </a>. </noscript> + <div id="imgbox" style="display:none;"></div> <form id="form" autocomplete="off"> <input type="text" id="search" placeholder="Search for a chip." list="paletteSearch"/> <hr/> @@ -106,6 +107,7 @@ To get started, simply type the name of the chip you'd like to know about into the top box. By default, the searcher will automatically refresh the results as you type.</p> <h4>Different types of chips</h4> + <hr> <ul> <li><b>Beta Chips</b> are indicated by a β symbol.</li> <li><b>Soon-to-be deprecated Chips</b> are indicated by yellow text, as well as a warning.</li> @@ -175,8 +175,10 @@ window.addEventListener("load", async (e) => { addBtn.setAttribute('title', 'Add to graph'); addBtn.onclick = getChipAddListener(el.GUID); if (isNested) name.append(addBtn); + + let m = generateChipHTML(el.NodeDescs); - ret.append(depr, name, iret, generateChipHTML(el.NodeDescs)); + ret.append(depr, name, iret, m); return ret; } |