Skip to content

Commit 515c10f

Browse files
adam77adam77
committed
Refactor utils.DOM -> $dndDOM.
1 parent 74317a6 commit 515c10f

File tree

3 files changed

+115
-140
lines changed

3 files changed

+115
-140
lines changed

‎src/dndDOM.js

Lines changed: 87 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,36 @@ var $dndDOMFactory = ['$document', '$window', function ($document, $window) {
4747
return offsetParent || docDomEl;
4848
};
4949

50+
function contains(a, b) {
51+
var adown = a.nodeType === 9 ? a.documentElement : a,
52+
bup = b && b.parentNode;
53+
return a === bup || !!( bup && bup.nodeType === 1 && contains(adown, bup) );
54+
};
55+
56+
function swapCss(element, css, callback, args) {
57+
var ret, prop, old = {};
58+
for (prop in css) {
59+
old[prop] = element.style[prop];
60+
element.style[prop] = css[prop];
61+
}
62+
63+
ret = callback.apply(element, args || []);
64+
65+
for (prop in css) {
66+
element.style[prop] = old[prop];
67+
}
68+
69+
return ret;
70+
};
71+
72+
var swapDisplay = /^(none|table(?!-c[ea]).+)/;
73+
74+
var cssShow = {
75+
position: 'absolute',
76+
visibility: 'hidden',
77+
display: 'block'
78+
};
79+
5080
return {
5181
/**
5282
* Provides read-only equivalent of jQuery's position function:
@@ -76,13 +106,70 @@ var $dndDOMFactory = ['$document', '$window', function ($document, $window) {
76106
* http://api.jquery.com/offset/
77107
*/
78108
offset: function (element) {
109+
110+
var doc = element[0] && element[0].ownerDocument;
111+
112+
if (!doc) {
113+
return;
114+
}
115+
116+
doc = doc.documentElement;
117+
118+
if (!contains(doc, element[0])) {
119+
return { top: 0, left: 0 };
120+
}
121+
79122
var boundingClientRect = element[0].getBoundingClientRect();
80123
return {
81124
width: boundingClientRect.width || element.prop('offsetWidth'),
82125
height: boundingClientRect.height || element.prop('offsetHeight'),
83126
top: boundingClientRect.top + ($window.pageYOffset || $document[0].documentElement.scrollTop),
84127
left: boundingClientRect.left + ($window.pageXOffset || $document[0].documentElement.scrollLeft)
85128
};
129+
},
130+
131+
/**
132+
* Partial implementation of https://api.jquery.com/closest/
133+
* @param node
134+
* @param value
135+
* @returns {angular.element}
136+
*/
137+
closest: function(node, value) {
138+
node = angular.element(node);
139+
if ($.fn && angular.isFunction($.fn.closest)) {
140+
return node.closest(value);
141+
}
142+
// Otherwise, assume it's a tag name...
143+
node = node[0];
144+
value = value.toLowerCase();
145+
do {
146+
if (node.nodeName.toLowerCase() === value) {
147+
return angular.element(node);
148+
}
149+
} while (node = node.parentNode);
150+
},
151+
152+
size: function(node) {
153+
var jq = angular.element(node);
154+
node = node.nodeName ? node : node[0];
155+
if (node.offsetWidth === 0 && swapDisplay.test(jq.css('display'))) {
156+
return swapCss(node, cssShow, getHeightAndWidth, [node]);
157+
}
158+
return getHeightAndWidth(node);
159+
160+
function getHeightAndWidth(element) {
161+
return {
162+
width: element.offsetWidth,
163+
height: element.offsetHeight
164+
};
165+
}
166+
},
167+
168+
keepSize: function(node) {
169+
var css = this.size(node);
170+
css.width = css.width + 'px';
171+
css.height = css.height + 'px';
172+
return css;
86173
}
87174
};
88175
}];

‎src/draggable.js

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -197,7 +197,7 @@ var $dragProvider = function() {
197197
currentDrag = self;
198198

199199
self.cssDisplay = self.element.css('display');
200-
self.dimensions = DOM.size(self.element);
200+
self.dimensions = $dndDOM.size(self.element);
201201
if (!self.hanging) {
202202
self.cssPosition = self.element.css("position");
203203

@@ -206,7 +206,7 @@ var $dragProvider = function() {
206206
width: self.element[0].style['width'],
207207
height: self.element[0].style['height']
208208
};
209-
self.element.css(DOM.keepSize(self.element));
209+
self.element.css($dndDOM.keepSize(self.element));
210210
}
211211
}
212212

@@ -354,6 +354,32 @@ var $dragProvider = function() {
354354
}
355355
};
356356

357+
function dragConstraints(value, element) {
358+
if (value.length === '') {
359+
return;
360+
}
361+
if (/^(\.|#)/.test(value) && $.fn && angular.isFunction($.fn.closest)) {
362+
// Find nearest element matching class
363+
return constraintsFor(element.parent().closest(value));
364+
}
365+
if (/^(\^|parent)$/.test(value)) {
366+
return constraintsFor(element.parent());
367+
}
368+
return constraintsFor($dndDOM.closest(element.parent(), value));
369+
};
370+
371+
function constraintsFor(element) {
372+
if (typeof element === 'undefined' || element.length === 0) {
373+
return;
374+
}
375+
// Use offset + width/height for now?
376+
var constraints = $dndDOM.offset(element),
377+
dimensions = $dndDOM.size(element);
378+
constraints.right = constraints.left + dimensions.width;
379+
constraints.bottom = constraints.top + dimensions.height;
380+
return constraints;
381+
};
382+
357383
/**
358384
* @ngdoc property
359385
* @module ui.drop
@@ -409,32 +435,6 @@ var $dragProvider = function() {
409435
return angular.isObject(thing) && thing.constructor === Draggable;
410436
}
411437

412-
function dragConstraints(value, element) {
413-
if (value.length === '') {
414-
return;
415-
}
416-
if (/^(\.|#)/.test(value) && $.fn && angular.isFunction($.fn.closest)) {
417-
// Find nearest element matching class
418-
return constraintsFor(element.parent().closest(value));
419-
}
420-
if (/^(\^|parent)$/.test(value)) {
421-
return constraintsFor(element.parent());
422-
}
423-
return constraintsFor(DOM.closest(element.parent(), value));
424-
}
425-
426-
function constraintsFor(element) {
427-
if (typeof element === 'undefined' || element.length === 0) {
428-
return;
429-
}
430-
// Use offset + width/height for now?
431-
var constraints = DOM.offset(element),
432-
dimensions = DOM.size(element);
433-
constraints.right = constraints.left + dimensions.width;
434-
constraints.bottom = constraints.top + dimensions.height;
435-
return constraints;
436-
}
437-
438438
function withinConstraints(c, x, y, w, h) {
439439
return x >= c.left && (x+w) <= c.right && y >= c.top && (y+h) <= c.bottom;
440440
}

‎src/utils.js

Lines changed: 0 additions & 112 deletions
Original file line numberDiff line numberDiff line change
@@ -111,116 +111,4 @@ matchesSelector = function(node, selector) {
111111
}
112112

113113
return matchesFn(node, selector);
114-
},
115-
116-
DOM = {
117-
nodeEq: function(node, name) {
118-
return (typeof (node.nodeName === 'string' ?
119-
node.nodeName.toLowerCase() : node[0].nodeName).toLowerCase() === name);
120-
},
121-
122-
offset: function(node) {
123-
node = node.length ? node[0] : node;
124-
var win, box = { top: 0, left: 0 },
125-
doc = node && node.ownerDocument;
126-
127-
if (!doc) {
128-
return;
129-
}
130-
131-
doc = doc.documentElement;
132-
133-
if (!DOM.contains(doc, node)) {
134-
return box;
135-
}
136-
137-
if (angular.isFunction(node.getBoundingClientRect)) {
138-
box = node.getBoundingClientRect();
139-
}
140-
141-
win = DOM.window(doc);
142-
143-
return {
144-
top: box.top + win.pageYOffset - doc.clientTop,
145-
left: box.left + win.pageXOffset - doc.clientLeft
146-
};
147-
},
148-
149-
contains: function(a, b) {
150-
var adown = a.nodeType === 9 ? a.documentElement : a,
151-
bup = b && b.parentNode;
152-
return a === bup || !!( bup && bup.nodeType === 1 && DOM.contains(adown, bup) );
153-
},
154-
155-
window: function(node) {
156-
node = typeof node.nodeName === 'undefined' && typeof node.length === 'number' ?
157-
node[0] : node;
158-
return DOM.isWindow(node) ? node : (node.nodeType === 9 && node.defaultView) ||
159-
(node.ownerDocument && (node.ownerDocument.defaultView ||
160-
node.ownerDocument.parentWindow));
161-
},
162-
163-
isWindow: function(obj) {
164-
return obj && obj.document && obj.location && obj.alert && obj.setInterval;
165-
},
166-
167-
swapCss: function (element, css, callback, args) {
168-
var ret, prop, old = {};
169-
for (prop in css) {
170-
old[prop] = element.style[prop];
171-
element.style[prop] = css[prop];
172-
}
173-
174-
ret = callback.apply(element, args || []);
175-
176-
for (prop in css) {
177-
element.style[prop] = old[prop];
178-
}
179-
180-
return ret;
181-
},
182-
183-
swapDisplay: /^(none|table(?!-c[ea]).+)/,
184-
185-
cssShow: {
186-
position: 'absolute',
187-
visibility: 'hidden',
188-
display: 'block'
189-
},
190-
191-
size: function(node) {
192-
var jq = angular.element(node);
193-
node = node.nodeName ? node : node[0];
194-
if (node.offsetWidth === 0 && DOM.swapDisplay.test(jq.css('display'))) {
195-
return DOM.swapCss(node, DOM.cssShow, getHeightAndWidth, [node]);
196-
}
197-
return getHeightAndWidth(node);
198-
199-
function getHeightAndWidth(element) {
200-
return {
201-
width: element.offsetWidth,
202-
height: element.offsetHeight
203-
};
204-
}
205-
},
206-
keepSize: function(node) {
207-
var css = DOM.size(node);
208-
css.width = css.width + 'px';
209-
css.height = css.height + 'px';
210-
return css;
211-
},
212-
closest: function(node, value) {
213-
node = angular.element(node);
214-
if ($.fn && angular.isFunction($.fn.closest)) {
215-
return node.closest(value);
216-
}
217-
// Otherwise, assume it's a tag name...
218-
node = node[0];
219-
value = value.toLowerCase();
220-
do {
221-
if (node.nodeName.toLowerCase() === value) {
222-
return angular.element(node);
223-
}
224-
} while (node = node.parentNode);
225-
}
226114
};

0 commit comments

Comments
 (0)