diff options
| -rw-r--r-- | modules-available/roomplanner/js/grid.js | 41 |
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; |