/**************************************************************************
 *                                                                        *
 *  Copyright 2014 Adobe Systems Incorporated                             *
 *  All Rights Reserved.                                                  *
 *                                                                        *
 * NOTICE:  All information contained herein is, and remains the property *
 * of Adobe Systems Incorporated and its suppliers, if any.               *
 * The intellectual and technical concepts contained herein are           *
 * proprietary to Adobe Systems Incorporated and its suppliers and may be *
 * covered by U.S. and Foreign Patents, patents in process, and are       *
 * protected by trade secret or copyright law.                            *
 * Dissemination of this information or reproduction of this material     *
 * strictly forbidden unless prior written permission is obtained from    *
 * Adobe Systems Incorporated.                                            *
 *                                                                        *
 **************************************************************************/

//    **Global Variables**
var videoLinks = new Array( "http://www.adobe.com/go/idtables",
                            "http://www.adobe.com/go/idepub",
                            "http://www.adobe.com/go/idsu");

//Convention followed for naming of feature images appearing on second page is that 1x image has a suffix "_1x" and similarly 2x image has suffix "_2x"
//In the array featureImagesBaseNames add the names of all the feature images without the suffix which indicates the scale factor of screen
var featureImagesBaseNames = new Array("SimplifiedTables", "EPUBFixedLayout", "SeamlessUpdate", "ColorGroups", "EnhancedSearch");
var featureImages = new Array();
var featureHeadings = new Array();
var featureText = new Array();
var currentFeatureNumber = -1;
var numberOfVideos = 3;
var numberOfFeatures = 5;
var numberOfVisibleRows = 3;
var resourceBundle;
var scrolled = 0;
var delta = 92;
var focusedFeature = 1;
var internetConnectionAjaxCallSent = false;
var connectedToInternet = false;
var iframeOnLoadCalled = false;
var elementFocusTimeOut;
var pageShowTimeOut;
var loadElementsTimeOut;

function onLoaded() {
    var csInterface = new CSInterface();
    
    loadJSX();
    
    updateThemeWithAppSkinInfo(csInterface.hostEnvironment.appSkinInfo);
    //Update the color of the panel when the theme color of the product changed.
    csInterface.addEventListener(CSInterface.THEME_COLOR_CHANGED_EVENT, onAppThemeColorChanged);
    
    //Intialising global arrays
    resourceBundle = csInterface.initResourceBundle();
    for(var i = 1; i <= numberOfFeatures; i++)
    {
        var featureHeadingKey = "Heading_Feature" + i;
        var featureTextKey = "Text_Feature" + i;
        featureHeadings[i-1] = resourceBundle[featureHeadingKey];
        featureText[i-1] = resourceBundle[featureTextKey];
    }

    //Initialising don't show again checkbox value
    var extScript = "$._ext_" + csInterface.hostEnvironment.appName + ".GetWhatsNewDontShowAgain()";
    evalScript(extScript, function(result) {
        var whatsnew = JSON.parse(result);
        var checkboxControl = document.getElementById("checkbox1");
        checkboxControl.checked = whatsnew.dontShowAgain;
    });

    //Making OS specific font changes
    var isWindowsOS = true;
    if(navigator.platform.indexOf("Mac") != -1)
        isWindowsOS = false;

    if(isWindowsOS)
    {
        var font = FontToBeUsed("Windows");
        $(".mainContainer").css("font-family", font);
    }
    else
    {
        var font = FontToBeUsed("Mac");
        $(".mainContainer").css("font-family", font);
        $(".appName").css("font-size","23px");
        $(".textHeader").css("font-size","10.5pt");
        $(".textDescription").css("font-size","9pt");
    }

    //Use smaller font size on J to make the branding label fit
    if(csInterface.hostEnvironment.appUILocale == "ja_JP")
        $(".appName").css("font-size","22px");

    //Loading feature images accordng to scale factor of screen
    LoadImagesAccordingToScaleFactor();
    csInterface.setScaleFactorChangedHandler(LoadImagesAccordingToScaleFactor);

    //Disabling drop inside whatsnew
    window.ondragenter=function(){ event.dataTransfer.dropEffect='none'; event.stopPropagation(); event.preventDefault(); }  
    window.ondragover=function(){ event.dataTransfer.dropEffect='none';event.stopPropagation(); event.preventDefault(); }
    window.ondrop=function(){ event.dataTransfer.dropEffect='none';event.stopPropagation(); event.preventDefault(); }
}

function LoadImagesAccordingToScaleFactor() {
    var csInterface = new CSInterface();
    var suffix;
    if(csInterface.getScaleFactor() == 2)
        suffix = "_2x";
    else
        suffix = "_1x";
    for(var i = 0; i < numberOfFeatures; i++)
    {
        featureImages[i] = "image/" + featureImagesBaseNames[i] + suffix + ".png";
    }
}

function FontToBeUsed(os)
{
    var csInterface = new CSInterface();
    var language = csInterface.hostEnvironment.appUILocale;
    if(os == "Windows")
    {
        switch(language)
        {
            case "ja_JP":
            return    "Meiryo";
            case "ko_KR":
            return    "Malgun Gothic";
            case "zh_CN":
            return    "Microsoft YaHei";
            case "zh_TW":
            return    "Microsoft JhengHei";
            default:
            return    "Tahoma";
        }
    }
    else if(os == "Mac")
    {
        switch(language)
        {
            case "ja_JP":
            return    "HiraKakuProN-W3";
            case "ko_KR":
            return    "AppleGothic";
            case "zh_CN":
            return    "STXihei";
            case "zh_TW":
            return    "LiHeiPro";
            default:
            return    "LucidaGrande";
        }
    }
}

/**
 * Update the theme with the AppSkinInfo retrieved from the host product.
 */
function updateThemeWithAppSkinInfo(appSkinInfo) {
    
    //Update the background color of the panel
    var panelBackgroundColor = appSkinInfo.panelBackgroundColor.color;
    document.body.bgColor = toHex(panelBackgroundColor);
    
    var styleId = "ppstyle";
    
    var csInterface = new CSInterface();
    var appName = csInterface.hostEnvironment.appName;
    
    if(panelBackgroundColor.red > 127)
        $("#theme").attr("href","./lightTheme.css");
    else
        $("#theme").attr("href","./darkTheme.css");

    addRule(styleId, ".default", "font-size:" + appSkinInfo.baseFontSize + "px" + "; color:" + reverseColor(panelBackgroundColor) + "; background-color:" + toHex(panelBackgroundColor, 20));
    addRule(styleId, "button", "border-color: " + toHex(panelBackgroundColor, -50));    
}

function addRule(stylesheetId, selector, rule) {
    var stylesheet = document.getElementById(stylesheetId);
    
    if (stylesheet) {
        stylesheet = stylesheet.sheet;
           if( stylesheet.addRule ){
               stylesheet.addRule(selector, rule);
           } else if( stylesheet.insertRule ){
               stylesheet.insertRule(selector + ' { ' + rule + ' }', stylesheet.cssRules.length);
           }
    }
}

function reverseColor(color, delta) {
    return toHex({red:Math.abs(255-color.red), green:Math.abs(255-color.green), blue:Math.abs(255-color.blue)}, delta);
}

/**
 * Convert the Color object to string in hexadecimal format;
 */
function toHex(color, delta) {
    function computeValue(value, delta) {
        var computedValue = !isNaN(delta) ? value + delta : value;
        if (computedValue < 0) {
            computedValue = 0;
        } else if (computedValue > 255) {
            computedValue = 255;
        }
        computedValue = Math.round(computedValue);
        computedValue = computedValue.toString(16);
        return computedValue.length == 1 ? "0" + computedValue : computedValue;
    }

    var hex = "";
    if (color) {
        with (color) {
             hex = computeValue(red, delta) + computeValue(green, delta) + computeValue(blue, delta);
        };
    }
    return "#" + hex;
}

function onAppThemeColorChanged(event) {
    //Should get a latest HostEnvironment object from application.
    var skinInfo = JSON.parse(window.__adobe_cep__.getHostEnvironment()).appSkinInfo;
    //Gets the style information such as color info from the skinInfo, 
    //and redraw all UI controls of your extension according to the style info.
    updateThemeWithAppSkinInfo(skinInfo);
} 

/**
 * Load JSX file into the scripting context of the product. All the jsx files in 
 * folder [ExtensionRoot]/jsx will be loaded. 
 */
function loadJSX() {
    var csInterface = new CSInterface();
    var extensionRoot = csInterface.getSystemPath(SystemPath.EXTENSION) + "/jsx/";
    csInterface.evalScript('$._ext.evalFiles("' + extensionRoot + '")');
}

function evalScript(script, callback) {
    new CSInterface().evalScript(script, callback);
}

function setVideoSource(videoSrc) {
    window.frames[0].stop();
    var video = document.getElementById("video_player");
    var frameDoc = video.contentDocument || video.contentWindow.document;
    frameDoc.documentElement.innerHTML = "";

    if(videoSrc != "")
        video.src = videoSrc;
}

function LoadElements(featureNumber) {

    //if(featureNumber < 0 || featureNumber >= numberOfFeatures)
    //    alert("wrong feature number");
    if(featureNumber < numberOfVideos)
    {
        var featureImage = document.getElementById("featureLargeImage");
        featureImage.src = featureImages[featureNumber];
        featureImage.style.visibility="hidden";
        document.getElementById("noConnectionText").style.visibility="hidden";
        document.getElementById("blackScreen").style.visibility="visible";
        document.getElementById("video_buffering").style.visibility="visible";

        iframeOnLoadCalled = false;
        connectedToInternet = false;
        setVideoSource(videoLinks[featureNumber]);
        $("#videopage_heading").text(featureHeadings[featureNumber]);
        $("#videopage_text").text(featureText[featureNumber]);
        CheckInternetConnectionUsingAjax();
    }
    else
    {
        setVideoSource("");
        var featureImage = document.getElementById("featureLargeImage");
        featureImage.src = featureImages[featureNumber];
        featureImage.style.visibility="visible";
        document.getElementById("noConnectionText").style.visibility="hidden";
        document.getElementById("blackScreen").style.visibility="hidden";
        document.getElementById("video_buffering").style.visibility="hdden";        
        $("#videopage_heading").text(featureHeadings[featureNumber]);
        $("#videopage_text").text(featureText[featureNumber]);
    }
    LogPageVisited(featureNumber);
}

function removeLoadingImage() {
    if($('#secondpage').is(':visible'))
    {
        iframeOnLoadCalled = true;
        if(currentFeatureNumber < numberOfVideos)
        {
            document.getElementById("video_buffering").style.visibility="hidden";
            document.getElementById("blackScreen").style.visibility="hidden";
        }
        LogVideoPlayed();
    }
}

function CheckInternetConnectionUsingAjax() {
    var status = navigator.onLine;
    if(status == false)
    {
        connectedToInternet = false;
        internetConnectionAjaxCallSent = false;
        HandleError();
        return;
    }
    else if(internetConnectionAjaxCallSent)
        return;
    
    internetConnectionAjaxCallSent = true;
    $.ajax(
    {
        type: 'HEAD',
        url: videoLinks[0],
        cache: false,
        timeout: 10000,
        success: function()
        {
            connectedToInternet = true;
            internetConnectionAjaxCallSent = false;
            LogVideoPlayed();
        },
        error: function()
        {
            connectedToInternet = false;
            internetConnectionAjaxCallSent = false;
            HandleError();
        }
    });
 }

 function HandleError() {
    if(currentFeatureNumber < numberOfVideos)
    {
        setVideoSource("");
         document.getElementById("noConnectionText").style.visibility="visible";
         document.getElementById("featureLargeImage").style.visibility="visible";
    }
 }

function onNextButtonClick() {
    
    if(currentFeatureNumber == numberOfFeatures-1)
        currentFeatureNumber = 0;
    else
        currentFeatureNumber++;
    clearTimeout(loadElementsTimeOut);
    loadElementsTimeOut = setTimeout( function(){LoadElements(currentFeatureNumber)}, 150);
}

function onPrevButtonClick() {

    if(currentFeatureNumber == 0)
        currentFeatureNumber = numberOfFeatures - 1;
    else
        currentFeatureNumber--;
    clearTimeout(loadElementsTimeOut);
    loadElementsTimeOut = setTimeout( function(){LoadElements(currentFeatureNumber)}, 150);
}

function onVideoClick(featureNumber) {
    $("#firstpage").hide();

    //clearTimeout for all corresponding setTimeout on div "firstpage"
    clearTimeout(elementFocusTimeOut);
    clearTimeout(pageShowTimeOut);
    pageShowTimeOut = setTimeout( function(){$("#secondpage").show()}, 100);
    currentFeatureNumber = featureNumber - 1;
    clearTimeout(loadElementsTimeOut);
    loadElementsTimeOut = setTimeout( function(){LoadElements(currentFeatureNumber)}, 100);
}

function onHomeButtonClick() {

    //clearTimeout for all corresponding setTimeout on div "secondpage"
    clearTimeout(loadElementsTimeOut);
    setVideoSource("");
    currentFeatureNumber = -1;
    $("#secondpage").hide();
    clearTimeout(pageShowTimeOut);
    pageShowTimeOut = setTimeout( function(){$("#firstpage").show()}, 100);
}

function onDoneButtonClick() {
    var csInterface = new CSInterface();
    var checkValue = document.getElementById('checkbox1').checked;

    var extScript = "$._ext_" + csInterface.hostEnvironment.appName + ".SetWhatsNewDontShowAgain(" + checkValue + ")";
    evalScript(extScript, null);

    csInterface.closeExtension();
}

function onDownButtonClick() {
    
    if(scrolled < numberOfFeatures - numberOfVisibleRows)
    {
        scrolled++;
        var increment = scrolled * delta;
        $(".featurelist").animate({
                scrollTop:  increment
           });
        if($("#upbutton").is(":disabled"))
            $("#upbutton").removeAttr('disabled');
        if(scrolled == numberOfFeatures - numberOfVisibleRows)
            $("#downbutton").attr('disabled','disabled');
        
        if( !((focusedFeature >= scrolled + 1) && (focusedFeature <= scrolled + numberOfVisibleRows)) )
            SetFocusToFirstVisibleRow();
    }
}

function onUpButtonClick() {

    if(scrolled > 0)
    {
        scrolled--;
        var increment = scrolled * delta;
        $(".featurelist").animate({
                scrollTop:  increment
           });
        if($("#downbutton").is(":disabled"))
            $("#downbutton").removeAttr('disabled');
        if(scrolled == 0)
            $("#upbutton").attr('disabled','disabled');
        if( !((focusedFeature >= scrolled + 1) && (focusedFeature <= scrolled + numberOfVisibleRows)) )
            SetFocusToFirstVisibleRow();
    }
}

function SetFocusToFirstVisibleRow() {
    var featureID = "feature" + focusedFeature;
    var el = document.getElementById(featureID);
    el.blur();
    el.tabIndex="-1";
    focusedFeature = scrolled + 1;
    featureID = "feature" + focusedFeature;
    el = document.getElementById(featureID);
    el.tabIndex="0";
}

function KeyDetect(event) {

     if(event.keyCode == 27) {
         //esc handling
         var csInterface = new CSInterface();
        csInterface.closeExtension();
     }
     else if(event.keyCode == 38) {
         //Up arrow handling
         if(focusedFeature > 1)
         {
             var featureID = "feature" + focusedFeature;
             var el = document.getElementById(featureID);
             if(el == document.activeElement && $("#"+featureID).is(':focus'))
             {
                 el.blur();
                 el.tabIndex="-1";
                 focusedFeature--;

                 var scrollerMoved = false;
                 if(focusedFeature <= scrolled)
                 {
                     onUpButtonClick();
                     scrollerMoved = true;
                 }
                 featureID = "feature" + focusedFeature;
                 el = document.getElementById(featureID);
                 el.tabIndex="0";
                 if(scrollerMoved)
                {
                     clearTimeout(elementFocusTimeOut);
                    elementFocusTimeOut = setTimeout( function(){el.focus()}, 400);
                }
                else
                    el.focus();
             }

         }
     }
     else if(event.keyCode == 40) {
         //Down arrow handling
         if(focusedFeature < numberOfFeatures)
         {
             var featureID = "feature" + focusedFeature;
             var el = document.getElementById(featureID);
             if(el == document.activeElement && $("#"+featureID).is(':focus'))
             {
                 el.blur();
                 el.tabIndex="-1";
                 focusedFeature++;

                 var scrollerMoved = false;
                 if(focusedFeature > scrolled + numberOfVisibleRows)
                 {
                     onDownButtonClick();
                     scrollerMoved = true;
                 }
                 featureID = "feature" + focusedFeature;
                 el = document.getElementById(featureID);
                 el.tabIndex="0";

                 if(scrollerMoved)
                 {
                     clearTimeout(elementFocusTimeOut);
                    elementFocusTimeOut = setTimeout( function(){el.focus()}, 400);
                }
                else
                    el.focus();
             }
         }
     }
     else if(event.keyCode == 32) {
         //Space handling
         var featureID = "feature" + focusedFeature;
         var el = document.getElementById(featureID);
         var link = document.getElementById("AllEnhancementsText");
         if(el == document.activeElement && $("#"+featureID).is(':focus'))
            onVideoClick(focusedFeature);
         else if(link == document.activeElement && $("#AllEnhancementsText").is(':focus') )
             OpenLinkInBrowser();
     }
     else if(event.keyCode == 13) {
         //Enter/Return handling
         //We get the same keycode in JavaScript for both.
         var activeEl = $(document.activeElement);
         if(!activeEl.is(':focus') )
             onDoneButtonClick();
     }
 }

function LogVideoPlayed() {
    if( !(iframeOnLoadCalled && connectedToInternet && document.getElementById("video_player").src != "" ) )
        return;
    var featurePlayed = currentFeatureNumber + 1;
    if(featurePlayed <= numberOfVideos)
    {
        var csInterface = new CSInterface();
        var event = new CSEvent("WhatsNew", "APPLICATION");
        event.extensionId = csInterface.getExtensionID();    
        event.data = "VideoPlayed:" + "Feature" + featurePlayed;
        csInterface.dispatchEvent(event);
    }
}

function OpenLinkInBrowser() {
    var csInterface = new CSInterface();
    var event = new CSEvent("WhatsNew", "APPLICATION");
    event.extensionId = csInterface.getExtensionID();
    event.data = "AllEnhancements:AllEnhancements";
    csInterface.dispatchEvent(event);

    var language = csInterface.hostEnvironment.appUILocale;
    if(language == "en_US")
    {
        var appLanguage = csInterface.hostEnvironment.appLocale;
        if(appLanguage == "en_AE" || appLanguage == "en_IL")
            language = appLanguage;
    }

    var localeSpecificString = "";
    if(language != "en_US") {
        var languageLength = language.length;
        localeSpecificString = language.substring(languageLength - 3);
        localeSpecificString = localeSpecificString.toLowerCase();
    }
    window.cep.util.openURLInDefaultBrowser("http://www.adobe.com/go/id_cc_new_features" + localeSpecificString);
}

function LogPageVisited(featureNumber) {
    var featureVisited = featureNumber + 1;
    var csInterface = new CSInterface();
    var event = new CSEvent("WhatsNew", "APPLICATION");
    event.extensionId = csInterface.getExtensionID();
    event.data = "PageVisited:" + "Feature" + featureVisited;
    csInterface.dispatchEvent(event);
}
