/**
 * jQuery vitrina plugin.  Turn 1 img into slideshow under mouse
 *  HTML Tagging required is:
 * <div class="vitrina">...
 * <a href="/product/pid" hrefalt="['/product/pid2', '/product/pid3']">
 * <img title="Subtitle 1" src="image1.jpg" srcalt="['image2.jpg', 'image3.jpg']"/>
 * </a>
 * </div>
 *
 * Timeline: timeIn -> preload -(timeISI)-> slide(preload next) -timeISI-> slide -...
 * mouseover -> pausa??
 *
 * Copyright (c) 2011 Dmitry Sherbina
 * Licensed under the MIT License:
 *   http://www.opensource.org/licenses/mit-license.php
 *
 * @usage
 * jQuery(window).load(function($) {
 *  $('.vitrina').vitrina();
 * });
 *
 * You can set some params like:
 *
 * @param      	soundsrc	(string) URL to wav file
 * @param	timeSound	(int)	 ms to wait sound on after slide, default 100
 * @param	timeISI	(int)	 ms between slides, default 2400
 * @param	speed	(int/string)	slide show speed ( 'slow', 'normal', 'fast' or number of milliseconds) default 'slow'
 * @param    	bgColor  (color)   color for wrapper background
 *
 * @changelog
 *	1.0.0	First release
 *
 */
(function($){
    $.fn.extend( {
        vitrina: function(options){
            var defaults = {
                //~ animation:  { marginLeft: function(){return -$(this).outerWidth({margin:true});} },
                //~ animationBack:  { marginLeft: '0' },
                //~ preparation: {marginLeft: function(){return $(this).parent().innerWidth();} },
                soundsrc: '',///prostyle/static/lib/page-flip-1.wav',
                timeSound: 100,
                bgColor: 'transparent',
                speed: 'slow',
                backSpeed: 'slow',
                timeIn: 200,
                timeISI : 2400
            };
            var options = $.extend(defaults, options);
            if (options.soundsrc){
                    var snd = $('<audio id="sound1" preload src="'+options.soundsrc+
                        '" type="audio/'+options.soundsrc.slice(-3)+'" ></audio> ').appendTo($('body'))[0];
                    var soundFlip = function() {
                        snd.play();
                    }
            }
            return this.each(function(){
                var a= $(this).find('a')
                var el = $(this).find('img');  //img in box
                    
                //~ var w = el.outerWidth();
                //~ var h	= el.outerHeight();
                var uuI=eval(el.attr('srcalt'))
                var uu=eval(a.attr('hrefalt'))
                if(!uuI || uuI.length==0)  return true;
                
                var animation= { opacity: 0};
                var animationBack= { opacity: 1};
                var timerWait=0;
                
                var items	= [el];
                var links= [a.attr('href')];
                var index	= 0;
                
                /* box */
                var props = {
                    width: el.outerWidth(true),
                    height: el.outerHeight(true),
                    'float': el.css('float')
                }
                var wrapper = $('<div></div>')
                    //~ .addClass('ui-effects-wrapper')
                    .css({
                        fontSize: '100%',
                        background: options.bgColor,
                        border: 'none',
                        margin: 0,
                        padding: 0
                    });
                el.wrap(wrapper);
                wrapper = el.parent(); //Hotfix for jQuery 1.4 since some change in wrap() seems to actually loose the reference to the wrapped element
                // transfer positioning properties to the wrapper
                if (el.css('position') == 'static') {
                    wrapper.css({ position: 'relative' });
                    //~ el.css({ position: 'relative' });
                } else {
                    $.extend(props, {
                        position: el.css('position'),
                        zIndex: el.css('z-index')
                    });
//'bottom', 'right'
                    $.each(['top', 'left'], function(i, pos) {
                        props[pos] = el.css(pos);
                        if (isNaN(parseInt(props[pos], 10))) {
                            props[pos] = 'auto';
                        }
                    });
                }
                el.css({position: 'absolute', top: 0, left:0, bottom: 'auto', right:'auto'});
                wrapper.css(props).css({overflow:'hidden'}).show();

                var speed = isNaN( parseInt( options.speed ) ) ? options.speed : parseInt( options.speed );
                
                var start = function() {
                    var timeIn = parseInt( options.timeIn );
                    var timeISI = parseInt( options.timeISI );
                    setTimeout(prepareItem, 0)
                    var t = (timeISI>timeIn) ? (timeISI-timeIn) : timeISI
                    timerWait=setTimeout( nextItem, t);
                }
                var stop =  function() {
                        if(timerWait>0){
                                clearTimeout(timerWait);
                                timerWait=0;
                        }
                }
                var nextItem = function() {
                        var itemCur=items [index]
                        var itemNext = (index+1>items.length-1) ? items[0] : items[index+1];
                        var uNext = (index+1> links.length-1) ? links[0] : links[index+1];
			w=itemCur.outerWidth()
                        itemCur.animate( animation, speed, function(){
                            $(this).hide(); 
                            prepareItem();
                        } );
                        itemNext.show().animate( animationBack, speed, function(){
                            timerWait=setTimeout(nextItem, options.timeISI);
                                a.attr('href', uNext);
                        });
                        if (options.soundsrc){
                                setTimeout(soundFlip, options.timeSound)
                        }
			index++; if( index > ( items.length-1) ) index = 0;
                };
                var prepareItem	= function() {
                    if (uuI.length>0){
                        var uINext=uuI.pop(0)
                        var itemNext=$('<img src="'+uINext+'">').css({position:'absolute', top:0, left:0}).appendTo(wrapper).hide()
                        items.push( itemNext );
                        var uNext=uu.pop(0)
                        links.push(uNext)
                    }else{
                        var itemNext = (index+1>items.length-1) ? items[0] : items[index+1];
                        var uNext = (index+1> links.length-1) ? links[0] : links[index+1];
                    }
                    var preprops={opacity: 0};
                    itemNext.css(preprops)
                };
                
                //~ wrapper.hover(stop, start)
                var timeIn = parseInt( options.timeIn );
                timerWait=setTimeout( start, timeIn );
            });
        }
    });
})(jQuery);