omggg got hexagon hover for rotate/copy

soo easy and this thing is purrrrrrinnngggg

diff --git a/.gitignore b/.gitignore
new file mode 100644 (file)
index 0000000..aeaec0f
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1 @@
+/*~

diff --git a/grid.js b/grid.js
index 14e1940d9837a342f56c03d3a2f6299269292b2a..9bbf10e79d48a0b116b058b8b2de06deca9b1fa4 100644 (file)
--- a/grid.js
+++ b/grid.js
@@ -37,7 +37,7 @@ class Hex {
 
 
                // methods for being displayed I guess
-               getCanvasCoords(xorig, yorig, scale, ispoint) {
+               getCanvasCoords(xorig, yorig, scale, ispoint=true) {
                                // x,y is origin place, scale is how much to multiply unit dist by
                                var xi = 0;
                                var yi = 0;

diff --git a/play.js b/play.js
index a2e127531f072ab6c1c49ab7031d4a5d1f7d5c04..21db4a19fbc5fe5f4fd5399298a1f92662665d50 100644 (file)
--- a/play.js
+++ b/play.js
@@ -72,6 +72,30 @@ function lc() {
                dl = document.getElementById("dload");
                dl.onclick = demoHandler;
                demoHandler(null);
+
+}
+
+radius_hover = function(e) {
+               let rad = parseInt(document.getElementById('rad').value);
+               let gcoord = getClickCoords(c,scale,xcenter,ycenter,e);
+               let cell = g.cellAt(gcoord.q, gcoord.r);
+               // does this belong here? maybe it's okay...
+               let ccoords = cell.getCanvasCoords(xcenter, ycenter, scale);
+               drawGrid(g, ctx, xcenter,ycenter,scale);
+               ctx.save();
+               ctx.fillStyle = "rgba(0.3,0.3,0.3,0.1)";
+               ctx.strokeStyle = "rgba(0.3,0.3,0.3,0.1)";
+               let r = (rad-.5) * scale * Math.sqrt(3);
+               let x = ccoords.x;
+               let y = ccoords.y;
+               ctx.beginPath();
+               ctx.moveTo(x+r,y);
+               for(let i=1; i<7; i++) {
+                               ctx.lineTo(x+ r*Math.cos(Math.PI*i/3), y+r*Math.sin(Math.PI*i/3));
+               }
+               ctx.fill();
+               ctx.stroke();
+               ctx.restore();
 }
 
 rangeManage = function(e) {
@@ -123,6 +147,8 @@ pptoggle = function(e) {
 
 rotateButtonHandler = function(e) {
                c.onclick =  e=>rotateThingy(e);
+               c.addEventListener('mousemove', radius_hover);
+
                // tf are those arguments globals are there for a reason
                ctx.save();
                ctx.fillStyle="rgba(0.4,0.4,0.4,0.1)"
@@ -130,6 +156,7 @@ rotateButtonHandler = function(e) {
                ctx.restore();
 }
 rotateThingy = function(evt) {
+               c.removeEventListener('mousemove', radius_hover);
                let coords = getClickCoords(c,scale,xcenter,ycenter,evt);
                let rad = parseInt(document.getElementById('rad').value);
                g.rotateHex(coords.q,coords.r,rad);
@@ -139,6 +166,7 @@ rotateThingy = function(evt) {
 
 copyHandler = function(e) {
                c.onclick = e=>copyhex(e);
+               c.addEventListener('mousemove', radius_hover);
                ctx.save();
                ctx.fillStyle="rgba(0.4,0.4,0.4,0.1)"
                ctx.fillRect(0,0,ctx.canvas.width,ctx.canvas.height);
@@ -146,6 +174,7 @@ copyHandler = function(e) {
 }
 
 copyhex = function(evt) {
+               c.removeEventListener('mousemove', radius_hover);
                let coords = getClickCoords(c,scale,xcenter,ycenter,evt);
                let rad = parseInt(document.getElementById('rad').value);
                copybuf = g.copyHex(coords.q, coords.r, rad)
@@ -154,12 +183,14 @@ copyhex = function(evt) {
 }
 pasteHandler = function(e) {
                c.onclick = e=>pastehex(e);
+               c.addEventListener('mousemove', radius_hover);
                ctx.save();
                ctx.fillStyle="rgba(0.4,0.4,0.4,0.1)"
                ctx.fillRect(0,0,ctx.canvas.width,ctx.canvas.height);
                ctx.restore();
 }
 pastehex = function(evt) {
+               c.removeEventListener('mousemove', radius_hover);
                let coords = getClickCoords(c,scale,xcenter,ycenter,evt);
                let rad = parseInt(document.getElementById('rad').value);
                g.pasteHex(coords.q,coords.r,copybuf);

diff --git a/wireworld.js b/wireworld.js
index bd8ceb96d83620e6651dc24957ba8ca6a9cddd6e..362bff9674fc3f935db2b05fae08f422c5b858be 100644 (file)
--- a/wireworld.js
+++ b/wireworld.js
@@ -234,8 +234,8 @@ function drawState(ctx,st,x,y,sz) {
                ctx.beginPath();
                r = sz * Math.sqrt(3)/2 * 0.9;
                ctx.arc(x,y,r,0,Math.PI*2,true);
-               ctx.stroke();
                ctx.fill();
+               ctx.stroke();
                ctx.restore();
 }