/*

name         Verkeer-In-Zicht 2010
author       Mark de Jong (http://www.spellcoder.nl)
copyright    (c) Senna Multimedia / Mark de Jong
website      http://www.senna.nu
version      december 2010

V1.0.1 - 15 dec
V1.0.2 - 16 dec
V1.1.0 - 19 dec
	- comparing processed tracks with original
	- better cleanup of tracks around school
V3.0.0 - 09 may
	- accident display included for Overijssel and Flevoland
	- user login 
	- access to accident display only by registered users
*/

product      = new productC();
medialist    = new spcMedialist();
searchwidget = new searchwidget();
mapmeta      = new spcMapData();
database	 = new spcDatabase();

accidentselection = new spcOptionPanel();

radioButtonSlowTraffic = null;
radioButtonFastTraffic = null;
radioButtonFixedObjects = null;
radioButtonAnimals = null;
radioButtonUnknown = null;
radioButtonFatal = null;
radioButtonNone = null;
buttonDisplayAccidents = null;

product.meta =					{ code:                 'VIZ'
                                , versionString:        'V3.0.0'
                                , builddate:            'mei 2011'
                                , project:              'Verkeer-In-Zicht'
                                , projectSubtitle:      'Online 2010'
                                };

product.config =
                                { cityselect:           true
                                , cityselectmap:        'Nederland'
                                , displayversion:       true
                                , debug:                        false
								, candrag:				true
                                , use_hq_video:         false           // default to high quality video

                                // experimental settings
                                , skin:                         'normal'
                                , lefthanded:           false           // not used yet
                                , mappointsfullscreen: false    // NOT SUPPORTED
                                , showunpublished:      false           // unfinished
                                }

product.url =   { api:                          		'spcwebsys/call.php'
                                //, joomla_api:         'http://localhost:1234/viz/spcwebsys/joomla_api.php' // FIXME
                                , joomla_api:           '../joomla/viz_joomla_api.php'
                                , bordenbase:           'http://trafficeducation.eu/content_borden/'
                                , selcitywelcome:   	'content/selectcity.xml'
                                , gallery:              'gallery/'
								, dbprefix:             'col_/'		// FIXME read this from server !
                                };

product.events = { mapswitch:           		new YAHOO.util.CustomEvent("mapswitch")
				, routecollectionloaded:        new YAHOO.util.CustomEvent("routecollectionloaded")
				, routecollectionselected:      new YAHOO.util.CustomEvent("routecollectionselected")
				, onceaftermaploaded:   		null
				};

product.components = { mapcollectionselector: null
                                        };

product.panels = { routes:      null
				, accidents:    null
				, video:        null
				, search:       null
				, cities:       null
				};

product.gmapsapikey = '';
product.dom = {};
product.mainmenu = null;
product.cityselectionmap = 'nederland';
product.map =   '';
product.unumber = 4321;

product.state = { initialized:          	false
				, gmaps_initialized:    	false
				, map:                  	''
				, legendcreated:        	false
				, legendaccidentcreated:	false
				, devmode:              	false
				};

state = { gmaps_loaded:         false
                };

// Internal state
product.windows         = [];
product.currentSection  = null;
product.userstate       = { loggedin: 		false
						  , accountname: 	''
						  , ID: 			0
						  };

// Webserver
product.runningonline = (location.protocol == 'http:' && location.hostname != 'localhost');
product.onwebserver   = (location.protocol == 'http:');
//product.betamode      = location.protocol.indexOf('prototype') != -1;

/* Part of the initialization not dependant on the DOM being ready for interaction */
productC.prototype.initData = function()
{
        // let testversion use the gallery of the live version
        var path = window.location.pathname;
        if (path.indexOf("/test") > 0)
                this.url.gallery = '../gallery/';

        this.URLargs = parseCurrentURLArgs();

        //this.determineGMapsKey();

        if (this.onbeforeinit)
                this.onbeforeinit();

		
        /*
        For use from DVD or installed on Harddisk:

                var URLpath = window.location.pathname;

                // Go up two dirs (webapp dir and webbrowser dir)
                var splitPos = URLpath.lastIndexOf("/");
                splitPos = URLpath.lastIndexOf("/",splitPos-1);
                product.path_main = URLpath.substring(0,splitPos);

                var navP = navigator.platform;
                if ( navP.substring(0,3) == 'Win' )
                {
                  product.path_main = URLpath.substring(1,splitPos);
                } else {
                  // assume UNIX descendant (MacOS X, Linux)
                  product.path_main = URLpath.substring(0,splitPos);
                }
        */
        //      preventSelection(document.getElementById('header'));
}


/* Part of the initialization when the browser is ready for DOM interaction,
   but not everything (images) are loaded */
productC.prototype.init = function()
{
        this.state.initialized = true;

        this.setOrientation('right');

        this.loadSkin(this.config.skin);
        this.initSkinSelector();

        document.getElementById('productTitle').innerHTML = this.meta.project;
        //document.getElementById('sectionTitle').innerHTML = this.meta.projectSubtitle;

        document.getElementById('loading').style.display = 'none';

//      makeElementPassEvents(document.getElementById('verkeerMenuMap'));
        makeElementPassEvents(document.getElementById('verkeerMenuPaal'));

        var testimg = document.getElementById('intro_overlay');
        if(testimg)
          makeElementPassEvents(testimg);

        // Debug ===================================================
        if (this.config.displayversion)
        {
                var appversionnode = document.getElementById("appversion");
                appversionnode.innerHTML = this.meta.versionString;
        }
        // =========================================================

        this.windowResize();
        addEvent(window, 'resize', product.windowResize);
		
        this.updateloginstate();

        this.showbrowserwarning();

        // Let's preload the map before Google Maps is ready
        if (this.URLargs.map)
        {
                // Directly go to the specified map
                this.gotoMap(this.URLargs.map);
                this.switchSection('map');
        }
        else
        {
                // Show the mainmenu/cityselection
                this.switchSection('mainmenu');
        }

        if (this.onafterinit)
                this.onafterinit();
}

productC.prototype.selectCity = function(city)
{
        console.info('selectCity '+city);
        this.gotoMap(city);
}

// Last part of the initialization, when everything on the website has been loaded
productC.prototype.postInit = function()
{
        // check if the browser failed to do a DOMContentLoaded
//      if (!this.state.initialized)
        //      this.init(); // IE (including 8) failed to initialize

		// 'http://www.verkeer-in-zicht.nl'	
		//,			`		onClick: function () {  } 
		

		var firstAccessSheet = objAccess.getFirstAccessSheet();
		var lastAccessSheet = objAccess.getLastAccessSheet();
		
		console.log('firstAccessSheet: ' + firstAccessSheet);
		
		console.log('lastAccessSheet: ' + lastAccessSheet);
		
		
		
        ifrm_login = document.createElement('iframe');
        ifrm_login.style.cssText = 'position: absolute; top: 0; left: 0; width: 500px; height: 500px; visibility: hidden;';
        document.body.appendChild(ifrm_login);

		

        addEvent(window, "message"
                        , function(event)
                                {
                                //console.log(event);
                                //console.log(event.data);
                                        // ADDME: check origin
                                        product.processMessages(parseResponse(event.data));
                                });

        this.resizeHeaderBar();


        product.panels.search   = document.createElement("div");//this.createpanel();
        searchwidget.panelcontainer     = product.panels.search;
        searchwidget.resultscontainer   = document.body;
        searchwidget.onitemselect       = function(itemid) { console.log('Item #'+itemid+' selected in the search panel.'); mygmap.onitemselect(itemid); }
        searchwidget.togglepanel();

        //this.container.appendChild(product.panels.search);
        document.body.appendChild(product.panels.search);
        product.panels.search.style.position = "absolute";
        product.panels.search.style.right = "320px";
        product.panels.search.style.top = "100px";

        //var testimg = document.getElementById('testimg');
        //preventSelection(testimg);

        this.getuserstate();

//      if (window.mygmap) // FIXME
//              this.panels.legenda.appendChild(mygmap.createLegend());

		

        loadScript('code/print.js', function() { pfQ = new printFrame(); } );

        if (useragent.isIE && useragent.versionIE < 7)
           alert("Uw versie van Internet Explorer (versie 6 uit 2001) wordt niet ondersteund.");
}

function mapselectionsidebar()
{
        var sidebar = this;
        this.citylist = null;

        var container = document.createElement('div');
        container.style.position = 'absolute';
        container.style.display = 'none';
		
        this.container = container;

        this.updatesize();

        container.style.right = '1px';
		
        container.style.backgroundColor = useragent.csssupport.rgba ? 'rgba(255, 255, 255, 0.8)' : '#FFFFFF';

        var tabstripnode = document.createElement('div');
        tabstripnode.className = 'tabList';
        tabstripnode.style.marginTop = '10px';
        container.appendChild(tabstripnode);

        document.body.appendChild(container);

        var menu2 = new TabStrip({ id:                'citysidebar_tabs'
                                                        , prefix:            'prefix'
                                                        , btnclass:          'tab'
                                                        , btnclass_selected: 'active'
                                                        , usenode:           tabstripnode
                                                        , onchange:                     function()
                                                                                                {
                                                                                                        var chosenpanel = menu2.getValue();

                                                                                                        switch(menu2.prevValue)
                                                                                                        {
                                                                                                                case 'cities': product.panels.cities.style.display = 'none';
                                                                                                                                break;
                                                                                                        }
                                                                                                        switch(chosenpanel)
                                                                                                        {
                                                                                                                case 'cities': product.panels.cities.style.display = 'block';
                                                                                                                                break;
                                                                                                        }
                                                                                                }
                                                        });

        product.panels.cities  = this.createpanel();
        var citiestab = menu2.createTab({ value:                'cities'
                                        , caption:      'Steden'
                                        });
        container.appendChild(product.panels.cities);
        citiestab.select();
}
mapselectionsidebar.prototype = sidebar.prototype;


mapselectionsidebar.prototype.generateCityList = function()
{
        console.info("mapselectionsidebar / generating cities list.");

        var resultitems = mapmeta.getSortedMapItems();

        var body = document.createElement('div');
        body.className = 'searchResults';

        var _this = this;

        for(var tel=0; tel<resultitems.length; tel++)
        {
                var item = resultitems[tel];

                var entry = document.createElement('div');
                entry.className = 'searchEntry';
                entry.mapitemid = item.id;
                entry.onclick = function()
                {
                        mygmap.onitemselect(this.mapitemid);
                };

                var entryname = document.createElement('span');
                entryname.className = 'entryName';
                entryname.appendChild(document.createTextNode( item.name ));
                entry.appendChild(entryname);

                body.appendChild(entry);
        }

        if (this.citylist == null)
                product.panels.cities.appendChild(body);
        else
                this.citylist.parentNode.replaceChild(body, this.citylist);

        this.citylist = body;
}


function mapsidebar()
{
        var sidebar = this;

        this.popup = new spcInfoPopup();

        var container = document.createElement('div');
        container.style.position = 'absolute';
        container.style.display = 'none';
        this.container = container;

        this.updatesize();

        container.style.right = '0px';
        container.style.backgroundColor = useragent.csssupport.rgba ? 'rgba(255, 255, 255, 0.8)' : '#FFFFFF';

        var tabstripnode = document.createElement('div');
        tabstripnode.className = 'tabList';
        tabstripnode.style.marginTop = '10px';
        container.appendChild(tabstripnode);

        document.body.appendChild(container);


        var menu = new TabStrip({ id:                'sidebar_tabs'
                                                        , prefix:            'prefix'
                                                        , btnclass:          'tab'
                                                        , btnclass_selected: 'active'
                                                        , usenode:           tabstripnode
                                                        , onchange:
                                                        function()
                                                        {
                                                                document.getElementById('lesbordkeuze').style.display = 'none';

                                                                var chosenpanel = menu.getValue();

                                                                switch(menu.prevValue)
                                                                {
                                                                        case 'routesraw': product.panels.routesraw.style.display = 'none';
                                                                                        break;
                                                                        case 'routes': product.panels.routes.style.display = 'none';
                                                                                        break;
                                                                        case 'accidents': product.panels.accidents.style.display = 'none';
																						break;
                                                                        case 'legend': product.panels.legenda.style.display = 'none';
                                                                                        break;
                                                                }
                                                                switch(chosenpanel)
                                                                {
                                                                        case 'routesraw': product.panels.routesraw.style.display = 'block';
                                                                                        break;
                                                                        case 'routes': product.panels.routes.style.display = 'block';
                                                                                        break;
                                                                        case 'accidents': 
																						if (!product.state.legendaccidentcreated) 
																						{
																							
																							//product.panels.accidents.appendChild(accidentselection.create("panelAccidentLegend",accidentselection.onSelect()));
																							//product.panels.accidents.appendChild(accidentselection.draw("panelAccidentLegend","accidentselection.onSelect()"));
																							
																							product.state.legendaccidentcreated = true;
																						}
																						product.panels.accidents.style.display = 'block';
																						break;
                                                                        case 'legend':
                                                                                        if (!product.state.legendcreated)
                                                                                        {
                                                                                                product.panels.legenda.appendChild(mygmap.createLegend());
                                                                                                product.state.legendcreated = true;
                                                                                        }
                                                                                        product.panels.legenda.style.display = 'block';
                                                                                        break;
                                                                }
                                                                //alert('old selection: '+menu.prevSelectedItem+"\n"+'new selection '+menu.selectedItem);
                                                        }
                                                        //, onbeforetabclose: function() { alert('tab wordt gesloten'); }
                                                        });
														
														
		var accidentstab = menu.createTab({   value:    	'accidents'
											, caption:      'Ongevallen'
											, access:		'classKnownUser'
											});

		product.panels.accidents = this.createpanel();
		product.panels.accidents.style.fontSize = '12px';
		this.container.appendChild(product.panels.accidents);
		accidentselection.create("panelAccidentLegend");
		product.panels.accidents.appendChild(accidentselection.draw("panelAccidentLegend"));

        if (sidebar.fillroutepanel)
        {
                var rawtab = menu.createTab({ value:         'routesraw'
											, caption:      'Losse routes'
											, onselect:     function() { sidebar.fillroutepanel(); }
											});

                product.panels.routesraw = this.createpanel();
                product.panels.routesraw.style.fontSize = '12px';
                this.container.appendChild(product.panels.routesraw);
				
        }
		
		

		
		// <NEW
		
		//if (accidentstab) {
			//product.panels.accidents.appendChild(mygmap.createAccidentLegend());
		//}
		
		// NEW>

        if (window.RouteCollectionSelector)
        {
                product.panels.routes  = this.createpanel();
                //product.panels.routes.style.fontSize = '12px';
                product.components.mapcollectionselector = new RouteCollectionSelector(product.panels.routes);
                __selector = product.components.mapcollectionselector; // REMOVE FIXME
                var routetab = menu.createTab({ value:          'routes'
												, caption:      'Routes'
												, onselect:     function()
																		{
																		}
												});
                //routetab.select();
        }

        //menu.createTab({ value:               'search'
        //                              , caption:      'Zoeken'
        //                              });

        var tab_legend =
                menu.createTab({ value:         'legend'
                                                , caption:      'Legenda'
                                                });
        product.panels.legenda = this.createpanel();
        tab_legend.select();


        //product.panels.videos   = this.createpanel();

        //product.panels.search   = this.createpanel();
        //searchwidget.panelcontainer     = product.panels.search;
        //searchwidget.resultscontainer   = document.body;
        //searchwidget.onitemselect       = function(itemid) { console.log('Item #'+itemid+' selected in the search panel.'); mygmap.onitemselect(itemid); }
        //searchwidget.togglepanel();


        if (window.RouteCollectionSelector)
                this.container.appendChild(product.panels.routes);

        this.container.appendChild(product.panels.legenda);
}
mapsidebar.prototype = sidebar.prototype;


function sidebar()
{
}

sidebar.prototype.show = function()
{
        this.container.style.display = "block";
}

sidebar.prototype.hide = function()
{
        this.container.style.display = "none";
}

sidebar.prototype.createpanel = function()
{
        var panel = document.createElement('div');
        panel.className = 'sidebarpanel';
        panel.style.overflow = 'auto';
        return panel;
}

sidebar.prototype.updatesize = function()
{
        if (!product.state.initialized)
                return;

        var vpsize = getViewPortDimensions();
        var mmpanel = document.getElementById('GMapPanels');

        var width = getrightsidewidth();
        var height = mmpanel.offsetHeight;
        if (height == 0) // ie fails to report the size if display: none;
        {
                ytop = 80;
        }
        else
        {
                width -= 8;
                ytop = height-6;
        }

        this.container.style.width = width + 'px';
//      this.container.style.height = (vpsize.height - mmpanel.offsetHeight + 6) + 'px';
        this.container.style.top = ytop + 'px';
        this.container.style.bottom = '0px';
}

// hack
function getrightsidewidth()
{
        var mmpanel = document.getElementById('GMapPanels');

        var width = mmpanel.offsetWidth;
		
        if (width == 0) // ie fails to report the size if display: none;
                width = 375;

        return width;
}



spcInfoPopup = function()
{
        this.wnd = product.openWindow(
                                                { name:                 'cityselection'
                                                , title:                'Kies een plaats'
                                                , className:    'mappopup pointpopup' //'frmSelectCity'
                                                , canclose:             false
                                                , candrag:              false
                                                //, content:            dummy
                                                , center:               false
                                                , visible:              false

                                                , preferredWidth:       300

                                                , anchoredge:   'topright'
                                                //, anchorishorcentre:  false
                                                //, anchorisvercentre:  true
                                                });
}
spcInfoPopup.prototype.hide = function()
{
        this.wnd.hide();
}
spcInfoPopup.prototype.show = function()
{
        this.wnd.show();
}
spcInfoPopup.prototype.position = function(anchorx, anchory)
{
        this.wnd.setPosition(anchorx, anchory);
}
spcInfoPopup.prototype.setAnchor = function(anchor)
{
        this.wnd.setAnchor(anchor);
}
spcInfoPopup.prototype.replaceDOMContent = function(domfragment)
{
        this.wnd.body.innerHTML = '';
        this.wnd.body.appendChild(domfragment);
}





productC.prototype.processMessages = function(messages)
{
	if (!messages) { console.log('processMessages: undefined'); return; }
	console.log('processMessages: ' + messages.type + ", " + messages.loggedin  + ", " + messages.name);
	
	 var reply = messages;
	 
/*
  for(var respcount = 0; respcount < messages.length; respcount++)
  {
                var reply = messages[respcount];
*/
					
				if (console.group) {
					console.group();
					//console.log('Message');
					console.log(reply);
					console.groupEnd();
				}

                switch(reply.type)
                {
                        case 'login':
                        {
                                if (reply.success)
                                {
//                                      product.accountname = reply.accountname;

                                        if (window.wndLogin && wndLogin.window != undefined)
                                                wndLogin.close();
                                }
                                else
                                {
                                        alert('Inloggen is niet gelukt.');
//                                      this.accountname = '';
                                }

                                product.userstate = reply;
                                product.updateloginstate();
                                break;
                        }

                        case 'logout':
                        {
//                              if (reply.success)
//                                      this.accountname = '';
//                              else
                                if (!reply.success)
                                        alert('failed to logout');

                                product.userstate = reply;
                                product.updateloginstate();
                                break;
                        }

                        case 'userstate':
                        {
                                product.userstate = reply;
                                //product.accountname = reply.accountname;
                                product.updateloginstate();
                                break;
                        }

                        default:
                        {
                                console.error('Unknown response from server ('+reply.type+')');
                        }
                }
  //}
}

productC.prototype.genericresponsehandler = function()
{
  var responses = parseResponse(this.req.responseText);
  product.processMessages(responses); // FIXME
}

productC.prototype.getuserstate = function()
{
		var self = this;

        if (!product.onwebserver)
                return;
				
			
		
/*
        ifrm_login.src = product.url.joomla_api + '?'
						+ getURLQueryString({ "class":			"joomla"
											, "method":			"getuserstate"
											, "session":    	product.session
											, "framecomm":  	true
											});
*/

        requestdoc({ url:				product.url.api			// product.url.joomla_api 
					, method:			'GET'
					, params:			{ "class":      'CMS'	// 'joomla' 
										 , "method":    'getuserstate'
										}
					, callback:         function() { 	var responses = parseResponse(this.req.responseText);
														product.processMessages(responses); }
														  
                    , callbackError:    function() {
											console.error('Failed to get userstate.');
										}
               });

}

productC.prototype.logout = function()
{	
		requestdoc(		
						{ url:               product.url.api+ '?class=CMS&method=logout' //'?class=joomla&method=login'
						, method:           'POST'
						, callback:         function() {  	
															console.log('logout.callback() called'); 
															var responses = parseResponse(this.req.responseText);
															product.processMessages(responses);
														}
						}
					);
}

function showPointGallery(itemID)
{
        //product.selectedPoint = itemID;
        var wndMedia = new mediawindow();

        var item = mapmeta.getItemById(itemID);

        //getDefined( mapmeta.getCurrentItemAttribute("name") , '-')
        wndMedia.window.setTitle( item.name );
        wndMedia.window.show();

        var panelright = document.getElementById('GMapPanels');

        if(wndMedia.fullscreen)
        {
                product.hideMainMenu();
                document.getElementById('GMapPanels').style.zIndex = '9000';
                wndMedia.window.header.style.right = (panelright.clientWidth+10)+'px'; //'300px';
        }
        wndMedia.gallery.show(
                                          //wndMedia.cont_beelden
                                          wndMedia.window.body
                                        , itemID
                                        , 1
                                        );

        var itemList = [];
        itemList[0] = mapmeta.getItemPosById(itemID); // drawPing uses array position, not pointid
        mygmap.drawPing( itemList );

        wndMedia.window.config.onclose = function()
        {
                mygmap.pulsePingStop();

                if(wndMedia.fullscreen)
                {
                        product.showMainMenu();
                        document.getElementById('GMapPanels').style.zIndex = '';
                }
        } // FIXME: hack
}

/********************************************************************************************/

curSec = newSection('map');
curSec.onSelect = function()
{
        product.createMapMenu();

        var testimg = document.getElementById('testimg');
        if (testimg)
                testimg.style.display = 'none';
};
curSec.onBeforeLeave = function()
{
};
curSec.onLeave = function()
{
};



curSec = newSection('mainmenu');
curSec.onSelect = function()
{
        if (window.mygmap && mygmap.gmap)
        {
                mygmap.gmap.getStreetView().setVisible(false);
        }

        product.gotoMap(product.config.cityselectmap);
        product.mainmenu = product.createMainMenu();

        //makeElementPassEvents(document.getElementById('verkeerMenuMap'));
        document.getElementById('GMapPanels').style.display = 'none';
        document.getElementById('intro_overlay').style.display = 'block';
        product.showSkinSelector(true);
        if (!product.citiessidebar)
        {
                product.citiessidebar = new mapselectionsidebar();
                product.citiessidebar.container.style.width = "280px"; // FIXME
        }

        product.citiessidebar.show();

        if (product.sidebar)
                product.sidebar.hide();

        //this.sidebar.hide();

        var testimg = document.getElementById('testimg');
        if (testimg)
                testimg.style.display = 'block';
}
curSec.onBeforeLeave = function()
{
        document.getElementById('GMapPanels').style.display = 'block';
        document.getElementById('intro_overlay').style.display = 'none';
        product.showSkinSelector(false);

        if (product.citiessidebar)
                product.citiessidebar.hide();

        if (!product.sidebar)
                product.sidebar = new mapsidebar();

        product.sidebar.show();

        //this.citiessidebar.hide();
        //this.sidebar.show();

//      var wndSelectCity = product.getWindowByName('cityselection');
//      if (wndSelectCity)
//              wndSelectCity.close();
}

/******************************************************************************
Skin selection
******************************************************************************/

productC.prototype.initSkinSelector = function()
{
        var self = this;

        skinmenu = new TabStrip({ btnclass:             ''
                                                        , btnclass_selected:  'tabActive'
                                                        });

        skinmenu.classInactiveTab = 'bigbutton';
        skinmenu.classActiveTab = 'bigbutton selected';

        // tabElement, caption, onselect, ondeselect, dontkeepfocus
        skinmenu.hookTab( document.getElementById('btnDesktop')
                                        , null
                                        , function() { self.loadSkin('normal'); }
                                        , null
                                        );

        skinmenu.hookTab( document.getElementById('btnDigitaalLesbord')
                                        , null
                                        , function() { self.loadSkin('lesbord'); }
                                        , null
                                        );

        skinmenu.selectTab(0);
}

productC.prototype.showSkinSelector = function(visible)
{
        if (visible)
                document.getElementById('lesbordkeuze').style.display = 'block';
        else
                document.getElementById('lesbordkeuze').style.display = 'none';
}

productC.prototype.loadSkin = function(name)
{
        switch(name)
        {
                case 'lesbord':
                        extrastyle = loadStyle('gfx/style/digitaal_schoolbord.css');
                        this.config.skin = 'lesbord';
                        break;

                case 'normal':
                        this.config.skin = 'normaal';
                        if (window.extrastyle)
                                        extrastyle.parentNode.removeChild(extrastyle);
                        break;
        }
}



/******************************************************************************

Misc simple dialogs

******************************************************************************/

productC.prototype.gotovizwebsite = function()
{
        window.location.href = "http://www.verkeer-in-zicht.nl";
}

productC.prototype.showcreditsdialog = function()
{
        // Als de credits dialoog al open is, breng deze naar voren
        var wnd = product.getWindowByName('credits')
        if (wnd)
        {
                wnd.toFront();
                return;
        }

        requestdoc(
                { url:          'content/dialog_productie.xml'
                , callback: function()
                                        {
                                                var wndCredits =
                                                        product.openWindow(
                                                                { name:         'credits'
                                                                , unique:       true
                                                                , title:     'Productie'
                                                                , className: 'frmCredits'
                                                                , canclose:  true
                                                                , onclose:
                                                                        function()
                                                                        {
                                                                                // menu.tabs[ menu.selectedItem ].deselect();
                                                                                //product.mainmenu.tabs[ 0 ].deselect();
                                                                                //product.closeWindow('credits');
                                                                        }
                                                                });

                                                wndCredits.body.innerHTML = this.req.responseText;
                                        }
                });
}

productC.prototype.openMeldingDialog = function()
{
        // Als de melding dialoog al open is, breng deze naar voren
        var wnd = product.getWindowByName('melding')
        if (wnd)
        {
                wnd.toFront();
                return;
        }

        var wndMelding = this.openInWindow(
                                { title: 'Melding'
                                , name: 'melding'
                                , className: ''
                                , url: 'http://spreadsheets.google.com/viewform?hl=nl&invite=CObU95UO&formkey=dGd4WG9rSE9UY3RzM1ZWellLUGVCWGc6MA'
                                });

        var viewport = getViewPortDimensions();
        wndMelding.setOuterSize(800,viewport.height);
        //wndMelding.setSize(800,600);
}

/******************************************************************************

Dialog 'Login'

******************************************************************************/

productC.prototype.showLoginDialog = function()
{
        if (window.wndLogin && wndLogin.window != undefined)
                return;
/*
        wndLogin = product.openInWindow({ title:        'Login'
                                                                        , url:          "content/dialog_login_joomla.html"
                                                                        , width:        500
                                                                        , height:       250
                                                                        });
*/
		requestdoc(
                { url:          'content/dialog_login.xml'
                , callback:     function()
                                {
                                        wndLogin = product.openWindow(
                                                { title:     'Login'
                                                , className: 'frmLogin'
                                                , canclose:  true
                                                , onclose:
                                                        function()
                                                        {
                                                                //ifrm_login.parentNode.removeChild(ifrm_login);
                                                                //product.mainmenu.deselect();
                                                                document.body.removeChild(greyout);
                                                                greyout = null;
																
                                                        }
                                                });

                                                wndLogin.body.innerHTML = this.req.responseText;
                                                //wndLogin.container.style.zIndex = 501;

                                                greyout = document.createElement('div');
                                                greyout.className = 'greyout';
                                                document.body.appendChild(greyout);
												
												product.unumber = Math.round(10000 * Math.random());
												
												var unumber =  document.getElementById('uNumber');
												if (unumber) {
													
													unumber.textContent = product.unumber;
												}	
												
												document.getElementById('uInstruction').selectedIndex = 5;
												var uname = document.getElementById('uName');
												if (uname) {
														uname.style.visibility=""; //|hidden|collapse
														//uname.focus();
												}
												
                                }
                });
}

function doLogin()
{
        try
        {
                var uname = document.getElementById('uName').value;
                var upass = document.getElementById('uPass').value;
				var upass2 = document.getElementById('uPass2').value;
				var unumber = document.getElementById('uUserNumber').value - document.getElementById('uNumber').textContent;
				
				
				

				/*
                ifrm_login.src = product.url.joomla_api + '?'
                                        + getURLQueryString({ "class":          "joomla"
                                                                                , "method":             "login"
                                                                                , "username":   uname
                                                                                , "password":   upass
                                                                                , "framecomm":  true
                                                                                });
				*/
                //function(event) { console.log(event); alert(event.origin); });

// window.frameElement (element this window is embedded in)
// window.parent (parent window or window of element the current window is embedded in)


// postMessage is supported by IE 8, Opera 9, Firefox 3, and Safari (4 or 5 ?)
//https://developer.mozilla.org/en/dom/window.postmessage
//window.parent.postMessage(jsonmessage, "*");

                requestdoc({ url:               product.url.api+ '?class=CMS&method=login' //'?class=joomla&method=login'
						, method:               'POST'
						, params:               { "uname": uname // uName
												, "upass": upass // uPass
												, "upass2": upass2 // uPass
												, "unumber": unumber
																}
						, callback:             function() {  	
																console.log('doLogin.callback() called'); 
																//try{
																		var loginReply = parseResponse(this.req.responseText);
																		console.log( 'doLogin.callback() loginReply.success = ' + loginReply.success);
																		console.log( 'doLogin.callback() loginReply.reason  = ' + loginReply.reason);
																		
																		console.log( 'doLogin.callback() loginReply.instruction  = ' + loginReply.instruction);
																		
																		var inputretype = document.getElementById('uPass2');
																		var labelretype = document.getElementById('uLabelPass2');
																		var labelnumber = document.getElementById('uLabelNumber');
																		var number = document.getElementById('uNumber');
																		var inputnumber = document.getElementById('uUserNumber');
																		
																		if (document.getElementById('uInstruction')) {
																			if (document.getElementById('uInstruction').selectedIndex=='') {
																				document.getElementById('uName').focus();
																				document.getElementById('uInstruction').selectedIndex = 5;
																			}

																			else if (loginReply.instruction == 1)  { document.getElementById('uName').focus();}
																			else if (loginReply.instruction == 2)  { labelretype.style.visibility=""; inputretype.style.visibility=""; inputretype.focus();}
																			else if (loginReply.instruction == 3)  { labelretype.style.visibility=""; inputretype.style.visibility=""; inputretype.focus();}
																			else if (loginReply.instruction == 4)  { number.style.visibility="";  labelnumber.style.visibility=""; inputnumber.style.visibility=""; inputnumber.focus();}
																			else if (loginReply.instruction == 5)  { document.getElementById('uName').focus();}
																			else if (loginReply.instruction == 6)  { document.getElementById('uPass').focus();}
																			else if (loginReply.instruction == 7)  { document.getElementById('uPass').focus();}
																			else if (loginReply.instruction == 8)  { inputnumber.style.visibility=""; document.getElementById('uUserNumber').focus();}
																			else { document.getElementById('uName').focus(); }
																		}

																		document.getElementById('uInstruction').selectedIndex = loginReply.instruction;
																		loginReply.instruction = document.getElementById('uInstruction').value;

																		if (loginReply.success) {
																			wndLogin.close();
																			product.processMessages(loginReply);
																			if (loginReply.complete) {
																				if (loginReply.complete==0) {
																					product.showUserDataDialog();
																				}
																			}
																		}

																		if (loginReply.retyperequest) {
																		
																			console.log( 'doLogin.callback() loginReply.retyperequest  = ' + loginReply.retyperequest);
																			
																			if (labelretype) {
																				labelretype.style.visibility=""; //|hidden|collapse
																			}
																			if (inputretype) {
																				inputretype.style.visibility=""; //|hidden|collapse		
																			}
																			if (inputnumber) {
																				inputnumber.style.visibility=""; //|hidden|collapse	
																			}
																			if (labelnumber) {
																				labelnumber.style.visibility=""; //|hidden|collapse
																				
																			}
																			if (number) {
																				number.style.visibility=""; //|hidden|collapse
																				number.innerHTML = product.unumber;
																				//number.textContent = product.unumber;
																			}	
																		}
																		else {
																		
																			if (inputretype) {
																				inputretype.style.visibility="hidden"; //|hidden|collapse
																				inputretype.value = "";
																			}
																			if (labelretype) {
																				labelretype.style.visibility="hidden"; //|hidden|collapse
																			}
																			if (inputnumber) {
																				inputnumber.style.visibility="hidden"; //|hidden|collapse
																				inputnumber.value = "";
																			}
																			if (labelnumber) {
																				labelnumber.style.visibility="hidden"; //|hidden|collapse
																			}
																			if (number) {
																				number.style.visibility="hidden"; //|hidden|collapse
																			}
																		}
																		if (inputretype) {
																			
																			if (loginReply.instruction == 2) inputretype.focus();
																			if (loginReply.instruction == 3) inputretype.focus();
																		}
																		if (inputnumber) {
																			
																			if (loginReply.instruction == 8) inputnumber.focus();
																		}
																		
																//} catch(e)
																//{
																//		console.error('Invalid JSON received for doLogin.');
																//		return;
																//}	
															}	//	product.genericresponsehandler
						, callbackError:        function()
												{
														alert('error loggin in');
												}
						}
                 );
                
        }
		catch (e) {
		
			alert('Login procedure failed.');
			wndLogin.close();
            return false; // cancel submit
		}
        finally
        {
            return false; // cancel submit
        }
		
}


productC.prototype.showUserDataDialog = function()
{
	var self = this;

        if (window.wndLogin && wndLogin.window != undefined)
                return;
/*
        wndLogin = product.openInWindow({ title:        'Login'
                                                                        , url:          "content/dialog_login_joomla.html"
                                                                        , width:        500
                                                                        , height:       250
                                                                        });
*/
		requestdoc(
                { url:          'content/dialog_user_data.xml'
                , callback:     function()
                                {
                                        wndLogin = product.openWindow(
                                                { title:     'Mijn gegevens'
                                                , className: 'frmUserData'
												, width:		700
												, height:		450
                                                , canclose:  true
                                                , onclose:
                                                        function()
                                                        {
                                                                //ifrm_login.parentNode.removeChild(ifrm_login);
                                                                //product.mainmenu.deselect();
                                                                document.body.removeChild(greyout);
                                                                greyout = null;
                                                        }
                                                });

										wndLogin.body.innerHTML = this.req.responseText;
										//wndLogin.container.style.zIndex = 501;

										greyout = document.createElement('div');
										greyout.className = 'greyout';
										document.body.appendChild(greyout);
												
										var database = new spcDatabase();
										var query = 'SELECT * FROM col_users WHERE ID=' + product.userstate.ID; // FIXME dbprefix !
										database.fetchQuery(query,function(queryResult) {self.onQueryDone(queryResult);});
										
																								
                                }
                });
}

productC.prototype.onQueryDone = function(queryResult)
{
	var self = this;
	
	console.log('Called productC.onQueryDone() ');
	
	if (console.group) {
		console.group();
		console.log(queryResult);
		console.groupEnd();
	}
	
	var proc = new spcObject();
	proc.foreachObject({ data:		queryResult
						,callback:	function(key,value) { self.queryResultToForm(key , value); }
						});	
}

productC.prototype.queryResultToForm = function(key,value)
{
	var obj = document.getElementById(key);
	if (obj) {
		obj.value = value;
	}
}

function SubmitC()
{
	var dummy;
}

SubmitC.prototype.onkeyup = function(self,event,handler)
{
	
	//alert('productC.prototype.onkeyup()');
	
	console.log('SubmitC.prototype.onkeyup');
	var database = new spcDatabase();
	if (database.formValidate(self)) {
		window.wndLogin.close();
		product.getuserstate();
	}
}

SubmitC.prototype.onclick = function(self,event,handler)
{
	
	//alert('productC.prototype.onclick()');
	
	console.log('SubmitC.prototype.onclick');
	var database = new spcDatabase();
	if (database.formValidate(self)) {
		window.wndLogin.close();
		product.getuserstate();
	}
}

cmdSubmit = new SubmitC();

/******************************************************************************

Dialog 'Lesbrief'

******************************************************************************/

productC.prototype.showLesbrief = function()
{
        // Als de lesbrief dialoog al open is, breng deze naar voren
        var wnd = product.getWindowByName('lesbrief')
        if (wnd)
        {
                wnd.toFront();
                return;
        }

        if (window.wndMedia)
                wndMedia.close();

        var self = this;

        requestdoc(
                { url:          'content/dialog_lesbrief.html'
                , callback:     function() { self.createLesbriefContent(this.req.responseText); }
                });
};

productC.prototype.createLesbriefContent = function(responsetext)
{
        //var lesbriefhtml = this.req.responseText;
        var lesbriefhtml = responsetext;

        getQuestionCollection(
                function() {
                        wndLesbrief = product.openWindow(
                                                                                { name:                 'lesbrief'
                                                                                , title:                'Opdrachten'
                                                                                , className:    'wndLesbrief'
                                                                                , canclose:             true
                                                                                , onclose:
                                                                                        function()
                                                                                        {
                                                                                                //menu.tabs[ menu.selectedItem ].deselect();
                                                                                        }
                                                                                });

                        wndLesbrief.body.innerHTML = lesbriefhtml;

                        var vreeksen = document.getElementById('vragenreeksen');

                        /*
                        <div class="reeks">
                                <div class="titel" onClick="selectAsnGroup(1);">Route naar school (omgeving)</div>
                                <div class="description">Hoe veilig is de route naar jouw school?</div>
                        </div>
                        */
                        var fragcollections = document.createDocumentFragment();
                        for(var cindex=0; cindex < questioncollections.length; cindex++)
                        {
                                var coll = questioncollections[cindex];

                                fragcollections.appendChild(getSelectionItem(
                                                                                                          coll.title
                                                                                                        , coll.description
                                                                                                        , coll.id
                                                                                                        , function() { RunQuestionGroupFromRequest(this.itemid); }
                                                                                                        , "reeks"
                                                                                                        ));
                        }

                        vreeksen.appendChild(fragcollections);
                });
}

function getSelectionItem(title, description, itemid, onclick, cssclass)
{
        var itemcontainer = document.createElement('div');
        itemcontainer.className = cssclass;

        var ititle = document.createElement('div');
        ititle.className = 'title';
        ititle.onclick = onclick;
        ititle.itemid = itemid;
        ititle.innerHTML = title;

        if (description != null)
        {
          var idesc = document.createElement('div');
          idesc.className = 'description';
          idesc.innerHTML = description;
        }

        itemcontainer.appendChild(ititle);
        itemcontainer.appendChild(idesc);
        return itemcontainer;
}

/******************************************************************************

Questionair dialogs

******************************************************************************/

function getQuestionCollection(callback)
{
  internalGetQuestionCollection({ url:                  product.url.api
								, settings:             { "class":    'questionair'
														, method:     'getcollections'
														}
								, callback:             callback
								});
}

function internalGetQuestionCollection(settings)
{
        requestdoc({ url:                               settings.url
                                , method:                       'GET'
                                , params:           settings.settings
                                , callback:                     function()
                                        {
                                                console.log('Loaded list of question collections.');

                                                //showdump(this.req.responseText);

                                                try{
                                                        questioncollections = parseResponse(this.req.responseText);
                                                } catch(e)
                                                {
                                                        console.error('Invalid JSON recieved for question collections.');
                                                        return;
                                                }

                                                settings.callback();
                                        }
                                , callbackError:        function()
                                        {
                                                console.error('Failed to load question collections.');
                                        }
                        });
}

function RunBordenQuestions()
{
        var tagids = [];
        tagids.push(20);

        var pointids = [];

        RunQuestionsWith(tagids,pointids);
}

function RunQuestionGroupFromRequest(groupname)
{
  LoadAndStartQuestions(product.url.api,
        { "class":    'questionair'
        , method:     'getquestionsbycollection'
        , collection: groupname
        });
}

function RunQuestionsWith(tagids, pointids)
{
  LoadAndStartQuestions(product.url.api,
        { "class":    'questionair'
        , method:     'getquestionsbycriteria'
        , tags:       tagids.join(',')
        , points:     pointids.join(',')
        //, collection: groupname
        });
}

function LoadAndStartQuestions(url, settings)
{
        requestdoc({ url:                               url
                                , method:                       'GET'
                                , params:           settings
                                , callback:                     function()
                                        {
                                                questions = parseResponse(this.req.responseText).questions;
                                                StartQuestionGroup();
                                        }
                                , callbackError:        function()
                                        {
                                                console.error('Failed to load test questions.');
                                        }
                                }
                        );
}

function StartQuestionGroup()
{
        var wndQuestionair =
                product.openWindow(
                        { name:      'questionair'
                        , unique:    true
                        , title:     'Opdrachten'
                        , className: 'wndQuestionair'
                        , canclose:  true
                        , width:     900
                        });

        //wndLesbrief.body.innerHTML = '';
        wndQuestionair.questionair = new questionair(questions, wndQuestionair.body);
        wndQuestionair.questionair.showQuestion(0);
}

/******************************************************************************

Dialog 'Verkeersborden'

******************************************************************************/

productC.prototype.showTrafficSignsQ = function()
{
        if (product.bordenVisible)
                return;

        product.bordenVisible = true;

        wndBorden = product.openWindow(
                { title:                'Borden'
                , className:    'frmBorden'
                , canclose:             true
                , onclose:              function()
                                                {
                                                        product.bordenVisible = false;
                                                        product.createMainMenu();
                                                }
                });

        ifrm = document.createElement('iframe');
        if (useragent.isIE)
        {
                ifrm.allowTransparency = 'true'; // so IE won't force #FFFFFF as default background color
                ifrm.frameBorder = '0';          // IE has an extra border within the iFrame which also needs to be disabled
        }

        wndBorden.body.appendChild(ifrm);

        wndBorden.ifrm = ifrm;


        product.createBordenMenu();
        product.mainmenu.selectTab(1);
}

/******************************************************************************

Dialog support functions

******************************************************************************/

productC.prototype.openInWindow = function(settings)
{
        // TODO: setting 'stretchtofit'
        // TODO: setting 'useframetitle'
        var wndWithSite =
                product.openWindow(
                        { name:      settings.name ? settings.name : 'iframewindow'
                        , unique:    false
                        , title:     settings.title
                    , className: settings.className
                        , canclose:  true
                        , width:     settings.width  ? settings.width  : 950
                        , height:    settings.height ? settings.height : 550
                        });

        wndWithSite.body.style.padding = '0';




        if (settings.embedcontent) // embed into windiw instead of using an iframe
        {
                requestdoc(
                                { url:          'content/dialog_login.xml'
                                , callback:     function()
                                                {
                                                        wndWithSite.body.innerHTML = this.req.responseText;

                                                        //greyout = document.createElement('div');
                                                        //greyout.className = 'greyout';
                                                        //document.body.appendChild(greyout);
                                                }
                                });
        }
        else
        {
                var ifrm = document.createElement('iframe');
                ifrm.setAttribute('allowTransparency','true');
                ifrm.style.cssText = 'border: 0; width: 100%; height: 100%;';
                ifrm.src = settings.url;
                ifrm.frameBorder = 0; // needed for IE
                wndWithSite.body.appendChild(ifrm);
        }

        return wndWithSite;
}

/******************************************************************************

Misc UI functions

******************************************************************************/

productC.prototype.setOrientation = function(orientation)
{
        switch(orientation)
        {
                case 'left':    addClass(document.body, 'layoutLeft');
                                                removeClass(document.body, 'layoutRight');
                                                document.getElementById('GMapPanels').className='mapPanels mapPanelsLeft';
                                                document.getElementById('verkeerMenu').className='showatright';
                                                document.getElementById('verkeerMenuPaal').className='showatright';
                                                break;

                case 'right':   addClass(document.body, 'layoutRight');
                                                removeClass(document.body, 'layoutLeft');
                                                document.getElementById('GMapPanels').className='mapPanels mapPanelsRight';
                                                document.getElementById('verkeerMenu').className='showatleft';
                                                document.getElementById('verkeerMenuPaal').className='showatleft';
                                                break;
        }
        document.getElementById('GMapPanels').style.display = 'block';
}

productC.prototype.hideMainMenu = function()
{
        document.getElementById('verkeerMenu').style.display = 'none';
        document.getElementById('verkeerMenuPaal').style.display = 'none';
        this.hideAppTitleBar();
}

productC.prototype.showMainMenu = function()
{
        document.getElementById('verkeerMenu').style.display = 'block';
        document.getElementById('verkeerMenuPaal').style.display = 'block';
        this.showAppTitleBar();
}

productC.prototype.hideAppTitleBar = function()
{
        document.getElementById('header').style.display = 'none';
        document.getElementById('mainmenubar').style.display = 'none';
}

productC.prototype.showAppTitleBar = function()
{
        document.getElementById('header').style.display = 'block';
        document.getElementById('mainmenubar').style.display = 'block';
}

productC.prototype.resizeHeaderBar = function()
{
	// resize mainmenu/menubar to take space not used by the minimap
	var header = document.getElementById('header');
	var mainmenubar = document.getElementById('mainmenubar');

	var panels = document.getElementById('GMapPanels');
	var panelwidth = panels.clientWidth;
	header.style.right = (panelwidth-9)+'px';
	mainmenubar.style.right = (panelwidth-9)+'px';

	if (product.panels.search)
	{
			var width = getrightsidewidth();
			product.panels.search.style.right = (width+20)+'px';//"320px";
	}
}

productC.prototype.showbrowserwarning = function()
{
	if (useragent.isIE && useragent.versionIE < 7)
	{
		var info = document.createElement('div');
		info.className = 'warning';

		var txt;
		if (useragent.versionIE == 6)
				txt = "Uw versie van Internet Explorer (versie 6 uit 2001) wordt niet ondersteund.";
		else
				txt = "Uw versie van Internet Explorer wordt niet ondersteund.";

		info.innerHTML = txt;
		document.body.appendChild(info);
	}
}

productC.prototype.updateloginstate = function()
{
	var elem_loggedin = document.getElementById('loggedin');
	var elem_mnusysop = document.getElementById('mnu_sysop');
	var elem_mnudebug1 = document.getElementById('mnu_debug');
	var elem_mnudebug2 = document.getElementById('mnu_debug2');
	
	var menulogin = document.getElementById("menulogin");
	var menulogout = document.getElementById("menulogout");
	var menuuserdata = document.getElementById("menuuserdata");
	
	var vizTabItem = document.getElementById("vizTabItem00");
	

	//alert('updateloginstate: ',this.userstate.accountname);
	
	//innerText
	if (this.userstate.loggedin==1)
	{		/*
			if (menulogin.classList) {
			menulogin.classList.add('disabled');
			menuuserdata.classList.remove('disabled');
			menulogout.classList.remove('disabled');
			}
			*/
			//if (vizTabItem)
			//vizTabItem.src = 'gfx/menu/text/logout.png';
			
			// set access levels by selecting correct style sheet
			objAccess.resetSheets(objAccess.firstAccessSheet+1);
			objAccess.setSheets(objAccess.firstAccessSheet+2);
			objAccess.resetSheets(objAccess.firstAccessSheet+3);
			
			if (menulogin)
					menulogin.style.display = 'none';
			if (menuuserdata)
					menuuserdata.style.display = '';
			if (menulogout)
					menulogout.style.display = '';		
					
			
	//      alert(typeof elem_loggedin.textContent);
			if (elem_loggedin.textContent) elem_loggedin.textContent = 'Ingelogd als '+this.userstate.name;
			if (elem_loggedin.innerHTML) elem_loggedin.innerHTML = 'Ingelogd als '+this.userstate.name;

			if (elem_mnusysop)
					elem_mnusysop.style.display = '';

			if (elem_mnudebug1)
					elem_mnudebug1.style.display = '';
			if (elem_mnudebug2)
					elem_mnudebug2.style.display = '';
	}
	else
	{
			//if (vizTabItem)
			//vizTabItem.src = 'gfx/menu/text/login.png';
	
			// set access levels by selecting correct style sheet
			objAccess.setSheets(objAccess.firstAccessSheet+1);
			objAccess.resetSheets(objAccess.firstAccessSheet+2);
			objAccess.resetSheets(objAccess.firstAccessSheet+3);
	
			if (elem_loggedin.textContent) elem_loggedin.textContent = 'Niet ingelogd';
			if (elem_loggedin.innerHTML) elem_loggedin.innerHTML = 'Niet ingelogd';
			
			/*
			if (menulogin.classList) {
			menulogin.classList.remove('disabled');
			menuuserdata.classList.add('disabled');
			menulogout.classList.add('disabled');
			}
			*/
			if (menulogin)
					menulogin.style.display = '';
			if (menuuserdata)
					menuuserdata.style.display = 'none';
			if (menulogout)
					menulogout.style.display = 'none';	

			if (elem_mnusysop)
					elem_mnusysop.style.display = 'none';

			if (elem_mnudebug1)
					elem_mnudebug1.style.display = 'none';
			if (elem_mnudebug2)
					elem_mnudebug2.style.display = 'none';
	}
}

product.windowResize = function()
{
}