var sizeAndPositionBackgroundMedia = function (backgroundMedia) { var mediaWidth = backgroundMedia.clientWidth, mediaHeight = backgroundMedia.clientHeight, windowWidth = window.innerWidth, windowHeight = window.innerHeight, widthDifference = mediaWidth / windowWidth, heightDifference = mediaHeight / windowHeight; // console.log('backgroundMedia', backgroundMedia, mediaWidth, mediaHeight, windowWidth, windowHeight, 'widthDifference', widthDifference, 'heightDifference', heightDifference); console.log('resize'); if (widthDifference < heightDifference) { var heightOffset = ((mediaHeight / widthDifference) - windowHeight) / 2 * -1; if (widthDifference < 1) { heightOffset = ((mediaHeight / widthDifference) / 2) * -1; } backgroundMedia.style.width = '100%'; backgroundMedia.style.height = 'auto'; backgroundMedia.style['margin-top'] = heightOffset + 'px'; } else { var widthOffset = ((mediaWidth / heightDifference) - windowWidth) / 2 * -1; if (heightDifference < 1) { widthOffset = ((mediaWidth / heightDifference) / 2) * -1; } backgroundMedia.style.height = '100%'; backgroundMedia.style.width = 'auto'; backgroundMedia.style['margin-left'] = widthOffset + 'px'; } if (classie.hasClass(backgroundMedia, 'lazyload')) { lazyloadBackgroundMedia(backgroundMedia); } };
var openSubNav = function (event) { // console.log('moving on nav'); var target = getEventTarget(event); if (classie.hasClass(target, 'has-sub-nav')) { self.showSubNav(target.getAttribute('data-navitr')); self.$navbar.removeEventListener('mousemove', openSubNav); } };
var autoSubmitFormHandler = function (e) { var formElement = this.form; if (classie.hasClass(formElement, '_pea-ajax-form')) { ajaxForm.get(e, formElement); } else { formElement.submit(); } };
openSubNav = function(event){ // console.log("moving on nav"); var target = getEventTarget(event); if(classie.hasClass(target,"has-sub-nav")){ self.showSubNav(target.getAttribute("data-navitr")); // console.log("moving on subnav",target.getAttribute("data-navitr")); self.$navbar.removeEventListener("mousemove",openSubNav); } };
this.init = function(){ // do it for every element that matches selector for(var x=0; x<thisElements.length;x++){ var touchDif, barHeight, divS = '<div></div>'; releaseScroll = false; // used in event handlers and for better minification me = thisElements[x]; classie.addClass(me,o.addedOriginalClass); // ensure we are not binding it again if( classie.hasClass(me.parentNode,o.wrapperClass) ){ // start from last bar position var offset = me.scrollTop; bar = me.parentNode.querSelector('.' + o.barClass),// find bar and rail, rail = me.parentNode.querSelector('.' + o.railClass); getBarHeight(); // check if we should scroll existing instance if (typeof options==='object'){ // Pass height: auto to an existing slimscroll object to force a resize after contents have changed if ( 'height' in options && options.height === 'auto' ) { me.parentNode.style.height='auto'; me.style.height='auto'; var height = me.parentNode.parentNode.scrollHeight; me.parent.style.height=height; me.style.height=height; } if ('scrollTo' in options){ // jump to a static point offset = parseInt(o.scrollTo,10); } else if ('scrollBy' in options){ // jump by value pixels offset += parseInt(o.scrollBy,10); } else if ('destroy' in options){ // remove slimscroll elements domhelper.removeElement(bar); domhelper.removeElement(rail); domhelper.unwrapElement(me); return; } // scroll content by the given offset // console.log("add scrollContent"); scrollContent(offset, false, true,me); } return; } // optionally set height to the parent's height o.height = (options.height === 'auto') ? me.parentNode.offsetHeight : options.height; // wrap content var wrapper = document.createElement("div"); classie.addClass(wrapper,o.wrapperClass); wrapper.style.position= 'relative'; wrapper.style.overflow= 'hidden'; wrapper.style.width= o.width; wrapper.style.height= o.height; // update style for the div me.style.overflow= 'hidden'; me.style.width= o.width; me.style.height= o.height; // create scrollbar rail rail = document.createElement("div"); classie.addClass(rail,o.railClass); rail.style.width= o.size; rail.style.height= '100%'; rail.style.position= 'absolute'; rail.style.top= 0; rail.style.display= (o.alwaysVisible && o.railVisible) ? 'block' : 'none'; rail.style['border-radius']= o.railBorderRadius; rail.style.background= o.railColor; rail.style.opacity= o.railOpacity; rail.style.zIndex= 90; // create scrollbar bar = document.createElement("div"); classie.addClass(bar,o.barClass); bar.style.background= o.color; bar.style.width= o.size; bar.style.position= 'absolute'; bar.style.top= 0; bar.style.opacity= o.opacity; bar.style.display= o.alwaysVisible ? 'block' : 'none'; bar.style['border-radius'] = o.borderRadius; bar.style.BorderRadius= o.borderRadius; bar.style.MozBorderRadius= o.borderRadius; bar.style.WebkitBorderRadius= o.borderRadius; bar.style.zIndex= 99; // set position if(o.position === 'right'){ rail.style.right = o.distance; bar.style.right = o.distance; } else{ rail.style.left = o.distance; bar.style.left = o.distance; } // wrap it domhelper.elementWrap(me,wrapper); // append to parent div me.parentNode.appendChild(bar); me.parentNode.appendChild(rail); // set up initial height getBarHeight(); // make it draggable and no longer dependent on the jqueryUI bar.addEventListener("mousedown",mousedownEventHandler); document.addEventListener("mouseup",mouseupEventHandler); bar.addEventListener("selectstart",selectstartEventHandler); bar.addEventListener("mouseover",mouseoverEventHandler); bar.addEventListener("mouseleave",mouseleaveEventHandler); bar.addEventListener('touchstart',scrollContainerTouchStartEventHandler); rail.addEventListener("mouseover",railMouseOverEventHandler); rail.addEventListener("mouseleave",railMouseLeaveEventHandler); me.addEventListener("mouseover",scrollContainerMouseOverEventHandler); me.addEventListener("mouseleave",scrollContainerMouseLeaveEventHandler); me.addEventListener('DOMMouseScroll', mouseWheelEventHandler, false ); me.addEventListener('mousewheel', mouseWheelEventHandler, false ); } // check start position if (o.start === 'bottom'){ // scroll content to bottom bar.style.top= me.offsetHeight - bar.offsetHeight; scrollContent(0, true); } else if (o.start !== 'top'){ // assume jQuery selector scrollContent( domhelper.getPosition(document.querSelector(o.start).top, null, true)); // make sure bar stays hidden if (!o.alwaysVisible) { domhelper.elementHideCss(bar); } } document.addEventListener('touchmove',scrollContainerTouchMoveEventHandler); }.bind(this);