//phototagging
var tagtopLeft;
var targetX, targetY;
var tagCounter = 0;

function submitTag() {
    tagValue = $("#tag-name").val();

    //Adds a new list item below image. Also adds events inline since they are dynamically created after page load
    $("#tag-wrapper").after('<p id="hotspot-item-' + tagCounter + '">' + tagValue + ' <span class="remove" onclick="removeTag(' + tagCounter + ')" onmouseover="showTag(' + tagCounter + ')" onmouseout="hideTag(' + tagCounter + ')">(Remove)</span></p>');

    //Adds a new hotspot to image
    $("#tag-wrapper").append('<div id="hotspot-' + tagCounter + '" class="hotspot" style="left:' + targetX + 'px; top:' + targetY + 'px;"><span>' + tagValue + '</span></div>');

    tagCounter++;
    closeTagInput();
}

function closeTagInput() {
    $("#tag-target").fadeOut();
    $("#tag-input").fadeOut();
    $("#tag-name").val("");
}

function removeTag(i) {
    $("#hotspot-item-" + i).fadeOut();
    $("#hotspot-" + i).fadeOut();
}

function showTag(i) {
    $("#hotspot-" + i).addClass("hotspothover");
}

function hideTag(i) {
    $("#hotspot-" + i).removeClass("hotspothover");
}
//end photo tagging

function verdammt() {
    overlayWidth = 596;
    overlayXMargin = Math.floor(overlayWidth / 2);
    overlayYMargin = Math.floor($('DIV#bidExtraOverlay').height() / 2);

    $('DIV#bidExtraOverlay').css({ marginLeft: '-' + overlayXMargin + 'px', width: overlayWidth + 'px' });
    if (!(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away IE6
        $('DIV#bidExtraOverlay').css({ marginTop: '-' + overlayYMargin + 'px' });
    }

    $('DIV#shroud').show();
    $('DIV#bidExtraOverlay').show();
}

// overlay - pinned to center of browser window, will not scroll with page
function miniOverlay(triggerLink, shroud, overlay, releaseLink, clickTrigger) {
    this.shroud = shroud;
    this.overlay = overlay;
    this.triggerLink = triggerLink;
    // this.overlayWidth = 596;
    this.overlayWidth = this.overlay.width();
    this.overlayXMargin = Math.floor(this.overlayWidth / 2);
    this.overlayYMargin = Math.floor(this.overlay.height() / 2);
    this.hideSelect = false;
    this.releaseLink = releaseLink;
    this.clickTrigger = clickTrigger;

    this.initialise();
}
miniOverlay.prototype.template = function() { };
miniOverlay.prototype.initialise = function() {
    var self = this;

    if (this.clickTrigger) {
        self.triggerLink.click(function(e) {
            // self.ieHideSelect();
            self.overlay.css({ marginLeft: '-' + self.overlayXMargin + 'px', width: self.overlayWidth + 'px' });
            if (!(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away IE6
                self.overlay.css({ marginTop: '-' + self.overlayYMargin + 'px' });
            }

            /* read content from metadata block if it exists */
            if ($(this).parent('DIV.prizeDetails').find('DIV.metadata').length != 0) {
                var overlayTitle = $(this).parent('DIV.prizeDetails').find('DIV.metadata H2').text();
                var overlayText = $(this).parent('DIV.prizeDetails').find('DIV.metadata P.text').text();
                var overlayImageSrc = $(this).parent('DIV.prizeDetails').find('DIV.metadata P.imgSrc').text();
                var overlayImageAlt = $(this).parent('DIV.prizeDetails').find('DIV.metadata  P.imgAlt').text();

                self.overlay.find('h2:eq(0)').empty().text(overlayTitle);
                self.overlay.find('DIV.body1 P:eq(0)').empty().text(overlayText);
                self.overlay.find('DIV.body1 IMG').attr({ 'src': overlayImageSrc, 'alt': overlayImageAlt });

                Cufon.replace('DIV#prizeOverlay H2.molotov', { fontFamily: 'molotov', textShadow: '1px 1px rgba(0, 0, 0, 0.2)' });
            }

            self.showOverlay();
            if (!self.releaseLink)
                e.preventDefault();
        });
    }

    // close overlay
    this.shroud.click(function(e) {
        e.preventDefault();
        self.hideOverlay();
    });
    this.overlay.find('A.closer').click(function(e) {
        e.preventDefault();
        self.hideOverlay();
    });

    // close overlay and open link
    this.overlay.find('A.linker').click(function(e) {
        self.hideOverlay();
    });

};
miniOverlay.prototype.ieHideSelect = function() {
    if (typeof document.body.style.maxHeight === "undefined") {//if IE 6
        $("body", "html").css({ height: "100%", width: "100%" });
        $("html").css("overflow", "hidden");
        if (document.getElementById("TB_HideSelect") === null) {//iframe to hide select elements in ie6
            this.hideSelect = true;
            $("body").append("<iframe id='TB_HideSelect'></iframe><div id='TB_overlay'></div><div id='TB_window'></div>");
        }
    }
};

miniOverlay.prototype.showOverlay = function() {
    this.shroud.show();
    this.overlay.show();
};
miniOverlay.prototype.hideOverlay = function() {
    this.shroud.hide();
    this.overlay.hide();
    if (self.hideSelect)
        $('#TB_HideSelect').hide();
};

miniOverlay.prototype.loadOpen = function() {
    this.overlay.css({ marginLeft: '-' + this.overlayXMargin + 'px', width: this.overlayWidth + 'px' });
    if (!(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away IE6
        this.overlay.css({ marginTop: '-' + this.overlayYMargin + 'px' });
    }

    this.showOverlay();
}

function kraveDateScroller(container) {
    this.container = container;
    this.itemWidth = 196;
    this.itemCount = $(this.container + ' UL LI').length;
    this.windowWidth = 4;
    this.stepCount = this.itemCount - this.windowWidth;
    this.pointer = 0;
    this.offset = 0;
    this.minOffset = 0;
    this.maxOffset = -(this.stepCount * this.itemWidth);
    this.animating = false;

    $(this.container + ' UL').css({ width: (this.itemCount * this.itemWidth) + 'px' });
}

kraveDateScroller.prototype.doScroll = function(delta, updateSlider) {
    var _self = this;
    _self.pointer += delta;
    var slidePX = -delta * _self.itemWidth;
    _self.offset += slidePX;

    if (updateSlider)
        $('#slider').slider('value', _self.pointer);

    if (!_self.animating) {
        _self.animating = true;
        // $(this.container + ' UL').css({'left':_self.offset + 'px'});
        // _self.animating = false;
        $(this.container + ' UL').animate({ 'left': _self.offset + 'px' }, function() { _self.animating = false; });
    }
};

var bidExtraOverlay;

/* install all page behaviours when page loads */
jQuery(document).ready(function() {
    /*
    // apply IE6 transparent PNG fix
    $('DIV.header,DIV.display').pngFix();
    */

    /*
    // prevent user entering invalid characters in text field
    // filter allows A-Z,a-z, space and - characters
    var textFilter = /([a-zA-Z\s\-]+)/g;
    $('INPUT.alphabeticLock').blur(function(){
    var fieldValue = $(this).val();
    var scratchpad = '';
    do
    {
    result =  textFilter.exec(fieldValue);
    if(result != null){
    scratchpad += result[0];
    }
    }
    while (result != null)
    $(this).val(scratchpad);
    });
    */

    // content tabs

    $("table tr:odd").addClass("odd");

    if ($("body").hasClass('tabbedContentContainer')) {

        $("#tabbedcontent").tabs();

    }

    //photo tagging
    //Dynamically wrap image
    $("img.phototag").wrap('<div id="tag-wrapper"></div>');

    //Dynamically size wrapper div based on image dimensions
    //$("#tag-wrapper").css({width: $("img.phototag").outerWidth(), height: $("img.phototag").outerHeight()});

    //Append #tag-target content and #tag-input content
    $("#tag-wrapper").append('<div id="tag-target"></div>');
    //<div id="tag-input"><label for="tag-name">Your Name:</label><input type="text" id="tag-name"><button type="submit">Submit</button><button type="reset">Cancel</button></div>

    //$("#tag-wrapper").click(function(e){
    $("img.phototag").click(function(e) {
        //Determine area within element that mouse was clicked
        mouseX = e.pageX - $("#tag-wrapper").offset().left;
        mouseY = e.pageY - $("#tag-wrapper").offset().top;
        tagtopLeft = [mouseX - 50, mouseY - 50];
        //console.log(tagtopLeft);

        //Get height and width of #tag-target
        targetWidth = $("#tag-target").outerWidth();
        targetHeight = $("#tag-target").outerHeight();

        //Determine position for #tag-target
        targetX = mouseX - targetWidth / 2;
        targetY = mouseY - targetHeight / 2;

        //Determine position for #tag-input
        inputX = mouseX + targetWidth / 2;
        inputY = mouseY - targetHeight / 2;

        //Animate if second click, else position and fade in for first click
        if ($("#tag-target").css("display") == "block") {
            $("#tag-target").animate({ left: targetX, top: targetY }, 500);
            $("#tag-input").animate({ left: inputX, top: inputY }, 500);
        } else {
            $("#tag-target").css({ left: targetX, top: targetY }).fadeIn();
            $("#tag-input").css({ left: inputX, top: inputY }).fadeIn();
        }

        //Give input focus
        $("#tag-name").focus();
    });

    //If cancel button is clicked
    $('button[type="reset"]').click(function() {
        closeTagInput();
    });

    //If enter button is clicked within #tag-input
    $("#tag-name").keyup(function(e) {
        if (e.keyCode == 13) submitTag();
    });

    //If submit button is clicked
    $('button[type="submit"]').click(function() {
        submitTag();
    });

    //end photo tagging

    //fake file input on upload photo overlay (earn page)
    $("INPUT.file").change(function() {
        var str;
        ($.browser.msie) ? str = $(this).val().substr($(this).val().lastIndexOf("\\") + 1) : str = $(this).val();
        $(this).prev("INPUT").val(str);
    });


    Cufon.now();
    Cufon.replace('.misterEarl', { fontFamily: 'misterearl', textShadow: '1px 1px rgba(0, 0, 0, 0.2)' });
    Cufon.replace('.molotov', { fontFamily: 'molotov', textShadow: '1px 1px rgba(0, 0, 0, 0.2)' });
    Cufon.replace('DIV.header UL.main LI SPAN A', { fontFamily: 'molotov', hover: true });
    Cufon.replace('DIV.subnav UL LI A SPAN', { fontFamily: 'molotov', hover: true });

    if ($('DIV.marquee MARQUEE').length != 0) {
        $('DIV.marquee MARQUEE').marquee()
		.mouseover(function() {
		    $(this).trigger('pause');
		})
		.mouseout(function() {
		    $(this).trigger('unpause');
		});
    }

    var prizeOverlay = new miniOverlay($('A.overlayLink'), $('DIV#shroud'), $('DIV#prizeOverlay'), false, true);

    var recruitOverlay = new miniOverlay($('A.recruitLink'), $('DIV#shroud'), $('DIV#recruitOverlay'), false, true);
    var photoOverlay = new miniOverlay($('A.photoLink'), $('DIV#shroud'), $('DIV#photoOverlay'), false, true);
    var taggingOverlay = new miniOverlay($('A.taggingLink'), $('DIV#shroud'), $('DIV#taggingOverlay'), false, true);
    var statusOverlay = new miniOverlay($('A.statusLink'), $('DIV#shroud'), $('DIV#statusOverlay'), false, true);
    var requestOverlay = new miniOverlay($('A.requestLink'), $('DIV#shroud'), $('DIV#requestOverlay'), false);

    if ($('BODY').hasClass('userOverlay')) {
        var bidExtraOverlay = new miniOverlay($('A.bidExtraLink'), $('DIV#shroud'), $('DIV#bidExtraOverlay'), true, false);
        if ($('BODY').hasClass('userOverlayOpen')) {
            bidExtraOverlay.loadOpen();
        }
    }

    //earn chunks overlays
    if ($('BODY').hasClass('photoOverlayOpen')) {
        photoOverlay.loadOpen();
    }

    if ($('BODY').hasClass('taggingOverlayOpen')) {
        taggingOverlay.loadOpen();
    }

    if ($('BODY').hasClass('statusOverlayOpen')) {
        statusOverlay.loadOpen();
    }


    if ($('INPUT#bid').length != 0) {
        $('DIV.bidBlock DIV.wrapper').addClass('default');

        $('INPUT#bid')
		.click(function(e) {
		    $(this).parent('DIV.wrapper').removeClass('default');
		})
		.blur(function() {
		    if ($(this).val() == '')
		        $(this).parent('DIV.wrapper').addClass('default');
		});
    }

    if ($('DIV.givechunks,DIV.registerPage,DIV#bidExtraOverlay,DIV.plain').length != 0) {
        $('DIV.wrapper').each(function(i) {
            if ($(this).find('INPUT:eq(0)').val() == '') {
                $(this).addClass('default');
            }
            if ($(this).find('TEXTAREA:eq(0)').length != 0) {
                if ($(this).find('TEXTAREA:eq(0)').val() == '') {
                    $(this).addClass('default');
                }
            }

        });

        $('DIV.wrapper INPUT,DIV.wrapper P.hint,DIV.wrapper TEXTAREA')
		.click(function(e) {
		    $(this).parent('DIV.wrapper').removeClass('default');
		    if (this.tagName == "P") {
		        if ($(this).siblings("INPUT")) {
		            $(this).siblings("INPUT").focus();
		        }
		        if ($(this).siblings("TEXTAREA")) {
		            $(this).siblings("TEXTAREA").focus();
		        }
		    }
		})
		.focus(function(e) {
		    $(this).parent('DIV.wrapper').removeClass('default');
		})
		.blur(function() {
		    if ($(this).val() == '')
		        $(this).parent('DIV.wrapper').addClass('default');
		});
        /* 
        $('DIV.wrapper INPUT')
        .keyup(function(){
        $(this).parent('DIV.wrapper').find('P').text( $(this).val() );
        Cufon.refresh('.misterEarl');
        })
        */
    }

    // hide all error overlays
    // $('DIV.errorOverlay').hide();

    if ($('DIV.kraveDateScroller').length != 0) {
        var thisScroller = new kraveDateScroller('DIV.kraveDateScroller');

        $('#slider').slider({
            value: 0,
            min: 0,
            max: thisScroller.stepCount,
            step: 1,
            // slide: function(event, ui){ console.log("slide:: ui.value:[%s]",ui.value); },
            // stop: function(event, ui){ console.log("stop:: ui.value:[%s]",ui.value); },
            change: function(event, ui) {
                if (typeof event.originalEvent == 'object' && thisScroller.pointer != ui.value) {
                    var difference = ui.value - thisScroller.pointer; // positive value = scroll to right 'previous' action
                    thisScroller.doScroll(difference, false);
                } else {
                }
            }
        });
    }

    // batch embed flash videos
    if ($('DIV.youtubeEmbed').length != 0) {
        var parameters = { "allowFullScreen": "true", "allowscriptaccess": "always", "wmode": "transparent" };
        var variables = {};
        $('DIV.youtubeEmbed').each(function() {
            var flashID = $(this).attr('id');
            var flashURL = $(this).find('SPAN:eq(0)').text();
            swfobject.embedSWF(flashURL, flashID, 640, 385, '9.0.28', false, variables, parameters);
        });
    }

    if ($('DIV.registerPage').length != 0) {
        // $('DIV.registerPage DIV.module').hide();

        $('A.loginTrigger').click(function(e) {
            $('DIV.login').show();
            $('DIV.register').hide();
            e.preventDefault();
        });

        $('A.registerTrigger').click(function(e) {
            $('DIV.login').hide();
            $('DIV.register').show();
            e.preventDefault();
        });

    }

    if ($(".page").hasClass("earnKrave")) {
        $(".pageOverlay").draggable({
            cursor: 'move'
        });
    }

    $(".imgPreview").hover(function() {
        $(this).children().show();
    }, function() {
        $(this).children().hide();
    });


});