var timerid=null;
var thumb_width = 50;
var master_width = 100;
var thumb_height = 50;
var head = document.getElementsByTagName("head")[0];
script = document.createElement('script');
script.id = 'googleScript';
script.type = 'text/javascript';
script.src = "http://www.google.com/jsapi";
head.appendChild(script);

SlideTimer = function(slider, master, timer_interval, slide_obj) {
    this.slider = slider;
    this.master = master;
    this.obj = slide_obj;
    this.timer_interval = timer_interval;
    this.timerid = null;
    this.start = function() {
        
        thisobject = this;
        this.timerid = setInterval(function() { thisobject.slideImages(); }, this.timer_interval); //"' + slider + '","' + master + '","' + obj + '")', 6000);

    }
    this.stop = function() {
        clearInterval(this.timerid);
    }


    this.slideImages = function() {
        
        var left_attr = parseInt($(this.slider).css('left'));
        var width_attr = parseInt($(this.master).css('width'));
        var slider_width = parseInt($(this.slider).css('width'));
        var animate_str = '-=' + thumb_width.toString();
        if (left_attr > (1 - (slider_width - Math.ceil((thumb_width ))))) {
            left_attr -= thumb_width;

        }
        else {
            left_attr = width_attr - (thumb_width * 2);
            
            $(this.slider).css('left', left_attr.toString() + 'px');
           
        }
      
        $(this.slider).animate({ left: animate_str }, 'slow');
        

    }
}

tubeslider = function(doc, divid, timer_interval) {
    this.doc = doc;
    this.timer_obj;
    this.timerid = null;
    this.timer_interval = timer_interval;
    this.divid = divid;
    this.slider;
    this.master = '#' + divid;

    if (this.timer_obj != null && this.timer_obj != undefined) {
        this.timer_obj.stop();
        delete this.timer_obj;
    }

    this.timer_obj = null;
    var slider_css = document.createElement('link');
    slider_css.rel = 'stylesheet'
    slider_css.type = 'text/css';
    slider_css.href = 'youtubeslider.css';
    document.getElementsByTagName('head')[0].appendChild(slider_css);




    this.initex = function(tube_data) {

        var j = 0;
        while (j < tube_data.length && tube_data[j]["thumb_url"] == '#') {
            j++;
        }
        if (j >= tube_data.length)
            return -1;
        var k = 0;
        for (var i_loop = 0; i_loop < tube_data.length; i_loop++) {
            if (tube_data[i_loop]['thumb_url'] != '#')
                k++;
        }
        master_width = (parseInt(tube_data[j]["thumb_width"]) + 10) * (k);
        thumb_width = 300; //parseInt(tube_data[j]["thumb_width"]);
        thumb_height = 180; //parseInt(tube_data[j]["thumb_height"]);
        thumb_title = tube_data[j]["thumb_title"];
        var temp = '#' + this.divid;

        //master for slider div
        var temp2 = temp + ' > div';
        $(temp2).remove();
        $(temp).css('position', 'absolute');
        $(temp).append("<div id='" + this.divid + "master" +
        "' class='master' style='top:24px;width:" + (parseInt($(temp).css('width')) - 1).toString() +
        "px;height:" + (parseInt($(temp).css('height')) - 50).toString() +
        "px;position:relative;overflow:hidden;'></div><p>");

        $(temp).append("<div id='" + this.divid + "_player'" +
        //" class='playerwin' style='top:1px;left:" + ((parseInt($(temp).css('width')) / 2) / 2).toString() +
        " class='playerwin' style='top:1px;left:1px;" +
        //"px;width:" + (parseInt($(temp).css('width')) / 2).toString() +
        "px;width:" + (parseInt($(temp).css('width')) -4).toString() +
        "px;height:" + (parseInt($(temp).css('height')) - 10).toString() +
        "px;position:absolute;overflow:hidden;z-index:1;display:none;'><div id='" + this.divid +
        "_close' style='height:3%;text-align:right;width:100%;'>" +
        "<a href='javascript:window.close();' style='height:100%;text-align:right;font-size:11px;'><center>Click aqu&iacute; para cerrar</center></a></div><br/>" +
        "<div id='" + this.divid + "_ytapiplayer' style='position:relative;float:left;'></div></div>");
        var close_win = '#' + this.divid + '_close';
        var temp_id2 = this.divid;
        $(close_win).click(function(event) {
            event.preventDefault();
            if (temp_id2.charAt(0) != '#')
                temp_id2 = '#' + temp_id2 + '_player';
            $(temp_id2).hide();

        });
        var master_id1 = '#' + this.divid + '_player';
        var player_width1 = parseInt($(master_id1).css('width'));
        var player_height1 = parseInt($(master_id1).css('height')) - 17;


        //div to show the text
        temp2 += ":first";



        this.master = temp + "master";

        this.slider = this.divid + '_slider';
        $(this.master).addClass('master');
        $(this.master).append("<div id='" + this.slider + "' class='slider' style='left:0px;width:" + master_width + "px;height:100%;position:relative;'></div>");
        //$(this.master).append("<div id='" + this.slider + "' class='slider' style='left:0px;width:300px;height:100%;position:relative;'></div>");

        this.slider = '#' + this.slider;
        for (var i = 0; i < tube_data.length; i++) {
            if (tube_data[i]["thumb_url"] != '#') {
                var div_tag = "<div id='" + this.divid + i.toString() +
            "' style='overlow:hidden;float:left;width:" +
            parseInt(thumb_width) + "px;height:" + parseInt(thumb_height) +
            "px;left:0px;top=0px;'>"; // "px;position:relative;margin-left:10px;'>";
                var a_tag = "<a href='" + tube_data[i]["thumb_url"] +
            "' target='_blank' style='text-decoration:none;'>";
                var img_tag = "<img src='" + tube_data[i]['thumb_img'] + "' style='width:" + thumb_width +
            "px;height:" + thumb_height + "px' />";
                var ending_tags = "</a><br/><center><font size='9px' color='black'>" + tube_data[i]['thumb_title'] + 
                                  "(vid " + tube_data[i]['vid'] + ")"  + "</font></center></div>";
                $(this.slider).append(div_tag + a_tag + img_tag + ending_tags);
            }

        }
        var local_slider = this.slider;
        var local_master = this.master;
        var temp_del = this.slider + " > div"

        this.timer_obj = new SlideTimer(this.slider, this.master, this.timer_interval, this);
        var timer_obj_ref = this.timer_obj;
        $(temp_del).hover(function() {
            timer_obj_ref.stop();
            var id_text = $(this).attr('id');
            if (id_text != undefined || id_text == '') {
                var i = id_text.length - 1;

                var chr_txt = id_text.charAt(i);
                while (!isNaN(parseInt(chr_txt))) {
                    i--;
                    var chr_txt = id_text.charAt(i);
                }
                id_text = id_text.substr(0, (i + 1));
                var txt_div = '#' + id_text + '_text';

                $(txt_div).css('display', 'block');
                $(txt_div).html("<b>" + $(this).text() + "</b>");



            }

        },
        function() {
            timer_obj_ref.start();
            var id_text = $(this).attr('id');
            if (id_text != undefined || id_text == '') {
                var i = id_text.length - 1;

                var chr_txt = id_text.charAt(i);
                while (!isNaN(parseInt(chr_txt))) {
                    i--;
                    var chr_txt = id_text.charAt(i);
                }
                id_text = id_text.substr(0, (i + 1));
                var txt_div = '#' + id_text + '_text';
                $(txt_div).css('display', 'none');
            }

        });
        var master_id = this.divid;
        $(temp_del).click(function(event) {
            timer_obj_ref.stop();
            event.preventDefault();
            var vid_text = $(this).text();

            if (vid_text != undefined || vid_text == '') {
                var i = vid_text.length - 1;
                var vid_mark1 = vid_text.indexOf('(vid');
                var vid_mark2 = -1;
                if (vid_mark1 != -1) {
                    vid_mark1 += 4;
                    vid_text = vid_text.substr(vid_mark1, ((vid_text.length - 1) - vid_mark1));



                }

                var playerid = '#' + master_id + '_player';
                vid_text = vid_text.replace(/^\s+|\s+$/g, "");

                var player_width = parseInt($(playerid).css('width'));
                var player_height = parseInt($(playerid).css('height'));

                var str_player = '<object style="position:relative;display:block;top:1px;left:1px;height:' +
                (player_height - 17).toString() + 'px; width:' + (player_width - 2).toString() + 'px">' +
                '<param name="movie" value="http://www.youtube.com/v/' + vid_text +
                '?version=3&iv_load_police=3&autoplay=1&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded">' +
                '<param name="allowFullScreen" value="true">' +
                '<param name="allowScriptAccess" value="always">' +
                '<embed src="http://www.youtube.com/v/' + vid_text +
                '?version=3&iv_load_police=3&autoplay=1&color1=0xb1b1b1&color2=0xcfcfcf&feature=player_embedded" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="' +
                 (player_width - 2).toString() + '" height="' + (player_height - 17).toString() + '"></object>'

                $(playerid).css('display', 'block');

                var player_div = '#' + master_id + '_ytapiplayer';
                $(player_div).html(str_player);

            }
        });
    }

    this.start = function() {
        if (this.timer_obj != null && this.timer_obj != undefined)
            this.timer_obj.start();
    }
    this.stop = function() {
        if (this.timer_obj != null && this.timer_obj != undefined)
            this.timer_obj.stop();
        delete (this.timer_obj);
        this.timer_obj = null;
    }

}