<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>

<title>Pane External Content Test</title>

<script type="text/javascript" src="../../dojo.js"></script>
<script language="JavaScript" type="text/javascript">
	dojo.require("dojo.event.*");
	dojo.require("dojo.widget.LayoutContainer");
	dojo.require("dojo.widget.LinkPane");
	dojo.require("dojo.widget.ContentPane");
	dojo.require("dojo.widget.Tree");
	dojo.require("dojo.widget.TreeSelector");
	dojo.require("dojo.widget.FloatingPane");
	dojo.require("dojo.widget.Dialog");
</script>

<script>
	function DisplayTreeContent(){
	    this.update = function(message) {
	        var clickedTreeNode = message.node;

			var docPane = dojo.widget.byId("docpane");
			var file = clickedTreeNode.object;
			if (!file){
				docPane.setContent("Try clicking doc0, doc1 or doc2 instead...");
			}else{
				docPane.setUrl(file);
			}
	    };
	}

	var displayer = new DisplayTreeContent();

	var nodeSelectionTopic = dojo.event.topic.getTopic("nodeSelected");
	nodeSelectionTopic.subscribe(displayer, "update");

	// display custom loadError or use built in
	// works best from live server instead of filesystem
	function contentLoadError(e){
		var chkbox = dojo.byId("defaultLoadError");
		if(chkbox && chkbox.checked){
			// use built in
			return;
		}
		e.preventDefault(); // or e.returnValue = false;
		var pane = dojo.widget.byId('docpane')
		pane.setContent("Custom Loaderror goes here<br/><img src='images/x.gif' style='float:left;'/> file not found");
		dialogHandler();// turn off loading dialog
	}

	// display custom Error(Content java/javascript eval error) or use built in method
	function contentExecError(e){
		var chkbox = dojo.byId("defaultEvalError");
		if(chkbox && chkbox.checked){
			// use built in
			return;
		}
		e.preventDefault();
		alert('Oops! error occured:'+arguments[0]);
	}

	// display loading dialog or use built in "Loading..." message
	function contentDownloadStart(e){
		var chkbox = dojo.byId("defaultLoadInfo");
		if(chkbox && chkbox.checked){
			// use built in
			return;
		}
		dialogHandler(e, true);
	}

	// show / hide loading dialog
	function dialogHandler(e, show){
		var dialog = dojo.widget.byId("statusDialog");
		if(show){
			e.preventDefault();
			dialog.show();
			return;
		}
		dialog.hide();
	}
</script>
<style>
html, body {
	height: 100%;
	width: 100%;
	overflow: hidden;
}
#main {
	height: 95%;
	width: 95%;
	left: 2%;
	top: 2%;
	position: relative;
}

.dojoDialog {
	background : white;
	border : 1px solid #999;
	-moz-border-radius : 5px;
	padding : 4px;
	text-align: center;
}

</style>
</head>
<body>
<div dojoType="LayoutContainer" id="main" layoutChildPriority='left-right'>
	<div dojoType="LinkPane" layoutAlign="left" style="width: 200px; background-color: #acb386;"
		href="tree.html"></div>
	<div dojoType="ContentPane" layoutAlign="client" style="background-color: #f5ffbf; padding: 10px;"
		id="docpane" executeScripts="true">
		This is the initial content of the pane (inlined in the HTML file), but
		it will be overriden when you click "doc0" or "doc1" or "doc2" in the tree on the left (underneath "Item 1")
	</div>
</div>
</body>
</html>