diff --git a/select.coffee b/select.coffee index c690aa4..5f8be33 100644 --- a/select.coffee +++ b/select.coffee @@ -141,6 +141,12 @@ class Select if hasClass(e.target, 'select-option') @highlightOption e.target + @drop.addEventListener 'mouseover', (e) => + document.body.style.overflow = 'hidden'; + + @drop.addEventListener 'mouseout', (e) => + document.body.style.overflow = 'auto'; + @content = document.createElement 'div' addClass @content, 'select-content' @drop.appendChild @content diff --git a/select.js b/select.js index ff2f297..4f82142 100644 --- a/select.js +++ b/select.js @@ -170,6 +170,12 @@ return _this.highlightOption(e.target); } }); + this.drop.addEventListener('mouseover', function(e) { + return document.body.style.overflow = 'hidden'; + }); + this.drop.addEventListener('mouseout', function(e) { + return document.body.style.overflow = 'auto'; + }); this.content = document.createElement('div'); addClass(this.content, 'select-content'); return this.drop.appendChild(this.content); diff --git a/select.min.js b/select.min.js index 16268a8..3fb5244 100644 --- a/select.min.js +++ b/select.min.js @@ -1,2 +1,2 @@ /*! select.js 0.3.0 */ -(function(){var a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s;s=Tether.Utils,i=s.extend,g=s.addClass,n=s.removeClass,l=s.hasClass,j=s.getBounds,b=13,c=27,d=32,f=38,a=40,r="ontouchstart"in document.documentElement,h=r?"touchstart":"click",q=function(a){var b,c,d,e;if(!(a.length>1))return!1;for(c=a.charAt(0),d=0,e=a.length;e>d;d++)if(b=a[d],b!==c)return!1;return!0},k=function(){var a;return null!=(a=document.querySelector(".select-target-focused"))?a.selectInstance:void 0},o="",p=void 0,m=void 0,document.addEventListener("keypress",function(a){var b,c;if((c=k())&&0!==a.charCode)return b=String.fromCharCode(a.charCode),q(o)&&!q(o+b)?o=b:(o+=b,m===b&&(o+=b)),m=b,a.keyCode===d&&a.preventDefault(),c.isOpen()?c.highlightOptionByText(o):c.selectOptionByText(o),clearTimeout(p),p=setTimeout(function(){return o=""},500)}),document.addEventListener("keydown",function(e){var g,h,i;if(g=k())if(((h=e.keyCode)===f||h===a||h===c)&&e.preventDefault(),g.isOpen())switch(e.keyCode){case f:case a:return g.moveHighlight(e.keyCode);case b:return g.selectHighlightedOption();case c:return g.close(),g.target.focus()}else if((i=e.keyCode)===f||i===a||i===d)return g.open()}),e=function(){function a(b){this.options=b,this.options=i({},a.defaults,this.options),this.select=this.options.el,this.setupTarget(),this.renderTarget(),this.setupDrop(),this.renderDrop(),this.setupSelect(),this.setupTether(),this.bindClick()}return a.defaults={alignToHighlighed:"auto",className:"select-theme-default"},a.prototype.setupTarget=function(){var a=this;return this.target=document.createElement("a"),this.target.href="javascript:;",g(this.target,"select-target"),this.options.className&&g(this.target,this.options.className),this.target.selectInstance=this,this.target.addEventListener("click",function(){return a.isOpen()?a.target.blur():a.target.focus()}),this.target.addEventListener("focus",function(){return g(a.target,"select-target-focused")}),this.target.addEventListener("blur",function(b){return a.isOpen()?b.relatedTarget&&!a.drop.contains(b.relatedTarget)?a.close():void 0:n(a.target,"select-target-focused")}),this.select.parentNode.insertBefore(this.target,this.select.nextSibling),this.select.style.display="none"},a.prototype.setupDrop=function(){var a=this;return this.drop=document.createElement("div"),g(this.drop,"select"),this.options.className&&g(this.drop,this.options.className),document.body.appendChild(this.drop),this.drop.addEventListener("click",function(b){return l(b.target,"select-option")?a.pickOption(b.target):void 0}),this.drop.addEventListener("mousemove",function(b){return l(b.target,"select-option")?a.highlightOption(b.target):void 0}),this.content=document.createElement("div"),g(this.content,"select-content"),this.drop.appendChild(this.content)},a.prototype.open=function(){var a,b,c=this;return g(this.drop,"select-open"),g(this.target,"select-open"),setTimeout(function(){return c.tether.enable()}),(b=this.drop.querySelector(".select-option-selected"))?(this.highlightOption(b),this.scrollDropContentToOption(b),a=function(){var a,d,e;return l(c.drop,"tether-abutted-left")||l(c.drop,"tether-abutted-bottom")?(a=j(c.drop),e=j(b),d=a.top-(e.top+e.height),c.drop.style.top=(parseFloat(c.drop.style.top)||0)+d+"px"):void 0},"always"===this.options.alignToHighlighted||"auto"===this.options.alignToHighlighted&&this.content.scrollHeight<=this.content.clientHeight?setTimeout(a):void 0):void 0},a.prototype.close=function(){return this.tether.disable(),n(this.drop,"select-open"),n(this.target,"select-open"),n(this.target,"select-target-focused")},a.prototype.toggle=function(){return this.isOpen()?this.close():this.open()},a.prototype.isOpen=function(){return l(this.drop,"select-open")},a.prototype.bindClick=function(){var a=this;return this.target.addEventListener(h,function(){return a.toggle()}),document.addEventListener(h,function(b){return!a.isOpen()||b.target===a.drop||a.drop.contains(b.target)||b.target===a.target||a.target.contains(b.target)?void 0:a.close()})},a.prototype.setupTether=function(){return this.tether=new Tether({element:this.drop,target:this.target,attachment:"top left",targetAttachment:"bottom left",classPrefix:"select",constraints:[{to:"window",pin:!0,attachment:"together"}]})},a.prototype.renderTarget=function(){var a,b,c,d;for(this.target.innerHTML="",d=this.select.querySelectorAll("option"),b=0,c=d.length;c>b;b++)if(a=d[b],a.selected){this.target.innerHTML=a.innerHTML;break}return this.target.appendChild(document.createElement("b"))},a.prototype.renderDrop=function(){var a,b,c,d,e,f;for(c=document.createElement("ul"),g(c,"select-options"),f=this.select.querySelectorAll("option"),d=0,e=f.length;e>d;d++)a=f[d],b=document.createElement("li"),g(b,"select-option"),b.setAttribute("data-value",a.value),b.innerHTML=a.innerHTML,a.selected&&g(b,"select-option-selected"),c.appendChild(b);return this.content.innerHTML="",this.content.appendChild(c)},a.prototype.setupSelect=function(){var a=this;return this.select.selectInstance=this,this.select.addEventListener("change",function(){return a.renderDrop(),a.renderTarget()})},a.prototype.findOptionByText=function(a){var b,c,d,e,f,g,h,i;for(h=this.drop.querySelectorAll(".select-option"),c=this.isOpen?this.drop.querySelector(".select-option-highlight"):this.drop.querySelector(".select-option-selected"),b=Array.prototype.indexOf.call(h,c),-1===b&&(b=0),a=a.toLowerCase(),e=q(a),d=b,e&&(d+=1),i=0;i=h.length&&(d=0),f=h[d],g=f.innerHTML.toLowerCase(),e&&g[0]===a[0]||g.substr(0,a.length)===a)return f;i+=1,d+=1}},a.prototype.highlightOptionByText=function(a){var b;if(this.isOpen()&&(b=this.findOptionByText(a)))return this.highlightOption(b),this.scrollDropContentToOption(b)},a.prototype.selectOptionByText=function(a){var b;if(b=this.findOptionByText(a))return this.select.value=b.getAttribute("data-value"),this.triggerChange()},a.prototype.highlightOption=function(a){var b;return b=this.drop.querySelector(".select-option-highlight"),null!=b&&n(b,"select-option-highlight"),g(a,"select-option-highlight")},a.prototype.moveHighlight=function(a){var b,c,d,e;return(c=this.drop.querySelector(".select-option-highlight"))?(e=this.drop.querySelectorAll(".select-option"),b=Array.prototype.indexOf.call(e,c),b>=0&&(a===f?b-=1:highlightedIndex+=1,!(0>b||highlightedIndex>=e.length))?(d=e[highlightedIndex],this.highlightOption(d),this.scrollDropContentToOption(d)):void 0):this.highlightOption(this.drop.querySelector(".select-option"))},a.prototype.scrollDropContentToOption=function(a){var b,c;return this.content.scrollHeight>this.content.clientHeight?(b=j(this.content),c=j(a),this.content.scrollTop=c.top-(b.top-this.content.scrollTop)):void 0},a.prototype.selectHighlightedOption=function(){return this.pickOption(this.drop.querySelector(".select-option-highlight"))},a.prototype.pickOption=function(a){var b=this;return this.select.value=a.getAttribute("data-value"),this.triggerChange(),setTimeout(function(){return b.close(),b.target.focus()})},a.prototype.triggerChange=function(){var a;return a=document.createEvent("HTMLEvents"),a.initEvent("change",!0,!1),this.select.dispatchEvent(a)},a}(),window.Select=e}).call(this); \ No newline at end of file +(function(){var a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s;s=Tether.Utils,i=s.extend,g=s.addClass,n=s.removeClass,l=s.hasClass,j=s.getBounds,b=13,c=27,d=32,f=38,a=40,r="ontouchstart"in document.documentElement,h=r?"touchstart":"click",q=function(a){var b,c,d,e;if(!(a.length>1))return!1;for(c=a.charAt(0),d=0,e=a.length;e>d;d++)if(b=a[d],b!==c)return!1;return!0},k=function(){var a;return null!=(a=document.querySelector(".select-target-focused"))?a.selectInstance:void 0},o="",p=void 0,m=void 0,document.addEventListener("keypress",function(a){var b,c;if((c=k())&&0!==a.charCode)return b=String.fromCharCode(a.charCode),q(o)&&!q(o+b)?o=b:(o+=b,m===b&&(o+=b)),m=b,a.keyCode===d&&a.preventDefault(),c.isOpen()?c.highlightOptionByText(o):c.selectOptionByText(o),clearTimeout(p),p=setTimeout(function(){return o=""},500)}),document.addEventListener("keydown",function(e){var g,h,i;if(g=k())if(((h=e.keyCode)===f||h===a||h===c)&&e.preventDefault(),g.isOpen())switch(e.keyCode){case f:case a:return g.moveHighlight(e.keyCode);case b:return g.selectHighlightedOption();case c:return g.close(),g.target.focus()}else if((i=e.keyCode)===f||i===a||i===d)return g.open()}),e=function(){function a(b){this.options=b,this.options=i({},a.defaults,this.options),this.select=this.options.el,this.setupTarget(),this.renderTarget(),this.setupDrop(),this.renderDrop(),this.setupSelect(),this.setupTether(),this.bindClick()}return a.defaults={alignToHighlighed:"auto",className:"select-theme-default"},a.prototype.setupTarget=function(){var a=this;return this.target=document.createElement("a"),this.target.href="javascript:;",g(this.target,"select-target"),this.options.className&&g(this.target,this.options.className),this.target.selectInstance=this,this.target.addEventListener("click",function(){return a.isOpen()?a.target.blur():a.target.focus()}),this.target.addEventListener("focus",function(){return g(a.target,"select-target-focused")}),this.target.addEventListener("blur",function(b){return a.isOpen()?b.relatedTarget&&!a.drop.contains(b.relatedTarget)?a.close():void 0:n(a.target,"select-target-focused")}),this.select.parentNode.insertBefore(this.target,this.select.nextSibling),this.select.style.display="none"},a.prototype.setupDrop=function(){var a=this;return this.drop=document.createElement("div"),g(this.drop,"select"),this.options.className&&g(this.drop,this.options.className),document.body.appendChild(this.drop),this.drop.addEventListener("click",function(b){return l(b.target,"select-option")?a.pickOption(b.target):void 0}),this.drop.addEventListener("mousemove",function(b){return l(b.target,"select-option")?a.highlightOption(b.target):void 0}),this.drop.addEventListener("mouseover",function(){return document.body.style.overflow="hidden"}),this.drop.addEventListener("mouseout",function(){return document.body.style.overflow="auto"}),this.content=document.createElement("div"),g(this.content,"select-content"),this.drop.appendChild(this.content)},a.prototype.open=function(){var a,b,c=this;return g(this.drop,"select-open"),g(this.target,"select-open"),setTimeout(function(){return c.tether.enable()}),(b=this.drop.querySelector(".select-option-selected"))?(this.highlightOption(b),this.scrollDropContentToOption(b),a=function(){var a,d,e;return l(c.drop,"tether-abutted-left")||l(c.drop,"tether-abutted-bottom")?(a=j(c.drop),e=j(b),d=a.top-(e.top+e.height),c.drop.style.top=(parseFloat(c.drop.style.top)||0)+d+"px"):void 0},"always"===this.options.alignToHighlighted||"auto"===this.options.alignToHighlighted&&this.content.scrollHeight<=this.content.clientHeight?setTimeout(a):void 0):void 0},a.prototype.close=function(){return this.tether.disable(),n(this.drop,"select-open"),n(this.target,"select-open"),n(this.target,"select-target-focused")},a.prototype.toggle=function(){return this.isOpen()?this.close():this.open()},a.prototype.isOpen=function(){return l(this.drop,"select-open")},a.prototype.bindClick=function(){var a=this;return this.target.addEventListener(h,function(){return a.toggle()}),document.addEventListener(h,function(b){return!a.isOpen()||b.target===a.drop||a.drop.contains(b.target)||b.target===a.target||a.target.contains(b.target)?void 0:a.close()})},a.prototype.setupTether=function(){return this.tether=new Tether({element:this.drop,target:this.target,attachment:"top left",targetAttachment:"bottom left",classPrefix:"select",constraints:[{to:"window",pin:!0,attachment:"together"}]})},a.prototype.renderTarget=function(){var a,b,c,d;for(this.target.innerHTML="",d=this.select.querySelectorAll("option"),b=0,c=d.length;c>b;b++)if(a=d[b],a.selected){this.target.innerHTML=a.innerHTML;break}return this.target.appendChild(document.createElement("b"))},a.prototype.renderDrop=function(){var a,b,c,d,e,f;for(c=document.createElement("ul"),g(c,"select-options"),f=this.select.querySelectorAll("option"),d=0,e=f.length;e>d;d++)a=f[d],b=document.createElement("li"),g(b,"select-option"),b.setAttribute("data-value",a.value),b.innerHTML=a.innerHTML,a.selected&&g(b,"select-option-selected"),c.appendChild(b);return this.content.innerHTML="",this.content.appendChild(c)},a.prototype.setupSelect=function(){var a=this;return this.select.selectInstance=this,this.select.addEventListener("change",function(){return a.renderDrop(),a.renderTarget()})},a.prototype.findOptionByText=function(a){var b,c,d,e,f,g,h,i;for(h=this.drop.querySelectorAll(".select-option"),c=this.isOpen?this.drop.querySelector(".select-option-highlight"):this.drop.querySelector(".select-option-selected"),b=Array.prototype.indexOf.call(h,c),-1===b&&(b=0),a=a.toLowerCase(),e=q(a),d=b,e&&(d+=1),i=0;i=h.length&&(d=0),f=h[d],g=f.innerHTML.toLowerCase(),e&&g[0]===a[0]||g.substr(0,a.length)===a)return f;i+=1,d+=1}},a.prototype.highlightOptionByText=function(a){var b;if(this.isOpen()&&(b=this.findOptionByText(a)))return this.highlightOption(b),this.scrollDropContentToOption(b)},a.prototype.selectOptionByText=function(a){var b;if(b=this.findOptionByText(a))return this.select.value=b.getAttribute("data-value"),this.triggerChange()},a.prototype.highlightOption=function(a){var b;return b=this.drop.querySelector(".select-option-highlight"),null!=b&&n(b,"select-option-highlight"),g(a,"select-option-highlight")},a.prototype.moveHighlight=function(a){var b,c,d,e;return(c=this.drop.querySelector(".select-option-highlight"))?(e=this.drop.querySelectorAll(".select-option"),b=Array.prototype.indexOf.call(e,c),b>=0&&(a===f?b-=1:highlightedIndex+=1,!(0>b||highlightedIndex>=e.length))?(d=e[highlightedIndex],this.highlightOption(d),this.scrollDropContentToOption(d)):void 0):this.highlightOption(this.drop.querySelector(".select-option"))},a.prototype.scrollDropContentToOption=function(a){var b,c;return this.content.scrollHeight>this.content.clientHeight?(b=j(this.content),c=j(a),this.content.scrollTop=c.top-(b.top-this.content.scrollTop)):void 0},a.prototype.selectHighlightedOption=function(){return this.pickOption(this.drop.querySelector(".select-option-highlight"))},a.prototype.pickOption=function(a){var b=this;return this.select.value=a.getAttribute("data-value"),this.triggerChange(),setTimeout(function(){return b.close(),b.target.focus()})},a.prototype.triggerChange=function(){var a;return a=document.createEvent("HTMLEvents"),a.initEvent("change",!0,!1),this.select.dispatchEvent(a)},a}(),window.Select=e}).call(this); \ No newline at end of file