/*jslint vars: true, plusplus: true, devel: true, browser: true, nomen: true, maxerr: 50 */
/*global $, document, jQuery, dismissOnboarding, setWorkspace, updateAppTheme, logDWMessage, OnBoardingManager */

var CONSTANTS = {
    OLD_USER : "oldUser",
    NEW_USER : "newUser",
    WS_CODE : "code",
    WS_DESIGN : "design",
    THEME_LIGHTEST : "lightest",
    THEME_LIGHT : "light",
    THEME_DARK : "dark",
    THEME_DARKEST : "darkest",
    ENTERKEYCODE: 13
};

var HEADLIGHTS = {
    UT_ONBOARDING : "Onboarding_17.0",
    UT_ONBOARDING_DISPLAYED : "Onboarding_Dsiplayed",
    UT_CAROUSAL_QE : "ExistingUser_FeatureCarousal_QuickEditSeen",
    UT_CAROUSAL_RTP : "ExistingUser_FeatureCarousal_RTPSeen",
    UT_CAROUSAL_GIT: "ExistingUser_FeatureCarousal_GitSupportSeen",
    UT_CAROUSAL_CSSPRE : "ExistingUser_FeatureCarousal_CSSPreSeen",
    UT_CAROUSAL_GS : "ExistingUser_FeatureCarousal_GetStartedSeen",
    UT_REPEAT_FEATURE : "ExistingUser_SeeFeaturesAgain_Clicked",
    UT_GET_STARTED : "ExistingUser_GetStarted_Clicked"
};

function initStrings() {
    "use strict";
    $.i18n.properties({
        name: 'OnBoarding',
        language: ' ',
        path: 'strings/',
        mode: 'both',
        callback: function () {
            var locItems = $(".ToTranslate");
            var j = 0;
            for (j = 0; j < locItems.length; j++) {
                var nKey = locItems[j].getAttribute("data-id");
                locItems[j].innerHTML = jQuery.i18n.prop(nKey);
            }
        }
    });
}

function initUI(userName, arg2) {
    "use strict";
    
    initStrings();
    
    var index = 0;
    //If we have been supplied a user name, put it in the document
    if (userName) {
        var matches = $(".userName");
        for (index = 0; index < matches.length; ++index) {
            matches[index].innerHTML += ", " + userName;
        }
    }
    
    logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_ONBOARDING_DISPLAYED);
    OnBoardingManager.setFocusToPage();
}

function escapeKeyPressed() {
    "use strict";
    OnBoardingManager.handleEscapeKey();
}

function dismissWindow(infoObject) {
    "use strict";
    var bNewUser = (infoObject.userType === CONSTANTS.NEW_USER);
    var bFolderSelected = false;
	var bWatchTutorial = false;
    if (bNewUser) {
        bFolderSelected = infoObject.folderSelected;
		bWatchTutorial = infoObject.watchTutorial;
    }
    dismissOnboarding(bNewUser, bFolderSelected, bWatchTutorial);
}

function onColorStopHoverIn(hoveredImgClass, selectedImgClass) {
    "use strict";
    if (hoveredImgClass !== selectedImgClass) {
        $(".app-dialog").removeClass(selectedImgClass);
        $(".app-dialog").addClass(hoveredImgClass);
    }
}

function onColorStopHoverOut(hoveredImgClass, selectedImgClass) {
    "use strict";
    if (hoveredImgClass !== selectedImgClass) {
        $(".app-dialog").removeClass(hoveredImgClass);
        $(".app-dialog").addClass(selectedImgClass);
    }
}

function onColorStopClick(newTheme, currentTheme) {
    "use strict";
    if (newTheme !== currentTheme) {
        $('body').removeClass(currentTheme);
        $('body').addClass(newTheme);
    }
}

var OnBoardingManager = (function () {
    'use strict';
	
	var infoObject = new Object();
    var selectedImgClass = "dark-img-class";
    var selectedTheme = "dark-theme";
    var chosenWorkspace = "";
    var chosenTheme = "";
    
    $('body').addClass(selectedTheme);
    $(".app-dialog").addClass(selectedImgClass);
	
	$("#myCarousel").carousel({
        interval : false,
        pause: false,
        wrap: false
    }).on('slid.bs.carousel', function () {
		var curSlide = $('.item.active');
        var slideId;
        if (curSlide) {
            slideId = curSlide.attr('id');
        }
        
        if (slideId === "slide0") {
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_CAROUSAL_QE);
        } else if (slideId === "slide1") {
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_CAROUSAL_RTP);
        } else if (slideId === "slide2") {
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_CAROUSAL_GIT);
        } else if (slideId === "slide3") {
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_CAROUSAL_CSSPRE);
        } else if (slideId === "slide4") {
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_CAROUSAL_GS);
        }
        
	    if (curSlide.is(':first-child')) {
		    $('.left').hide();
		    return;
	    } else {
		    $('.left').show();
        }
        if (curSlide.is(':last-child')) {
            $('.left, .right, .slider-title, .carousel-indicators').hide();
            $('.carousel-inner .item.last-item').fadeIn();
            return;
        } else {
            $('.right').show();
        }
	});


	$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
		$("#myCarousel").carousel(0);
		$('.right').show();
		$('.slider-title, .carousel-indicators').show();
    });
    
    $('body').keydown(function (event) {
        if (event.keyCode === 27) {
            OnBoardingManager.handleEscapeKey();
        }
    });
    
    $("#new-user").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            $(".welcome-msg").hide("slide", { direction: "left"  }, 500);
            $('.nav-tabs a:eq(0)').tab('show');
        }
    });
    
	$("#old-user").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            $(".welcome-msg").hide("slide", { direction: "left"  }, 500);
            $('.nav-tabs a:eq(0)').tab('show');
        }
    });
 
	
	$(".new-user-layout .btn-continue-2").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            $('.nav-tabs a:eq(2)').tab('show');
            $('.nav-tabs li:eq(1)').addClass("disabled");
        }
    });
	
	$(".new-user-layout .developer").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            setWorkspace(CONSTANTS.WS_CODE);
            chosenWorkspace = CONSTANTS.WS_CODE;
            $('.nav-tabs a:eq(1)').tab('show');
            $('.nav-tabs li:eq(0)').addClass("disabled");
        }
    });
    
    $(".new-user-layout .standard").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            setWorkspace(CONSTANTS.WS_DESIGN);
            chosenWorkspace = CONSTANTS.WS_DESIGN;
            $('.nav-tabs a:eq(1)').tab('show');
            $('.nav-tabs li:eq(0)').addClass("disabled");
        }
    });

	
    $(".old-user-layout .btn-continue-2").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            $('.nav-tabs a:eq(1)').tab('show');
            $('.nav-tabs li:eq(0)').addClass("disabled");
		    $("#myCarousel").carousel(0);
		    $('.right').show();
		    $('.slider-title, .carousel-indicators').show();
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_CAROUSAL_QE);
        }
    });

	
	$(".old-user-layout .developer").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            setWorkspace(CONSTANTS.WS_CODE);
            chosenWorkspace = CONSTANTS.WS_CODE;
            $('.nav-tabs a:eq(2)').tab('show');
            $('.nav-tabs li:eq(1)').addClass("disabled");
        }
    });
    
    $(".old-user-layout .standard").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            setWorkspace(CONSTANTS.WS_DESIGN);
            chosenWorkspace = CONSTANTS.WS_DESIGN;
            $('.nav-tabs a:eq(2)').tab('show');
            $('.nav-tabs li:eq(1)').addClass("disabled");
        }
    });
	
    
    $(".dw-color-stops .darkest-stop").hover(function () {
        onColorStopHoverIn("darkest-img-class", selectedImgClass);
    }, function () {
        onColorStopHoverOut("darkest-img-class", selectedImgClass);
    });

    $(".dw-color-stops .dark-stop").hover(function () {
        onColorStopHoverIn("dark-img-class", selectedImgClass);
    }, function () {
        onColorStopHoverOut("dark-img-class", selectedImgClass);
    });
    
    $(".dw-color-stops .light-stop").hover(function () {
        onColorStopHoverIn("light-img-class", selectedImgClass);
    }, function () {
        onColorStopHoverOut("light-img-class", selectedImgClass);
    });

    $(".dw-color-stops .lightest-stop").hover(function () {
        onColorStopHoverIn("lightest-img-class", selectedImgClass);
    }, function () {
        onColorStopHoverOut("lightest-img-class", selectedImgClass);
    });
	
	$(".dw-color-stops span").hover(function () {
        $(".dw-color-stops span").removeClass("selected");
    }, function () {
	});
    
    //accessibility begin
        
    $(".dw-color-stops .darkest-stop").focusin(function () {
        onColorStopHoverIn("darkest-img-class", selectedImgClass);
    });
    $(".dw-color-stops .darkest-stop").focusout(function () {
        onColorStopHoverOut("darkest-img-class", selectedImgClass);
    });

    $(".dw-color-stops .dark-stop").focusin(function () {
        onColorStopHoverIn("dark-img-class", selectedImgClass);
    });
    $(".dw-color-stops .dark-stop").focusout(function () {
        onColorStopHoverOut("dark-img-class", selectedImgClass);
    });
    
    $(".dw-color-stops .light-stop").focusin(function () {
        onColorStopHoverIn("light-img-class", selectedImgClass);
    });
    $(".dw-color-stops .light-stop").focusout(function () {
        onColorStopHoverOut("light-img-class", selectedImgClass);
    });

    $(".dw-color-stops .lightest-stop").focusin(function () {
        onColorStopHoverIn("lightest-img-class", selectedImgClass);
    });
    $(".dw-color-stops .lightest-stop").focusout(function () {
        onColorStopHoverOut("lightest-img-class", selectedImgClass);
    });
	
	$(".dw-color-stops span").focusin(function () {
        $(".dw-color-stops span").removeClass("selected");
    });
    
    //accessibility end
	
	$(".dw-color-stops span").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
		    $(".dw-color-stops span").removeClass("selected");
		    $(".dw-color-stops span").removeClass("active");
		    $(this).addClass("active");
        }
	});
	
	$(".dw-color-stops .darkest-stop").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            onColorStopClick("darkest-theme", selectedTheme);
            selectedImgClass = "darkest-img-class";
            selectedTheme = "darkest-theme";
            infoObject.colorStop = CONSTANTS.THEME_DARKEST;
            updateAppTheme(0);
        }
    });
    
    $(".dw-color-stops .dark-stop").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            onColorStopClick("dark-theme", selectedTheme);
            selectedImgClass = "dark-img-class";
            selectedTheme = "dark-theme";
            infoObject.colorStop = CONSTANTS.THEME_DARK;
            updateAppTheme(1);
        }
    });
    
    $(".dw-color-stops .light-stop").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            onColorStopClick("light-theme", selectedTheme);
            selectedImgClass = "light-img-class";
            selectedTheme = "light-theme";
            infoObject.colorStop = CONSTANTS.THEME_LIGHT;
            updateAppTheme(2);
        }
    });
    
    $(".dw-color-stops .lightest-stop").bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            onColorStopClick("lightest-theme", selectedTheme);
            selectedImgClass = "lightest-img-class";
            selectedTheme = "lightest-theme";
            infoObject.colorStop = CONSTANTS.THEME_LIGHTEST;
            updateAppTheme(3);
        }
    });
    
	$('#repeat-feature').on('click keydown', function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
		    $('.carousel-inner .item.last-item').fadeOut();
		    $("#myCarousel").carousel(0);
		    $('.right').show();
		    $('.slider-title, .carousel-indicators').show();
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_REPEAT_FEATURE);
        }
	});
	
	$('#new-user').on('click keydown', function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
		    infoObject.userType = CONSTANTS.NEW_USER;
		    $('body').removeClass('old-user');
		    $('body').addClass('new-user');
        }
	});

	$('#old-user').on('click keydown', function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
		    infoObject.userType = CONSTANTS.OLD_USER;
		    $('body').removeClass('new-user');
		    $('body').addClass('old-user');
        }

	});

	$('.dw-close').bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
		    $('.app-dialog').fadeOut();
            dismissWindow(infoObject);
        }
	});
    
    $('.finish-btn').bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
		    $('.app-dialog').fadeOut();
            logDWMessage(HEADLIGHTS.UT_ONBOARDING, HEADLIGHTS.UT_GET_STARTED);
            dismissWindow(infoObject);
        }
	});
	
	$('.starter-template .content-dev').bind("click keydown", function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
		    $('.app-dialog, .app-header').hide();
            infoObject.folderSelected = false;
		    infoObject.watchTutorial = false;
            dismissWindow(infoObject);
        }
	});
	
	$('.project-folder .content-std').on('click keydown', function (e) {
        if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
            infoObject.folderSelected = true;
		    infoObject.watchTutorial = false;
            dismissWindow(infoObject);
        }
	});
	
    if (window.navigator.onLine === true) {
        $('.watch-tutorial .content-std').on('click keydown', function (e) {
            if (e.type === 'click' || (e.type === 'keydown' && e.which === CONSTANTS.ENTERKEYCODE)) {
                infoObject.folderSelected = false;
                infoObject.watchTutorial = true;
                dismissWindow(infoObject);
            }
        });
    } else {
        $('.watch-tutorial').addClass('disabled');
    }
    
    return {
        handleEscapeKey : function () {
            if (chosenWorkspace !== "") {
                setWorkspace(chosenWorkspace);
            } else {
                setWorkspace(CONSTANTS.WS_CODE);
            }
            if (infoObject.colorStop !== undefined) {
                if (infoObject.colorStop === CONSTANTS.THEME_DARKEST) {
                    updateAppTheme(0);
                } else if (infoObject.colorStop === CONSTANTS.THEME_DARK) {
                    updateAppTheme(1);
                } else if (infoObject.colorStop === CONSTANTS.THEME_LIGHT) {
                    updateAppTheme(2);
                } else if (infoObject.colorStop === CONSTANTS.THEME_LIGHTEST) {
                    updateAppTheme(3);
                }
            } else {
                updateAppTheme(0);
            }
            dismissWindow(infoObject);
        },
        setFocusToPage: function () {
            $('#new-user').focus();
        }
    };
}());
