var MainContent = Class.create();

MainContent.prototype = {

	initialize: function() {
		this.pane = new Pane('mainContent');
		this.mapHTML = "";
	},


	load: function() {
		//TODOmainShowMap();
		//mainShowMap();
		this.pane.currentPane = 'front';
		this.pane.currentPage = 'map';
		this.saveMapHTML(this.pane.currentHTML());
	},

	refreshCurrentPage: function() {		
		this.loadPage(this.pane.currentPage);
	},
	
	loadPage: function(page) {
		if       (page == 'about')  this.loadAbout();
		else if  (page == 'map')    this.loadMap();
		else if  (page == 'help')   this.loadHelp();
		else                        this.loadDummy(page);
	},

	title: function(s) {
		return '<h1>' + s + '</h1>';
	},

	subtitle: function(s) {
		return '<div class="vague">' + s + '</div>';
	},

	doAjax: function(url,tag) {
		var reqURL = fullPath(url) +
		"";
		function f(res) {
			$(tag).innerHTML = res;
		}
		ajax(reqURL, { f: f, html: true, fType: "text", counter: tag });
	},

	loadSimplePage: function(page, title, subtitle, url) {
		var tag = page + '_content';
		var w= MAP_WIDTH-20;
		var h= MAP_HEIGHT-70;
		var html = '';
		html += this.title('About');
		html += this.subtitle('A brief intro to the projct');
		html += theCommon.aboutContent();
		this.showContent(page,html);
	},

	loadAbout: function() {
		this.loadSimplePage('about', 'About', 'A brief intro to the proect', 'changes.php');
	},

	loadHelp: function() {
		var page = 'help';
		var html = '';
		html += this.title('Help');
		html += this.subtitle('Our extensive help department');
		html += theCommon.helpContent();
		this.showContent(page,html);
	},
	 
	loadDummy: function(_page) {
		var page = 'dummy';

		var html = "no <em>" + _page + "</em> for you!";
		this.showContent(page,html);
	},

	loadMap: function() {
		var page = 'map';
		
		kmapsMain();
		this.load();
		this.refreshCurrentPage();
		theNavleft.load();
	},

	showContent: function(page,html) {
		if (page == 'map') {
			
		} else {
			html = '<div style="padding: 10px">' + html + '</div>';
		}
		//
		// save the map HTML
		//
		if (this.pane.currentPage == 'map') {
			this.saveMapHTML(this.pane.currentHTML());
		}
		this.pane.showContent(page,html);
	},

	saveMapHTML: function(html) {
		//$(this.pane.pane('map')).innerHTML = html;
		this.mapHTML = html;

	}
};

// singleton
theMainContent = new MainContent();