var root = document.body

//import Header from'./Header.js';
import _Root from './_Root.js';
import Navigation from './Navigation.js';
import _Navigation from './_Navigation.js';
import Cart from './Cart.js';
//import _Cart from './_Cart.js';
//import ItemBrowser from './ItemBrowser.js';
import Messages from './Messages.js';
import LoginBox from './LoginBox.js';
import _Login from './_Login.js';
import Modal from './Modal.js';
//import LargeImage from './LargeImage.js';

import _DB from './_DB.js';
window._DB = _DB;

var Page = {
view: function(){
  return [
        m('#root.container.grid-lg', _Root.attrs, [
          m('#head.columns', [
            m('img.img-responsive.column.col-3', {src: 'images/piazza-optical-logo.jpg'}),
            m(LoginBox),
            m('.column.col-1', [
              m('button.btn.btn-primary', {onclick: _Navigation.navigateToFunction(Cart,null)}, [
                m('i.icon-basket'),
                'Cart'
                ])
              ])
            ]),
          m(Navigation),
          m('#main', [
            m(_Navigation.component, _Navigation.attrs)
            //m(ItemBrowser)
            ]),
          m(Modal),
          //m(LargeImage),
          m(Messages) // last so it's always on top
          ]),
        m("#footer.bg-dark", [
          m("h6#copyright.text-center", "Copyright ©2019 Piazza Optical")
          ])
    ]
  }
};
m.mount(root, Page);

// TODO: get rid of this function in production
function api(endpoint, payload){
  return m.request({
    method: 'POST',
    url: '/cgi/'+endpoint,
    body: payload
    });
  }
window.api = api;

//module.exports = {};