/// <reference path="jquery-ui-1.7.2.custom.min.js" />

$(document).ready(function() {
    initScript();
    initInputs();
    initGalleryScroll();
    //initTabs();
    initVideoSelector();
    hideFormText();
    initEvents();
    initRating();
    initGalleryAutoScroll();
});

function initGalleryAutoScroll() {
    var loopInterval = 5000;
    var theLoop = startLoop();
    var loopWasCancelled = false;

    $("div.promo-carusel").mouseover(function() {
        //console.log("mouseOver");
        clearInterval(theLoop);
    });

    $("div.promo-carusel").mouseout(function() {
        //console.log("mouseOut");
        if (!loopWasCancelled)
            theLoop = startLoop();
    });

    $(".carusel .next, .carusel .prev").mousedown(function() {
        //console.log("mouseDown()");
        clearInterval(theLoop);
        loopWasCancelled = true;
    });

    function startLoop() {
        //console.log("startLoop()");
        return setInterval(
            function() {
                //console.log("LOOP");
                $("a.next").click();
            }, loopInterval);
        }
}

function initEvents() {
    $("#show-terms").click(function() {
        $("#terms").toggle(300);
        return false;
    });
    $(".komment").click(function() {
        $(".video-comment").toggle();
        $(".share").hide();
        return false;
    });
    $(".del").click(function() {
        $(".share").toggle();
        $(".video-comment").hide();
        return false;
    });
    $(".embed-code").click(function() {
        $(this).select();
        return false;
    });
    $("form").submit(function() {
        $(".embed-code").val("");
    });
}

function initRating() {
    var videoId;
    var userId;
    var userToken;
    var doVoteLink = $(".favorit");
    var ratingField = $(".favorit span span");

    doVoteLink.click(function() {
        doRate($(this).attr("href"));
        return false;
    });

    function doRate(_url) {
        $.ajax({
            url: WCF_HOST + _url,
            cache: false,
            contentType: 'application/json',
            dataType: 'jsonp',
            success: function(data) {
                if (data.Success == true) {
                    //alert("SUCCESS");
                    ratingField.fadeOut("normal", function() {
                        ratingField.text(data.Rating);
                        ratingField.fadeIn("normal");
                    });
                }
                else {
                    //alert("ERROR " + data.Status)
                    if (data.Status == "1") {
                        jQuery.Login.ShowLoginDialog();
                    }
                }
            }
        });
        return false;
    }
}

function initVideoSelector() {
    var _tab = $('ul.ajax-tabset a');
    var _hold = $('div.ajax-tabs');
    var btn_prev = $('div.ajax-tabs-navigation a.left');
    var btn_next = $('div.ajax-tabs-navigation a.right');
    var _info = $('div.ajax-tabs-navigation span');

    var _loader = $('<div class="loader">Loading...</div>').css('opacity', 0);
    _hold.append(_loader);
    
    var _currentTab = 0;
    var _currentPage = 0;
    var _channel = $(".ajax-tabs-hold").attr("id") != "" ? $(".ajax-tabs-hold").attr("id") : 0;
    
    function doRequest(tab, page) {
        //console.log("doRequest(" + tab + ", " + page + ")");
        _currentTab = tab;
        _currentPage = page;
        var _url = WCF_HOST + "/services/video.svc/GetVids/" + _channel + "/" + tab + "/" + page;

        // animate out
        var endHeight = _hold.parent().height();
        //console.log(_hold);
        _hold.animate({
            opacity: 0
        }, 1000, function() {
            _hold.parent().height(endHeight);
            _hold.empty();
            _hold.parent().height(endHeight);
            _loader.animate({ opacity: 1 }, 150);
            doAjax(_url);
        });
        
    }

    btn_next.click(function() {
        if (!btn_next.hasClass("disabled"))
            doRequest(_currentTab, _currentPage + 1);
            return false;
    });
    btn_prev.click(function() {
        if (!btn_prev.hasClass("disabled"))
            doRequest(_currentTab, _currentPage - 1);
            return false;
    });
    _tab.click(function() {
        doRequest(_tab.index(this), 1);
        _tab.removeClass("active");
        $(this).addClass("active");
        return false;
    });

    doRequest(0, 1);

    function doAjax(_url) {
        $.ajax({
            url: _url,
            cache: false,
            contentType: 'application/json',
            dataType: 'jsonp',
            success: function(data) {
                if (data.Videos.length > 0) {
                    $.each(data.Videos, function(index) {
                        //console.log(this);
                        var outerDiv = $("<div class='box-video'></div>");
                        var innerDiv = $("<div class='box-video-top'></div>");
                        var maxLength = 20;
                        var shortenedTitle =
                            this.Title.length < maxLength ? this.Title : this.Title.substring(0, maxLength) + "...";
                        var title = $("<h4><a href='" + this.VideoLink + "' title='" + this.Title + "'>" + shortenedTitle + "</a></h4>");
                        var imageLink = $("<a href='" + this.VideoLink + "' title='" + this.Title + "'></a>");
                        var image = $("<img></img>");
                        image.attr("src", this.Image);
                        image.attr("alt", this.Title);
                        var infoDiv = $("<div class='info'></div>");
                        //infoDiv.append("<span>" + this.User + "</span>");
                        infoDiv.append("<span class='it it3'>" + this.ViewCount + "</span>");
                        infoDiv.append("<span class='it'>" + this.Comments + "</span>");
                        infoDiv.append("<span class='it it2'>" + this.Upvotes + "</span>");

                        var channel = $("<h5><a href='" + this.ChannelLink + "' title='" + this.ChannelName + "'>" + this.ChannelName + "</a></h5>");
                        outerDiv.append(innerDiv);
                        innerDiv.append(title);
                        innerDiv.append(imageLink);
                        imageLink.append(image);
                        innerDiv.append(infoDiv);
                        if ($(".ajax-tabs-hold").hasClass("frontpage"))
                            innerDiv.append(channel);
                        _hold.append(outerDiv);
                    });

                    if (_currentPage == 1) {
                        btn_prev.addClass('disabled');
                    } else {
                        btn_prev.removeClass('disabled');
                    }
                    if (_currentPage == data.Pages) {
                        btn_next.addClass('disabled');
                    }
                    else {
                        btn_next.removeClass('disabled');
                    }
                    _info.text(_currentPage + ' af ' + data.Pages);

                    // animate in
                    _loader.stop().animate({ opacity: 0 }, 150);
                    _hold.parent().height("auto");
                    _hold.animate({
                        //height: "auto",
                        opacity: 1
                    }, 1000);

                }
                else {
                    //alert("No videos");
                    //var noVids = $("<div>Der er ingen videoer i denne kanal</div>");
                    //_hold.append(noVids);
                    _info.text('0 af 0');
                    btn_next.addClass('disabled');
                    btn_prev.addClass('disabled');
                }

            }
        });
    }
}

/*--- initTabs ---*/
function initTabs(){
    $('div.ajax-tabs-hold').each(function() {
        var _btn = $(this).find('ul.ajax-tabset a');
        var _hold = $(this).find('div.ajax-tabs');
        var btn_prev = $(this).find('div.ajax-tabs-navigation a.left');
        var btn_next = $(this).find('div.ajax-tabs-navigation a.right');
        var _info = $(this).find('div.ajax-tabs-navigation span');

        var _pageNo = 1;
        var _loader = $('<div class="loader">Loading...</div>').css('opacity', 0);
        _hold.append(_loader);
        var _f = false;
        var _a = _btn.index(_btn.filter('.active:eq(0)'));
        if (_a == -1) _a = 0;

        _btn.removeClass('active').eq(_a).addClass('active');
        if (_a == 0) btn_prev.addClass('disabled');
        else btn_prev.removeClass('disabled');
        if (_a == _btn.length - 1) btn_next.addClass('disabled');
        else btn_next.removeClass('disabled');
        _info.text((_a + 1) + ' af ' + _btn.length);

        $.ajax({
            url: _btn.eq(_a).attr('href'),
            cache: false,
            dataType: 'html',
            success: function(_html) {
                _btn.get(_a)._box = $(_html);
                _hold.append(_btn.get(_a)._box);
                _f = true;
            }
        });

        btn_prev.click(function() {
            //if (!btn_prev.hasClass('disabled')) changeTab(_a - 1);
            if (!btn_prev.hasClass('disabled')) changeTab(_a, _pageNo - 1);
            return false;
        });
        btn_next.click(function() {
            //if (!btn_next.hasClass('disabled')) changeTab(_a + 1);
            if (!btn_prev.hasClass('disabled')) changeTab(_a, _pageNo + 1);
            return false;
        });
        _btn.click(function() {
            changeTab(_btn.index(this));
            return false;
        });

        function changePage(_tab, _pageNo) {

        }

        function changeTab(_ind, _pageNo) {
            if (_pageNo == null) _pageNo = 1;
            if (_ind != _a && _f) {
                _f = false;
                _hold.height(_hold.height());
                if (_ind == 0) btn_prev.addClass('disabled');
                else btn_prev.removeClass('disabled');
                if (_ind == _btn.length - 1) btn_next.addClass('disabled');
                else btn_next.removeClass('disabled');
                _info.text((_ind + 1) + ' af ' + _btn.length);
                _btn.eq(_a).removeClass('active');
                _btn.eq(_ind).addClass('active');
                if (_btn.get(_ind)._box) {
                    _btn.get(_a)._box.css({ position: 'absolute', zIndex: 2 }).animate({ opacity: 0 }, 500, function() {
                        $(this).css({ display: 'none', position: 'relative', zIndex: 3 });
                    });
                    _btn.get(_ind)._box.show().animate({ opacity: 1 }, 500, function() {
                        _hold.animate({ height: _btn.get(_ind)._box.height() }, 300, function() {
                            $(this).height('auto');
                            _a = _ind;
                            _f = true;
                        });
                    });
                }
                else {
                    _loader.animate({ opacity: 1 }, 150);
                    _btn.get(_a)._box.css({ position: 'absolute', zIndex: 2 }).animate({ opacity: 0 }, 500, function() {
                        $(this).css({ display: 'none', position: 'relative', zIndex: 3 });
                    });
                    $.ajax({
                        url: _btn.eq(_ind).attr('href'),
                        cache: false,
                        dataType: 'html',
                        success: function(_html) {
                            _btn.get(_ind)._box = $(_html).css({ position: 'relative', opacity: 0 });
                            _hold.append(_btn.get(_ind)._box);
                            _loader.stop().animate({ opacity: 0 }, 150);
                            _btn.get(_ind)._box.animate({ opacity: 1 }, 500, function() {
                                _hold.animate({ height: _btn.get(_ind)._box.height() }, 300, function() {
                                    $(this).height('auto');
                                    _a = _ind;
                                    _f = true;
                                });
                            });
                        }
                    });
                }
            }
        }
    });
}
//init Gallery
function initGalleryScroll(){
	if ($(".carusel").length) {
		$('.carusel').galleryScroll({
			btPrev: 'a.prev',
			btNext: 'a.next',
			holderList: 'div.caruselItems',
			scrollElParent: 'ul',
			scrollEl: '> li',
			duration : 1000,
			autoSlide: false,
			circleSlide: true
		});
	}
}
// change Bg on focus and blur for inputs
function initInputs(){
	if ($("div.inp-bg").length){
		_holders = $("div.inp-bg");
		_holders.each(function(){
			var _this = $(this);
			$(this).find("input").each(function(){
				if (!$(this).val() == '') {
					_this.addClass("inp-focus");
				}
				$(this).focus(function(){
					_this.addClass("inp-focus");
				}).blur(function(){
					if ($(this).val() == '') {
						if ($.browser.msie && $.browser.version < 7) _this.removeClass("hover");
						_this.removeClass("inp-focus");
					}
				});
			});
		});
		if ($.browser.msie && $.browser.version < 7) {
			_holders.hover(function(){
				$(this).addClass("hover");
			},function(){
				$(this).removeClass("hover");
			})
		}
	}
}


//add Class on Click
function initScript() {
	setClass({
		tagName:'a',
		tagClass:'a-class',
		classAdd:'div-parent-add-class',
		addToParent:true
	})
}
function setClass (_options) {
	var _tagName = _options.tagName;
	var _tagClass = _options.tagClass;
	var _classAdd = _options.classAdd;
	var _addToParent = false || _options.addToParent;
	var _el = document.getElementsByTagName(_tagName);
	if (_el) {
		for (var i=0; i < _el.length; i++) {
			if (_el[i].className.indexOf(_tagClass) != -1) {
				_el[i].onclick = function() {
					if (_addToParent) {
						if (this.parentNode.className.indexOf(_classAdd) == -1) {
							this.parentNode.className += ' '+_classAdd;
						} else {
							this.parentNode.className = this.parentNode.className.replace(_classAdd,'');
						}
					} else {
						if (this.className.indexOf(_classAdd) == -1) {
							this.className += ' '+_classAdd;
						} else {
							this.className = this.className.replace(_classAdd,'');
						}
					}
					return false;
				}
			}
		}
	}
}

function hideFormText() {
	var _inputs = document.getElementsByTagName('input');
	var _txt = document.getElementsByTagName('textarea');
	var _value = [];

	if (_inputs) {
		for(var i=0; i<_inputs.length; i++) {
			if ((_inputs[i].type == 'text' || _inputs[i].type == 'password') && _inputs[i].className != 'embed-code') {

				_inputs[i].index = i;
				_value[i] = _inputs[i].value;

				_inputs[i].onfocus = function(){
					if (this.value == _value[this.index])
						this.value = '';
				}
				_inputs[i].onblur = function(){
					if (this.value == '')
						this.value = _value[this.index];
				}
			}
		}
	}
	if (_txt) {
		for(var i=0; i<_txt.length; i++) {
			_txt[i].index = i;
			_value['txt'+i] = _txt[i].value;

			_txt[i].onfocus = function(){
				if (this.value == _value['txt'+this.index])
					this.value = '';
			}
			_txt[i].onblur = function(){
				if (this.value == '')
					this.value = _value['txt'+this.index];
			}
		}
	}
}

function clearEmbedField() {
    $(".embed-code").val("");
    return true;
}

jQuery(
    function($) {

        // ***************************************************************
        // Login class
        // ***************************************************************

        function Login() { }

        Login.ShowLoginDialog = function() {
            var dlg = $("#login-dialog").dialog({
                autoOpen: true,
                draggable: false,
                modal: true,
                height: 232,
                width: 512
            });

            dlg.parent().appendTo($("form#aspnetForm"));
            $("#login-dialog input")[0].focus();
        }

        Login.HideLoginDialog = function(theElement) {
            $("#login-dialog").dialog('close');
        }

        Login.PrepareTransferForm = function(elem, actionUrl, query) {
            if ($(elem).val() == "") {
                var url = new String(document.location);

                if (url.indexOf("/login") != -1)
                    url = "/";

                if (query != "") {
                    if (url.indexOf("?") == -1)
                        url += query; // query contains "?"
                    else
                        url += ("&" + query.substring(1));
                }

                $(elem).val(url);
            }

            $("form#aspnetForm").attr("action", actionUrl);
        }

        Login.PrepareLoginForm = function(sender) {
            $("#useraction").val("login-" + sender);
        }

        jQuery.Login = Login;

        // ATTACH EVENTS
        // ***************************************************************

        $("#login-dialog .login a.btn-close").click(
            function() {
                Login.HideLoginDialog();
                return false;
            }
        );

        $("span.chkPostToFB input[type=checkbox]").click(
            function() {
                var chkBox = $(this);
                if (chkBox.is(':checked')) {
                    FB.login(function(response) {
                        if (!response.session || !response.perms) {
                            alert("For at vi kan slå filmen op på din Facebook-profil, skal du trykke 'Tillad' i popup-vinduet.");
                            chkBox.removeAttr("checked");
                        }
                    }, { perms: 'publish_stream, offline_access' });
                }
            }
        );

    });