/*
* jQuery infinitecarousel plugin
* @author admin@catchmyfame.com - http://www.catchmyfame.com
* @version 1.2.2
* @date August 31, 2009
* @category jQuery plugin
* @copyright (c) 2009 admin@catchmyfame.com (www.catchmyfame.com)
* @license CC Attribution-Share Alike 3.0 - http://creativecommons.org/licenses/by-sa/3.0/
*/
//String.prototype.trim = function() {
//    return this.replace(/^\s+|\s+$/g, "");
//}

(function($) {
    $.fn.extend({
        infiniteCarousel: function(options) {
            var defaults =
			{
			    transitionSpeed: 1500,
			    displayTime: 6000,
			    textholderHeight: .9,
			    displayProgressBar: 1,
			    displayThumbnails: 1,
			    displayThumbnailNumbers: 0,
			    displayThumbnailBackground: 1,
			    thumbnailWidth: '33px',
			    thumbnailHeight: '33px',
			    thumbnailFontSize: '.7em'
			};
            var options = $.extend(defaults, options);

            return this.each(function() {
                var randID = Math.round(Math.random() * 100000000);
                var o = options;
                var obj = $(this);
                var curr = 1;

                var numImages = $('img', obj).length; // Number of images
                var imgHeight = $('img:first', obj).height();
                var imgWidth = $('img:first', obj).width();
                var autopilot = 1;

                $('p', obj).hide(); // Hide any text paragraphs in the carousel
                $(obj).width(imgWidth).height(imgHeight);

                // Build progress bar
                if (o.displayProgressBar) {
                    //$(obj).append('<div id="progress' + randID + '" style="position:absolute;bottom:0;background:#bbb;left:' + $(obj).css('paddingLeft') + '"></div>');
                    $(obj).append('<div id="progress' + randID + '" style="position:absolute;bottom:0px;background:#bbb;left:1px;right:2px"></div>');
                    $('#progress' + randID).width(imgWidth).height(4).css('opacity', '.3');
                }

                // Move last image and stick it on the front
                $(obj).css({ 'overflow': 'hidden', 'position': 'relative' });
                $('li:last', obj).prependTo($('ul', obj));
                $('ul', obj).css('left', -imgWidth + 'px');
                $('ul', obj).width(9999);

                $('ul', obj).css({ 'list-style': 'none', 'margin': '0', 'padding': '0', 'position': 'relative' });
                $('li', obj).css({ 'display': 'inline', 'float': 'left' });

                // Build textholder div at top left and moving down
                bbrhtm = '<div id="textholder' + randID + '" style="margin-top:-38px;margin-left:646px;Color:#000"></div>'
                
               $(obj).after(bbrhtm);
                var correctTHWidth = parseInt($('#textholder' + randID).css('paddingBottom') - 222);
                var correctTHHeight = parseInt($('#textholder' + randID).css('paddingRight'));
                $('#textholder' + randID).append('<img src="' + $('li:eq(1) p', obj).html() + '" usemap="#mp' + $('li:eq(1) p', obj).html() + '" border="0"/>');
                showtext('<img src="' + $('li:eq(1) p', obj).html() + '" usemap="#mp' + $('li:eq(1) p', obj).html() + '" border="0"/>');
                //jun create side boxes
                //rbxhtm = '<div id="rbx' + randID + '" style="margin-top:-49px;margin-left:650px;Color:#000"></div>'
                //$(obj).after(rbxhtm);
                $('#rbx' + randID).append('<img src="' + $('img:eq(1)', obj).attr('src') + '"/>');
                // Prev/next button(img) 
                html = '<div id="btn_rt' + randID + '" style="position:absolute;right:0;top:' + ((imgHeight / 2) - 15) + 'px"><a href="javascript:void(0);"><img style="border:none;margin-right:2px" src="../images/rt.png" /></a></div>';
                html += '<div id="btn_lt' + randID + '" style="position:absolute;left:0;top:' + ((imgHeight / 2) - 15) + 'px"><a href="javascript:void(0);"><img style="border:none;margin-left:2px" src="../images/lt.png" /></a></div>';
                //$(obj).append(html);

                // Pause/play button(img)	
                html = '<a href="javascript:void(0);"><img id="pause_btn' + randID + '" src="images/pause.png" style="position:absolute;top:10px;right:10px;border:none" alt="Pause" /></a>';
                html += '<a href="javascript:void(0);"><img id="play_btn' + randID + '" src="images/play.png" style="position:absolute;top:10px;right:10px;border:none;display:none;" alt="Play" /></a>';
                //$(obj).append(html);
                // ///////////jun added news room button
                //            html = '<div id="dvNRM" style="position:absolute;right:0px;top:' + ((imgHeight / 2) - 65) + 'px"><a href="nrm.htm"><img style="border:none;margin-right:2px;width:88px" src="imgs/btnfm.jpg" alt="News Room" /></a></div>';
                //            $(obj).append(html);
                //            $('#dvNRM').css('opacity', '.5').hover(function() { $(this).animate({ opacity: '1' }, 660) }, function() { $(this).animate({ opacity: '.5' }, 450) });
                //            showNRM($('#dvNRM', obj).html());
                ////////////////////////////////////////////////
                $('#pause_btn' + randID).css('opacity', '.5').hover(function() { $(this).animate({ opacity: '1' }, 250) }, function() { $(this).animate({ opacity: '.5' }, 250) });
                $('#pause_btn' + randID).click(function() {
                    autopilot = 0;
                    $('#progress' + randID).stop().fadeOut();
                    clearTimeout(clearInt);
                    $('#pause_btn' + randID).fadeOut(250);
                    $('#play_btn' + randID).fadeIn(250);
                    //showminmax();
                });
                $('#play_btn' + randID).css('opacity', '.5').hover(function() { $(this).animate({ opacity: '1' }, 250) }, function() { $(this).animate({ opacity: '.5' }, 250) });
                $('#play_btn' + randID).click(function() {
                    autopilot = 1;
                    anim('next');
                    $('#play_btn' + randID).hide();
                    clearInt = setInterval(function() { anim('next'); }, o.displayTime + o.transitionSpeed);
                    setTimeout(function() { $('#pause_btn' + randID).show(); $('#progress' + randID).fadeIn().width(imgWidth).height(5); }, o.transitionSpeed);
                });

                // Left and right arrow image button actions
                $('#btn_rt' + randID).css('opacity', '.75').click(function() {
                    autopilot = 0;
                    $('#progress' + randID).stop().fadeOut();
                    anim('next');
                    setTimeout(function() { $('#play_btn' + randID).fadeIn(250); }, o.transitionSpeed);
                    clearTimeout(clearInt);
                }).hover(function() { $(this).animate({ opacity: '1' }, 250) }, function() { $(this).animate({ opacity: '.75' }, 250) });
                $('#btn_lt' + randID).css('opacity', '.75').click(function() {
                    autopilot = 0;
                    $('#progress' + randID).stop().fadeOut();
                    anim('prev');
                    setTimeout(function() { $('#play_btn' + randID).fadeIn(250); }, o.transitionSpeed);
                    clearTimeout(clearInt);
                }).hover(function() { $(this).animate({ opacity: '1' }, 250) }, function() { $(this).animate({ opacity: '.75' }, 250) });

                if (o.displayThumbnails) {
                    // Build thumbnail viewer and thumbnail divs
                    //$(obj).after('<div id="thumbs' + randID + '" style="position:relative;overflow:auto;text-align:left;padding-top:-25px;"></div>');
                    //jun changed the thumbs position
                    $(obj).append('<div id="thumbs' + randID + '" style="position:absolute;left:492px;top:' + ((imgHeight / 2) + 63) + 'px"></div>');
                    $('#thumbs' + randID).width(imgWidth);
                    //jun add this line for thumbnails
                    var arythbg = new Array('#ffde00', '#d60000', '#7b21ad', '#009c51');
                    for (i = 0; i <= numImages - 1; i++) {
                        var arythimgs = new Array('imgs/tb1.jpg', 'imgs/tb2.jpg', 'imgs/tb3.jpg');
                        thumb = $('img:eq(' + (i + 1) + ')', obj).attr('src');

                        $('#thumbs' + randID).append('<div class="thumb" id="thumb' + randID + '_' + (i + 1) + '" style="cursor:pointer;background-image:url(' + arythimgs[i] + ');display:inline;float:left;width:' + o.thumbnailWidth + ';height:' + o.thumbnailHeight + ';line-height:' + o.thumbnailHeight + ';padding:0;overflow:hidden;text-align:center;border:1px solid #ccc;margin-right:4px;font-size:' + o.thumbnailFontSize + ';font-family:Arial;color:#000;-moz-border-radius: 3px;text-shadow:0 0 3px #fff">' + (i + 1) + '</div>');
                        //jun changed this for thumbnails background
                        //$('#thumbs' + randID).append('<div class="thumb" id="thumb' + randID + '_' + (i + 1) + '" style="cursor:pointer;background-color:' + arythbg[i] + ';display:inline;float:left;width:' + o.thumbnailWidth + ';height:' + o.thumbnailHeight + ';line-height:' + o.thumbnailHeight + ';padding:0;overflow:hidden;text-align:center;border:1px solid #ccc;margin-right:4px;font-size:' + o.thumbnailFontSize + ';font-family:Arial;color:#000;-moz-border-radius: 3px;text-shadow:0 0 3px #fff">' + (i + 1) + '</div>');
                        if (i == 0) $('#thumb' + randID + '_1').css({ 'border-color': '#ff0000' });
                    }
                    // Next two lines are a special case to handle the first list element which was originally the last
                    //thumb = $('img:first', obj).attr('src');
                    //$('#thumb' + randID + '_' + numImages).css({ 'background-image': 'url(' + thumb + ')' });


                    $('#thumbs' + randID + ' div.thumb:not(:first)').css({ 'opacity': '.4' }); // makes all thumbs 65% opaque except the first one
                    $('#thumbs' + randID + ' div.thumb').hover(function() { $(this).animate({ 'opacity': .6 }, 150) }, function() { if (curr != this.id.split('_')[1]) $(this).animate({ 'opacity': .4 }, 250) }); // add hover to thumbs

                    // Assign click handler for the thumbnails. Normally the format $('.thumb') would work but since it's outside of our object (obj) it would get called multiple times
                    $('#thumbs' + randID + ' div').bind('click', thumbclick); // We use bind instead of just plain click so that we can repeatedly remove and reattach the handler

                    if (!o.displayThumbnailNumbers) $('#thumbs' + randID + ' div').text('');
                    if (!o.displayThumbnailBackground) $('#thumbs' + randID + ' div').css({ 'background-image': 'none' });
                }
                function thumbclick(event) {
                    target_num = this.id.split('_'); // we want target_num[1]
                    if (curr != target_num[1]) {
                        $('#thumb' + randID + '_' + curr).css({ 'border-color': '#ccc' });
                        $('#progress' + randID).stop().fadeOut();
                        clearTimeout(clearInt);
                        //alert(event.data.src+' '+this.id+' '+target_num[1]+' '+curr);
                        $('#thumbs' + randID + ' div').css({ 'cursor': 'default' }).unbind('click'); // Unbind the thumbnail click event until the transition has ended
                        autopilot = 0;
                        setTimeout(function() { $('#play_btn' + randID).fadeIn(250); }, o.transitionSpeed);
                    }
                    if (target_num[1] > curr) {
                        diff = target_num[1] - curr;
                        anim('next', diff);
                    }
                    if (target_num[1] < curr) {
                        diff = curr - target_num[1];
                        anim('prev', diff);
                    }
                }

                function showtext(t) {
                    // the text will always be the text of the second list item (if it exists)
                    if (t != null) {
                        $('#textholder' + randID).html(t).animate({ 'opacity': .9 }, 250); // drop down 
                        //$('#textholder' + randID).html(t).animate({ marginLeft: '30px' }, 500); // drop down 
                        //showminmax();
                    }
                }
                function showNRM(btnImg) {
                    // the text will always be the text of the second list item (if it exists)
                    if (btnImg != null) {
                        $('#dvNRM').html(btnImg).animate({ marginRight: '30px' }, 500); // drop down 
                        //showminmax();
                    }
                }
                function showminmax() {
                    if (!autopilot) {
                        html = '<img style="position:absolute;bottom:2px;right:18px;display:none;cursor:pointer" src="../images/down.png" title="Minimize" alt="minimize" id="min" /><img style="position:absolute;bottom:2px;right:18px;display:none;cursor:pointer" src="../images/up.png" title="Maximize" alt="maximize" id="max" />';
                        html += '<img style="position:absolute;bottom:2px;right:6px;display:none;cursor:pointer" src="../images/close.png" title="Close" alt="close" id="close" />';
                        // $('#textholder' + randID).append(html);
                        //$('#min').fadeIn(250).click(function() { $('#textholder' + randID).animate({ marginTop: '0px' }, 500, function() { $("#min,#max").toggle(); }); });
                       // $('#max').click(function() { $('#textholder' + randID).animate({ marginTop: '30px' }, 500, function() { $("#min,#max").toggle(); }); });
                       // $('#close').fadeIn(250).click(function() { $('#textholder' + randID).animate({ marginTop: '0px' }, 500); });
                    }
                }
                function borderpatrol(elem) {
                    $('#thumbs' + randID + ' div').css({ 'border-color': '#ccc' }).animate({ opacity: 0.65 }, 500);
                    setTimeout(function() { elem.css({ 'border-color': '#ff0000' }).animate({ 'opacity': .99 }, 500); }, o.transitionSpeed);
                }
                function anim(direction, dist) {
                    // Fade left/right arrows out when transitioning
                    $('#btn_rt' + randID).fadeOut(500);
                    $('#btn_lt' + randID).fadeOut(500);

                    // animate textholder out of frame
                    // $('#textholder' + randID).animate({ marginTop: (-imgHeight * o.textholderHeight) - (correctTHHeight * 2) + '0px' }, 500);


                    //?? Fade out play/pause?
                    $('#pause_btn' + randID).fadeOut(250);
                    $('#play_btn' + randID).fadeOut(250);

                    if (direction == "next") {
                        if (curr == numImages) curr = 0;
                        if (dist > 1) {
                            borderpatrol($('#thumb' + randID + '_' + (curr + dist)));
                            $('li:lt(2)', obj).clone().insertAfter($('li:last', obj));
                            $('ul', obj).animate({ left: -imgWidth * (dist + 1) }, o.transitionSpeed, function() {
                                $('li:lt(2)', obj).remove();
                                for (j = 1; j <= dist - 2; j++) {
                                    $('li:first', obj).clone().insertAfter($('li:last', obj));
                                    $('li:first', obj).remove();
                                }
                                $('#btn_rt' + randID).fadeIn(500);
                                $('#btn_lt' + randID).fadeIn(500);
                                $('#play_btn' + randID).fadeIn(250);
                                //showtext($('li:eq(1) p', obj).html());
                                showtext('<img src="' + $('li:eq(1) p', obj).html() + '" usemap="#mp' + $('li:eq(1) p', obj).html() + '" border="0"/>');


                                $(this).css({ 'left': -imgWidth });
                                curr = curr + dist;
                                $('#thumbs' + randID + ' div').bind('click', thumbclick).css({ 'cursor': 'pointer' });
                            });
                        }
                        else {
                            borderpatrol($('#thumb' + randID + '_' + (curr + 1)));
                            $('#thumbs' + randID + ' div').css({ 'cursor': 'default' }).unbind('click'); // Unbind the thumbnail click event until the transition has ended
                            // Copy leftmost (first) li and insert it after the last li
                            $('li:first', obj).clone().insertAfter($('li:last', obj));
                            // Update width and left position of ul and animate ul to the left
                            $('ul', obj)
								.animate({ left: -imgWidth * 2 }, o.transitionSpeed, function() {
								    $('li:first', obj).remove();
								    $('ul', obj).css('left', -imgWidth + 'px');
								    $('#btn_rt' + randID).fadeIn(500);
								    $('#btn_lt' + randID).fadeIn(500);
								    if (autopilot) $('#pause_btn' + randID).fadeIn(250);
								    //showtext($('li:eq(1) p', obj).html());
								    showtext('<img src="' + $('li:eq(1) p', obj).html() + '" usemap="#mp' + $('li:eq(1) p', obj).html() + '" border="0"/>');


								    if (autopilot) {
								        $('#progress' + randID).width(imgWidth).height(5);
								        $('#progress' + randID).animate({ 'width': 0 }, o.displayTime, function() {
								            $('#pause_btn' + randID).fadeOut(50);
								            setTimeout(function() { $('#pause_btn' + randID).fadeIn(250) }, o.transitionSpeed)
								        });
								    }
								    curr = curr + 1;
								    $('#thumbs' + randID + ' div').bind('click', thumbclick).css({ 'cursor': 'pointer' });
								});
                        }
                    }
                    if (direction == "prev") {
                        if (dist > 1) {
                            borderpatrol($('#thumb' + randID + '_' + (curr - dist)));
                            $('li:gt(' + (numImages - (dist + 1)) + ')', obj).clone().insertBefore($('li:first', obj));
                            $('ul', obj).css({ 'left': (-imgWidth * (dist + 1)) }).animate({ left: -imgWidth }, o.transitionSpeed, function() {
                                $('li:gt(' + (numImages - 1) + ')', obj).remove();
                                $('#btn_rt' + randID).fadeIn(500);
                                $('#btn_lt' + randID).fadeIn(500);
                                $('#play_btn' + randID).fadeIn(250);
                                //  showtext($('li:eq(1) p', obj).html());
                                showtext('<img src="' + $('li:eq(1) p', obj).html() + '" usemap="#mp' + $('li:eq(1) p', obj).html() + '" border="0"/>');

                                curr = curr - dist;
                                $('#thumbs' + randID + ' div').bind('click', thumbclick).css({ 'cursor': 'pointer' });
                            });
                        }
                        else {
                            borderpatrol($('#thumb' + randID + '_' + (curr - 1)));
                            $('#thumbs' + randID + ' div').css({ 'cursor': 'default' }).unbind('click'); // Unbind the thumbnail click event until the transition has ended
                            // Copy rightmost (last) li and insert it after the first li
                            $('li:last', obj).clone().insertBefore($('li:first', obj));
                            // Update width and left position of ul and animate ul to the right
                            $('ul', obj)
								.css('left', -imgWidth * 2 + 'px')
								.animate({ left: -imgWidth }, o.transitionSpeed, function() {
								    $('li:last', obj).remove();
								    $('#btn_rt' + randID).fadeIn(500);
								    $('#btn_lt' + randID).fadeIn(500);
								    if (autopilot) $('#pause_btn' + randID).fadeIn(250);
								    //showtext($('li:eq(1) p', obj).html());
								    showtext('<img src="' + $('li:eq(1) p', obj).html() + '" usemap="#mp' + $('li:eq(1) p', obj).html() + '" border="0"/>');


								    curr = curr - 1;
								    if (curr == 0) curr = numImages;
								    $('#thumbs' + randID + ' div').bind('click', thumbclick).css({ 'cursor': 'pointer' });
								});
                        }
                    }
                }

                var clearInt = setInterval(function() { anim('next'); }, o.displayTime + o.transitionSpeed);
                $('#progress' + randID).animate({ 'width': 0 }, o.displayTime + o.transitionSpeed, function() {
                    $('#pause_btn' + randID).fadeOut(100);
                    setTimeout(function() { $('#pause_btn' + randID).fadeIn(250) }, o.transitionSpeed)
                });
            });
        }
    });
})(jQuery);