// if (location.protocol !== "https:") {
//  //   location.protocol = "https:";
// }
if (typeof (NodeList.prototype.forEach) !== typeof (alert)) {
    NodeList.prototype.forEach = Array.prototype.forEach; //IE Fix
}

var get_page_id = function(e){
    var page_id = document.location.hash.substring(1);
    return page_id;
}

var show_page = function (page_id) {
    console.log("show_page()", page_id);
    if (!is_page_loaded(page_id)) {
        load_page(page_id);
    } else {
        if (document.querySelector("section#go_page--" + page_id).classList.contains('error_page')){
            // try reloading again if it is an error page.
            console.log("Error Page: ", page_id, "- trying to reload!");
            load_page(page_id);
        }else{
            // page is loaded and isn't an error page.
            show_page_sub(page_id);
        }
    }
}

var show_page_sub = function (page_id) {
    console.log("show_page_sub", page_id);
    // hide all non active pages and content
    document.querySelectorAll("section.go_page").forEach(function (this_go_page, tindex) {
        this_go_page.classList.remove("go_page--active");
        // Dectivate Video if Defined
        if(this_go_page.querySelector("iframe.step-video")){
            this_go_page.querySelector("iframe.step-video").setAttribute("src", ""); // deactivate Videos
        }
    });
    // find and show and activate current active pages and content
    document.querySelectorAll("section#go_page--" + page_id).forEach(function (this_go_page, tindex) {
        this_go_page.classList.add("go_page--active");
        // Activate Video if Defined
        if(this_go_page.querySelector("iframe.step-video")){
            var this_go_page_data_live_src = this_go_page.querySelector("iframe.step-video").getAttribute("data-live-src");
            this_go_page.querySelector("iframe.step-video").setAttribute("src", this_go_page_data_live_src);
        }
        update_document_title();
    });
    document.querySelector("body").setAttribute("history_length", navigation_history.length);
    try{
        if (document.querySelector("section.go_page--active").classList.contains("go_page--card-slider")){
            document.querySelector(".layout-go-app").classList.add("card-slider-controls");
        }else{
            document.querySelector(".layout-go-app").classList.remove("card-slider-controls");
        }
    }catch(e){}
    scroll_to_top();
    update_card_step_navigation();
}

var card_step_navigation_completed = function(e) {
    console.log("card_step_navigation_completed");
    var current_go_page = document.querySelector("section.go_page--active");
    var current_go_page_step = parseInt(current_go_page.getAttribute("current_step"));
    var all_go_page_steps = current_go_page.querySelectorAll(".mdl-card");
    all_go_page_steps[current_go_page_step - 1].classList.add("step-completed");
    card_step_navigation_next(e);
}

var card_step_navigation_reset_all_steps = function (e) {
    console.log("card_step_navigation_reset_all_steps");
    var current_go_page = document.querySelector("section.go_page--active");
    var current_go_page_step = parseInt(current_go_page.getAttribute("current_step"));
    var all_go_page_steps = current_go_page.querySelectorAll(".mdl-card");
    all_go_page_steps.forEach(function(step_item, step_index){
        step_item.classList.remove("step-completed");
    })
    current_go_page.setAttribute("current_step", 1);
    //document.querySelector("#go_page--container").scrollIntoView({ behavior: "smooth", block: "start" });
    //current_go_page.querySelectorAll(".mdl-card")[0].scrollIntoView({ behavior: "smooth", block: "start" });
    step_scroll_to_top();
}

var card_step_navigation_next = function (e) {
    console.log("card_step_navigation_next");
    var current_go_page = document.querySelector("section.go_page--active");
    var current_go_page_step = parseInt(current_go_page.getAttribute("current_step"));
    var current_go_page_steps_total = current_go_page.querySelectorAll(".mdl-card").length;
    // console.log("current_go_page_step", current_go_page_step);
    // console.log("current_go_page_steps_total", current_go_page_steps_total);
    var new_go_page_step = Math.min(current_go_page_steps_total, current_go_page_step + 1);
    current_go_page.setAttribute("current_step", new_go_page_step);
    //document.querySelector("#go_page--container").scrollIntoView({ behavior: "smooth", block: "start" });
    // current_go_page.querySelectorAll(".mdl-card")[new_go_page_step-1].scrollIntoView({ behavior: "smooth", block: "start" });
    update_card_step_navigation();
    step_scroll_to_top();
}

var card_step_navigation_previous = function (e) {
    console.log("card_step_navigation_previous");
    var current_go_page = document.querySelector("section.go_page--active");
    var current_go_page_step = parseInt(current_go_page.getAttribute("current_step"));
    var current_go_page_steps_total = current_go_page.querySelectorAll(".mdl-card").length;
    // console.log("current_go_page_step", current_go_page_step);
    // console.log("current_go_page_steps_total", current_go_page_steps_total);
    var new_go_page_step = Math.max(1, current_go_page_step - 1);
    current_go_page.setAttribute("current_step", new_go_page_step);
    current_go_page.querySelectorAll(".mdl-card")[new_go_page_step-1].scrollIntoView({ behavior: "smooth", block: "start" });
    //document.querySelector(".layout-go-app").scrollIntoView({ behavior: "smooth", block: "start" });
    //document.querySelector("#go_page--container").scrollIntoView({ behavior: "smooth", block: "start" });
    update_card_step_navigation();
    step_scroll_to_top();
}

var update_card_step_navigation = function(e){
    var current_go_page = document.querySelector("section.go_page--active");
    // these were used and were global buttons
    //var card_slide_previous_button = document.querySelector("#card-slide-previous-button");
    //var card_slide_next_button = document.querySelector("#card-slide-next-button");

    if(current_go_page.hasAttribute("current_step") && current_go_page.classList.contains("go_page--card-slider")){
        var current_go_page_step = parseInt(current_go_page.getAttribute("current_step"));
        var current_go_page_steps_total = current_go_page.querySelectorAll(".mdl-card").length;
        var current_go_page_active_step_div = current_go_page.querySelectorAll(".mdl-card")[current_go_page_step-1];
        // get current active page step buttons.. current_go_page_active_step_div not document
        var step_slide_previous_button = current_go_page_active_step_div.querySelector(".jd-step-previous-button"); 
        var step_slide_next_button = current_go_page_active_step_div.querySelector(".jd-step-next-button");
        // console.log("current_go_page_step", current_go_page_step);
        // console.log("current_go_page_steps_total", current_go_page_steps_total);
        // console.log('(current_go_page_step >= current_go_page_steps_total)', (current_go_page_step >= current_go_page_steps_total));
        if (current_go_page_step <= 1){
            //card_slide_previous_button.classList.add("disabled");
            step_slide_previous_button.classList.add("disabled");
        }else{
            //card_slide_previous_button.classList.remove("disabled");
            step_slide_previous_button.classList.remove("disabled");
        }
        if (current_go_page_step >= current_go_page_steps_total) { 
            //card_slide_next_button.classList.add("disabled");
            step_slide_next_button.classList.add("disabled");
        } else {
            //card_slide_next_button.classList.remove("disabled");
            step_slide_next_button.classList.remove("disabled");
        }
    }
}

var mdl_toggle_drawer = function (e) {
    try {
        var layout = document.querySelector('.mdl-layout');
        layout.MaterialLayout.toggleDrawer();
    } catch (e) { }
}

var mdl_close_drawer = function (e) {
    var drawer = document.querySelector('.mdl-layout__drawer');
    if (drawer.classList.contains('is-visible')) {
        mdl_toggle_drawer(e);
    }
}

var mdl_open_drawer = function (e) {
    var drawer = document.querySelector('.mdl-layout__drawer');
    if (!drawer.classList.contains('is-visible')) {
        mdl_toggle_drawer(e);
    }
}

var hash_changed = function(e){
    var page_id = get_page_id();
    console.log("hash_changed() - page_id", page_id);
  //  mdl_close_drawer();   // TODO:
    if(navigation_history[navigation_history.length-1] != page_id){
        navigation_history.push(page_id);
    }
    console.log("navigation_history", navigation_history);
    show_page(page_id);
}

var scrollOptions = {
    top: 1,
    left: 1,
    behavior: 'smooth'
};
var scrollIntoViewOptions = { behavior: "smooth", block: "start", inline: "nearest" };

var step_scroll_to_top = function(e) {
    document.querySelector("#go_page--container").scrollIntoView(scrollIntoViewOptions);
    var current_go_page = document.querySelector("section.go_page--active");
    current_go_page.scrollIntoView(scrollIntoViewOptions);
    current_go_page.querySelectorAll(".mdl-card").forEach(function(step_item, step_index){
        step_item.scrollIntoView(scrollIntoViewOptions);
    });
}

var scroll_to_top = function(e){
    // not working
}

var is_page_loaded = function(page_id){
    if(document.querySelectorAll("section#go_page--"+page_id).length <= 0){
        //console.log("not loaded", page_id);
        return false;
    }else{
        return true;
    }
}

var error_page = function(page_id){
    console.log("error_page()", page_id);
    if (!is_page_loaded(page_id)){ // only create it if doesn't exist already
        var error_div = document.querySelector("#go_page--error");
        var missing_div = error_div.cloneNode(true);
        missing_div.id = "go_page--" + page_id;
        missing_div.classList.add("error_page");
        document.querySelector("#go_page--container").insertAdjacentElement("beforeend", missing_div);
    }
    show_page_sub(page_id);
    scroll_to_top();
}

var load_page = function(page_id){
    console.log("loading", page_id);
    fetch(page_id+'.html')
        .then(function(response) {
            if (response.status == 200) {
                return response.text();
            }else{
                return false;
            }
        })
        .then(function(newPageHTML) {
            if(newPageHTML != false){
                console.log("page loaded", page_id);
                // if load is successful and there is an existing page in its place currently lets remove it so it can be recreated
                if (document.querySelector("section#go_page--" + page_id)) {
                    // if (document.querySelector("section#go_page--" + page_id).classList.contains('error_page')) {
                        // this will remove any error_page versions as well.
                    // }
                    console.log("Removing:", page_id);
                    document.querySelector("section#go_page--" + page_id).parentNode.removeChild(document.querySelector("section#go_page--" + page_id));
                }
                //document.querySelector("#go_page--container").insertAdjacentHTML("beforeend", newPageHTML);
                // done: add verification that the loaded html snippet has the appropriate ID set. 
                // incorrect ID's will cause loop loading issues.
                // this creates a new element and sets the id based on what was requested
                // then appends it to the dom
                var new_go_page = document.createElement("div");
                new_go_page.innerHTML = String(newPageHTML).trim();
                new_go_page.firstChild.id = "go_page--" + page_id;
                //new_go_page.firstChild.insertAdjacentHTML("afterbegin", '<div class="go_page_top"></div>');
                console.log("new_go_page.firstChild", new_go_page.firstChild);
                document.querySelector("#go_page--container").insertAdjacentElement("beforeend", new_go_page.firstChild);
                console.log("page added", page_id);
                show_page(page_id);
            }else{
                error_page(page_id);
            }
        }).catch(function(err) {  
            console.log('load_page() Fetch Error', err);  
            error_page(page_id);
        });
}

var load_manifest_json = function(e){
    fetch("manifest.json")
        .then(function(response) {
            if (response.status == 200) {
                return response.json();
            }else{
                return false;
            }
        })
        .then(function(loaded_manifest_json) {
            if(loaded_manifest_json != false){
                manifest_json = loaded_manifest_json;
                //document.title = manifest_json.name + " ("+manifest_json.version+")";
                update_document_title();
                init_service_worker();
            }
        }).catch(function(err) {  
            console.log('load_package_json() Fetch Error', err);  
        });
}

var update_document_title = function(e){
    var go_page_title = "";
    var app_title = document.title;//"Go App";
    var current_go_page_id = get_page_id();
    var current_go_page = document.querySelector("section#go_page--" + current_go_page_id);
    if (is_page_loaded()){
        if (current_go_page.hasAttribute("data-go-page-title")) {
            if (current_go_page.getAttribute("data-go-page-title") != "") {
                go_page_title = " - " + current_go_page.getAttribute("data-go-page-title");
            }
        }
    }
    if (manifest_json) {
        if (manifest_json.name){
            app_title = manifest_json.name;
        }
        if (manifest_json.build && app_title.indexOf("(v" + manifest_json.build + ")") == -1){
            app_title = app_title; // + " (v" + manifest_json.build + ")";
           // document.querySelector("#build").innerHTML = "v" + manifest_json.build;  // TODO:
        }
    }
    document.title = app_title + go_page_title;
}

var init_service_worker = function(e){
    // if(enable_service_worker){
    //     console.log("init_service_worker()");
    //     console.log("manifest_json.scope", manifest_json.scope);
    //     if ('serviceWorker' in navigator) {
    //         navigator.serviceWorker.register(manifest_json.scope+'service-worker.js', {
    //             updateViaCache: 'none',
    //             scope: manifest_json.scope //"/projects/cdn-sites-go-apps/htdocs/GOPUSHMDL/"
    //         })
    //         .then(function(registration) {
    //             console.log('Registration successful, scope is:', registration.scope);
    //         })
    //         .catch(function(error) {
    //             console.log('Service worker registration failed, error:', error);
    //         });
    //     }

    // }else{
    //     console.log("enable_service_worker", enable_service_worker);
    // }
}

var navigate_page_previous = function(e) {
    if(navigation_history.length > 1){
        navigation_history.pop(); // remove one history.
        console.log("navigation_history", navigation_history);
        window.history.back();
    }
}

var beforeinstallprompt = function(e) {
    // Prevent Chrome 67 and earlier from automatically showing the prompt
    e.preventDefault();
    // Stash the event so it can be triggered later.
    deferred_pwa_install_prompt = e;
    console.log("beforeinstallprompt", e);
}

var appinstalled = function(e) {
    console.log('appinstalled', e);
}

var deferred_pwa_install_prompt;
var manifest_json = null;
var enable_service_worker = true;
var navigation_history = [];
var myHammer = null;
var myHammerPanDirection = null;


document.addEventListener("DOMContentLoaded", function(event) {
    window.onhashchange = hash_changed;
    if(document.location.hash.length == 0){ 
        document.location.hash = "#home"; 
    }else{
        hash_changed();
    }
    load_manifest_json();

    myHammer = new Hammer(document.querySelector("#go_page--container"));//.querySelector("body"));
    myHammer.on("swipe", function(ev) {
        var current_go_page = document.querySelector("section.go_page--active");
        if(current_go_page.hasAttribute("current_step") && current_go_page.classList.contains("go_page--card-slider")){
            //console.log(ev.type +" gesture detected.");
            switch(ev.direction) {
                case Hammer.DIRECTION_LEFT:
                    card_step_navigation_next();
                    break;
                case Hammer.DIRECTION_RIGHT:
                    card_step_navigation_previous();
                    break;
            }
        }
    });

    document.querySelector("#back-button").addEventListener("click", navigate_page_previous, true);
  //  document.querySelector(".jd__drawer-button").addEventListener("click", mdl_toggle_drawer, true); // TODO:
    // document.querySelector("#card-slide-previous-button").addEventListener("click", card_step_navigation_previous, true);
    // document.querySelector("#card-slide-next-button").addEventListener("click", card_step_navigation_next, true);
});

window.addEventListener('beforeinstallprompt', beforeinstallprompt);
window.addEventListener('appinstalled', appinstalled);