;(function ( $, window, document, undefined ) { // Create the defaults once var pluginName = 'ploguine', defaults = { width: "100%", height: "800px", folder: "", imgArray: "", basepath: "/", autoplay: true, delay: 3000, fadeOnLoad: 2000, crossfadeDelay: 1000, random: true, imgSizing: "" }; var currentPosition = 0; // plugin constructor function Plugin( element, options ) { var base = this; base.element = element; //dom element base.$element = $(element); //jquery element this.myindex = "1"; base.options = $.extend( {}, defaults, options) ; base._defaults = defaults; base._name = pluginName; var browser = { chrome: false, mozilla: false, opera: false, msie: false, safari: false }; var sUsrAg = navigator.userAgent; if(sUsrAg.indexOf("Chrome") > -1) { browser.chrome = true; } else if (sUsrAg.indexOf("Safari") > -1) { browser.safari = true; } else if (sUsrAg.indexOf("Opera") > -1) { browser.opera = true; } else if (sUsrAg.indexOf("Firefox") > -1) { browser.mozilla = true; } else if (sUsrAg.indexOf("MSIE") > -1) { browser.msie = true; } console.log(browser.msie); base.nextSlide = function(){ if (base.options.crossfadeDelay > base.options.delay) { //this.options.crossfadeDelay = this.options.delay-50; //leave a gap } if (browser.safari==true) { var myTransition = '-webkit-transition', myCSSObj = { opacity : 0 }; } else { var myTransition = '-moz-transition', myCSSObj = { opacity : 0 }; } myCSSObj[myTransition] = 'opacity '+ base.options.crossfadeDelay +'ms ease-in-out'; //fadeout the front div base._divtorotate = $(element).children().last(); base._divtorotate.animate({ na: 100 }, { //this is a hack we animate a non existing property step: function(now,fx) { $(this).css(myCSSObj); }, complete: function() { base._divtorotate.removeClass("active"); base._divtorotate.prependTo($(element)); base._divtorotate.css('opacity', 1); $(element).children().last().addClass("active"); currentPosition = $(element).children().last().data("index"); }, duration:base.options.crossfadeDelay },'linear'); } base.init(); } Plugin.prototype.init = function () { //try to find the specified folder var base = this; $.ajax({ url: "/js/jquery.laburbainslideshow.php", type: "POST", data: { folder: base.options.folder, random: base.options.random, basepath: base.options.basepath } }).done(function( result ) { console.log(result); base.options.imgArray = eval(result); base.$element.css({width:base.options.width, display:'none'}); for (var i = 0; i < base.options.imgArray.length; i++) { base.$element.append("
"); } //fadein if (base.options.fadeOnLoad > 0) { base.$element.fadeIn(base.options.fadeOnLoad); }else{ base.$element.show(); } //if the img array is bigger than 1 start timer if (base.options.imgArray.length > 1) { setInterval($.proxy(base.nextSlide, base), base.options.delay); //setInterval(console.log("nextcalled"), this.options.delay); } }); // Place initialization logic here // You already have access to the DOM element and // the options via the instance, e.g. this.element // and this.options }; // A really lightweight plugin wrapper around the constructor, // preventing against multiple instantiations $.fn[pluginName] = function ( options ) { return this.each(function () { if (!$.data(this, 'plugin_' + pluginName)) { $.data(this, 'plugin_' + pluginName, new Plugin( this, options )); } }); } $.fn.getActive = function(){ return currentPosition; }; })( jQuery, window, document );