/**
* author Remy Sharp
* url http://remysharp.com/tag/marquee
*/

(function ($) {
    $.fn.marquee = function (klass) {
            var newMarquee = [],
	                last = this.length;

			        // works out the left or right hand reset position, based on scroll
				        // behavior, current direction and new direction
					        function getReset(newDir, marqueeRedux, marqueeState) {
						            var behavior = marqueeState.behavior, width = marqueeState.width, dir = marqueeState.dir;
							                var r = 0;
									            if (behavior == 'alternate') {
										                    r = newDir == 1 ? marqueeRedux[marqueeState.widthAxis] - (width*2) : width;
												                } else if (behavior == 'slide') {
														                if (newDir == -1) {
																                    r = dir == -1 ? marqueeRedux[marqueeState.widthAxis] : width;
																		                    } else {
																				                        r = dir == -1 ? marqueeRedux[marqueeState.widthAxis] - (width*2) : 0;
																							                }
																									            } else {
																										                    r = newDir == -1 ? marqueeRedux[marqueeState.widthAxis] : 0;
																												                }
																														            return r;
																															            }

																																            // single "thread" animation
																																	            function animateMarquee() {
																																		                var i = newMarquee.length,
																																				                marqueeRedux = null,
																																						                $marqueeRedux = null,
																																								                marqueeState = {},
																																										                newMarqueeList = [],
																																												                hitedge = false;
																																														                
																																																            while (i--) {
																																																	                    marqueeRedux = newMarquee[i];
																																																			                    $marqueeRedux = $(marqueeRedux);
																																																					                    marqueeState = $marqueeRedux.data('marqueeState');
																																																							                    
																																																									                    if ($marqueeRedux.data('paused') !== true) {
																																																											                        // TODO read scrollamount, dir, behavior, loops and last from data
																																																														                    marqueeRedux[marqueeState.axis] += (marqueeState.scrollamount * marqueeState.dir);

																																																																                        // only true if it's hit the end
																																																																			                    hitedge = marqueeState.dir == -1 ? marqueeRedux[marqueeState.axis] <= getReset(marqueeState.dir * -1, marqueeRedux, marqueeState) : marqueeRedux[marqueeState.axis] >= getReset(marqueeState.dir * -1, marqueeRedux, marqueeState);
																																																																					                        
																																																																								                    if ((marqueeState.behavior == 'scroll' && marqueeState.last == marqueeRedux[marqueeState.axis]) || (marqueeState.behavior == 'alternate' && hitedge && marqueeState.last != -1) || (marqueeState.behavior == 'slide' && hitedge && marqueeState.last != -1)) {                        
																																																																										                            if (marqueeState.behavior == 'alternate') {
																																																																													                                marqueeState.dir *= -1; // flip
																																																																																	                        }
																																																																																				                        marqueeState.last = -1;

																																																																																							                        $marqueeRedux.trigger('stop');

																																																																																										                        marqueeState.loops--;
																																																																																													                        if (marqueeState.loops === 0) {
																																																																																																                            if (marqueeState.behavior != 'slide') {
																																																																																																			                                    marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir, marqueeRedux, marqueeState);
																																																																																																							                                } else {
																																																																																																											                                // corrects the position
																																																																																																															                                marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir * -1, marqueeRedux, marqueeState);
																																																																																																																			                            }

																																																																																																																						                                $marqueeRedux.trigger('end');
																																																																																																																										                        } else {
																																																																																																																													                            // keep this marquee going
																																																																																																																																                                newMarqueeList.push(marqueeRedux);
																																																																																																																																				                            $marqueeRedux.trigger('start');
																																																																																																																																							                                marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir, marqueeRedux, marqueeState);
																																																																																																																																											                        }
																																																																																																																																														                    } else {
																																																																																																																																																                            newMarqueeList.push(marqueeRedux);
																																																																																																																																																			                        }
																																																																																																																																																						                    marqueeState.last = marqueeRedux[marqueeState.axis];

																																																																																																																																																								                        // store updated state only if we ran an animation
																																																																																																																																																											                    $marqueeRedux.data('marqueeState', marqueeState);
																																																																																																																																																													                    } else {
																																																																																																																																																															                        // even though it's paused, keep it in the list
																																																																																																																																																																		                    newMarqueeList.push(marqueeRedux);                    
																																																																																																																																																																				                    }
																																																																																																																																																																						                }

																																																																																																																																																																								            newMarquee = newMarqueeList;
																																																																																																																																																																									                
																																																																																																																																																																											            if (newMarquee.length) {
																																																																																																																																																																												                    setTimeout(animateMarquee, 25);
																																																																																																																																																																														                }            
																																																																																																																																																																																        }
																																																																																																																																																																																	        
																																																																																																																																																																																		        // TODO consider whether using .html() in the wrapping process could lead to loosing predefined events...
																																																																																																																																																																																			        this.each(function (i) {
																																																																																																																																																																																				            var $marquee = $(this),
																																																																																																																																																																																					                    width = $marquee.attr('width') || $marquee.width(),
																																																																																																																																																																																							                    height = $marquee.attr('height') || $marquee.height(),
																																																																																																																																																																																									                    $marqueeRedux = $marquee.after('<div ' + (klass ? 'class="' + klass + '" ' : '') + 'style="display: block-inline; width: ' + width + 'px; height: ' + height + 'px; overflow: hidden;"><div style="float: left; white-space: nowrap;">' + $marquee.html() + '</div></div>').next(),
																																																																																																																																																																																											                    marqueeRedux = $marqueeRedux.get(0),
																																																																																																																																																																																													                    hitedge = 0,
																																																																																																																																																																																															                    direction = ($marquee.attr('direction') || 'left').toLowerCase(),
																																																																																																																																																																																																	                    marqueeState = {
																																																																																																																																																																																																			                        dir : /down|right/.test(direction) ? -1 : 1,
																																																																																																																																																																																																						                    axis : /left|right/.test(direction) ? 'scrollLeft' : 'scrollTop',
																																																																																																																																																																																																								                        widthAxis : /left|right/.test(direction) ? 'scrollWidth' : 'scrollHeight',
																																																																																																																																																																																																											                    last : -1,
																																																																																																																																																																																																													                        loops : $marquee.attr('loop') || -1,
																																																																																																																																																																																																																                    scrollamount : $marquee.attr('scrollamount') || this.scrollAmount || 2,
																																																																																																																																																																																																																		                        behavior : ($marquee.attr('behavior') || 'scroll').toLowerCase(),
																																																																																																																																																																																																																					                    width : /left|right/.test(direction) ? width : height
																																																																																																																																																																																																																							                    };
																																																																																																																																																																																																																									                
																																																																																																																																																																																																																											            // corrects a bug in Firefox - the default loops for slide is -1
																																																																																																																																																																																																																												                if ($marquee.attr('loop') == -1 && marqueeState.behavior == 'slide') {
																																																																																																																																																																																																																														                marqueeState.loops = 1;
																																																																																																																																																																																																																																            }

																																																																																																																																																																																																																																	                $marquee.remove();
																																																																																																																																																																																																																																			            
																																																																																																																																																																																																																																				                // add padding
																																																																																																																																																																																																																																						            if (/left|right/.test(direction)) {
																																																																																																																																																																																																																																							                    $marqueeRedux.find('> div').css('padding', '0 ' + width + 'px');
																																																																																																																																																																																																																																									                } else {
																																																																																																																																																																																																																																											                $marqueeRedux.find('> div').css('padding', height + 'px 0');
																																																																																																																																																																																																																																													            }
																																																																																																																																																																																																																																														                
																																																																																																																																																																																																																																																            // events
																																																																																																																																																																																																																																																	                $marqueeRedux.bind('stop', function () {
																																																																																																																																																																																																																																																			                $marqueeRedux.data('paused', true);
																																																																																																																																																																																																																																																					            }).bind('pause', function () {
																																																																																																																																																																																																																																																						                    $marqueeRedux.data('paused', true);
																																																																																																																																																																																																																																																								                }).bind('start', function () {
																																																																																																																																																																																																																																																										                $marqueeRedux.data('paused', false);
																																																																																																																																																																																																																																																												            }).bind('unpause', function () {
																																																																																																																																																																																																																																																													                    $marqueeRedux.data('paused', false);
																																																																																																																																																																																																																																																															                }).data('marqueeState', marqueeState); // finally: store the state
																																																																																																																																																																																																																																																																	            
																																																																																																																																																																																																																																																																		                // todo - rerender event allowing us to do an ajax hit and redraw the marquee

																																																																																																																																																																																																																																																																				            newMarquee.push(marqueeRedux);

																																																																																																																																																																																																																																																																					                marqueeRedux[marqueeState.axis] = getReset(marqueeState.dir, marqueeRedux, marqueeState);
																																																																																																																																																																																																																																																																							            $marqueeRedux.trigger('start');
																																																																																																																																																																																																																																																																								                
																																																																																																																																																																																																																																																																										            // on the very last marquee, trigger the animation
																																																																																																																																																																																																																																																																											                if (i+1 == last) {
																																																																																																																																																																																																																																																																													                animateMarquee();
																																																																																																																																																																																																																																																																															            }
																																																																																																																																																																																																																																																																																            });            

																																																																																																																																																																																																																																																																																	            return $(newMarquee);
																																																																																																																																																																																																																																																																																		        };
																																																																																																																																																																																																																																																																																			}(jQuery));
																																																																																																																																																																																																																																																																																			

