Updated the footable Lib.
This commit is contained in:
@ -1,4 +1,4 @@
|
||||
/*! UIkit 2.21.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
|
||||
/*! UIkit 2.25.0 | http://www.getuikit.com | (c) 2014 YOOtheme | MIT License */
|
||||
(function(addon) {
|
||||
|
||||
var component;
|
||||
@ -22,10 +22,13 @@
|
||||
UI.component('slider', {
|
||||
|
||||
defaults: {
|
||||
center : false,
|
||||
threshold : 10,
|
||||
infinite : true,
|
||||
activecls : 'uk-active'
|
||||
center : false,
|
||||
threshold : 10,
|
||||
infinite : true,
|
||||
autoplay : false,
|
||||
autoplayInterval : 7000,
|
||||
pauseOnHover : true,
|
||||
activecls : 'uk-active'
|
||||
},
|
||||
|
||||
boot: function() {
|
||||
@ -35,11 +38,11 @@
|
||||
|
||||
setTimeout(function(){
|
||||
|
||||
UI.$("[data-uk-slider]", context).each(function(){
|
||||
UI.$('[data-uk-slider]', context).each(function(){
|
||||
|
||||
var ele = UI.$(this);
|
||||
|
||||
if (!ele.data("slider")) {
|
||||
if (!ele.data('slider')) {
|
||||
UI.slider(ele, UI.Utils.options(ele.attr('data-uk-slider')));
|
||||
}
|
||||
});
|
||||
@ -55,11 +58,11 @@
|
||||
this.container = this.element.find('.uk-slider');
|
||||
this.focus = 0;
|
||||
|
||||
UI.$win.on("resize load", UI.Utils.debounce(function() {
|
||||
UI.$win.on('resize load', UI.Utils.debounce(function() {
|
||||
$this.resize(true);
|
||||
}, 100));
|
||||
|
||||
this.on("click.uikit.slider", '[data-uk-slider-item]', function(e) {
|
||||
this.on('click.uk.slider', '[data-uk-slider-item]', function(e) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
@ -67,65 +70,77 @@
|
||||
|
||||
if ($this.focus == item) return;
|
||||
|
||||
// stop autoplay
|
||||
$this.stop();
|
||||
|
||||
switch(item) {
|
||||
case 'next':
|
||||
case 'previous':
|
||||
$this[item=='next' ? 'next':'previous']();
|
||||
break;
|
||||
default:
|
||||
$this.updateFocus(parseInt(slide, 10));
|
||||
$this.updateFocus(parseInt(item, 10));
|
||||
}
|
||||
});
|
||||
|
||||
this.container.on('touchstart mousedown', function(evt) {
|
||||
this.container.on({
|
||||
|
||||
if (evt.originalEvent && evt.originalEvent.touches) {
|
||||
evt = evt.originalEvent.touches[0];
|
||||
}
|
||||
'touchstart mousedown': function(evt) {
|
||||
|
||||
// ignore right click button
|
||||
if (evt.button && evt.button==2 || !$this.active) {
|
||||
return;
|
||||
}
|
||||
|
||||
anchor = UI.$(evt.target).is('a') ? UI.$(evt.target) : UI.$(evt.target).parents('a:first');
|
||||
dragged = false;
|
||||
|
||||
if (anchor.length) {
|
||||
|
||||
anchor.one('click', function(e){
|
||||
if (dragged) e.preventDefault();
|
||||
});
|
||||
}
|
||||
|
||||
delayIdle = function(e) {
|
||||
|
||||
dragged = true;
|
||||
dragging = $this;
|
||||
store = {
|
||||
touchx : parseInt(e.pageX, 10),
|
||||
dir : 1,
|
||||
focus : $this.focus,
|
||||
base : $this.options.center ? 'center':'area'
|
||||
};
|
||||
|
||||
if (e.originalEvent && e.originalEvent.touches) {
|
||||
e = e.originalEvent.touches[0];
|
||||
if (evt.originalEvent && evt.originalEvent.touches) {
|
||||
evt = evt.originalEvent.touches[0];
|
||||
}
|
||||
|
||||
dragging.element.data({
|
||||
'pointer-start': {x: parseInt(e.pageX, 10), y: parseInt(e.pageY, 10)},
|
||||
'pointer-pos-start': $this.pos
|
||||
});
|
||||
// ignore right click button
|
||||
if (evt.button && evt.button==2 || !$this.active) {
|
||||
return;
|
||||
}
|
||||
|
||||
$this.container.addClass('uk-drag');
|
||||
// stop autoplay
|
||||
$this.stop();
|
||||
|
||||
delayIdle = false;
|
||||
};
|
||||
anchor = UI.$(evt.target).is('a') ? UI.$(evt.target) : UI.$(evt.target).parents('a:first');
|
||||
dragged = false;
|
||||
|
||||
delayIdle.x = parseInt(evt.pageX, 10);
|
||||
delayIdle.threshold = $this.options.threshold;
|
||||
if (anchor.length) {
|
||||
|
||||
anchor.one('click', function(e){
|
||||
if (dragged) e.preventDefault();
|
||||
});
|
||||
}
|
||||
|
||||
delayIdle = function(e) {
|
||||
|
||||
dragged = true;
|
||||
dragging = $this;
|
||||
store = {
|
||||
touchx : parseInt(e.pageX, 10),
|
||||
dir : 1,
|
||||
focus : $this.focus,
|
||||
base : $this.options.center ? 'center':'area'
|
||||
};
|
||||
|
||||
if (e.originalEvent && e.originalEvent.touches) {
|
||||
e = e.originalEvent.touches[0];
|
||||
}
|
||||
|
||||
dragging.element.data({
|
||||
'pointer-start': {x: parseInt(e.pageX, 10), y: parseInt(e.pageY, 10)},
|
||||
'pointer-pos-start': $this.pos
|
||||
});
|
||||
|
||||
$this.container.addClass('uk-drag');
|
||||
|
||||
delayIdle = false;
|
||||
};
|
||||
|
||||
delayIdle.x = parseInt(evt.pageX, 10);
|
||||
delayIdle.threshold = $this.options.threshold;
|
||||
|
||||
},
|
||||
|
||||
mouseenter: function() { if ($this.options.pauseOnHover) $this.hovering = true; },
|
||||
mouseleave: function() { $this.hovering = false; }
|
||||
});
|
||||
|
||||
this.resize(true);
|
||||
@ -138,6 +153,12 @@
|
||||
|
||||
// prevent dragging links + images
|
||||
this.element.find('a,img').attr('draggable', 'false');
|
||||
|
||||
// Set autoplay
|
||||
if (this.options.autoplay) {
|
||||
this.start();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
resize: function(focus) {
|
||||
@ -164,7 +185,7 @@
|
||||
|
||||
this.container.css({'min-width': pos, 'min-height': maxheight});
|
||||
|
||||
if (this.options.infinite && pos <= (2*this.vp) && !this.itemsResized) {
|
||||
if (this.options.infinite && (pos <= (2*this.vp) || this.items.length < 5) && !this.itemsResized) {
|
||||
|
||||
// fill with cloned items
|
||||
this.container.children().each(function(idx){
|
||||
@ -188,7 +209,7 @@
|
||||
'transform': ''
|
||||
});
|
||||
|
||||
this.updateFocus(0);
|
||||
if (focus) this.updateFocus(this.focus);
|
||||
},
|
||||
|
||||
updatePos: function(pos) {
|
||||
@ -208,7 +229,7 @@
|
||||
|
||||
dir = dir || (idx > this.focus ? 1:-1);
|
||||
|
||||
var $this = this, item = this.items.eq(idx), area, i;
|
||||
var item = this.items.eq(idx), area, i;
|
||||
|
||||
if (this.options.infinite) {
|
||||
this.infinite(idx, dir);
|
||||
@ -250,18 +271,36 @@
|
||||
|
||||
area += this.items.eq(i).data('width');
|
||||
|
||||
if (area >= this.vp) {
|
||||
if (area == this.vp) {
|
||||
idx = i;
|
||||
break;
|
||||
}
|
||||
|
||||
if (area > this.vp) {
|
||||
idx = (i < this.items.length-1) ? i+1 : i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.updatePos(this.items.eq(idx).data('left')*-1);
|
||||
if (area > this.vp) {
|
||||
this.updatePos((this.container.width() - this.vp) * -1);
|
||||
} else {
|
||||
this.updatePos(this.items.eq(idx).data('left')*-1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// mark elements
|
||||
var left = this.items.eq(idx).data('left');
|
||||
|
||||
this.items.removeClass('uk-slide-before uk-slide-after').each(function(i){
|
||||
if (i!==idx) {
|
||||
UI.$(this).addClass(UI.$(this).data('left') < left ? 'uk-slide-before':'uk-slide-after');
|
||||
}
|
||||
});
|
||||
|
||||
this.focus = idx;
|
||||
|
||||
this.trigger('focusitem.uk.slider', [idx,this.items.eq(idx),this]);
|
||||
@ -281,9 +320,25 @@
|
||||
this.updateFocus(focus, -1);
|
||||
},
|
||||
|
||||
start: function() {
|
||||
|
||||
this.stop();
|
||||
|
||||
var $this = this;
|
||||
|
||||
this.interval = setInterval(function() {
|
||||
if (!$this.hovering) $this.next();
|
||||
}, this.options.autoplayInterval);
|
||||
|
||||
},
|
||||
|
||||
stop: function() {
|
||||
if (this.interval) clearInterval(this.interval);
|
||||
},
|
||||
|
||||
infinite: function(baseidx, direction) {
|
||||
|
||||
var $this = this, item = this.items.eq(baseidx), i, z = baseidx, move = [], lastvisible, area = 0;
|
||||
var $this = this, item = this.items.eq(baseidx), i, z = baseidx, move = [], area = 0;
|
||||
|
||||
if (direction == 1) {
|
||||
|
||||
@ -356,7 +411,7 @@
|
||||
});
|
||||
|
||||
// handle dragging
|
||||
UI.$doc.on('mousemove.uikit.slider touchmove.uikit.slider', function(e) {
|
||||
UI.$doc.on('mousemove.uk.slider touchmove.uk.slider', function(e) {
|
||||
|
||||
if (e.originalEvent && e.originalEvent.touches) {
|
||||
e = e.originalEvent.touches[0];
|
||||
@ -434,13 +489,16 @@
|
||||
store.diff = diff;
|
||||
});
|
||||
|
||||
UI.$doc.on('mouseup.uikit.slider touchend.uikit.slider', function(e) {
|
||||
UI.$doc.on('mouseup.uk.slider touchend.uk.slider', function(e) {
|
||||
|
||||
if (dragging) {
|
||||
|
||||
dragging.container.removeClass('uk-drag');
|
||||
|
||||
var item = dragging.items.eq(store.focus), itm, focus = false, i, z;
|
||||
// TODO is this needed?
|
||||
dragging.items.eq(store.focus);
|
||||
|
||||
var itm, focus = false, i, z;
|
||||
|
||||
if (store.dir == 1) {
|
||||
|
||||
|
||||
Reference in New Issue
Block a user