From 07594bccda051ca54ebb52757f5968801c5775de Mon Sep 17 00:00:00 2001 From: Patrick Simianer Date: Tue, 25 Aug 2015 14:32:53 +0200 Subject: support for uneven grid & tweaking --- snaptogrid.js | 38 +++++++++++++++++++++++++++----------- 1 file changed, 27 insertions(+), 11 deletions(-) diff --git a/snaptogrid.js b/snaptogrid.js index 2d86968..cc2be8a 100644 --- a/snaptogrid.js +++ b/snaptogrid.js @@ -17,11 +17,19 @@ window.onload = function () { { document.getElementById("debug").innerHTML = el["id"] + " <-> " + obj["id"] ee = shapesById[obj["id"]]; - if (el.getBBox().x > ee.getBBox().x) { - att = {x: ee.attr("x")+70}; + if (el["grid"] > ee["grid"]) { + if (el.getBBox().width < obj.getBBox().width && + el.getBBox().x > (obj.getBBox().x+obj.getBBox().width/2)) { + return; + } + att = {x: ee.attr("x")+el.getBBox().width+10}; ee.attr(att); } else { - att = {x: ee.attr("x")-70}; + if (el.getBBox().width < obj.getBBox().width && + el.getBBox().x < (obj.getBBox().x+obj.getBBox().width/2)) { + return; + } + att = {x: ee.attr("x")-(el.getBBox().width+10)}; ee.attr(att); } @@ -42,23 +50,31 @@ window.onload = function () { obj.animate(att, 250); } // x - if (el.getBBox().x != el["grid"]*70) { + /*if (el.getBBox().x != el["grid"]*70) { att = {x:el["grid"]*70}; obj.animate(att,250); - } + }*/ + var d = 0; for (var i = 0; i < 4; i++) { - obj = shapesById[i]; - att = {x:obj["grid"]*70}; + obj = null + for (var j = 0; j < shapes.length; j++) { + obj = shapesById[j]; + if (obj["grid"] == i) + break; + } + att = {x:d}; obj.animate(att,250); + d += obj.getBBox().width+10; } }; r = Raphael("holder", 280, 100), + xAnchors = [ 0, 20, 60, 130 ] shapes = [ - r.rect(0, 50, 60, 30, 0), - r.rect(70, 50, 60, 30, 0), - r.rect(140, 50, 60, 30, 0), - r.rect(210, 50, 60, 30, 0), + r.rect(xAnchors[0], 50, 10, 30, 0), + r.rect(xAnchors[1], 50, 30, 30, 0), + r.rect(xAnchors[2], 50, 60, 30, 0), + r.rect(xAnchors[3], 50, 30, 30, 0), ]; colors = [ "#000", "#ccc", "#0f0", "#00f" ]; shapesById = {}; -- cgit v1.2.3