/*
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
 */

var compiledPages = {};
var pagesToCompile = [
    "home",
    "settings"
];
console.log("Compiling page templates...");
for (var i = 0; i < pagesToCompile.length; i++) {
    compiledPages[pagesToCompile[i]] = Template7.compile($.ajax({
        type: "GET",
        url: "./pages/" + pagesToCompile[i] + ".html",
        async: false
    }).responseText);
}
console.log("Compiled page templates.");

var routes = [
    {
        path: '/home',
        name: 'home',
        on: {
            pageAfterIn: function () {
                createMap();
            }
        },
        async: function ( { resolve, reject }) {
            resolve({
                content: compiledPages.home({})
            }, {});
        }
    },
    {
        path: '/credits',
        url: './pages/credits.html',
        name: 'credits'
    },
    {
        path: '/settings',
        name: 'settings',
        async: function ( {resolve}) {
            var settings = [];
            settings.push(
                    {
                        setting: "display",
                        title: "Display and Appearance",
                        text: "",
                        onclick: "router.navigate('/settings/display')",
                        link: true
                    },
                    {
                        setting: "maps",
                        title: "Map",
                        text: "Change map settings and units.",
                        onclick: "router.navigate('/settings/maps')",
                        link: true
                    }
            );

            settings.push(
                    {
                        setting: "versions",
                        title: SETTINGS.branding.apptitle + " app v" + app_version,
                        text: "Copyright &copy; 2019-2021 Netsyms Technologies.",
                        onclick: ""
                    },
                    {
                        setting: "opensource",
                        title: "Credits and open source info",
                        text: "",
                        onclick: "router.navigate('/credits')",
                        link: true
                    },
                    {
                        setting: "privacy",
                        title: "Privacy policy and legal",
                        text: "",
                        onclick: "openBrowser('https://netsyms.com/legal?mtm_campaign=FixPhraseApp')",
                        link: true
                    });
            resolve({
                content: compiledPages.settings({
                    page_title: "Settings",
                    settings: settings
                })
            });
        },
        routes: [
            {
                path: '/display',
                name: 'settings',
                async: function ( {resolve}) {
                    var settings = [
                        {
                            setting: "apptheme",
                            title: "Color theme",
                            select: true,
                            options: [
                                {
                                    value: "auto",
                                    label: "Auto",
                                    selected: getStorage("apptheme") == null || getStorage("apptheme") == "auto"
                                },
                                {
                                    value: "dark",
                                    label: "Dark",
                                    selected: getStorage("apptheme") == "dark"
                                },
                                {
                                    value: "light",
                                    label: "Light",
                                    selected: getStorage("apptheme") == "light"
                                }
                            ]
                        },
                        {
                            setting: "animation",
                            title: "Animations",
                            select: true,
                            options: [
                                {
                                    value: "auto",
                                    label: "On",
                                    selected: getStorage("animation") == null || getStorage("animation") == "auto" || getStorage("animation") == "on"
                                },
                                {
                                    value: "off",
                                    label: "Off",
                                    selected: getStorage("animation") == "off"
                                }
                            ]
                        }
                    ];
                    resolve({
                        content: compiledPages.settings({
                            page_title: "Display Settings",
                            settings: settings
                        })
                    });
                }
            },
            {
                path: '/maps',
                name: 'settings',
                async: function ( {resolve}) {
                    var mapstyles = [];
                    mapstyles.push({
                        value: "auto",
                        label: "Automatic",
                        selected: getStorage("mapsource") == id
                    });
                    for (var id in SETTINGS.maptileurls) {
                        if (SETTINGS.maptileurls.hasOwnProperty(id)) {
                            mapstyles.push({
                                value: id,
                                label: SETTINGS.maptileurls[id].name,
                                selected: getStorage("mapsource") == id
                            });
                        }
                    }
                    var settings = [
                        {
                            setting: "mapsource",
                            title: "Map style",
                            select: true,
                            options: mapstyles,
                            text: "Choose which map style to use."
                        },
                        {
                            setting: "units",
                            title: "Measurement units",
                            select: true,
                            options: [
                                {
                                    value: "metric",
                                    label: "Meters/Kilometers",
                                    selected: getStorage("units") == "metric"
                                },
                                {
                                    value: "imperial",
                                    label: "Feet/Miles",
                                    selected: getStorage("units") == "imperial"
                                }
                            ]
                        },
                        {
                            setting: "mapscale",
                            title: "Map Scale Ruler",
                            text: "Show a scale in the corner of the map.",
                            toggle: true,
                            checked: getStorage("mapscale") !== "false",
                            onclick: ""
                        },
                    ];
                    resolve({
                        content: compiledPages.settings({
                            page_title: "Map Settings",
                            settings: settings
                        })
                    });
                }
            }
        ]
    }
];
