dragselect - npm Package Compare versions

Comparing version 1.7.3 to 1.7.4

dist/DragSelect.js

@@ -123,2 +123,9 @@ /*
 
+  // Area has to have a special position attribute for calculations
+  var computedArea = getComputedStyle(this.area);
+  var isAbsolute = computedArea.position === 'absolute' || computedArea.position === 'relative' || computedArea.position === 'fixed';
+  if(this.area !== document && !isAbsolute) {
+    this.area.style.position = 'relative';
+  }
+
   // Selector
@@ -125,0 +132,0 @@ this.selector = options.selector || this._createSelector();

dist/ds.min.js

@@ -1,1 +0,1 @@
-function DragSelect(e){this.multiSelectKeyPressed,this.initialCursorPos,this.initialScroll,this.selected=[],this._createBindings(),this._setupOptions(e),this.start()}DragSelect.prototype._createBindings=function(){this._startUp=this._startUp.bind(this),this._handleMove=this._handleMove.bind(this),this.reset=this.reset.bind(this),this._onClick=this._onClick.bind(this)},DragSelect.prototype._setupOptions=function(e){this.selectables=[],this._handleSelectables(this.toArray(e.selectables)),this.multiSelectKeys=e.multiSelectKeys||["ctrlKey","shiftKey","metaKey"],this.selectCallback=e.onElementSelect||function(){},this.unselectCallback=e.onElementUnselect||function(){},this.callback=e.callback||function(){},this.area=e.area||document,this.customStyles=e.customStyles,this.selector=e.selector||this._createSelector(),this.addClass(this.selector,"ds-selector")},DragSelect.prototype._handleSelectables=function(e,t,s){for(var i=0;i<e.length;i++){var l=e[i],o=this.selectables.indexOf(l);o<0&&!t?(this.addClass(l,"ds-selectable"),l.addEventListener("click",this._onClick),this.selectables.push(l),s&&this.selected.indexOf(l)<0&&(this.addClass(l,"ds-selected"),this.selected.push(l))):o>-1&&t&&(this.removeClass(l,"ds-hover"),this.removeClass(l,"ds-selectable"),l.removeEventListener("click",this._onClick),this.selectables.splice(o,1),s&&this.selected.indexOf(l)>-1&&(this.removeClass(l,"ds-selected"),this.selected.splice(this.selected.indexOf(l),1)))}},DragSelect.prototype._onClick=function(e){var t=e.target;this.isMultiSelectKeyPressed(e),this.checkIfInsideSelection(!0),this.selectables.indexOf(t)>-1&&(this.toggle(t),this.reset())},DragSelect.prototype._createSelector=function(){var e=document.createElement("div");return e.style.position="absolute",this.customStyles||(e.style.background="rgba(0, 0, 255, 0.1)",e.style.border="1px solid rgba(0, 0, 255, 0.45)",e.style.display="none"),(this.area===document?document.body:this.area).appendChild(e),e},DragSelect.prototype.start=function(){this.area.addEventListener("mousedown",this._startUp)},DragSelect.prototype._startUp=function(e){this.selector.style.display="block",this.isMultiSelectKeyPressed(e),this._getStartingPositions(e),this.checkIfInsideSelection(!0),this.area.removeEventListener("mousedown",this._startUp),this.area.addEventListener("mousemove",this._handleMove),document.addEventListener("mouseup",this.reset)},DragSelect.prototype.isMultiSelectKeyPressed=function(e){this.multiSelectKeyPressed=!1;for(var t=0;t<this.multiSelectKeys.length;t++){e[this.multiSelectKeys[t]]&&(this.multiSelectKeyPressed=!0)}},DragSelect.prototype._getStartingPositions=function(e){this.initialCursorPos=this.getCursorPos(e,this.area),this.initialScroll=this.getScroll(this.area);var t={};t.x=this.initialCursorPos.x+this.initialScroll.x,t.y=this.initialCursorPos.y+this.initialScroll.y,t.w=0,t.h=0,this.updatePos(this.selector,t)},DragSelect.prototype._handleMove=function(e){var t=this.getPosition(e);this.updatePos(this.selector,t),this.checkIfInsideSelection(),this._autoScroll(e)},DragSelect.prototype.getPosition=function(e){var t=this.getCursorPos(e,this.area),s=this.getScroll(this.area),i={x:s.x-this.initialScroll.x,y:s.y-this.initialScroll.y},l={};return t.x>this.initialCursorPos.x-i.x?(l.x=this.initialCursorPos.x+this.initialScroll.x,l.w=t.x-this.initialCursorPos.x+i.x):(l.x=t.x+s.x,l.w=this.initialCursorPos.x-t.x-i.x),t.y>this.initialCursorPos.y-i.y?(l.y=this.initialCursorPos.y+this.initialScroll.y,l.h=t.y-this.initialCursorPos.y+i.y):(l.y=t.y+s.y,l.h=this.initialCursorPos.y-t.y-i.y),l},DragSelect.prototype.checkIfInsideSelection=function(e){for(var t=!1,s=0,i=this.selectables.length;s<i;s++){var l=this.selectables[s];this.isElementTouching(l,this.selector,this.area)?(this._handleSelection(l,e),t=!0):this._handleUnselection(l,e)}return t},DragSelect.prototype._handleSelection=function(e,t){if(this.hasClass(e,"ds-hover")&&!t)return!1;var s=this.selected.indexOf(e);s<0?this.select(e):s>-1&&this.multiSelectKeyPressed&&this.unselect(e),this.addClass(e,"ds-hover")},DragSelect.prototype._handleUnselection=function(e,t){if(!this.hasClass(e,"ds-hover")&&!t)return!1;this.selected.indexOf(e)>-1&&!this.multiSelectKeyPressed&&this.unselect(e),this.removeClass(e,"ds-hover")},DragSelect.prototype.select=function(e){return!(this.selected.indexOf(e)>-1)&&(this.selected.push(e),this.addClass(e,"ds-selected"),this.selectCallback(e),e)},DragSelect.prototype.unselect=function(e){return!(this.selected.indexOf(e)<0)&&(this.selected.splice(this.selected.indexOf(e),1),this.removeClass(e,"ds-selected"),this.unselectCallback(e),e)},DragSelect.prototype.toggle=function(e){return this.selected.indexOf(e)>-1?this.unselect(e):this.select(e),e},DragSelect.prototype.isElementTouching=function(e,t,s){var i=this.getScroll(s),l={y:t.getBoundingClientRect().top+i.y,x:t.getBoundingClientRect().left+i.x,h:t.offsetHeight,w:t.offsetWidth},o={y:e.getBoundingClientRect().top+i.y,x:e.getBoundingClientRect().left+i.x,h:e.offsetHeight,w:e.offsetWidth};return l.x<o.x+o.w&&l.x+l.w>o.x&&l.y<o.y+o.h&&l.h+l.y>o.y},DragSelect.prototype._autoScroll=function(e){var t=this.isCursorNearEdge(e,this.area),s=this.area===document?this.area.body:this.area;"top"===t&&s.scrollTop>0?s.scrollTop-=1:"bottom"===t?s.scrollTop+=1:"left"===t&&s.scrollLeft>0?s.scrollLeft-=1:"right"===t&&(s.scrollLeft+=1)},DragSelect.prototype.isCursorNearEdge=function(e,t){var s=this.getCursorPos(e,t),i=this.getAreaRect(t),l={x:Math.max(i.width/10,30),y:Math.max(i.height/10,30)},o=t===document?this.getScroll(document.body):{x:0,y:0};return s.y<l.y+o.y?"top":i.height-s.y+o.y<l.y?"bottom":i.width-s.x+o.x<l.x?"right":s.x<l.x+o.x&&"left"},DragSelect.prototype.reset=function(){this.selector.style.width="0",this.selector.style.height="0",this.selector.style.display="none",this.callback(this.selected),this.area.removeEventListener("mousemove",this._handleMove),this.area.addEventListener("mousedown",this._startUp)},DragSelect.prototype.stop=function(){this.reset(),this.area.removeEventListener("mousedown",this._startUp),document.removeEventListener("mouseup",this.reset)},DragSelect.prototype.getSelection=function(){return this.selected},DragSelect.prototype.addSelectables=function(e,t){var s=this.toArray(e);return this._handleSelectables(s,!1,t),e},DragSelect.prototype.getSelectables=function(){return this.selectables},DragSelect.prototype.removeSelectables=function(e,t){var s=this.toArray(e);return this._handleSelectables(s,!0,t),e},DragSelect.prototype.addClass=function(e,t){var s=e.className;return-1!==s.indexOf(t)?e:(""!==s&&(t=" "+t),e.className=s+t,e)},DragSelect.prototype.removeClass=function(e,t){var s=e.className,i=new RegExp(t+"\\b","g");return s=s.replace(i,""),e.className=s,e},DragSelect.prototype.hasClass=function(e,t){return e.className.indexOf(t)>-1},DragSelect.prototype.toArray=function(e){if(!e)return!1;if(!e.length&&this.isElement(e))return[e];for(var t=[],s=e.length-1;s>=0;s--)t[s]=e[s];return t},DragSelect.prototype.isElement=function(e){try{return e instanceof HTMLElement}catch(t){return"object"==typeof e&&1===e.nodeType&&"object"==typeof e.style&&"object"==typeof e.ownerDocument}},DragSelect.prototype.getCursorPos=function(e,t){var s={x:e.pageX||e.clientX,y:e.pageY||e.clientY},i=this.getAreaRect(t||document);return{x:s.x-i.left,y:s.y-i.top}},DragSelect.prototype.getScroll=function(e){return{y:e&&e.scrollTop>=0?e.scrollTop:0,x:e&&e.scrollLeft>=0?e.scrollLeft:0}},DragSelect.prototype.getAreaRect=function(e){if(e===document){var t={y:e.documentElement.clientHeight>0?e.documentElement.clientHeight:window.innerHeight,x:e.documentElement.clientWidth>0?e.documentElement.clientWidth:window.innerWidth};return{top:0,left:0,bottom:0,right:0,width:t.x,height:t.y}}return{top:e.getBoundingClientRect().top,left:e.getBoundingClientRect().left,bottom:e.getBoundingClientRect().bottom,right:e.getBoundingClientRect().right,width:e.offsetWidth,height:e.offsetHeight}},DragSelect.prototype.updatePos=function(e,t){return e.style.left=t.x+"px",e.style.top=t.y+"px",e.style.width=t.w+"px",e.style.height=t.h+"px",e},"undefined"!=typeof module&&null!==module?module.exports=DragSelect:window.DragSelect=DragSelect;
+function DragSelect(e){this.multiSelectKeyPressed,this.initialCursorPos,this.initialScroll,this.selected=[],this._createBindings(),this._setupOptions(e),this.start()}DragSelect.prototype._createBindings=function(){this._startUp=this._startUp.bind(this),this._handleMove=this._handleMove.bind(this),this.reset=this.reset.bind(this),this._onClick=this._onClick.bind(this)},DragSelect.prototype._setupOptions=function(e){this.selectables=[],this._handleSelectables(this.toArray(e.selectables)),this.multiSelectKeys=e.multiSelectKeys||["ctrlKey","shiftKey","metaKey"],this.selectCallback=e.onElementSelect||function(){},this.unselectCallback=e.onElementUnselect||function(){},this.callback=e.callback||function(){},this.area=e.area||document,this.customStyles=e.customStyles;var t=getComputedStyle(this.area),s="absolute"===t.position||"relative"===t.position||"fixed"===t.position;this.area===document||s||(this.area.style.position="relative"),this.selector=e.selector||this._createSelector(),this.addClass(this.selector,"ds-selector")},DragSelect.prototype._handleSelectables=function(e,t,s){for(var i=0;i<e.length;i++){var l=e[i],o=this.selectables.indexOf(l);o<0&&!t?(this.addClass(l,"ds-selectable"),l.addEventListener("click",this._onClick),this.selectables.push(l),s&&this.selected.indexOf(l)<0&&(this.addClass(l,"ds-selected"),this.selected.push(l))):o>-1&&t&&(this.removeClass(l,"ds-hover"),this.removeClass(l,"ds-selectable"),l.removeEventListener("click",this._onClick),this.selectables.splice(o,1),s&&this.selected.indexOf(l)>-1&&(this.removeClass(l,"ds-selected"),this.selected.splice(this.selected.indexOf(l),1)))}},DragSelect.prototype._onClick=function(e){var t=e.target;this.isMultiSelectKeyPressed(e),this.checkIfInsideSelection(!0),this.selectables.indexOf(t)>-1&&(this.toggle(t),this.reset())},DragSelect.prototype._createSelector=function(){var e=document.createElement("div");return e.style.position="absolute",this.customStyles||(e.style.background="rgba(0, 0, 255, 0.1)",e.style.border="1px solid rgba(0, 0, 255, 0.45)",e.style.display="none"),(this.area===document?document.body:this.area).appendChild(e),e},DragSelect.prototype.start=function(){this.area.addEventListener("mousedown",this._startUp)},DragSelect.prototype._startUp=function(e){this.selector.style.display="block",this.isMultiSelectKeyPressed(e),this._getStartingPositions(e),this.checkIfInsideSelection(!0),this.area.removeEventListener("mousedown",this._startUp),this.area.addEventListener("mousemove",this._handleMove),document.addEventListener("mouseup",this.reset)},DragSelect.prototype.isMultiSelectKeyPressed=function(e){this.multiSelectKeyPressed=!1;for(var t=0;t<this.multiSelectKeys.length;t++){e[this.multiSelectKeys[t]]&&(this.multiSelectKeyPressed=!0)}},DragSelect.prototype._getStartingPositions=function(e){this.initialCursorPos=this.getCursorPos(e,this.area),this.initialScroll=this.getScroll(this.area);var t={};t.x=this.initialCursorPos.x+this.initialScroll.x,t.y=this.initialCursorPos.y+this.initialScroll.y,t.w=0,t.h=0,this.updatePos(this.selector,t)},DragSelect.prototype._handleMove=function(e){var t=this.getPosition(e);this.updatePos(this.selector,t),this.checkIfInsideSelection(),this._autoScroll(e)},DragSelect.prototype.getPosition=function(e){var t=this.getCursorPos(e,this.area),s=this.getScroll(this.area),i={x:s.x-this.initialScroll.x,y:s.y-this.initialScroll.y},l={};return t.x>this.initialCursorPos.x-i.x?(l.x=this.initialCursorPos.x+this.initialScroll.x,l.w=t.x-this.initialCursorPos.x+i.x):(l.x=t.x+s.x,l.w=this.initialCursorPos.x-t.x-i.x),t.y>this.initialCursorPos.y-i.y?(l.y=this.initialCursorPos.y+this.initialScroll.y,l.h=t.y-this.initialCursorPos.y+i.y):(l.y=t.y+s.y,l.h=this.initialCursorPos.y-t.y-i.y),l},DragSelect.prototype.checkIfInsideSelection=function(e){for(var t=!1,s=0,i=this.selectables.length;s<i;s++){var l=this.selectables[s];this.isElementTouching(l,this.selector,this.area)?(this._handleSelection(l,e),t=!0):this._handleUnselection(l,e)}return t},DragSelect.prototype._handleSelection=function(e,t){if(this.hasClass(e,"ds-hover")&&!t)return!1;var s=this.selected.indexOf(e);s<0?this.select(e):s>-1&&this.multiSelectKeyPressed&&this.unselect(e),this.addClass(e,"ds-hover")},DragSelect.prototype._handleUnselection=function(e,t){if(!this.hasClass(e,"ds-hover")&&!t)return!1;this.selected.indexOf(e)>-1&&!this.multiSelectKeyPressed&&this.unselect(e),this.removeClass(e,"ds-hover")},DragSelect.prototype.select=function(e){return!(this.selected.indexOf(e)>-1)&&(this.selected.push(e),this.addClass(e,"ds-selected"),this.selectCallback(e),e)},DragSelect.prototype.unselect=function(e){return!(this.selected.indexOf(e)<0)&&(this.selected.splice(this.selected.indexOf(e),1),this.removeClass(e,"ds-selected"),this.unselectCallback(e),e)},DragSelect.prototype.toggle=function(e){return this.selected.indexOf(e)>-1?this.unselect(e):this.select(e),e},DragSelect.prototype.isElementTouching=function(e,t,s){var i=this.getScroll(s),l={y:t.getBoundingClientRect().top+i.y,x:t.getBoundingClientRect().left+i.x,h:t.offsetHeight,w:t.offsetWidth},o={y:e.getBoundingClientRect().top+i.y,x:e.getBoundingClientRect().left+i.x,h:e.offsetHeight,w:e.offsetWidth};return l.x<o.x+o.w&&l.x+l.w>o.x&&l.y<o.y+o.h&&l.h+l.y>o.y},DragSelect.prototype._autoScroll=function(e){var t=this.isCursorNearEdge(e,this.area),s=this.area===document?this.area.body:this.area;"top"===t&&s.scrollTop>0?s.scrollTop-=1:"bottom"===t?s.scrollTop+=1:"left"===t&&s.scrollLeft>0?s.scrollLeft-=1:"right"===t&&(s.scrollLeft+=1)},DragSelect.prototype.isCursorNearEdge=function(e,t){var s=this.getCursorPos(e,t),i=this.getAreaRect(t),l={x:Math.max(i.width/10,30),y:Math.max(i.height/10,30)},o=t===document?this.getScroll(document.body):{x:0,y:0};return s.y<l.y+o.y?"top":i.height-s.y+o.y<l.y?"bottom":i.width-s.x+o.x<l.x?"right":s.x<l.x+o.x&&"left"},DragSelect.prototype.reset=function(){this.selector.style.width="0",this.selector.style.height="0",this.selector.style.display="none",this.callback(this.selected),this.area.removeEventListener("mousemove",this._handleMove),this.area.addEventListener("mousedown",this._startUp)},DragSelect.prototype.stop=function(){this.reset(),this.area.removeEventListener("mousedown",this._startUp),document.removeEventListener("mouseup",this.reset)},DragSelect.prototype.getSelection=function(){return this.selected},DragSelect.prototype.addSelectables=function(e,t){var s=this.toArray(e);return this._handleSelectables(s,!1,t),e},DragSelect.prototype.getSelectables=function(){return this.selectables},DragSelect.prototype.removeSelectables=function(e,t){var s=this.toArray(e);return this._handleSelectables(s,!0,t),e},DragSelect.prototype.addClass=function(e,t){var s=e.className;return-1!==s.indexOf(t)?e:(""!==s&&(t=" "+t),e.className=s+t,e)},DragSelect.prototype.removeClass=function(e,t){var s=e.className,i=new RegExp(t+"\\b","g");return s=s.replace(i,""),e.className=s,e},DragSelect.prototype.hasClass=function(e,t){return e.className.indexOf(t)>-1},DragSelect.prototype.toArray=function(e){if(!e)return!1;if(!e.length&&this.isElement(e))return[e];for(var t=[],s=e.length-1;s>=0;s--)t[s]=e[s];return t},DragSelect.prototype.isElement=function(e){try{return e instanceof HTMLElement}catch(t){return"object"==typeof e&&1===e.nodeType&&"object"==typeof e.style&&"object"==typeof e.ownerDocument}},DragSelect.prototype.getCursorPos=function(e,t){var s={x:e.pageX||e.clientX,y:e.pageY||e.clientY},i=this.getAreaRect(t||document);return{x:s.x-i.left,y:s.y-i.top}},DragSelect.prototype.getScroll=function(e){return{y:e&&e.scrollTop>=0?e.scrollTop:0,x:e&&e.scrollLeft>=0?e.scrollLeft:0}},DragSelect.prototype.getAreaRect=function(e){if(e===document){var t={y:e.documentElement.clientHeight>0?e.documentElement.clientHeight:window.innerHeight,x:e.documentElement.clientWidth>0?e.documentElement.clientWidth:window.innerWidth};return{top:0,left:0,bottom:0,right:0,width:t.x,height:t.y}}return{top:e.getBoundingClientRect().top,left:e.getBoundingClientRect().left,bottom:e.getBoundingClientRect().bottom,right:e.getBoundingClientRect().right,width:e.offsetWidth,height:e.offsetHeight}},DragSelect.prototype.updatePos=function(e,t){return e.style.left=t.x+"px",e.style.top=t.y+"px",e.style.width=t.w+"px",e.style.height=t.h+"px",e},"undefined"!=typeof module&&null!==module?module.exports=DragSelect:window.DragSelect=DragSelect;

package.json

 {
   "name": "dragselect",
-  "version": "1.7.3",
+  "version": "1.7.4",
   "description": "easy javascript drag select functionality to your projects",
@@ -5,0 +5,0 @@ "main": "./dist/ds.min.js",

src/DragSelect.js

@@ -123,2 +123,9 @@ /*
 
+  // Area has to have a special position attribute for calculations
+  var computedArea = getComputedStyle(this.area);
+  var isAbsolute = computedArea.position === 'absolute' || computedArea.position === 'relative' || computedArea.position === 'fixed';
+  if(this.area !== document && !isAbsolute) {
+    this.area.style.position = 'relative';
+  }
+
   // Selector
@@ -125,0 +132,0 @@ this.selector = options.selector || this._createSelector();

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1173241

increased by0.07%

Lines of code

1742

increased by0.69%

No dependency changes