[roomplanner] Fix snap-to-grid behaviorHEADmaster

Problem found by AI, yay to our AI overlords:

- Different rounding methods used in getCellPositionFromPixels
  vs. grid option passed to draggable component
- Wrong casing used for gridRow and gridCol in one place

1 files changed, 29 insertions, 12 deletions

diff --git a/modules-available/roomplanner/js/grid.js b/modules-available/roomplanner/js/grid.js
index 9157faa5..a2513c3f 100644
--- a/modules-available/roomplanner/js/grid.js
+++ b/modules-available/roomplanner/js/grid.js
@@ -7,17 +7,27 @@ if (!roomplanner) var roomplanner = {
 		getScaleFactor: function() {
 			return this.settings.scale/100;
 		},
+		// Single source of truth: pixel size of one grid step at current zoom
+		getGridStepPx: function() {
+			return this.settings.scale / this.settings.cellsep;
+		},
+		// Quantize absolute left/top (in px, relative to draw-element-area) onto grid
 		getCellPositionFromPixels: function(left,top) {
-			var n = this.settings.scale / this.settings.cellsep;
-			return [ parseInt(left) - ((parseInt(left)%n)+n)%n , parseInt(top) - ((parseInt(top)%n)+n)%n];
+			var n = this.getGridStepPx();
+			left = parseInt(left);
+			top = parseInt(top);
+			return [
+				Math.round(left / n) * n,
+				Math.round(top / n) * n
+			];
 		},
 		getCellPositionFromGrid: function(row,col) {
-			var n = this.settings.scale / this.settings.cellsep;
+			var n = this.getGridStepPx();
 			return [ parseInt(col*n), parseInt(row*n) ]
 		},
 		getGridFromPixels: function(left,top) {
-			var n = this.settings.scale / this.settings.cellsep;
-			return [Math.round(top/n), Math.round(left/n)];
+			var n = this.getGridStepPx();
+			return [Math.floor(parseInt(top)/n), Math.floor(parseInt(left)/n)];
 		},
 		settings: {
 			cellsep: 4,
@@ -150,9 +160,16 @@ if (!roomplanner) var roomplanner = {
 			var options = {
 					"containment" : "#draw-element-area",
 					"helper" : false,
-					"grid" : [(roomplanner.settings.scale / 4), (roomplanner.settings.scale / 4)],
+					"grid" : [roomplanner.getGridStepPx(), roomplanner.getGridStepPx()],
 					"stop": function(ev,ui) {
-						
+						// Ensure final position is snapped to grid and attributes are updated
+						var left = parseInt($(this).css('left'));
+						var top = parseInt($(this).css('top'));
+						var snapped = roomplanner.getCellPositionFromPixels(left, top);
+						$(this).css({ left: snapped[0] + 'px', top: snapped[1] + 'px' });
+						var gridPositions = roomplanner.getGridFromPixels(snapped[0], snapped[1]);
+						$(this).attr('gridRow', gridPositions[0]);
+						$(this).attr('gridCol', gridPositions[1]);
 						if ($(this).attr('itemtype').indexOf('_drag') > -1) {
 							var itemtype = $(this).attr('itemtype').replace('_drag','');
 							$(this).attr('itemtype',itemtype);
@@ -188,7 +205,7 @@ if (!roomplanner) var roomplanner = {
 				obstacle: '[itemtype="'+$(el).attr('itemtype')+'"]',
 				handles: "se",
 				autoHide: true,
-				grid: [(roomplanner.settings.scale / 4), (roomplanner.settings.scale / 4)],
+				grid: [roomplanner.getGridStepPx(), roomplanner.getGridStepPx()],
 				resize: function(ev,ui) {
 					var gridSteps = $(this).resizable("option","grid");
 								
@@ -443,9 +460,9 @@ roomplanner.grid = (function() {
 					
 					$item.css({width: w+"px", height: h+"px", left: pos[0]+"px", top: pos[1]+"px"});
 					if ($item.hasClass('draggable')) {
-						$item.draggable("option", "grid", [(roomplanner.settings.scale / 4), (roomplanner.settings.scale / 4)]);
+						$item.draggable("option", "grid", [roomplanner.getGridStepPx(), roomplanner.getGridStepPx()]);
 						if (roomplanner.isElementResizable(item)) {
-							$item.resizable("option", "grid", [(roomplanner.settings.scale / 4), (roomplanner.settings.scale / 4)]);
+							$item.resizable("option", "grid", [roomplanner.getGridStepPx(), roomplanner.getGridStepPx()]);
 						}
 					}
 				});
@@ -471,9 +488,9 @@ roomplanner.fitContent = function() {
 	$gridInner.find('.ui-draggable').each(function(idx,item) {
 		var $item = $(item);
 
-		var l = parseInt($item.attr('gridcol')) * roomplanner.settings.cellsize;
+		var l = parseInt($item.attr('gridCol')) * roomplanner.settings.cellsize;
 		var r = l + parseInt($item.attr('data-width'));
-		var t = parseInt($item.attr('gridrow')) * roomplanner.settings.cellsize;
+		var t = parseInt($item.attr('gridRow')) * roomplanner.settings.cellsize;
 		var b = t + parseInt($item.attr('data-height'));
 
 		if (l < minX) minX = l;