var favicon = "images/favicon.ico";
var alerticon = "images/alert.ico";
var video;

/*------------------ INITIALIZATION --------------------*/
function initApp() {

    if (window.external.msIsSiteMode()) {

        // Hook up handlers that need to change with focus changes.  This is
        // necessary to get correct behavior when switching between browser tabs.
        window.onfocus = initFocus;

        // Add the overlay play and pause buttons for video content
        addButtons();

    }
    else {

        // Turn on the add to start menu button - note this is not on by default to avoid
        // having it flash on the screen when in site mode
        var btnAddWebApp = document.getElementById("btnAddWebApp");
        if (btnAddWebApp)
            btnAddWebApp.style.display = 'block';
    }
}

function initFocus() {

    // Add local page category and items to the jumplist
    addLocalJumpList();

}

/*------------------ ADD SITE TO START MENU --------------------*/
function addWebApp() {

    // Add to start menu
    try {
        window.external.msAddSiteMode();
    }
    catch (ex) {
        // Site Mode not supported.
    } 
}

/*------------------ OVERLAY ICON ALERTING --------------------*/
function notify() {

    // Add overlay icon to alert the user 
    window.external.msSiteModeSetIconOverlay(alerticon, 'notify');

    // Set the var to tell the new items page what to display.  Simulates new items being
    // added to this page.
    window.localStorage.NewItems++;
}

function clearAlertIcons() {
    // Clear overlay icon
    window.external.msSiteModeClearIconOverlay();
}

/*------------------ ADD LOCAL JUMPLIST ITEMS -----------------*/
function addLocalJumpList() {

    var cl = document.getElementById("contents-list");
    if (cl) {
        var anchors = cl.getElementsByTagName("A");

        // Add local category to the jumplist.  Note that this also clears any existing jumplist.
        // Adding the currently focused page type (e.g. Blog, Article, etc.)
        window.external.msSiteModeCreateJumplist(cl.childNodes[1].innerHTML);

        // For each page entry in current page, create a JumpList Item with item title and linking to item URL
        for (cnt = 0; cnt < anchors.length; cnt++) {
            window.external.msSiteModeAddJumpListItem(anchors[cnt].children[0].children[0].children[0].innerText, anchors[cnt].href, favicon);
        }
        window.external.msSiteModeShowJumplist();
    }
    else {
        window.external.msSiteModeClearJumplist();
    }
}


/*------------------ THUMBNAIL BUTTONS --------------------*/
var btnPlayVideo, stylePlay, stylePause;

function addButtons() {

    video = document.getElementsByTagName('video')[0];

    if (video) {

        // Create the Thumbbar.  If it already exists for this session, this will set the 
        // correct reference for the button.
        btnPlayVideo = window.external.msSiteModeAddThumbBarButton('images/play.ico', 'Play');

        // Set the enabled and visible properties to true in case this thumbar has been deactivated in
        // this session
        window.external.msSiteModeUpdateThumbBarButton(btnPlayVideo, true, true);

        // Then we add the Pause and Play styles to toggle between Play / Pause
        // requires full URL to icon file
        stylePause = window.external.msSiteModeAddButtonStyle(btnPlayVideo,
                  'http://localhost/sitemodesamplecomplete/images/Pause.ico',
                 'Pause');

        stylePlay = window.external.msSiteModeAddButtonStyle(btnPlayVideo,
                  'http://localhost/sitemodesamplecomplete/images/Play.ico',
                  'Play');

        // Then we setup the listener to handle a button click
        if (document.addEventListener) {
            document.addEventListener('msthumbnailclick', thumbnailclick, false);
        }
        // Finally we set the buttons to show on the Thumbnail
        window.external.msSiteModeShowThumbBar();

        window.onunload = hideButtons;
    }
}

// Hide the buttons every time we leave the page.
function hideButtons() {

    window.external.msSiteModeUpdateThumbBarButton(btnPlayVideo, false, false);

}

function thumbnailclick(btn) {

    if (btn.buttonID == btnPlayVideo) {
        if (video.paused) {
            video.play();
            window.external.msSiteModeShowButtonStyle(btnPlayVideo, stylePause);
        }
        else {
            video.pause();
            window.external.msSiteModeShowButtonStyle(btnPlayVideo, stylePlay);
        }
    } 
}