aboutsummaryrefslogtreecommitdiffstats
path: root/what.html
diff options
context:
space:
mode:
authoralyx <>2022-02-04 14:02:20 +0000
committeralyxisdysphoric <alyx@aleteoryx.me>2022-02-04 14:02:20 +0000
commit40c8a4cb97f185f2b18c0e78f96a895b1b3fe06d (patch)
tree2135a25ef2890331935e5be2728ef34a3d7bd834 /what.html
downloadRRCUtils-40c8a4cb97f185f2b18c0e78f96a895b1b3fe06d.tar.gz
RRCUtils-40c8a4cb97f185f2b18c0e78f96a895b1b3fe06d.tar.bz2
RRCUtils-40c8a4cb97f185f2b18c0e78f96a895b1b3fe06d.zip
Initial commit
Diffstat (limited to 'what.html')
-rw-r--r--what.html86
1 files changed, 86 insertions, 0 deletions
diff --git a/what.html b/what.html
new file mode 100644
index 0000000..29e4f7e
--- /dev/null
+++ b/what.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Document</title>
+ <script>
+ let root = document.documentElement;
+ var x,y = 0;
+ var canvas,ctx;
+ var offsetx,offsety;
+ var connections = [];
+ //{a: in ports, b: in ports, color: rbga()}
+
+ var ports = [
+ {type: "input"},
+ {type: "input"},
+ {type: "output"},
+ {type: "output"}
+ ]
+
+ window.addEventListener("load", e => {
+ canvas = document.getElementById('canvas');
+ ctx = canvas.getContext('2d');
+ canvas.width = window.innerWidth
+ canvas.height = window.innerHeight
+
+ })
+
+ function point(x, y) {
+ ctx.fillRect(x,y, 1, 1);
+ }
+
+ function drawLines() {
+ var startx = 200;
+ var starty = 200;
+
+ renderCurveBetweenPorts(startx, starty, dims.x, dims.y);
+ }
+ function renderCurveBetweenPorts(outx, outy, inx, iny) {
+ var dist = (((outx - inx) ** 2) + ((outy - iny) ** 2)) ** 0.5;
+ var heightOfCurve = Math.abs(iny - outy);
+ var widthOfCurve = Math.abs(inx - outx);
+ var halfWidth = (inx - outx)/2;
+
+ var cpbasex = (Math.abs((widthOfCurve * 2) / dist * 10) + 60) * (heightOfCurve / 150)**0.8;
+
+ var cp1x = outx + cpbasex;
+ var cp2x = inx - cpbasex;
+
+ ctx.clearRect(0,0,window.innerWidth,window.innerHeight);
+
+ //point(cp1x, outy);
+ //point(cp2x, iny);
+ //point(inx - outx, outy);
+
+ ctx.beginPath();
+ ctx.moveTo(outx,outy);
+ ctx.bezierCurveTo(cp1x, outy, cp2x, iny, inx, iny);
+ ctx.moveTo(outx,outy);
+ ctx.closePath();
+ ctx.lineWidth = 3;
+ ctx.stroke();
+ }
+ </script>
+ <style>
+ canvas {
+ position:fixed;
+ top:0;
+ bottom:0;
+ left:0;
+ right:0;
+ z-index: -20;
+ }
+ .move {
+ position:fixed;
+ height: 10px;
+ width: 10px;
+ background: red;
+ }
+ </style>
+</head>
+<body>
+ <canvas id="canvas"></canvas>
+</body>
+</html> \ No newline at end of file