/** ==========================================================
* jquery lightslider.js v1.0
* http://sachinchoolur.github.io/lightslider/
* released under the apache license - http://opensource.org/licenses/apache-2.0
=========================================================/**/
;
(function ($, undefined) {
"use strict";
var defaults = {
slidewidth: 270,
slidemargin: 0,
slidemove: 1,
minslide: 1,
maxslide: 8,
mode: "slide",
usecss: true,
speed: 1000, //ms'
easing: '', //'ex cubic-bezier(0.25, 0, 0.25, 1)',//
auto: false,
pause: 3000,
loop: true,
controls: true,
prevhtml: '',
nexthtml: '',
keypress: true,
pager: true,
gallery: false,
thumbwidth: 50,
thumbmargin: 3,
currentpagerposition: 'middle',
swipethreshold: 40,
onbeforestart: function () {},
onsliderload: function () {},
onbefroreslide: function () {},
onafterslide: function () {},
onbeforenextslide: function () {},
onbeforeprevslide: function () {}
};
$.fn.lightslider = function (options) {
var plugin = {};
var settings = $.extend(true, {}, defaults, options);
var $el = this;
plugin.$el = this;
var $children = $el.children(),
length = 0,
w = 0,
on = false,
elwidth = 0,
$slide = '',
scene = 0,
pagerwidth = 0,
slidewidth = 0,
resize = false,
slideon = false,
interval = '',
istouch = ('ontouchstart' in document.documentelement);
var refresh = new object();
plugin = {
docss: function () {
var support = function () {
var transition = ['transition', 'moztransition', 'webkittransition', 'otransition', 'mstransition', 'khtmltransition'];
var root = document.documentelement;
for (var i = 0; i < transition.length; i++) {
if (transition[i] in root.style) {
return true;
}
}
};
if (settings.usecss && support()) {
return true;
}
return false;
},
keypress: function () {
if (settings.keypress === true) {
$(document).bind('keyup', function (e) {
if (e.keycode === 37) {
$el.gotoprevslide();
clearinterval(interval);
} else if (e.keycode === 39) {
$el.gotonextslide();
clearinterval(interval);
}
});
}
},
controls: function () {
if (settings.controls) {
$el.after('
');
var $prev = $slide.find('.csprev');
var $next = $slide.find('.csnext');
$prev.bind('click', function () {
$el.gotoprevslide();
clearinterval(interval);
});
$next.bind('click', function () {
$el.gotonextslide();
clearinterval(interval);
});
}
},
initialstyle: function () {
$el.addclass('lightslider').wrap("");
$slide = $el.parent('.csslidewrapper');
settings.onbeforestart.call(this);
elwidth = $el.outerwidth();
var min, max;
refresh.calsw = function () {
min = (elwidth - ((settings.minslide * settings.slidemargin) - settings.slidemargin)) / settings.minslide;
max = (elwidth - ((settings.maxslide * settings.slidemargin) - settings.slidemargin)) / settings.maxslide;
if (settings.slidewidth === '') {
slidewidth = min;
} else if (min < settings.slidewidth) {
slidewidth = min;
} else if (max > settings.slidewidth) {
slidewidth = max;
} else {
slidewidth = settings.slidewidth;
}
};
refresh.ssw = function () {
length = $children.length;
w = length * (slidewidth + settings.slidemargin);
if (w % 1) {
w = w + 1;
}
$el.css('width', w + 'px');
$children.css('width', slidewidth + 'px');
$children.css({
'float': 'left',
'margin-right': settings.slidemargin + 'px'
});
};
refresh.call = function () {
$children = $el.children();
length = $children.length;
};
if (this.docss()) {
$slide.addclass('usingcss');
}
refresh.call();
$children.first().addclass('active');
if (settings.mode === "slide") {
refresh.calsw();
refresh.ssw();
} else {
var height = $children.height();
$el.css('height', height);
$el.addclass('csfade');
if (!this.docss()) {
$children.not(".active").css('display', 'none');
}
}
$slide.css({
'max-width': '100%',
'position': 'relative'
});
},
pager: function () {
var $this = this;
refresh.createpager = function () {
var maxslide = '';
if (settings.mode === 'slide') {
maxslide = parseint(length / settings.slidemove);
var mod = length % settings.slidemove;
if (mod) {
maxslide = maxslide + 1;
}
} else {
maxslide = length;
}
var i = 0,
pagers = '',
v = 0;
for (i = 0; i < maxslide; i++) {
if (settings.mode === 'slide') {
v = i * ((slidewidth + settings.slidemargin) * settings.slidemove);
}
var thumb = $children.eq(i * settings.slidemove).attr('data-thumb');
if (settings.gallery === true) {
pagers += '';
} else {
pagers += '' + (i + 1) + '';
}
if (settings.mode === 'slide') {
if ((v) >= w - elwidth - settings.slidemargin) {
i = i + 1;
break;
}
}
}
var $csouter = $slide.parent();
$csouter.find('.cspager').html(pagers);
if (settings.gallery === true) {
pagerwidth = i * (settings.thumbmargin + settings.thumbwidth);
$csouter.find('.cspager').css({
'width': pagerwidth + 'px',
'transform': 'translate(0px, 0px)',
'transition': '1s all'
});
}
var $pager = $csouter.find('.cspager').find('li');
$pager.first().addclass('active');
$pager.on('click', function () {
scene = $pager.index(this);
$el.mode();
if (settings.gallery === true) {
$this.slidethumb();
}
clearinterval(interval);
});
};
if (settings.pager) {
var cl = '';
if (settings.gallery) {
cl = 'csgallery';
} else {
cl = 'cspg';
}
$slide.after('');
refresh.createpager();
}
settings.onsliderload.call(this);
},
active: function (ob, t) {
if (this.docss() && settings.mode === "fade") {
if (!$slide.hasclass('on')) {
$slide.addclass('on');
}
}
var sc = 0;
if (scene * settings.slidemove < length) {
ob.removeclass('active');
if (!this.docss() && settings.mode === "fade" && t === false) {
ob.fadeout(settings.speed);
}
t === true ? sc = scene : sc = scene * settings.slidemove;
if (t === true) {
var l = ob.length;
var nl = l - 1;
if (sc + 1 >= l) {
sc = nl;
}
}
if (!this.docss() && settings.mode === "fade" && t === false) {
ob.eq(sc).fadein(settings.speed);
}
ob.eq(sc).addclass('active');
} else {
ob.removeclass('active');
ob.eq(ob.length - 1).addclass('active');
if (!this.docss() && settings.mode === "fade" && t === false) {
ob.fadeout(settings.speed);
ob.eq(sc).fadein(settings.speed);
}
}
},
move: function (ob, v) {
if (this.docss()) {
ob.css('transform', 'translate(-' + v + 'px, 0px)');
} else {
ob.css('position', 'relative').animate({
left: -v + 'px'
}, settings.speed, settings.easing);
}
var $thumb = $slide.parent().find('.cspager').find('li');
this.active($thumb, true);
},
fade: function () {
this.active($children, false);
var $thumb = $slide.parent().find('.cspager').find('li');
this.active($thumb, true);
},
slide: function () {
var $this = this;
refresh.calslide = function () {
var slidevalue = scene * ((slidewidth + settings.slidemargin) * settings.slidemove);
$this.active($children, false);
if ((slidevalue) > w - elwidth - settings.slidemargin) {
slidevalue = w - elwidth - settings.slidemargin;
} else if (slidevalue < 0) {
slidevalue = 0;
}
$this.move($el, slidevalue);
};
refresh.calslide();
slideon = true;
},
slidethumb: function () {
var position;
switch (settings.currentpagerposition) {
case 'left':
position = 0;
break;
case 'middle':
position = (elwidth / 2) - (settings.thumbwidth / 2);
break;
case 'right':
position = elwidth - settings.thumbwidth;
}
var thumbslide = scene * ((settings.thumbwidth + settings.thumbmargin)) - (position);
if ((thumbslide + elwidth) > pagerwidth) {
thumbslide = pagerwidth - elwidth - settings.thumbmargin;
}
if (thumbslide < 0) {
thumbslide = 0;
}
var $pager = $slide.parent().find('.cspager');
this.move($pager, thumbslide);
},
auto: function () {
if (settings.auto) {
interval = setinterval(function () {
$el.gotonextslide();
}, settings.pause);
}
},
enabletouch: function () {
if (istouch) {
var startcoords = {},
endcoords = {};
$slide.on('touchstart.lightslider', function (e) {
endcoords = e.originalevent.targettouches[0];
startcoords.pagex = e.originalevent.targettouches[0].pagex;
startcoords.pagey = e.originalevent.targettouches[0].pagey;
});
$slide.on('touchmove.lightslider', function (e) {
var orig = e.originalevent;
endcoords = orig.targettouches[0];
var xmovement = math.abs(endcoords.pagex - startcoords.pagex);
var ymovement = math.abs(endcoords.pagey - startcoords.pagey);
if ((xmovement * 3) > ymovement) {
e.preventdefault();
}
});
$slide.on('touchend.lightslider', function () {
var distance = endcoords.pagex - startcoords.pagex,
swipethreshold = settings.swipethreshold;
if (distance >= swipethreshold) {
$el.gotoprevslide();
clearinterval(interval);
} else if (distance <= -swipethreshold) {
$el.gotonextslide();
clearinterval(interval);
}
});
}
},
build: function () {
var $this = this;
$this.initialstyle();
$this.auto();
$this.enabletouch();
$this.pager();
$this.controls();
$this.keypress();
}
};
plugin.build();
refresh.init = function () {
resize = true;
refresh.call();
if (settings.mode === "slide") {
$el.removeclass('csslide');
}
elwidth = $slide.outerwidth();
if (settings.mode === "slide") {
refresh.calsw();
refresh.ssw();
}
settimeout(function () {
if (resize === true) {
if (settings.mode === "slide") {
$el.addclass('csslide');
}
resize = false;
}
}, 1000);
if (settings.pager) {
refresh.createpager();
}
if (settings.gallery === true) {
plugin.slidethumb();
}
if (slideon) {
refresh.calslide();
}
};
$el.gotoprevslide = function () {
if (scene > 0) {
settings.onbeforeprevslide.call(this);
scene--;
$el.mode();
if (settings.gallery === true) {
plugin.slidethumb();
}
} else {
if (settings.loop === true) {
settings.onbeforeprevslide.call(this);
var l = length;
l = l - 1;
scene = parseint(l / settings.slidemove, 10);
$el.mode();
if (settings.gallery === true) {
plugin.slidethumb();
}
}
}
};
$el.gotonextslide = function () {
if ((scene * settings.slidemove) < length - settings.slidemove) {
settings.onbeforenextslide.call(this);
scene++;
$el.mode();
if (settings.gallery === true) {
plugin.slidethumb();
}
} else {
if (settings.loop === true) {
settings.onbeforenextslide.call(this);
scene = 0;
$el.mode();
if (settings.gallery === true) {
plugin.slidethumb();
}
}
}
};
$el.mode = function () {
if (on === false) {
if (settings.mode === "slide") {
if (plugin.docss()) {
$el.addclass('csslide');
if (settings.speed !== '') {
$slide.css('transition-duration', settings.speed + 'ms');
}
if (settings.easing !== '') {
$slide.css('transition-timing-function', settings.easing);
}
}
} else {
if (plugin.docss()) {
if (settings.speed !== '') {
$el.css('transition-duration', settings.speed + 'ms');
}
if (settings.easing !== '') {
$el.css('transition-timing-function', settings.easing);
}
}
}
}
settings.onbefroreslide.call(this);
if (settings.mode === "slide") {
plugin.slide();
} else {
plugin.fade();
}
settimeout(function () {
settings.onafterslide.call(this);
}, settings.speed);
on = true;
};
$el.play = function () {
clearinterval(interval);
$el.gotonextslide();
interval = setinterval(function () {
$el.gotonextslide();
}, settings.pause);
};
$el.pause = function(){
clearinterval(interval);
};
$el.refresh = function () {
refresh.init();
};
$el.getcurrentslidecount = function () {
return scene + 1;
};
$el.gotoslide = function (s) {
scene = s;
$el.mode();
};
$(window).on('resize', function (e) {
e.preventdefault();
refresh.init();
});
return this;
};
}(jquery));