From a946447ddabef1d7a0cc8ea622464dde8ce67dd8 Mon Sep 17 00:00:00 2001 From: Aurovrata V Date: Sun, 20 Sep 2020 22:16:04 +0530 Subject: [PATCH 1/6] slide index add a slide index data attribute to each slide upon initialisation. line 103, [].forEach.call(_.slides, function (_) { _.classList.add('glider-slide') }) changed to [].forEach.call(_.slides, function (_,i) { _.classList.add('glider-slide'); _.setAttribute('data-gslide',i) }) --- glider.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/glider.js b/glider.js index 3d4484d..49c45f8 100644 --- a/glider.js +++ b/glider.js @@ -100,8 +100,9 @@ _.slides = _.track.children; - [].forEach.call(_.slides, function (_) { - _.classList.add('glider-slide') + [].forEach.call(_.slides, function (_,i) { + _.classList.add('glider-slide'); + _.setAttribute('data-gslide',i) }) _.containerWidth = _.ele.clientWidth From fc35cb70f81836514fcdc3a994dc3ab3323334ef Mon Sep 17 00:00:00 2001 From: Aurovrata V Date: Sun, 20 Sep 2020 22:16:56 +0530 Subject: [PATCH 2/6] slide index slide index attribute --- glider.min.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/glider.min.js b/glider.min.js index 81ca60a..1f54611 100644 --- a/glider.min.js +++ b/glider.min.js @@ -13,4 +13,4 @@ Release Date: October 25th, 2018 */ -!function(e){"function"==typeof define&&define.amd?define(e):"object"==typeof exports?module.exports=e():e()}(function(){var a="undefined"!=typeof window?window:this,e=a.Glider=function(e,t){var o=this;if(e._glider)return e._glider;if(o.ele=e,o.ele.classList.add("glider"),(o.ele._glider=o).opt=Object.assign({},{slidesToScroll:1,slidesToShow:1,resizeLock:!0,duration:.5,easing:function(e,t,o,i,r){return i*(t/=r)*t+o}},t),o.animate_id=o.page=o.slide=0,o.arrows={},o._opt=o.opt,o.opt.skipTrack)o.track=o.ele.children[0];else for(o.track=document.createElement("div"),o.ele.appendChild(o.track);1!==o.ele.children.length;)o.track.appendChild(o.ele.children[0]);o.track.classList.add("glider-track"),o.init(),o.resize=o.init.bind(o,!0),o.event(o.ele,"add",{scroll:o.updateControls.bind(o)}),o.event(a,"add",{resize:o.resize})},t=e.prototype;return t.init=function(e,t){var o=this,i=0,r=0;o.slides=o.track.children,[].forEach.call(o.slides,function(e){e.classList.add("glider-slide")}),o.containerWidth=o.ele.clientWidth;var s=o.settingsBreakpoint();if(t=t||s,"auto"===o.opt.slidesToShow||void 0!==o.opt._autoSlide){var l=o.containerWidth/o.opt.itemWidth;o.opt._autoSlide=o.opt.slidesToShow=o.opt.exactWidth?l:Math.floor(l)}"auto"===o.opt.slidesToScroll&&(o.opt.slidesToScroll=Math.floor(o.opt.slidesToShow)),o.itemWidth=o.opt.exactWidth?o.opt.itemWidth:o.containerWidth/o.opt.slidesToShow,[].forEach.call(o.slides,function(e){e.style.height="auto",e.style.width=o.itemWidth+"px",i+=o.itemWidth,r=Math.max(e.offsetHeight,r)}),o.track.style.width=i+"px",o.trackWidth=i,o.isDrag=!1,o.preventClick=!1,o.opt.resizeLock&&o.scrollTo(o.slide*o.itemWidth,0),(s||t)&&(o.bindArrows(),o.buildDots(),o.bindDrag()),o.updateControls(),o.emit(e?"refresh":"loaded")},t.bindDrag=function(){var t=this;t.mouse=t.mouse||t.handleMouse.bind(t);function e(){t.mouseDown=void 0,t.ele.classList.remove("drag"),t.isDrag&&(t.preventClick=!0),t.isDrag=!1}var o={mouseup:e,mouseleave:e,mousedown:function(e){e.preventDefault(),e.stopPropagation(),t.mouseDown=e.clientX,t.ele.classList.add("drag")},mousemove:t.mouse,click:function(e){t.preventClick&&(e.preventDefault(),e.stopPropagation()),t.preventClick=!1}};t.ele.classList.toggle("draggable",!0===t.opt.draggable),t.event(t.ele,"remove",o),t.opt.draggable&&t.event(t.ele,"add",o)},t.buildDots=function(){var e=this;if(e.opt.dots){if("string"==typeof e.opt.dots?e.dots=document.querySelector(e.opt.dots):e.dots=e.opt.dots,e.dots){e.dots.innerHTML="",e.dots.classList.add("glider-dots");for(var t=0;t=d.trackWidth;d.opt.rewind||(d.arrows.prev&&d.arrows.prev.classList.toggle("disabled",d.ele.scrollLeft<=0||t),d.arrows.next&&d.arrows.next.classList.toggle("disabled",Math.ceil(d.ele.scrollLeft+d.containerWidth)>=Math.floor(d.trackWidth)||t)),d.slide=Math.round(d.ele.scrollLeft/d.itemWidth),d.page=Math.round(d.ele.scrollLeft/d.containerWidth);var c=d.slide+Math.floor(Math.floor(d.opt.slidesToShow)/2),h=Math.floor(d.opt.slidesToShow)%2?0:c+1;1===Math.floor(d.opt.slidesToShow)&&(h=0),d.ele.scrollLeft+d.containerWidth>=Math.floor(d.trackWidth)&&(d.page=d.dots?d.dots.children.length-1:0),[].forEach.call(d.slides,function(e,t){var o=e.classList,i=o.contains("visible"),r=d.ele.scrollLeft,s=d.ele.scrollLeft+d.containerWidth,l=d.itemWidth*t,n=l+d.itemWidth;[].forEach.call(o,function(e){/^left|right/.test(e)&&o.remove(e)}),o.toggle("active",d.slide===t),c===t||h&&h===t?o.add("center"):(o.remove("center"),o.add([t=r&&Math.floor(n)<=s;o.toggle("visible",a),a!==i&&d.emit("slide-"+(a?"visible":"hidden"),{slide:t})}),d.dots&&[].forEach.call(d.dots.children,function(e,t){e.classList.toggle("active",d.page===t)}),e&&d.opt.scrollLock&&(clearTimeout(d.scrollLock),d.scrollLock=setTimeout(function(){clearTimeout(d.scrollLock),.02d.containerWidth+d.ele.scrollLeft&&d.scrollItem(d.getCurrentSlide()))},d.opt.scrollLockDelay||250))},t.getCurrentSlide=function(){var e=this;return e.round(e.ele.scrollLeft/e.itemWidth)},t.scrollItem=function(e,t,o){o&&o.preventDefault();var i=this,r=e;if(++i.animate_id,!0===t)e*=i.containerWidth,e=Math.round(e/i.itemWidth)*i.itemWidth;else{if("string"==typeof e){var s="prev"===e;if(e=i.opt.slidesToScroll%1||i.opt.slidesToShow%1?i.getCurrentSlide():i.slide,s?e-=i.opt.slidesToScroll:e+=i.opt.slidesToScroll,i.opt.rewind){var l=i.ele.scrollLeft;e=s&&!l?i.slides.length:!s&&l+i.containerWidth>=Math.floor(i.trackWidth)?0:e}}e=Math.max(Math.min(e,i.slides.length),0),i.slide=e,e=i.itemWidth*e}return i.scrollTo(e,i.opt.duration*Math.abs(i.ele.scrollLeft-e),function(){i.updateControls(),i.emit("animated",{value:r,type:"string"==typeof r?"arrow":t?"dot":"slide"})}),!1},t.settingsBreakpoint=function(){var e=this,t=e._opt.responsive;if(t){t.sort(function(e,t){return t.breakpoint-e.breakpoint});for(var o=0;o=i.breakpoint)return e.breakpoint!==i.breakpoint&&(e.opt=Object.assign({},e._opt,i.settings),e.breakpoint=i.breakpoint,!0)}}var r=0!==e.breakpoint;return e.opt=Object.assign({},e._opt),e.breakpoint=0,r},t.scrollTo=function(t,o,i){var r=this,s=(new Date).getTime(),l=r.animate_id,n=function(){var e=(new Date).getTime()-s;r.ele.scrollLeft=r.ele.scrollLeft+(t-r.ele.scrollLeft)*r.opt.easing(0,e,0,1,o),e=d.trackWidth;d.opt.rewind||(d.arrows.prev&&d.arrows.prev.classList.toggle("disabled",d.ele.scrollLeft<=0||t),d.arrows.next&&d.arrows.next.classList.toggle("disabled",Math.ceil(d.ele.scrollLeft+d.containerWidth)>=Math.floor(d.trackWidth)||t)),d.slide=Math.round(d.ele.scrollLeft/d.itemWidth),d.page=Math.round(d.ele.scrollLeft/d.containerWidth);var c=d.slide+Math.floor(Math.floor(d.opt.slidesToShow)/2),h=Math.floor(d.opt.slidesToShow)%2?0:c+1;1===Math.floor(d.opt.slidesToShow)&&(h=0),d.ele.scrollLeft+d.containerWidth>=Math.floor(d.trackWidth)&&(d.page=d.dots?d.dots.children.length-1:0),[].forEach.call(d.slides,function(e,t){var o=e.classList,i=o.contains("visible"),r=d.ele.scrollLeft,s=d.ele.scrollLeft+d.containerWidth,l=d.itemWidth*t,n=l+d.itemWidth;[].forEach.call(o,function(e){/^left|right/.test(e)&&o.remove(e)}),o.toggle("active",d.slide===t),c===t||h&&h===t?o.add("center"):(o.remove("center"),o.add([t=r&&Math.floor(n)<=s;o.toggle("visible",a),a!==i&&d.emit("slide-"+(a?"visible":"hidden"),{slide:t})}),d.dots&&[].forEach.call(d.dots.children,function(e,t){e.classList.toggle("active",d.page===t)}),e&&d.opt.scrollLock&&(clearTimeout(d.scrollLock),d.scrollLock=setTimeout(function(){clearTimeout(d.scrollLock),.02d.containerWidth+d.ele.scrollLeft&&d.scrollItem(d.getCurrentSlide()))},d.opt.scrollLockDelay||250))},t.getCurrentSlide=function(){var e=this;return e.round(e.ele.scrollLeft/e.itemWidth)},t.scrollItem=function(e,t,o){o&&o.preventDefault();var i=this,r=e;if(++i.animate_id,!0===t)e*=i.containerWidth,e=Math.round(e/i.itemWidth)*i.itemWidth;else{if("string"==typeof e){var s="prev"===e;if(e=i.opt.slidesToScroll%1||i.opt.slidesToShow%1?i.getCurrentSlide():i.slide,s?e-=i.opt.slidesToScroll:e+=i.opt.slidesToScroll,i.opt.rewind){var l=i.ele.scrollLeft;e=s&&!l?i.slides.length:!s&&l+i.containerWidth>=Math.floor(i.trackWidth)?0:e}}e=Math.max(Math.min(e,i.slides.length),0),i.slide=e,e=i.itemWidth*e}return i.scrollTo(e,i.opt.duration*Math.abs(i.ele.scrollLeft-e),function(){i.updateControls(),i.emit("animated",{value:r,type:"string"==typeof r?"arrow":t?"dot":"slide"})}),!1},t.settingsBreakpoint=function(){var e=this,t=e._opt.responsive;if(t){t.sort(function(e,t){return t.breakpoint-e.breakpoint});for(var o=0;o=i.breakpoint)return e.breakpoint!==i.breakpoint&&(e.opt=Object.assign({},e._opt,i.settings),e.breakpoint=i.breakpoint,!0)}}var r=0!==e.breakpoint;return e.opt=Object.assign({},e._opt),e.breakpoint=0,r},t.scrollTo=function(t,o,i){var r=this,s=(new Date).getTime(),l=r.animate_id,n=function(){var e=(new Date).getTime()-s;r.ele.scrollLeft=r.ele.scrollLeft+(t-r.ele.scrollLeft)*r.opt.easing(0,e,0,1,o),e Date: Wed, 1 Sep 2021 09:51:17 +0530 Subject: [PATCH 3/6] Add _.opt.dir --- glider.js | 1 + 1 file changed, 1 insertion(+) diff --git a/glider.js b/glider.js index 49be059..e3ea618 100644 --- a/glider.js +++ b/glider.js @@ -47,6 +47,7 @@ slidesToShow: 1, resizeLock: true, duration: 0.5, + dir: (_window.getComputedStyle(_.ele).direction === 'rtl') ? -1:1, // easeInQuad easing: function (x, t, b, c, d) { return c * (t /= d) * t + b From 483f631dd8db7bb7895d4636f3e845f3fece9bf5 Mon Sep 17 00:00:00 2001 From: aurovrata Date: Thu, 2 Sep 2021 18:35:34 +0530 Subject: [PATCH 4/6] back to upstream --- glider.js | 1 - 1 file changed, 1 deletion(-) diff --git a/glider.js b/glider.js index e3ea618..49be059 100644 --- a/glider.js +++ b/glider.js @@ -47,7 +47,6 @@ slidesToShow: 1, resizeLock: true, duration: 0.5, - dir: (_window.getComputedStyle(_.ele).direction === 'rtl') ? -1:1, // easeInQuad easing: function (x, t, b, c, d) { return c * (t /= d) * t + b From f5453f2e166171ae0be7fe8e4f587a916cc02386 Mon Sep 17 00:00:00 2001 From: aurovrata Date: Thu, 2 Sep 2021 18:47:13 +0530 Subject: [PATCH 5/6] labels in dots --- glider.css | 7 +++++++ glider.js | 6 ++++++ 2 files changed, 13 insertions(+) diff --git a/glider.css b/glider.css index 4422543..d621bce 100644 --- a/glider.css +++ b/glider.css @@ -19,6 +19,13 @@ display: flex; z-index: 1; } +.label-dots .glider-dot { + width: 1.1rem; + height: 1.1rem; + font-size: 1rem; + line-height: 1; + padding-bottom: 2px; +} .glider.draggable { user-select: none; cursor: -webkit-grab; diff --git a/glider.js b/glider.js index 49be059..9ddba20 100644 --- a/glider.js +++ b/glider.js @@ -47,6 +47,7 @@ slidesToShow: 1, resizeLock: true, duration: 0.5, + labelDots:false, // easeInQuad easing: function (x, t, b, c, d) { return c * (t /= d) * t + b @@ -207,6 +208,7 @@ _.dots.innerHTML = '' _.dots.classList.add('glider-dots') + if(false !== _.opt.labelDots) _.dots.classList.add('label-dots') for (var i = 0; i < Math.ceil(_.slides.length / _.opt.slidesToShow); ++i) { var dot = document.createElement('button') @@ -214,6 +216,10 @@ dot.setAttribute('aria-label', 'Page ' + (i + 1)) dot.setAttribute('role', 'tab') dot.className = 'glider-dot ' + (i ? '' : 'active') + if(false !== _.opt.labelDots){ + if(_.opt.labelDots[i]) dot.innerText = _.opt.labelDots[i] + else dot.innerText = (i+1) + } _.event(dot, 'add', { click: _.scrollItem.bind(_, i, true) }) From 67242b9830c2d41572e7dc574fea47496bfc3c5d Mon Sep 17 00:00:00 2001 From: aurovrata Date: Thu, 2 Sep 2021 18:49:43 +0530 Subject: [PATCH 6/6] cleanup --- glider.js | 1 - 1 file changed, 1 deletion(-) diff --git a/glider.js b/glider.js index 9ddba20..9598def 100644 --- a/glider.js +++ b/glider.js @@ -101,7 +101,6 @@ _.slides = _.track.children; - [].forEach.call(_.slides, function (_, i) { _.classList.add('glider-slide') _.setAttribute('data-gslide', i)