'use strict'; /** * Licensed Materials - Property of IBM * IBM Cognos Products: BI Cloud (C) Copyright IBM Corp. 2018 * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp. */ define(['jquery', 'underscore', '../../../../lib/@waca/core-client/js/core-client/ui/core/Class'], function ($, _, Class) { var Guidlines = Class.extend({ THRESHOLD: 5, /** * Find widgets and create guidelines for them, to align with top,middle,bottom,left,center,right. * @param nPage {domNode} Container of the widgets to create guidelines for. * @param dragObject {object} A drag object used by move and resize. Essentially, we only needs the IDs of the widgets being resized/moved, so they are excluded from the guidelines */ setup: function setup(nPage, dragObject, snapGuidelines) { this._aGuidelines = []; this.snapGuidelines = snapGuidelines; this.domNode = nPage; var $page = $(this.domNode); _.each($page.children('.widget,.pagegroup,.pagetemplateDropZone'), function (n) { if (dragObject && dragObject.dragBox && dragObject.dragBox.ids.indexOf(n.id) > -1) { return; } var $n = $(n), rect = $n.position(); var leftOffset = 0, topOffset = 0, height, width; var isDropZone = $n.is('.pagetemplateDropZone'); height = $n.outerHeight(); width = $n.outerWidth(); var left = Math.round(rect.left + nPage.scrollLeft + leftOffset), right = Math.round(left + width); var top = Math.round(rect.top + nPage.scrollTop + topOffset), bottom = Math.round(top + height); this._addGuideline('x', left, top, bottom, isDropZone ? 'left' : null); this._addGuideline('x', right, top, bottom, isDropZone ? 'right' : null); this._addGuideline('x', (left + right) / 2, top, bottom); this._addGuideline('y', top, left, right, isDropZone ? 'top' : null); this._addGuideline('y', bottom, left, right, isDropZone ? 'bottom' : null); this._addGuideline('y', (top + bottom) / 2, left, right); }.bind(this)); this._addGuideline('x', nPage.scrollWidth / 2); this._addGuideline('y', nPage.scrollHeight / 2); }, /** * Create a guideline object. Adds it to the internal array. A guideline object the position (x/y) and the dom node to represent it (axis_x/axis_y). * @param {string} sAxis Can be 'x' or 'y'. Sets the orientation of the guideline. * @param {int} iPos The x or y coordinates where to create a guideline. * @param {int} topOrLeft (Optional) Top or Left position of the marker, depending if sAxis is x or y. * @param {int} bottomOrRight (Optional) Bottom or Right position of the marker, depending if sAxis is x or y. * @param {string} restrictedTo Can be 'top', 'bottom', 'left' or 'right'. It specifies if the guideline must only be used with a specific edge */ _addGuideline: function _addGuideline(sAxis, iPos, topOrLeft, bottomOrRight, restrictedTo) { var $page = $(this.domNode), h = this.domNode.scrollHeight - 10 + 'px', w = this.domNode.scrollWidth - 10 + 'px'; var cssPosition = sAxis === 'x' ? { left: iPos + 'px', height: h } : { top: iPos + 'px', width: w }; var $marker1 = $('