import m from "mithril"
import { Toolbar, ToolbarTitle } from "polythene-mithril"
import { backButton, logoutButton } from "./buttons"

export const nav = {
    view: function(vnode) {
        return m(Toolbar, {
            style: {
                backgroundColor: "rgb(255, 153, 0)",
                // position: "fixed",
                width: "100%",
                // zIndex: "12"
            },
            tone: "dark",
            compact: true
        }, [
            vnode.attrs.back != false ?
            m({
                view: function() {
                    return m("div.nav-button", {
                        style: {
                            marginLeft: "1em",
                            cursor: "pointer"
                        },
                        onclick: function() {
                            /* Request ke question model */
                            // qsModel.fetch(qsId.qsuestionnaire.url)
                            /* Route */
                            m.route.set(vnode.attrs.back)
                        }
                    }, m(backButton))
                }
            })
            : null,
            m(ToolbarTitle, {
                id: "nav-title",
                style: {
                    margin: "0 auto"
                },
                text: m("span#nav-title__text", vnode.attrs.title),
                center: true
            }),
            m("div.nav-button", {
                style: {
                    marginRight: "1em",
                    cursor: "pointer"
                },
                onclick: function() {
                    m.route.set("")
                }
            }, m(logoutButton))
        ])
    }
}