/**
 * Coin Slider - Unique jQuery Image Slider
 * @version: 1.0 - (2010/04/04)
 * @requires jQuery v1.2.2 or later 
 * @author Ivan Lazarevic
 * Examples and documentation at: http://workshop.rs/projects/coin-slider/
 
 * Licensed under MIT licence:
 *   http://www.opensource.org/licenses/mit-license.php
**/

(function($) {

        var params              = new Array;
        var order               = new Array;
        var images              = new Array;
        var links               = new Array;
        var linksTarget = new Array;
        var titles              = new Array;
        var interval    = new Array;
        var imagePos    = new Array;
        var appInterval = new Array;    
        var squarePos   = new Array;    
        var reverse             = new Array;
        
        $.fn.coinslider= $.fn.CoinSlider = function(options){
                
                init = function(el){
                                
                        order[el.id]            = new Array();  // order of square appereance
                        images[el.id]           = new Array();
                        links[el.id]            = new Array();
                        linksTarget[el.id]      = new Array();
                        titles[el.id]           = new Array();
                        imagePos[el.id]         = 0;
                        squarePos[el.id]        = 0;
                        reverse[el.id]          = 1;                                            
                                
                        params[el.id] = $.extend({}, $.fn.coinslider.defaults, options);
                                                
                        // create images, links and titles arrays
                        $.each($('#'+el.id+' img'), function(i,item){
                                images[el.id][i]                = $(item).attr('src');
                                links[el.id][i]                 = $(item).parent().is('a') ? $(item).parent().attr('href') : '';
                                linksTarget[el.id][i]   = $(item).parent().is('a') ? $(item).parent().attr('target') : '';
                                titles[el.id][i]                = $(item).next().is('span') ? $(item).next().html() : '';
                                $(item).hide();
                                $(item).next().hide();
                        });                     
                        

                        // set panel
                        $(el).css({
                                'background-image':'url('+images[el.id][0]+')',
                                'width': params[el.id].width,
                                'height': params[el.id].height,
                                'position': 'relative',
                                'background-position': 'top left'
                        }).wrap("<div class='coin-slider' id='coin-slider-"+el.id+"' />");      
                        
                                
                        // create title bar
                        $('#'+el.id).append("<div class='cs-title' id='cs-title-"+el.id+"' style='position: absolute; bottom:0; left: 0; z-index: 1000;'></div>");
                                                
                        $.setFields(el);
                        
                        if(params[el.id].navigation)
                                $.setNavigation(el);
                        
                        $.transition(el,0);
                        $.transitionCall(el);
                                
                }
                
                // squares positions
                $.setFields = function(el){
                        
                        tWidth = sWidth = parseInt(params[el.id].width/params[el.id].spw);
                        tHeight = sHeight = parseInt(params[el.id].height/params[el.id].sph);
                        
                        counter = sLeft = sTop = 0;
                        tgapx = gapx = params[el.id].width - params[el.id].spw*sWidth;
                        tgapy = gapy = params[el.id].height - params[el.id].sph*sHeight;
                        
                        for(i=1;i <= params[el.id].sph;i++){
                                gapx = tgapx;
                                
                                        if(gapy > 0){
                                                gapy--;
                                                sHeight = tHeight+1;
                                        } else {
                                                sHeight = tHeight;
                                        }
                                
                                for(j=1; j <= params[el.id].spw; j++){  

                                        if(gapx > 0){
                                                gapx--;
                                                sWidth = tWidth+1;
                                        } else {
                                                sWidth = tWidth;
                                        }

                                        order[el.id][counter] = i+''+j;
                                        counter++;
                                        
                                        if(params[el.id].links)
                                                $('#'+el.id).append("<a href='"+links[el.id][0]+"' class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></a>");
                                        else
                                                $('#'+el.id).append("<div class='cs-"+el.id+"' id='cs-"+el.id+i+j+"' style='width:"+sWidth+"px; height:"+sHeight+"px; float: left; position: absolute;'></div>");
                                                                
                                        // positioning squares
                                        $("#cs-"+el.id+i+j).css({ 
                                                'background-position': -sLeft +'px '+(-sTop+'px'),
                                                'left' : sLeft ,
                                                'top': sTop
                                        });
                                
                                        sLeft += sWidth;
                                }

                                sTop += sHeight;
                                sLeft = 0;                                      
                                        
                        }
                        
                        
                        $('.cs-'+el.id).mouseover(function(){
                                $('#cs-navigation-'+el.id).show();
                        });
                
                        $('.cs-'+el.id).mouseout(function(){
                                $('#cs-navigation-'+el.id).hide();
                        });     
                        
                        $('#cs-title-'+el.id).mouseover(function(){
                                $('#cs-navigation-'+el.id).show();
                        });
                
                        $('#cs-title-'+el.id).mouseout(function(){
                                $('#cs-navigation-'+el.id).hide();
                        });     
                        
                        if(params[el.id].hoverPause){   
                                $('.cs-'+el.id).mouseover(function(){
                                        params[el.id].pause = true;
                                });
                        
                                $('.cs-'+el.id).mouseout(function(){
                                        params[el.id].pause = false;
                                });     
                                
                                $('#cs-title-'+el.id).mouseover(function(){
                                        params[el.id].pause = true;
                                });
                        
                                $('#cs-title-'+el.id).mouseout(function(){
                                        params[el.id].pause = false;
                                });     
                        }
                                        
                        
                };
                                
                
                $.transitionCall = function(el){
                
                        clearInterval(interval[el.id]); 
                        delay = params[el.id].delay + params[el.id].spw*params[el.id].sph*params[el.id].sDelay;
                        interval[el.id] = setInterval(function() { $.transition(el)  }, delay);
                        
                }
                
                // transitions
                $.transition = function(el,direction){
                        
                        if(params[el.id].pause == true) return;
                        
                        $.effect(el);
                        
                        squarePos[el.id] = 0;
                        appInterval[el.id] = setInterval(function() { $.appereance(el,order[el.id][squarePos[el.id]])  },params[el.id].sDelay);
                                        
                        $(el).css({ 'background-image': 'url('+images[el.id][imagePos[el.id]]+')' });
                        
                        if(typeof(direction) == "undefined")
                                imagePos[el.id]++;
                        else
                                if(direction == 'prev')
                                        imagePos[el.id]--;
                                else
                                        imagePos[el.id] = direction;
                
                        if  (imagePos[el.id] == images[el.id].length) {
                                imagePos[el.id] = 0;
                        }
                        
                        if (imagePos[el.id] == -1){
                                imagePos[el.id] = images[el.id].length-1;
                        }
        
                        $('.cs-button-'+el.id).removeClass('cs-active');
                        $('#cs-button-'+el.id+"-"+(imagePos[el.id]+1)).addClass('cs-active');
                        
                        if(titles[el.id][imagePos[el.id]]){
                                $('#cs-title-'+el.id).css({ 'opacity' : 0 }).animate({ 'opacity' : params[el.id].opacity }, params[el.id].titleSpeed);
                                $('#cs-title-'+el.id).html(titles[el.id][imagePos[el.id]]);
                        } else {
                                $('#cs-title-'+el.id).css('opacity',0);
                        }                               
                                
                };
                
                $.appereance = function(el,sid){

                        $('.cs-'+el.id).attr('href',links[el.id][imagePos[el.id]]).attr('target',linksTarget[el.id][imagePos[el.id]]);

                        if (squarePos[el.id] == params[el.id].spw*params[el.id].sph) {
                                clearInterval(appInterval[el.id]);
                                return;
                        }

                        $('#cs-'+el.id+sid).css({ opacity: 0, 'background-image': 'url('+images[el.id][imagePos[el.id]]+')' });
                        $('#cs-'+el.id+sid).animate({ opacity: 1 }, 300);
                        squarePos[el.id]++;
                        
                };
                
                // navigation
                $.setNavigation = function(el){
                        // create prev and next 
                        $(el).append("<div id='cs-navigation-"+el.id+"'></div>");
                        $('#cs-navigation-'+el.id).hide();
                        $('#cs-navigation-'+el.id).append("<a href='#' id='cs-prev-"+el.id+"' class='cs-prev'><img src='"+BASE_URL+"system/application/resources/images/btn_prev.png' /></a>");
                        $('#cs-navigation-'+el.id).append("<a href='#' id='cs-next-"+el.id+"' class='cs-next'><img src='"+BASE_URL+"system/application/resources/images/btn_next.png' /></a>");
                        $('#cs-prev-'+el.id).css({
                                'position'      : 'absolute',
                                'top'           : 13,
                                'left'          : -68,
                                'z-index'       : 999,
                                'line-height': '30px'
                        }).click( function(e){
                                e.preventDefault();
                                $.transition(el,'prev');
                                $.transitionCall(el);           
                        }).mouseover( function(){ $('#cs-navigation-'+el.id).show() });
        
                        $('#cs-next-'+el.id).css({
                                'position'      : 'absolute',
                                'top'           : 13,
                                'right'         : -69,
                                'z-index'       : 999,
                                'line-height': '30px'
                        }).click( function(e){
                                e.preventDefault();
                                $.transition(el);
                                $.transitionCall(el);
                        }).mouseover( function(){ $('#cs-navigation-'+el.id).show() });
                
                        // image buttons
                        $("<div id='cs-buttons-"+el.id+"' class='cs-buttons'></div>").appendTo($('#coin-slider-'+el.id));

                        
                        for(k=1;k<images[el.id].length+1;k++){
                                $('#cs-buttons-'+el.id).append("<a href='#' class='cs-button-"+el.id+"' id='cs-button-"+el.id+"-"+k+"'>"+k+"</a>");
                        }
                        
                        $.each($('.cs-button-'+el.id), function(i,item){
                                $(item).click( function(e){
                                        $('.cs-button-'+el.id).removeClass('cs-active');
                                        $(this).addClass('cs-active');
                                        e.preventDefault();
                                        $.transition(el,i);
                                        $.transitionCall(el);                           
                                })
                        });     
                        
                        $('#cs-navigation-'+el.id+' a').mouseout(function(){
                                $('#cs-navigation-'+el.id).hide();
                                params[el.id].pause = false;
                        });                                             

                        $("#cs-buttons-"+el.id).css({
                                'left'                  : '85%',
                                'top'                  : '-39px',
                                'margin-left'   : -images[el.id].length*15/2-5,
                                'position'              : 'relative'
                                
                        });
                        
                                
                }




                // effects
                $.effect = function(el){
                        
                        effA = ['random','swirl','rain','straight'];
                        if(params[el.id].effect == '')
                                eff = effA[Math.floor(Math.random()*(effA.length))];
                        else
                                eff = params[el.id].effect;

                        order[el.id] = new Array();

                        if(eff == 'random'){
                                counter = 0;
                                  for(i=1;i <= params[el.id].sph;i++){
                                        for(j=1; j <= params[el.id].spw; j++){  
                                                order[el.id][counter] = i+''+j;
                                                counter++;
                                        }
                                  }     
                                $.random(order[el.id]);
                        }
                        
                        if(eff == 'rain')       {
                                $.rain(el);
                        }
                        
                        if(eff == 'swirl')
                                $.swirl(el);
                                
                        if(eff == 'straight')
                                $.straight(el);
                                
                        reverse[el.id] *= -1;
                        if(reverse[el.id] > 0){
                                order[el.id].reverse();
                        }

                }

                        
                // shuffle array function
                $.random = function(arr) {
                                                
                  var i = arr.length;
                  if ( i == 0 ) return false;
                  while ( --i ) {
                     var j = Math.floor( Math.random() * ( i + 1 ) );
                     var tempi = arr[i];
                     var tempj = arr[j];
                     arr[i] = tempj;
                     arr[j] = tempi;
                   }
                }       
                
                //swirl effect by milos popovic
                $.swirl = function(el){

                        var n = params[el.id].sph;
                        var m = params[el.id].spw;

                        var x = 1;
                        var y = 1;
                        var going = 0;
                        var num = 0;
                        var c = 0;
                        
                        var dowhile = true;
                                                
                        while(dowhile) {
                                
                                num = (going==0 || going==2) ? m : n;
                                
                                for (i=1;i<=num;i++){
                                        
                                        order[el.id][c] = x+''+y;
                                        c++;

                                        if(i!=num){
                                                switch(going){
                                                        case 0 : y++; break;
                                                        case 1 : x++; break;
                                                        case 2 : y--; break;
                                                        case 3 : x--; break;
                                                
                                                }
                                        }
                                }
                                
                                going = (going+1)%4;

                                switch(going){
                                        case 0 : m--; y++; break;
                                        case 1 : n--; x++; break;
                                        case 2 : m--; y--; break;
                                        case 3 : n--; x--; break;               
                                }
                                
                                check = $.max(n,m) - $.min(n,m);                        
                                if(m<=check && n<=check)
                                        dowhile = false;
                                                                        
                        }
                }

                // rain effect
                $.rain = function(el){
                        var n = params[el.id].sph;
                        var m = params[el.id].spw;

                        var c = 0;
                        var to = to2 = from = 1;
                        var dowhile = true;



                        while(dowhile){
                                
                                for(i=from;i<=to;i++){
                                        order[el.id][c] = i+''+parseInt(to2-i+1);
                                        c++;
                                }
                                
                                to2++;
                                
                                if(to < n && to2 < m && n<m){
                                        to++;   
                                }
                                
                                if(to < n && n>=m){
                                        to++;   
                                }
                                
                                if(to2 > m){
                                        from++;
                                }
                                
                                if(from > to) dowhile= false;
                                
                        }                       

                }

                // straight effect
                $.straight = function(el){
                        counter = 0;
                        for(i=1;i <= params[el.id].sph;i++){
                                for(j=1; j <= params[el.id].spw; j++){  
                                        order[el.id][counter] = i+''+j;
                                        counter++;
                                }
                                
                        }
                }

                $.min = function(n,m){
                        if (n>m) return m;
                        else return n;
                }
                
                $.max = function(n,m){
                        if (n<m) return m;
                        else return n;
                }               
        
        this.each (
                function(){ init(this); }
        );
        

        };
        
        
        // default values
        $.fn.coinslider.defaults = {    
                width: 565, // width of slider panel
                height: 290, // height of slider panel
                spw: 0, // squares per width
                sph: 0, // squares per height
                delay: 10000, // delay between images in ms
                sDelay: 100, // delay beetwen squares in ms
                opacity: 0.7, // opacity of title and navigation
                titleSpeed: 500, // speed of title appereance in ms
                effect: '', // random, swirl, rain, straight
                navigation: true, // prev next and buttons
                links : true, // show images as links 
                hoverPause: true // pause on hover              
        };      
        
})(jQuery);