HD.WidgetView = function (config) {
	this.config = config;
	this.observers = [];
	
	this.navigationEl = HD.get(this.config.navigation);
	this.canvasEl = HD.get(this.config.canvas);
};

HD.WidgetView.prototype = {
	/**
	*	@param div The div to set visible, all other siblings are hidden
	*	@param backText The text to show in the back button
	*	@param callback The function to execute when back button is pressed
	*/
	showDiv : function(div, text, callback) {
		this.setActiveDiv(HD.get(div));
		this.setupNav(text, callback);
	},
	
	setActiveDiv : function(divToShow) {
//		HD.util.Common.printStackTrace();
		var wrapperDiv = this.canvasEl;
		if(wrapperDiv.hasChildNodes()) {
			var childNodes = wrapperDiv.childNodes;
			for(var i = 0, len = childNodes.length; i < len; i++) {
				var childNode = childNodes[i];
				// do this ID test because some of the nodes are text nodes
				// and don't support setting class names
				if(childNode.id != null) {
					HD.hide(childNode);
				}
			}
		}
		
		HD.show(divToShow);
	},
	
	setupNav : function(text, callback) {
		var classes = HD.CSS_CLASSES;
		// show back button
		HD.addClass(this.navigationEl, classes.CONTROL);
		this.setNavText(text);
		
		if(callback != null) {
			HD.addClass(this.navigationEl, classes.CONTROL);
			this.navigationEl.onclick = callback;
		} else {
			HD.removeClass(this.navigationEl, classes.CONTROL);
		}
		
		/*
		var cb = this;
		navigationEl.onclick = function() {
			HD.removeClass(navigationEl, classes.CONTROL);
			cb.revertNavText.call(cb);
			cb.setActiveDiv.call(cb, cb.canvasDiv, backDiv);
		};
		*/
	},
	
	revertNavText : function() {
		this.navigationEl.innerHTML = this.previousNavHTML;
	},
	
	setNavText : function(text) {
		this.previousNavHTML = this.navigationEl.innerHTML;
		this.navigationEl.innerHTML = text;
	}
};

HD.extend(HD.WidgetView, [HD.util.Observable]);

HD.register('hd_widget_view', HD.WidgetView, {version: "1.0", build: "1"});