Start of support for using the UI

13 files changed, 1083 insertions, 1006 deletions

diff --git a/src/main/resources/conf/endpoint-loadContent.json b/src/main/resources/conf/endpoint-loadContent.json
new file mode 100644
index 0000000..c1a592c
--- /dev/null
+++ b/src/main/resources/conf/endpoint-loadContent.json
@@ -0,0 +1,5 @@
+{
+    "context" : "endpoint/loadContent/*",
+    "type" : "groovy",
+    "file" : "script/loadContent.groovy"
+}
\ No newline at end of file
diff --git a/src/main/resources/script/executeQuery.groovy b/src/main/resources/script/executeQuery.groovy
index f953c28..e865131 100644
--- a/src/main/resources/script/executeQuery.groovy
+++ b/src/main/resources/script/executeQuery.groovy
@@ -79,8 +79,9 @@ hostConnection.withTransaction {
     (Pattern.compile("(.*?)(?=(" + separator + "\\s*\\n)|\$)").matcher(content.sql)).each { statement ->
         if (statement[1].size()) {
 
-            sets.add([ RESULTS: [ COLUMNS: [], DATA: [] ] ])
+            sets.add([ RESULTS: [ COLUMNS: [], DATA: [] ], SUCCEEDED: false ])
             int currentSet = sets.size()-1
+            long startTime = (new Date()).toTimestamp().getTime();
 
             try {
                 hostConnection.eachRow(statement[1], { row ->
@@ -89,6 +90,10 @@ hostConnection.withTransaction {
                     int i = 0
                     def data = []
 
+                    sets[currentSet].SUCCEEDED = true
+                    sets[currentSet].EXECUTIONTIME = ((new Date()).toTimestamp().getTime() - startTime);
+
+
                     if (sets[currentSet].RESULTS.COLUMNS.size() == 0) {
                         for (i = 1; i <= columnCount; i++) {
                             sets[currentSet].RESULTS.COLUMNS.add(meta.getColumnName(i));
@@ -123,6 +128,9 @@ hostConnection.withTransaction {
         }
 
     }
+
+
+
     hostConnection.rollback();
 }
 
diff --git a/src/main/resources/script/loadContent.groovy b/src/main/resources/script/loadContent.groovy
new file mode 100644
index 0000000..091d9f5
--- /dev/null
+++ b/src/main/resources/script/loadContent.groovy
@@ -0,0 +1,33 @@
+def fragment_parts = request.resourceName.split("_")
+
+assert fragment_parts.size() > 1
+
+def schema_def = openidm.read("system/fiddles/schema_defs/" + fragment_parts[0] + "_" + fragment_parts[1])
+
+assert schema_def != null
+
+def response = [
+        "short_code": schema_def.short_code,
+        "ddl": schema_def.ddl,
+        "schema_statement_separator": schema_def.statement_separator
+    ]
+
+if (fragment_parts.size() > 2) {
+
+    def query = openidm.read("system/fiddles/queries/" + fragment_parts[0] + "_" + fragment_parts[1] + "_" + fragment_parts[2])
+    assert query != null
+
+    response["query_statement_separator"] = query.statement_separator
+    response["sql"] = query.sql
+    response["id"] = query.id
+
+    response["sets"] = openidm.action("endpoint/executeQuery", "query", [
+            "db_type_id": fragment_parts[0],
+            "schema_short_code": fragment_parts[1],
+            "sql": query.sql,
+            "statement_separator": query.statement_separator
+        ]).sets
+
+}
+
+response
\ No newline at end of file
diff --git a/src/main/resources/tools/fiddles/SearchScript.groovy b/src/main/resources/tools/fiddles/SearchScript.groovy
index e4bf8b1..1754753 100644
--- a/src/main/resources/tools/fiddles/SearchScript.groovy
+++ b/src/main/resources/tools/fiddles/SearchScript.groovy
@@ -69,7 +69,7 @@ def fieldMap = [
     ],
     "queries": [
         "__NAME__": "q.md5",
-        "__UID__": "(s.id || '_' || s.short_code || '_' || q.id)"
+        "__UID__": "(s.db_type_id || '_' || s.short_code || '_' || q.id)"
     ]
 ]
 
@@ -209,7 +209,10 @@ switch ( objectClass ) {
             d.simple_name
         FROM
             db_types d
-    """ + where, whereParams) {
+        ${where}
+        ORDER BY
+            d.full_name
+    """, whereParams) {
 
         result.add([
             __NAME__:it.full_name, 
diff --git a/src/main/resources/ui/sqlfiddle/www/index.html b/src/main/resources/ui/sqlfiddle/www/index.html
index e5a3596..0576df7 100644
--- a/src/main/resources/ui/sqlfiddle/www/index.html
+++ b/src/main/resources/ui/sqlfiddle/www/index.html
@@ -1,350 +1,350 @@
 <!doctype html>
 <head>
-	
-	<meta charset="utf-8">
-	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-	
-	<title>SQL Fiddle</title>
-	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<meta name="description" content="Application for testing and sharing SQL queries.">
-	<meta name="author" content="Jake Feasel">
-	
-	<meta property="og:title" content="SQL Fiddle | A tool for easy online testing and sharing of database problems and their solutions." />
-	<meta property="og:type" content="website" />
-	<meta property="og:url" content="http://sqlfiddle.com/" />
-	<meta property="og:image" content="http://sqlfiddle.com/images/fiddle_transparent.png" />
-	<meta property="og:site_name" content="SQL Fiddle" />
-	
-	<link rel="icon" href="favicon.ico?20120504" type="image/x-icon">
-	<link rel="shortcut icon" href="favicon.ico?20120504" type="image/x-icon">
-
-	<link href="stylesheets/codemirror.css" rel="stylesheet" type="text/css" />
-	<link href="stylesheets/qp.css" rel="stylesheet" type="text/css" />
-
-	<link rel="stylesheet/less" type="text/css" href="stylesheets/bootstrap-2.0.4/bootstrap.less">
-	<link rel="stylesheet/less" type="text/css" href="stylesheets/bootstrap-2.0.4/responsive.less">
-	<link rel="stylesheet/less" type="text/css" href="stylesheets/fiddle.less">
-	<script src="javascript/less-1.3.0.min.js" type="text/javascript"></script>
-
-	<link href="stylesheets/print.css" media="print" rel="stylesheet" type="text/css" />
+    
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    
+    <title>SQL Fiddle</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="Application for testing and sharing SQL queries.">
+    <meta name="author" content="Jake Feasel">
+    
+    <meta property="og:title" content="SQL Fiddle | A tool for easy online testing and sharing of database problems and their solutions." />
+    <meta property="og:type" content="website" />
+    <meta property="og:url" content="http://sqlfiddle.com/" />
+    <meta property="og:image" content="http://sqlfiddle.com/images/fiddle_transparent.png" />
+    <meta property="og:site_name" content="SQL Fiddle" />
+    
+    <link rel="icon" href="favicon.ico" type="image/x-icon">
+    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
+
+    <link href="stylesheets/codemirror.css" rel="stylesheet" type="text/css" />
+    <link href="stylesheets/qp.css" rel="stylesheet" type="text/css" />
+
+    <link rel="stylesheet/less" type="text/css" href="stylesheets/bootstrap-2.0.4/bootstrap.less">
+    <link rel="stylesheet/less" type="text/css" href="stylesheets/bootstrap-2.0.4/responsive.less">
+    <link rel="stylesheet/less" type="text/css" href="stylesheets/fiddle.less">
+    <script src="javascript/less-1.3.0.min.js" type="text/javascript"></script>
+
+    <link href="stylesheets/print.css" media="print" rel="stylesheet" type="text/css" />
 
 </head>
 <body>
 
-	<div class="navbar navbar-fixed-top">
-		<div class="navbar-inner">
-			<div class="container-fluid">
-				<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
-					<span class="icon-bar"></span>
-					<span class="icon-bar"></span>
-					<span class="icon-bar"></span>
-				</a>
-				<a class="brand" href="">SQL Fiddle<img src="images/fiddle_transparent_small.png" style="height: 20px;margin-top: -10px;"> </a>
-
-					<ul class="nav" id="db_type_label_collapsed">
-						<li class="">
-						<p class="navbar-text"></p>
-						</li>
-					</ul>
-
-				<div class="nav-collapse">
-					<ul class="nav">
-						<li class="dropdown" id="db_type_id">
-							<a class="dropdown-toggle" data-toggle="dropdown" href="#">
-								Loading... <b class="caret"></b>
-							</a>
-						</li>
-
-						<li class="divider-vertical"></li>
-
-						<li class="">
-							<a id="sample" href="#viewSample"><i class="icon-list-alt"></i>View Sample Fiddle</a>
-						</li>
-
-						<li class="">
-							<a id="clear" href="#clear"><i class="icon-refresh"></i>Clear</a>
-						</li>
-												
-						<li class="dropdown" id="userInfo">
-
-							<a href="#loginModal" data-toggle="modal"><i class="icon-user"></i>Login</a>
-
-<!--							<cfoutput>
-							<cfif !StructKeyExists(session, "user")>
-							#includePartial("/Users/_login")#
-							<cfelse>
-							#includePartial("/Users/_info")#
-							</cfif>
-							</cfoutput>
+    <div class="navbar navbar-fixed-top">
+        <div class="navbar-inner">
+            <div class="container-fluid">
+                <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
+                    <span class="icon-bar"></span>
+                    <span class="icon-bar"></span>
+                    <span class="icon-bar"></span>
+                </a>
+                <a class="brand" href="">SQL Fiddle<img src="images/fiddle_transparent_small.png" style="height: 20px;margin-top: -10px;"> </a>
+
+                    <ul class="nav" id="db_type_label_collapsed">
+                        <li class="">
+                        <p class="navbar-text"></p>
+                        </li>
+                    </ul>
+
+                <div class="nav-collapse">
+                    <ul class="nav">
+                        <li class="dropdown" id="db_type_id">
+                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
+                                Loading... <b class="caret"></b>
+                            </a>
+                        </li>
+
+                        <li class="divider-vertical"></li>
+
+                        <li class="">
+                            <a id="sample" href="#viewSample"><i class="icon-list-alt"></i>View Sample Fiddle</a>
+                        </li>
+
+                        <li class="">
+                            <a id="clear" href="#clear"><i class="icon-refresh"></i>Clear</a>
+                        </li>
+                                                
+                        <li class="dropdown" id="userInfo">
+
+                            <a href="#loginModal" data-toggle="modal"><i class="icon-user"></i>Login</a>
+
+<!--                            <cfoutput>
+                            <cfif !StructKeyExists(session, "user")>
+                            #includePartial("/Users/_login")#
+                            <cfelse>
+                            #includePartial("/Users/_info")#
+                            </cfif>
+                            </cfoutput>
 -->
-						</li>
-
-						<li>
-							<a href="#textToDDLModal" data-toggle="modal"><i class="icon-wrench"></i>Text to DDL</a>
-						</li>
-						
-					</ul>
-
-					<ul class="nav pull-right">
-						<li>
-
-							<form action="https://www.paypal.com/cgi-bin/webscr" method="post" id="paypal_donate" style="margin: 6px 0 0 0;">
-							<input type="hidden" name="cmd" value="_s-xclick">
-							<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----MIIHLwYJKoZIhvcNAQcEoIIHIDCCBxwCAQExggEwMIIBLAIBADCBlDCBjjELMAkGA1UEBhMCVVMxCzAJBgNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA1UECxQKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC5jb20CAQAwDQYJKoZIhvcNAQEBBQAEgYCfpi+DdEg8o5S0X0x7fkOnc3Tl4+GVgj9kUjN8wj0MzknyIJNHaUoQkvm2QeN8Vqf8MBEqUR9VsKbXx5rsm9TR7xNtgGLTzPkjzMqHTQJAnpQHXHAQZv+qkJ6Kk8oSg+h/VawWeRKPf8WmhG/RGetE4udEMye5EDAhG/u5XVlUJjELMAkGBSsOAwIaBQAwgawGCSqGSIb3DQEHATAUBggqhkiG9w0DBwQICkhAGQuINl2AgYhB7j1zxwGnl0/ZIUDD398PW/dMjkpzwKQYY75F3ENT9jJux0zuN8SU3uiBmyfLf8DiF4FAzgOWeqODKhl7BK6KEr+w9r04qTwW51UqQqc0PcfHDV9ihGpcmM6wAQlPRRDwmsT5aVxgeGCKF7VIqwLhf4TqBsfh/gglrc6iqrbggMrU7oWubabUoIIDhzCCA4MwggLsoAMCAQICAQAwDQYJKoZIhvcNAQEFBQAwgY4xCzAJBgNVBAYTAlVTMQswCQYDVQQIEwJDQTEWMBQGA1UEBxMNTW91bnRhaW4gVmlldzEUMBIGA1UEChMLUGF5UGFsIEluYy4xEzARBgNVBAsUCmxpdmVfY2VydHMxETAPBgNVBAMUCGxpdmVfYXBpMRwwGgYJKoZIhvcNAQkBFg1yZUBwYXlwYWwuY29tMB4XDTA0MDIxMzEwMTMxNVoXDTM1MDIxMzEwMTMxNVowgY4xCzAJBgNVBAYTAlVTMQswCQYDVQQIEwJDQTEWMBQGA1UEBxMNTW91bnRhaW4gVmlldzEUMBIGA1UEChMLUGF5UGFsIEluYy4xEzARBgNVBAsUCmxpdmVfY2VydHMxETAPBgNVBAMUCGxpdmVfYXBpMRwwGgYJKoZIhvcNAQkBFg1yZUBwYXlwYWwuY29tMIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDBR07d/ETMS1ycjtkpkvjXZe9k+6CieLuLsPumsJ7QC1odNz3sJiCbs2wC0nLE0uLGaEtXynIgRqIddYCHx88pb5HTXv4SZeuv0Rqq4+axW9PLAAATU8w04qqjaSXgbGLP3NmohqM6bV9kZZwZLR/klDaQGo1u9uDb9lr4Yn+rBQIDAQABo4HuMIHrMB0GA1UdDgQWBBSWn3y7xm8XvVk/UtcKG+wQ1mSUazCBuwYDVR0jBIGzMIGwgBSWn3y7xm8XvVk/UtcKG+wQ1mSUa6GBlKSBkTCBjjELMAkGA1UEBhMCVVMxCzAJBgNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA1UECxQKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC5jb22CAQAwDAYDVR0TBAUwAwEB/zANBgkqhkiG9w0BAQUFAAOBgQCBXzpWmoBa5e9fo6ujionW1hUhPkOBakTr3YCDjbYfvJEiv/2P+IobhOGJr85+XHhN0v4gUkEDI8r2/rNk1m0GA8HKddvTjyGw/XqXa+LSTlDYkqI8OwR8GEYj4efEtcRpRYBxV8KxAW93YDWzFGvruKnnLbDAF6VR5w/cCMn5hzGCAZowggGWAgEBMIGUMIGOMQswCQYDVQQGEwJVUzELMAkGA1UECBMCQ0ExFjAUBgNVBAcTDU1vdW50YWluIFZpZXcxFDASBgNVBAoTC1BheVBhbCBJbmMuMRMwEQYDVQQLFApsaXZlX2NlcnRzMREwDwYDVQQDFAhsaXZlX2FwaTEcMBoGCSqGSIb3DQEJARYNcmVAcGF5cGFsLmNvbQIBADAJBgUrDgMCGgUAoF0wGAYJKoZIhvcNAQkDMQsGCSqGSIb3DQEHATAcBgkqhkiG9w0BCQUxDxcNMTIwOTIxMDQyMDUyWjAjBgkqhkiG9w0BCQQxFgQU/t+Fkye3KTvt7onofZmqoiZOhaQwDQYJKoZIhvcNAQEBBQAEgYAhjx22VxpWl4NxCJ4o4eGlKmwm5iA5lAAkIUMw/yvZ3rX1iPpeGCNhWo++GkFyGWNQWiEIXutasYnwZDEal8lCPEYZJwrZppm85h0G5chsgrowjXXcLSNNlm8WYibZKk7qo/njQT3cA5NYiZ+uUw3eQIzYvqz9bMW6tj80nO5Qlw==-----END PKCS7-----
-							">
-							<input type="image" style="width:80px;height:24px;" src="images/btn_donate_SM.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
-							</form>
-
-						</li>
-						<li>
-							
-							<a href="http://flattr.com/thing/679503/SQL-Fiddle" target="_blank">
-							<img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a>
-							
-						</li>
-
-						<li class="optional">
-							<a href="about.html"><i class="icon-info-sign"></i>About</a>
-						</li>
+                        </li>
+
+                        <li>
+                            <a href="#textToDDLModal" data-toggle="modal"><i class="icon-wrench"></i>Text to DDL</a>
+                        </li>
+                        
+                    </ul>
+
+                    <ul class="nav pull-right">
+                        <li>
+
+                            <form action="https://www.paypal.com/cgi-bin/webscr" method="post" id="paypal_donate" style="margin: 6px 0 0 0;">
+                            <input type="hidden" name="cmd" value="_s-xclick">
+                            <input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----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-----END PKCS7-----
+                            ">
+                            <input type="image" style="width:80px;height:24px;" src="images/btn_donate_SM.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
+                            </form>
+
+                        </li>
+                        <li>
+                            
+                            <a href="http://flattr.com/thing/679503/SQL-Fiddle" target="_blank">
+                            <img src="http://api.flattr.com/button/flattr-badge-large.png" alt="Flattr this" title="Flattr this" border="0" /></a>
+                            
+                        </li>
+
+                        <li class="optional">
+                            <a href="about.html"><i class="icon-info-sign"></i>About</a>
+                        </li>
 
  
-					</ul>
-
-				</div>
-				
-				<ul class="nav pull-right" id="exit_fullscreen">
-					<li class="">
-					<a href="#"><span>Exit Fullscreen</span> <i class="icon-resize-small"></i></a>
-					</li>
-				</ul>
-				
-			</div>
-		</div>
-	</div>
-	<div class="container-fluid">
-		<div class="row-fluid">
-		
-			<div class="span12" id="content">
-
-				<div class="span12" id="schema-output">
-					<div class="span6 panel schema pull-left">
-						
-						<div class="helpTip alert alert-info alert-block">
-							<h4 class="alert-heading">Schema Panel</h4>
-							Use this panel to setup your database problem (CREATE TABLE, INSERT, and whatever other statements you need to prepare a representative sample of your real database). 
-							Use "Text to DDL" to quickly build your schema objects from text.
-						</div>
-
-								<form id="fiddleFormDDL" method="post" action="">
-									<textarea id="schema_ddl"></textarea>
-
-									<div id="browser"></div>
-
-									<div class="action_buttons ddl_actions">
-											
-										<a href="#" id="buildSchema" title="You can also press Ctrl-Enter while editing">
-										<label for="result-ddl" class="btn btn-primary">
-											Build Schema <i class="icon-download-alt icon-white"></i>
-										</label>
-										</a>
-	
-										<a href="#" id="schemaFullscreen" class="btn btn-info">
-											Edit Fullscreen <i class="icon-resize-full icon-white"></i>
-										</a>
-	
-										<a href="#" id="schemaBrowser" class="btn btn-info">
-											Browser <i class="icon-indent-left icon-white"></i>
-										</a>
-	<!--
-										<a href="#" id="schemaDiagram" class="btn btn-info">
-											Diagram <i class="icon-qrcode"></i>
-										</a>
-	-->									
-										<div class="btn-group terminator" id="schemaStmtTerminator" data-statement_separator=";">
-											<a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
-											[ ; ]
-											<span class="caret"></span>
-											</a>
-											<ul class="dropdown-menu nav">
-												<li class="nav-header">Query Terminator</li>
-												<li class="divider"></li>										
-												<li><a href=";">Semi-colon [ ; ]</a></li>
-												<li><a href="|">Pipe [ | ]</a></li>
-												<li><a href="/">Slash [ / ]</a></li>
-												<li><a href="//">Double-slash [ // ]</a></li>
-												<li><a href="GO">Keyword [ GO ]</a></li>
-											</ul>
-										</div>
-	
-	
-	
-									</div>
-									
-									<div class="action_buttons browser_actions">
-										<a href="#" id="ddlEdit" class="btn btn-info">
-											DDL Editor <i class="icon-pencil icon-white"></i>
-										</a>
-									</div>
-	
-
-
-								</form>
-
-					</div><!-- end ddl div -->
-					
-					
-					<div class="span6 panel sql pull-right needsReadySchema">
-						
-						
-						<div class="helpTip alert alert-info alert-block">
-							<h4 class="alert-heading">Query Panel</h4>
-							Use this panel to try to solve the problem with other SQL statements (SELECTs, etc...). 
-							Results will be displayed below. Share your queries by copying and pasting the URL that is generated after each run. 
-						</div>
-						
-						
-						<form id="fiddleFormSQL" method="post" action="" class="schema_ready">
-							<textarea id="sql"></textarea>
-
-							<div class="action_buttons">
-
-								<div class="btn-group" id="runQueryOptions">
-								
-										<a href="#" class="runQuery btn btn-primary" title="You can also press Ctrl-Enter while editing">Run SQL <i class="icon-play icon-white"></i></a>
-								
-									<button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
-										<span class="caret"></span>
-									</button>
-									<ul class="dropdown-menu">
-										<!-- dropdown menu links -->
-										<li><a href="#" id="tabular">Tabular Output</a></li>
-										<li><a href="#" id="plaintext">Plaintext Output</a></li>
-										<li><a href="#" id="markdown">Markdown Output</a></li>
-									</ul>
-
-								</div>
-
-								<a href="#" id="queryFullscreen" class="btn btn-info">
-									Edit Fullscreen <i class="icon-resize-full icon-white"></i>
-								</a>
-
-								<a href="#" id="queryPrettify" class="btn btn-info">
-									Format Code <i class="icon-filter icon-white"></i>
-								</a>
-
-								<div class="btn-group terminator" id="queryStmtTerminator" data-statement_separator=";">
-									<a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
-									[ ; ]
-									<span class="caret"></span>
-									</a>
-									<ul class="dropdown-menu nav">
-										<li class="nav-header">Query Terminator</li>
-										<li class="divider"></li>										
-										<li><a href=";">Semi-colon [ ; ]</a></li>
-										<li><a href="|">Pipe [ | ]</a></li>
-										<li><a href="/">Slash [ / ]</a></li>
-										<li><a href="//">Double-slash [ // ]</a></li>
-										<li><a href="GO">Keyword [ GO ]</a></li>
-									</ul>
-								</div>
-
-	
-							</div>
-
-						</form>
-					</div><!-- end sql div -->
-					
-				</div><!-- end schema-output -->
-				
-				<div class="span12 panel needsReadySchema" id="output">
-				</div> <!-- end output -->
-				
-			</div><!-- end content -->
-		</div><!-- end row-fluid -->
-		
-	</div><!-- end container-fluid -->
-
-	<div id="hosting">
-		<ul id="hostingPartners">
-			<li id="sqlsentry"><a href="http://www.sqlsentry.net/download-trial/landing/complete.asp?ad=201208-sqlfiddle" target="_new"><img src="images/sqlsentry/00.jpg" alt="SQL Sentry"></a></li>
-		</ul>
-	</div>
-
-	<div id="textToDDLModal" class="modal">
-		<div class="modal-header">
-			<a class="close" data-dismiss="modal">x</a>
-			<h3>Formatted Text Table to DDL</h3>
-		</div>
-	
-	  <div class="modal-body">
-			<label for="tableName">Table Name: </label><input type="text" id="tableName" value="Table1"><br>
-			<textarea id="raw" cols="40" rows="8" placeholder="Paste formatted text here. CSV, space-separated, pipe-delimited are all valid."></textarea>
-			<hr>
-			
-			<pre id="parseResults"></pre>
-	
-	</div>
-	<div class="modal-footer">
-		<div class="pull-left">
-			<i class="icon-info-sign"></i>
-			<a href="http://dygraphs.com/date-formats.html" target="_blank">Date problems?</a>
-			|
-			<a href="https://github.com/jakefeasel/DDLBuilder/blob/master/ddl_builder/qunit/fixture.html" target="_blank">Example Input</a>
-		</div>
-		<a href="#" id="appendDDL" class="btn btn-primary">Append to DDL</a>
-		<a href="#" id="parseDDL" class="btn">Test Parse</a>
-	</div>
-	
-	</div>
-
-	<div id="loginModal" class="modal">
-		<form action="index.cfm/Users/auth" method="post" class="form-horizontal">
-		<input type="hidden" name="hash" value="" id="hash">
-		<div class="modal-header">
-			<a class="close" data-dismiss="modal">x</a>
-			<h3>Login to SQL Fiddle</h3>
-		</div>
-		<div class="modal-body">
-			<div class="control-group">
-				<label class="control-label" for="openid_identifier">OpenID Identity: </label>
-				<div class="controls">
-					<input type="text" id="openid_identifier" name="openid_identity" value="" size="20" />
-				</div>
-			</div>	
-			
-			<div class="control-group">				
-				<label class="control-label" for="remember">Remember Me: </label>
-				<div class="controls">
-					<input type="checkbox" value="true" name="remember" id="remember">
-				</div>
-			</div>	
-		</div>
-	  
-		<div class="modal-footer">
-			<input class="btn btn-primary" type="submit" value="Login" />
-		</div>	
-	  
-		</form>
-	</div>	
-
-	<div id="myFiddlesModal" class="modal">
-		
-		<form action="index.cfm/Users/auth" method="post">
-		<div class="modal-header">
-			<a class="close" data-dismiss="modal">x</a>
-			<ul class="nav nav-tabs" id="myFiddlesTabs">
-				<li class="active"><a href="#fiddle_history" data-toggle="tab">Fiddle History</a></li>
-				<li><a href="#favorites" data-toggle="tab">Favorites <i class="icon-star"></i></a></li>
-			</ul>
-		</div>
-
-		<div class="modal-body tab-content">
-		</div>
-	  
-		</form>
-	</div>	
-
-	<script type="text/javascript" src="javascript/require.js" data-main="javascript/main"></script>
+                    </ul>
+
+                </div>
+                
+                <ul class="nav pull-right" id="exit_fullscreen">
+                    <li class="">
+                    <a href="#"><span>Exit Fullscreen</span> <i class="icon-resize-small"></i></a>
+                    </li>
+                </ul>
+                
+            </div>
+        </div>
+    </div>
+    <div class="container-fluid">
+        <div class="row-fluid">
+        
+            <div class="span12" id="content">
+
+                <div class="span12" id="schema-output">
+                    <div class="span6 panel schema pull-left">
+                        
+                        <div class="helpTip alert alert-info alert-block">
+                            <h4 class="alert-heading">Schema Panel</h4>
+                            Use this panel to setup your database problem (CREATE TABLE, INSERT, and whatever other statements you need to prepare a representative sample of your real database). 
+                            Use "Text to DDL" to quickly build your schema objects from text.
+                        </div>
+
+                                <form id="fiddleFormDDL" method="post" action="">
+                                    <textarea id="schema_ddl"></textarea>
+
+                                    <div id="browser"></div>
+
+                                    <div class="action_buttons ddl_actions">
+                                            
+                                        <a href="#" id="buildSchema" title="You can also press Ctrl-Enter while editing">
+                                        <label for="result-ddl" class="btn btn-primary">
+                                            Build Schema <i class="icon-download-alt icon-white"></i>
+                                        </label>
+                                        </a>
+    
+                                        <a href="#" id="schemaFullscreen" class="btn btn-info">
+                                            Edit Fullscreen <i class="icon-resize-full icon-white"></i>
+                                        </a>
+    
+                                        <a href="#" id="schemaBrowser" class="btn btn-info">
+                                            Browser <i class="icon-indent-left icon-white"></i>
+                                        </a>
+    <!--
+                                        <a href="#" id="schemaDiagram" class="btn btn-info">
+                                            Diagram <i class="icon-qrcode"></i>
+                                        </a>
+    -->                                 
+                                        <div class="btn-group terminator" id="schemaStmtTerminator" data-statement_separator=";">
+                                            <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
+                                            [ ; ]
+                                            <span class="caret"></span>
+                                            </a>
+                                            <ul class="dropdown-menu nav">
+                                                <li class="nav-header">Query Terminator</li>
+                                                <li class="divider"></li>                                       
+                                                <li><a href=";">Semi-colon [ ; ]</a></li>
+                                                <li><a href="|">Pipe [ | ]</a></li>
+                                                <li><a href="/">Slash [ / ]</a></li>
+                                                <li><a href="//">Double-slash [ // ]</a></li>
+                                                <li><a href="GO">Keyword [ GO ]</a></li>
+                                            </ul>
+                                        </div>
+    
+    
+    
+                                    </div>
+                                    
+                                    <div class="action_buttons browser_actions">
+                                        <a href="#" id="ddlEdit" class="btn btn-info">
+                                            DDL Editor <i class="icon-pencil icon-white"></i>
+                                        </a>
+                                    </div>
+    
+
+
+                                </form>
+
+                    </div><!-- end ddl div -->
+                    
+                    
+                    <div class="span6 panel sql pull-right needsReadySchema">
+                        
+                        
+                        <div class="helpTip alert alert-info alert-block">
+                            <h4 class="alert-heading">Query Panel</h4>
+                            Use this panel to try to solve the problem with other SQL statements (SELECTs, etc...). 
+                            Results will be displayed below. Share your queries by copying and pasting the URL that is generated after each run. 
+                        </div>
+                        
+                        
+                        <form id="fiddleFormSQL" method="post" action="" class="schema_ready">
+                            <textarea id="sql"></textarea>
+
+                            <div class="action_buttons">
+
+                                <div class="btn-group" id="runQueryOptions">
+                                
+                                        <a href="#" class="runQuery btn btn-primary" title="You can also press Ctrl-Enter while editing">Run SQL <i class="icon-play icon-white"></i></a>
+                                
+                                    <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+                                        <span class="caret"></span>
+                                    </button>
+                                    <ul class="dropdown-menu">
+                                        <!-- dropdown menu links -->
+                                        <li><a href="#" id="tabular">Tabular Output</a></li>
+                                        <li><a href="#" id="plaintext">Plaintext Output</a></li>
+                                        <li><a href="#" id="markdown">Markdown Output</a></li>
+                                    </ul>
+
+                                </div>
+
+                                <a href="#" id="queryFullscreen" class="btn btn-info">
+                                    Edit Fullscreen <i class="icon-resize-full icon-white"></i>
+                                </a>
+
+                                <a href="#" id="queryPrettify" class="btn btn-info">
+                                    Format Code <i class="icon-filter icon-white"></i>
+                                </a>
+
+                                <div class="btn-group terminator" id="queryStmtTerminator" data-statement_separator=";">
+                                    <a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
+                                    [ ; ]
+                                    <span class="caret"></span>
+                                    </a>
+                                    <ul class="dropdown-menu nav">
+                                        <li class="nav-header">Query Terminator</li>
+                                        <li class="divider"></li>                                       
+                                        <li><a href=";">Semi-colon [ ; ]</a></li>
+                                        <li><a href="|">Pipe [ | ]</a></li>
+                                        <li><a href="/">Slash [ / ]</a></li>
+                                        <li><a href="//">Double-slash [ // ]</a></li>
+                                        <li><a href="GO">Keyword [ GO ]</a></li>
+                                    </ul>
+                                </div>
+
+    
+                            </div>
+
+                        </form>
+                    </div><!-- end sql div -->
+                    
+                </div><!-- end schema-output -->
+                
+                <div class="span12 panel needsReadySchema" id="output">
+                </div> <!-- end output -->
+                
+            </div><!-- end content -->
+        </div><!-- end row-fluid -->
+        
+    </div><!-- end container-fluid -->
+
+    <div id="hosting">
+        <ul id="hostingPartners">
+            <li id="sqlsentry"><a href="http://www.sqlsentry.net/download-trial/landing/complete.asp?ad=201208-sqlfiddle" target="_new"><img src="images/sqlsentry/00.jpg" alt="SQL Sentry"></a></li>
+        </ul>
+    </div>
+
+    <div id="textToDDLModal" class="modal">
+        <div class="modal-header">
+            <a class="close" data-dismiss="modal">x</a>
+            <h3>Formatted Text Table to DDL</h3>
+        </div>
+    
+      <div class="modal-body">
+            <label for="tableName">Table Name: </label><input type="text" id="tableName" value="Table1"><br>
+            <textarea id="raw" cols="40" rows="8" placeholder="Paste formatted text here. CSV, space-separated, pipe-delimited are all valid."></textarea>
+            <hr>
+            
+            <pre id="parseResults"></pre>
+    
+    </div>
+    <div class="modal-footer">
+        <div class="pull-left">
+            <i class="icon-info-sign"></i>
+            <a href="http://dygraphs.com/date-formats.html" target="_blank">Date problems?</a>
+            |
+            <a href="https://github.com/jakefeasel/DDLBuilder/blob/master/ddl_builder/qunit/fixture.html" target="_blank">Example Input</a>
+        </div>
+        <a href="#" id="appendDDL" class="btn btn-primary">Append to DDL</a>
+        <a href="#" id="parseDDL" class="btn">Test Parse</a>
+    </div>
+    
+    </div>
+
+    <div id="loginModal" class="modal">
+        <form action="index.cfm/Users/auth" method="post" class="form-horizontal">
+        <input type="hidden" name="hash" value="" id="hash">
+        <div class="modal-header">
+            <a class="close" data-dismiss="modal">x</a>
+            <h3>Login to SQL Fiddle</h3>
+        </div>
+        <div class="modal-body">
+            <div class="control-group">
+                <label class="control-label" for="openid_identifier">OpenID Identity: </label>
+                <div class="controls">
+                    <input type="text" id="openid_identifier" name="openid_identity" value="" size="20" />
+                </div>
+            </div>  
+            
+            <div class="control-group">             
+                <label class="control-label" for="remember">Remember Me: </label>
+                <div class="controls">
+                    <input type="checkbox" value="true" name="remember" id="remember">
+                </div>
+            </div>  
+        </div>
+      
+        <div class="modal-footer">
+            <input class="btn btn-primary" type="submit" value="Login" />
+        </div>  
+      
+        </form>
+    </div>  
+
+    <div id="myFiddlesModal" class="modal">
+        
+        <form action="index.cfm/Users/auth" method="post">
+        <div class="modal-header">
+            <a class="close" data-dismiss="modal">x</a>
+            <ul class="nav nav-tabs" id="myFiddlesTabs">
+                <li class="active"><a href="#fiddle_history" data-toggle="tab">Fiddle History</a></li>
+                <li><a href="#favorites" data-toggle="tab">Favorites <i class="icon-star"></i></a></li>
+            </ul>
+        </div>
+
+        <div class="modal-body tab-content">
+        </div>
+      
+        </form>
+    </div>  
+
+    <script type="text/javascript" src="javascript/require.js" data-main="javascript/main"></script>
 
 <script type="text/javascript">
           var _gaq = _gaq || [];
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/app.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/app.js
index a16cae3..4750390 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/app.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/app.js
@@ -1,307 +1,312 @@
 // this is essentially the controller, as far as I can tell
 
 define([
-	'BrowserEngines/engines',
-	
-	'fiddle_backbone/models/UsedFiddle', 
-	'fiddle_backbone/models/MyFiddleHistory', 
-	'fiddle_backbone/models/DBTypesList', 
-	'fiddle_backbone/models/SchemaDef', 
-	'fiddle_backbone/models/Query',
-	
-	'fiddle_backbone/views/DBTypesList',
-	'fiddle_backbone/views/SchemaDef',
-	'fiddle_backbone/views/Query',
-	 
-	'fiddle_backbone/router', 
-	'libs/renderTerminator',
-	
-	'libs/jquery/jquery.blockUI',
-	'libs/jquery/jquery.cookie',
-	'Bootstrap/bootstrap-collapse',
-	'Bootstrap/bootstrap-tab',
-	'Bootstrap/bootstrap-dropdown',
-	'Bootstrap/bootstrap-modal',
-	'Bootstrap/bootstrap-tooltip',
-	'Bootstrap/bootstrap-popover'
-	
+    'BrowserEngines/engines',
+    
+    'fiddle_backbone/models/UsedFiddle', 
+    'fiddle_backbone/models/MyFiddleHistory', 
+    'fiddle_backbone/models/DBTypesList', 
+    'fiddle_backbone/models/SchemaDef', 
+    'fiddle_backbone/models/Query',
+    
+    'fiddle_backbone/views/DBTypesList',
+    'fiddle_backbone/views/SchemaDef',
+    'fiddle_backbone/views/Query',
+     
+    'fiddle_backbone/router', 
+    'libs/renderTerminator',
+    
+    'libs/jquery/jquery.blockUI',
+    'libs/jquery/jquery.cookie',
+    'Bootstrap/bootstrap-collapse',
+    'Bootstrap/bootstrap-tab',
+    'Bootstrap/bootstrap-dropdown',
+    'Bootstrap/bootstrap-modal',
+    'Bootstrap/bootstrap-tooltip',
+    'Bootstrap/bootstrap-popover'
+    
 ], function (
-		browserEngines, 
-		UsedFiddle, MyFiddleHistory, DBTypesList, SchemaDef, Query, 
-		DBTypesListView, SchemaDefView, QueryView,
-		Router,
-		renderTerminator
-		) {
-	
-  var initialize = function(dbTypesData) {
+        browserEngines, 
+        UsedFiddle, MyFiddleHistory, DBTypesList, SchemaDef, Query, 
+        DBTypesListView, SchemaDefView, QueryView,
+        Router,
+        renderTerminator
+        ) {
+    
+  var obj = {
 
-	var router = {};
-	
-	var myFiddleHistory = new MyFiddleHistory();
-		
-	var dbTypes = new DBTypesList();
-	
-	var schemaDef = new SchemaDef({browserEngines: browserEngines});
-	
-	var query = new Query({
-		"schemaDef": schemaDef
-	});
-			
-	var dbTypesListView = new DBTypesListView({
-		el: $("#db_type_id")[0],
-		collection:  dbTypes
-	});
-	
-	var schemaDefView = new SchemaDefView({
-		id: "schema_ddl",
-		model: schemaDef,
-		output_el: $("#output"),
-		browser_el: $("#browser")
-	});
+    initialize : function() {
 
-	var queryView = new QueryView({
-		id: "sql",
-		model: query,
-		output_el: $("#output")
-	});
+        var router = {};
+        
+        var myFiddleHistory = new MyFiddleHistory();
+            
+        var dbTypes = new DBTypesList();
+        
+        var schemaDef = new SchemaDef({browserEngines: browserEngines});
+        
+        var query = new Query({
+            "schemaDef": schemaDef
+        });
+                
+        var dbTypesListView = new DBTypesListView({
+            el: $("#db_type_id")[0],
+            collection:  dbTypes
+        });
+        
+        var schemaDefView = new SchemaDefView({
+            id: "schema_ddl",
+            model: schemaDef,
+            output_el: $("#output"),
+            browser_el: $("#browser")
+        });
 
-	/* UI Changes */
-	dbTypes.on("change", function () {
-	// see also the router function defined below that also binds to this event 
-		dbTypesListView.render();
-		if (schemaDef.has("dbType"))
-		{
-			schemaDef.set("ready", (schemaDef.get("short_code").length && schemaDef.get("dbType").id == this.getSelectedType().id));
-		}
-	});
+        var queryView = new QueryView({
+            id: "sql",
+            model: query,
+            output_el: $("#output")
+        });
 
-	schemaDef.on("change", function () {
-		if (this.hasChanged("ready"))
-			schemaDefView.updateDependents();
-		
-		if (this.hasChanged("errorMessage"))
-			schemaDefView.renderOutput();
-		
-		if (this.hasChanged("schema_structure"))
-			schemaDefView.renderSchemaBrowser();
-	});
-	
-	schemaDef.on("reloaded", function () {
-		this.set("dbType", dbTypes.getSelectedType());
-		schemaDefView.render();
-	});
+        /* UI Changes */
+        dbTypes.on("change", function () {
+        // see also the router function defined below that also binds to this event 
+            dbTypesListView.render();
+            if (schemaDef.has("dbType")) {
+                schemaDef.set("ready", (schemaDef.get("short_code").length && schemaDef.get("dbType").id === this.getSelectedType().id));
+            }
+        });
 
-	query.on("reloaded", function () {
-		this.set({"pendingChanges": false}, {silent: true});	
-		
-		queryView.render();
-	});
+        schemaDef.on("change", function () {
+            if (this.hasChanged("ready")) {
+                schemaDefView.updateDependents();
+            }
+            
+            if (this.hasChanged("errorMessage")) {
+                schemaDefView.renderOutput();
+            }
+            
+            if (this.hasChanged("schema_structure")) {
+                schemaDefView.renderSchemaBrowser();
+            }
+        });
+        
+        schemaDef.on("reloaded", function () {
+            this.set("dbType", dbTypes.getSelectedType());
+            schemaDefView.render();
+        });
 
-	schemaDef.on("built failed", function () {
-	// see also the router function defined below that also binds to this event 
-		$("#buildSchema label").prop('disabled', false);
-		$("#buildSchema label").html($("#buildSchema label").data("originalValue"));
-		schemaDefView.renderOutput();
-		schemaDefView.renderSchemaBrowser();
-	});
+        query.on("reloaded", function () {
+            this.set({"pendingChanges": false}, {silent: true});    
+            
+            queryView.render();
+        });
 
-	query.on("change", function () {
-		if ((this.hasChanged("sql") || this.hasChanged("statement_separator")) && !this.hasChanged("id") && !this.get("pendingChanges"))
-		{
-			this.set({"pendingChanges": true}, {silent: true});
-		}
-	});
-	
-	query.on("executed", function () {
-	// see also the router function defined below that also binds to this event 
-		var $button = $(".runQuery");
-		$button.prop('disabled', false);
-		$button.html($button.data("originalValue"));
+        schemaDef.on("built failed", function () {
+        // see also the router function defined below that also binds to this event 
+            $("#buildSchema label").prop('disabled', false);
+            $("#buildSchema label").html($("#buildSchema label").data("originalValue"));
+            schemaDefView.renderOutput();
+            schemaDefView.renderSchemaBrowser();
+        });
 
-		this.set({"pendingChanges": false}, {silent: true});	
-		queryView.renderOutput();
-	});
+        query.on("change", function () {
+            if ((this.hasChanged("sql") || this.hasChanged("statement_separator")) && !this.hasChanged("id") && !this.get("pendingChanges"))
+            {
+                this.set({"pendingChanges": true}, {silent: true});
+            }
+        });
+        
+        query.on("executed", function () {
+        // see also the router function defined below that also binds to this event 
+            var $button = $(".runQuery");
+            $button.prop('disabled', false);
+            $button.html($button.data("originalValue"));
 
-	/* Non-view object event binding */
-	$("#buildSchema").click(function (e) {
-		var $button = $("label", this);
-		e.preventDefault();
+            this.set({"pendingChanges": false}, {silent: true});    
+            queryView.renderOutput();
+        });
 
-		if ($button.prop('disabled')) return false;
-		
-		$button.data("originalValue", $button.html());
-		$button.prop('disabled', true).text('Building Schema...');
-		
-		schemaDef.build();
-	});	
-	
-	var handleRunQuery = function (e) {
-		var $button = $(".runQuery");
-		e.preventDefault();
-		
-		if ($button.prop('disabled')) return false;
-		$button.data("originalValue", $button.html());
-		$button.prop('disabled', true).text('Executing SQL...');
-		
-		queryView.checkForSelectedText();
-		query.execute();
-	};
-	
-	$(".runQuery").click(handleRunQuery);
-	$(document).keyup(function (e) {
-		if (e.keyCode == 116) // F5
-		{	
-			e.preventDefault();
-			handleRunQuery(e);
-		}
-	});
-	
-	$("#runQueryOptions li a").click(function (e) {
-		e.preventDefault();
-		queryView.setOutputType(this.id);
-		queryView.renderOutput();
-	});
-	
-	$("#queryPrettify").click(function (e) {
-		var thisButton = $(this);
-		thisButton.attr("disabled", true);
-		e.preventDefault();
-		$.post("index.cfm/proxy/formatSQL", {sql: query.get("sql")}, function (resp) {
-			query.set({"sql": resp});
-			query.trigger('reloaded');
-			query.set({"pendingChanges": true});
-			
-			thisButton.attr("disabled", false);
-		});
-	});
-	
-	$(".terminator .dropdown-menu a").on('click', function (e) {
-		e.preventDefault();
-		
-		renderTerminator($(this).closest(".panel"), $(this).attr('href'));
-		
-		if ($(this).closest(".panel").hasClass("schema"))
-		{
-			schemaDefView.handleSchemaChange();
-		}
-		else // must be the query panel button
-		{
-			query.set({
-				"pendingChanges": true,
-				"statement_separator": $(this).attr('href')
-			}, {silent: true});			
-		}
+        /* Non-view object event binding */
+        $("#buildSchema").click(function (e) {
+            var $button = $("label", this);
+            e.preventDefault();
 
-	});
-	
-	$("#output").on("click", ".depesz", function (e) {
-		var fullTextPlan = $(this).closest(".set").find(".executionPlan tr:not(:first)").text();
-		$(this).closest("form").find("[name=plan]").val(fullTextPlan);
-	});
-	
-	$(window).bind('beforeunload', function () {
-		if (query.get("pendingChanges"))
-			return "Warning! You have made changes to your query which will be lost. Continue?'";
-	});
+            if ($button.prop('disabled')) {
+                return false;
+            }
+            
+            $button.data("originalValue", $button.html());
+            $button.prop('disabled', true).text('Building Schema...');
+            
+            schemaDef.build();
+        }); 
+        
+        var handleRunQuery = function (e) {
+            var $button = $(".runQuery");
+            e.preventDefault();
+            
+            if ($button.prop('disabled')) return false;
+            $button.data("originalValue", $button.html());
+            $button.prop('disabled', true).text('Executing SQL...');
+            
+            queryView.checkForSelectedText();
+            query.execute();
+        };
+        
+        $(".runQuery").click(handleRunQuery);
+        $(document).keyup(function (e) {
+            if (e.keyCode == 116) // F5
+            {   
+                e.preventDefault();
+                handleRunQuery(e);
+            }
+        });
+        
+        $("#runQueryOptions li a").click(function (e) {
+            e.preventDefault();
+            queryView.setOutputType(this.id);
+            queryView.renderOutput();
+        });
+        
+        $("#queryPrettify").click(function (e) {
+            var thisButton = $(this);
+            thisButton.attr("disabled", true);
+            e.preventDefault();
+            $.post("index.cfm/proxy/formatSQL", {sql: query.get("sql")}, function (resp) {
+                query.set({"sql": resp});
+                query.trigger('reloaded');
+                query.set({"pendingChanges": true});
+                
+                thisButton.attr("disabled", false);
+            });
+        });
+        
+        $(".terminator .dropdown-menu a").on('click', function (e) {
+            e.preventDefault();
+            
+            renderTerminator($(this).closest(".panel"), $(this).attr('href'));
+            
+            if ($(this).closest(".panel").hasClass("schema"))
+            {
+                schemaDefView.handleSchemaChange();
+            }
+            else // must be the query panel button
+            {
+                query.set({
+                    "pendingChanges": true,
+                    "statement_separator": $(this).attr('href')
+                }, {silent: true});         
+            }
 
-	/* Data loading */
-	dbTypes.on("reset", function () {
-		// When the dbTypes are loaded, everything else is ready to go....
-		router = Router.initialize(dbTypes, schemaDef, query, myFiddleHistory, dbTypesListView);
+        });
+        
+        $("#output").on("click", ".depesz", function (e) {
+            var fullTextPlan = $(this).closest(".set").find(".executionPlan tr:not(:first)").text();
+            $(this).closest("form").find("[name=plan]").val(fullTextPlan);
+        });
+        
+        $(window).bind('beforeunload', function () {
+            if (query.get("pendingChanges"))
+                return "Warning! You have made changes to your query which will be lost. Continue?'";
+        });
 
-		if (this.length && !this.getSelectedType())
-		{
-			this.setSelectedType(this.first().id, true);
-			schemaDef.set("dbType", this.getSelectedType());
-		}
+        /* Data loading */
+        dbTypes.on("reset", function () {
+            // When the dbTypes are loaded, everything else is ready to go....
+            router = Router.initialize(dbTypes, schemaDef, query, myFiddleHistory, dbTypesListView);
 
-		// make sure everything is up-to-date on the page
-		dbTypesListView.render();
-		schemaDefView.render();
-		queryView.render();
-	});
+            if (this.length && !this.getSelectedType())
+            {
+                this.setSelectedType(this.first().id, true);
+            }
 
-	myFiddleHistory.on("change reset remove", function () {
-		if (localStorage)
-		{
-			localStorage.setItem("fiddleHistory", JSON.stringify(this.toJSON()));
-		}
-	});
+            schemaDef.set({"dbType": this.getSelectedType()}, {silent: true});
 
-	
-	/* Events which will trigger new route navigation */
-			
-	$("#clear").click(function (e) {
-		e.preventDefault();
-		schemaDef.reset();
-		query.reset();
-		router.navigate("!" + dbTypes.getSelectedType().id, {trigger: true});	
-	});
-	
-	$("#sample").click(function (e) {
-		e.preventDefault();
-		router.navigate("!" + dbTypes.getSelectedType().get("sample_fragment"), {trigger: true});
-	});
+            // make sure everything is up-to-date on the page
+            dbTypesListView.render();
+            schemaDefView.render();
+            queryView.render();
+        });
 
-	dbTypes.on("change", function () {
-		dbTypesListView.render();
-		if (
-				query.id &&
-				schemaDef.get("short_code").length &&
-				schemaDef.get("dbType").id == this.getSelectedType().id
-			)
-			router.navigate("!" + this.getSelectedType().id + "/" + schemaDef.get("short_code") + "/" + query.id);
-		else if (
-				schemaDef.get("short_code").length &&
-				schemaDef.get("dbType").id == this.getSelectedType().id		
-			)
-			router.navigate("!" + this.getSelectedType().id + "/" + schemaDef.get("short_code"));
-		else
-			router.navigate("!" + this.getSelectedType().id);	
+        myFiddleHistory.on("change reset remove", function () {
+            if (localStorage)
+            {
+                localStorage.setItem("fiddleHistory", JSON.stringify(this.toJSON()));
+            }
+        });
 
-		schemaDef.set("dbType", this.getSelectedType());
+        
+        /* Events which will trigger new route navigation */
+                
+        $("#clear").click(function (e) {
+            e.preventDefault();
+            schemaDef.reset();
+            query.reset();
+            router.navigate("!" + dbTypes.getSelectedType().id, {trigger: true});   
+        });
+        
+        $("#sample").click(function (e) {
+            e.preventDefault();
+            router.navigate("!" + dbTypes.getSelectedType().get("sample_fragment"), {trigger: true});
+        });
 
-	});
+        dbTypes.on("change", function () {
+            dbTypesListView.render();
+            if (
+                    query.id &&
+                    schemaDef.get("short_code").length &&
+                    schemaDef.get("dbType").id === this.getSelectedType().id
+                )
+                router.navigate("!" + this.getSelectedType().id + "/" + schemaDef.get("short_code") + "/" + query.id);
+            else if (
+                    schemaDef.get("short_code").length &&
+                    schemaDef.get("dbType").id == this.getSelectedType().id     
+                )
+                router.navigate("!" + this.getSelectedType().id + "/" + schemaDef.get("short_code"));
+            else
+                router.navigate("!" + this.getSelectedType().id);   
 
-	schemaDef.on("built", function () {
-		
-		myFiddleHistory.insert(new UsedFiddle({
-			"fragment": "!" + this.get("dbType").id + "/" + this.get("short_code")
-		}));
-		
-		router.navigate("!" + this.get("dbType").id + "/" + this.get("short_code"));
-	});
-	
-	query.on("executed", function () {
-		var schemaDef = this.get("schemaDef");
-		
-		if (this.id) {
-			myFiddleHistory.insert(new UsedFiddle({
-				"fragment": "!" + schemaDef.get("dbType").id + "/" + schemaDef.get("short_code") + "/" + this.id
-			}));
-	
-			router.navigate(
-				"!" + schemaDef.get("dbType").id + "/" + schemaDef.get("short_code") + "/" + this.id 
-			);
-		}
-		
-	});
-	
-	
-	
-	dbTypes.reset(dbTypesData);
+            schemaDef.set("dbType", this.getSelectedType());
 
+        });
 
-	return {
-		dbTypes: dbTypes,
-		schemaDef: schemaDef,
-		schemaDefView: schemaDefView,
-		queryView: queryView
-	}
+        schemaDef.on("built", function () {
+            
+            myFiddleHistory.insert(new UsedFiddle({
+                "fragment": "!" + this.get("dbType").id + "/" + this.get("short_code")
+            }));
+            
+            router.navigate("!" + this.get("dbType").id + "/" + this.get("short_code"));
+        });
+        
+        query.on("executed", function () {
+            var schemaDef = this.get("schemaDef");
+            
+            if (this.id) {
+                myFiddleHistory.insert(new UsedFiddle({
+                    "fragment": "!" + schemaDef.get("dbType").id + "/" + schemaDef.get("short_code") + "/" + this.id
+                }));
+        
+                router.navigate(
+                    "!" + schemaDef.get("dbType").id + "/" + schemaDef.get("short_code") + "/" + this.id 
+                );
+            }
+            
+        });
 
-  };
+        dbTypes.fetch();
+
+        return {
+                dbTypes: dbTypes,
+                schemaDef: schemaDef,
+                schemaDefView: schemaDefView,
+                queryView: queryView
+            };
+
+        }
+
+    };
+  
+    return obj;
 
-  return { 
-	initialize: initialize
-  };
 });
\ No newline at end of file
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBType.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBType.js
index 9320779..5ade0ff 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBType.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBType.js
@@ -1,17 +1,13 @@
 define(["Backbone"], function (Backbone) {
-	
-	var DBType = Backbone.Model.extend({
-		defaults: {
-			"sample_fragment":"",
-			"notes":"",
-			"simple_name": "",
-			"full_name": "",
-			"selected": false,
-			"context": "host",
-			"className": ""
-		}
-	});
-	
-	return DBType;
-	
+    return Backbone.Model.extend({
+        defaults: {
+            "sample_fragment":"",
+            "notes":"",
+            "simple_name": "",
+            "full_name": "",
+            "selected": false,
+            "context": "host",
+            "className": ""
+        }
+    });
 });
\ No newline at end of file
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBTypesList.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBTypesList.js
index b064537..7040a0b 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBTypesList.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/DBTypesList.js
@@ -1,26 +1,42 @@
-define(["Backbone", "fiddle_backbone/models/DBType"], function (Backbone, DBType) {
-	
-	var DBTypesList = Backbone.Collection.extend({
-		model: DBType,
-		getSelectedType: function () {
-			var selectedType = this.filter(function (dbType) { 
-				return dbType.get("selected");
-			});
-			if (selectedType.length)
-				return selectedType[0];
-			else
-				return false;
-		},
-		setSelectedType: function (db_type_id, silentSelected) {
-			this.each(function (dbType) {
-				dbType.set({"selected": (dbType.id == db_type_id)}, {silent: true});
-			});
-			if (! silentSelected)
-				this.trigger("change");
-		}
-				
-	});
-	
-	return DBTypesList;
-	
+define(["jQuery", "Backbone", "fiddle_backbone/models/DBType"], function ($, Backbone, DBType) {
+    
+    return Backbone.Collection.extend({
+        model: DBType,
+        fetch: function () {
+            var _this = this;
+            return $.ajax({
+                url: '/openidm/system/fiddles/db_types?_queryFilter=full_name gt ""',
+                headers: {
+                    "X-OpenIDM-Username" : "openidm-admin",
+                    "X-OpenIDM-Password" : "openidm-admin",
+                    "X-OpenIDM-NoSession" : "true"
+                }
+            }).then(function (qry) {
+                _this.reset(_.map(qry.result, function (r) {
+                    return new DBType({
+                        "id": r.id,
+                        "simple_name": r.simple_name,
+                        "full_name": r.full_name,
+                        "context": r.context
+                    });
+                }));
+                return _this;
+            });
+        },
+        getSelectedType: function () {
+            return this.find(function (dbType) { 
+                return dbType.get("selected");
+            });
+        },
+        setSelectedType: function (db_type_id, silentSelected) {
+            this.each(function (dbType) {
+                dbType.set({"selected": (dbType.id === db_type_id)}, {silent: true});
+            });
+            if (! silentSelected) {
+                this.trigger("change");
+            }
+        }
+                
+    });
+    
 });
\ No newline at end of file
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/Query.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/Query.js
index 2b6bd45..1d2414a 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/Query.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/Query.js
@@ -23,15 +23,20 @@ define(["jQuery", "Backbone"], function ($, Backbone) {
 			{ return false; }
 						
 			$.ajax({
-				
 				type: "POST",
-				url: "index.cfm/fiddles/runQuery",
-				data: {
+				url: "/openidm/endpoint/executeQuery?_action=query",
+				data: JSON.stringify({
 					db_type_id: this.get("schemaDef").get("dbType").id,
 					schema_short_code: this.get("schemaDef").get("short_code"),
 					statement_separator: this.get("statement_separator"),
 					sql: this.get("sql")
-				},
+				}),
+                headers: {
+                    "X-OpenIDM-Username" : "openidm-admin",
+                    "X-OpenIDM-Password" : "openidm-admin",
+                    "X-OpenIDM-NoSession" : "true",
+                    "Content-Type": "application/json"
+                },
 				dataType: "json",
 				success: function (resp, textStatus, jqXHR) {
 					if (thisModel.get("schemaDef").get("dbType").get("context") == "browser")
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/SchemaDef.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/SchemaDef.js
index 0673984..5028bd7 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/SchemaDef.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/models/SchemaDef.js
@@ -1,4 +1,4 @@
-define(["Backbone"], function (Backbone) {
+define(["jQuery", "Backbone"], function ($, Backbone) {
 	
 	var SchemaDef = Backbone.Model.extend({
 	
@@ -25,26 +25,35 @@ define(["Backbone"], function (Backbone) {
 
 			$.ajax({
 				type: "POST",
-				url: "index.cfm/fiddles/createSchema",
-				data: {
+				url: "/openidm/system/fiddles/schema_defs?_action=create",
+				data: JSON.stringify({
 					statement_separator: this.get('statement_separator'),
 					db_type_id: this.get('dbType').id,
-					schema_ddl: this.get('ddl')
-				},
+					ddl: this.get('ddl'),
+					md5: "n/a"
+				}),
+                headers: {
+                    "X-OpenIDM-Username" : "openidm-admin",
+                    "X-OpenIDM-Password" : "openidm-admin",
+                    "X-OpenIDM-NoSession" : "true",
+                    "Content-Type": "application/json"
+                },
 				dataType: "json",
 				success: function (data, textStatus, jqXHR) {
-					if (data["short_code"])
-					{
-						if (selectedDBType.get("context") == "browser")
-						{
+					var short_code;
+
+					if (data._id) {
+						short_code = data._id.split('_')[1];
+
+						if (selectedDBType.get("context") === "browser") {
 							thisModel.get("browserEngines")[selectedDBType.get("className")].buildSchema({
 								
-								short_code: $.trim(data["short_code"]),
+								short_code: short_code,
 								statement_separator: thisModel.get('statement_separator'),
 								ddl: thisModel.get('ddl'),
 								success: function () {
 									thisModel.set({
-										"short_code": $.trim(data["short_code"]),
+										"short_code": short_code,
 										"ready": true,
 										"valid": true,
 										"errorMessage": ""
@@ -62,7 +71,7 @@ define(["Backbone"], function (Backbone) {
 								},
 								error: function (message) {
 									thisModel.set({
-										"short_code": $.trim(data["short_code"]),
+										"short_code": short_code,
 										"ready": false,
 										"valid": false,
 										"errorMessage": message,
@@ -72,15 +81,13 @@ define(["Backbone"], function (Backbone) {
 								}
 								
 							});
-						}
-						else
-						{
+						} else {
 							thisModel.set({
-								"short_code": $.trim(data["short_code"]),
+								"short_code": short_code,
 								"ready": true,
 								"valid": true,
-								"errorMessage": "",
-								"schema_structure": data["schema_structure"]
+								"errorMessage": ""/*,
+								"schema_structure": data["schema_structure"]*/
 							});
 							
 							thisModel.trigger("built");
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/router.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/router.js
index 4691077..89c453e 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/router.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/router.js
@@ -1,294 +1,294 @@
 define([
-	'jQuery',
-	'Underscore',
-	'Backbone',
-	"libs/renderTerminator",
-	"fiddle_backbone/models/UsedFiddle"
+    'jQuery',
+    'Underscore',
+    'Backbone',
+    "libs/renderTerminator",
+    "fiddle_backbone/models/UsedFiddle"
 ], function($, _, Backbone, renderTerminator, UsedFiddle){
 
-	var initialize = function(dbTypes, schemaDef, query, myFiddleHistory, dbTypesListView) {
-		
-		var Router = Backbone.Router.extend({
-		
-			routes: {
-				"!:db_type_id":	"DBType", // #!1
-				"!:db_type_id/:short_code":"SchemaDef", // #!1/abc12
-				"!:db_type_id/:short_code/:query_id":"Query", // #!1/abc12/1
-				"!:db_type_id/:short_code/:query_id/:set_id":"SetAnchor" // #!1/abc12/1/1
-			},
-			
-			DBType: function (db_type_id) {
-				// update currently-selected dbtype
-				dbTypes.setSelectedType(db_type_id, true);
-				dbTypesListView.render();
-			},
-			
-			SchemaDef: function (db_type_id, short_code) {
-				this.loadContent(db_type_id, "!" + db_type_id + "/" + short_code);
-			},
-			
-			Query: function (db_type_id, short_code, query_id) {
-				this.loadContent(db_type_id, "!" + db_type_id + "/" + short_code + "/" + query_id);
-			},
-			SetAnchor: function (db_type_id, short_code, query_id, set_id) {
-				
-				var selectSet = function () {
-					if ($("#set_" + set_id).length)
-					{
-						window.scrollTo(0,$("#set_" + set_id).offset()["top"]-50);
-						$("#set_" + set_id).addClass("highlight");
-					}				
-				};
-				
-				if (
-						!dbTypes.getSelectedType() ||
-						dbTypes.getSelectedType().get("id") != db_type_id ||
-						schemaDef.get("short_code") != short_code ||
-						query.get("id") != query_id
-					)			
-				{
-					query.bind("reloaded", _.once(selectSet));
-					this.loadContent(db_type_id, "!" + db_type_id + "/" + short_code + "/" + query_id);
-				}
-				else
-				{
-					$(".set").removeClass("highlight");
-					selectSet();
-				}			
-			},	
-			
-			loadContent: function (db_type_id,frag) {
-	
-				this.DBType(db_type_id);
-	
-				if (query.get("pendingChanges") && !confirm("Warning! You have made changes to your query which will be lost. Continue?'"))
-					return false;
-	
-				schemaDef.set("loading", true);
-				
-				$(".helpTip").css("display", "none");
-				$("body").block({ message: "Loading..."});
-						
-				$.getJSON("index.cfm/fiddles/loadContent", {fragment: frag}, function (resp) {
-					schemaDef.set("loading", false);
-	
-					if (resp["short_code"])
-					{
-						
-						var selectedDBType = dbTypes.getSelectedType();
-	
-						if (selectedDBType.get("context") == "browser")
-						{
-							if (
-									selectedDBType.get("className") == "sqljs" &&
-									schemaDef.get("browserEngines")["websql"].nativeSQLite
-								)
-							{
-								if (confirm("Fiddle originally built with SQL.js, but you have WebSQL available - would you like to use that instead (it'll be faster to load)?"))
-								{
-									dbTypes.setSelectedType($("#db_type_id a:contains('WebSQL')").closest('li').attr('db_type_id'));
-									selectedDBType = dbTypes.getSelectedType();
-									schemaDef.set({
-										"ddl": resp["ddl"],
-										"dbType": selectedDBType,
-										"statement_separator": resp["schema_statement_separator"]
-									});
-									if (resp["sql"])
-									{
-										query.set({
-											"schemaDef": schemaDef, 
-											"sql":  resp["sql"],
-											"statement_separator": resp["query_statement_separator"]
-										});
-										schemaDef.on("built", _.once(function () {
-											query.execute();					
-										}));
-	
-									}
-									schemaDef.build();
-	
-									
-								}
-							}
-							
-							schemaDef.get("browserEngines")[selectedDBType.get("className")].buildSchema({
-								
-								short_code: $.trim(resp["short_code"]),
-								statement_separator: resp["schema_statement_separator"],
-								ddl: resp["ddl"],
-								success: function () {
-	
-									schemaDef.set({
-										"short_code": resp["short_code"],
-										"ddl": resp["ddl"],
-										"ready": true,
-										"valid": true,
-										"errorMessage": "",
-										"statement_separator": resp["schema_statement_separator"],
-										"dbType": dbTypes.getSelectedType()
-									});
-									renderTerminator($(".panel.schema"), resp["schema_statement_separator"]);
-																	
-									if (resp["sql"])
-									{
-										myFiddleHistory.insert(new UsedFiddle({
-											"fragment": "!" + db_type_id + "/" + resp["short_code"] + "/" + resp["id"]
-										}));
-			
-										query.set({
-											"id": resp["id"],
-											"sql":  resp["sql"],
-											"statement_separator": resp["query_statement_separator"]
-										});
-									}
-									else
-									{
-										myFiddleHistory.insert(new UsedFiddle({
-											"fragment": "!" + db_type_id + "/" + resp["short_code"]
-										}));									
-									}				
-									
-									schemaDef.get("browserEngines")[selectedDBType.get("className")].getSchemaStructure({
-											callback: function (schemaStruct) {
-												schemaDef.set({
-													"schema_structure": schemaStruct
-												});
-	
-												schemaDef.trigger("reloaded");
-												
-												if (resp["sql"])
-												{
-													schemaDef.get("browserEngines")[selectedDBType.get("className")].executeQuery({
-														sql: resp["sql"],
-														statement_separator: resp["query_statement_separator"],
-														success: function (sets) {
-	
-															query.set({
-																"sets": sets
-															});				
-				
-															query.trigger("reloaded");
-					
-															$("body").unblock();
-														},
-														error: function (e) {
-	
-															query.set({
-																"sets": []
-															});				
-															
-															query.trigger("reloaded");
-					
-															$("body").unblock();
-														}
-													});
-												}
-												else
-												{
-													$("body").unblock();	
-												} // end if resp["sql"]
-	
-											}
-										});
-									
-	
-								},
-								error: function (message) {
-	
-									schemaDef.set({
-										"short_code": resp["short_code"],
-										"ddl": resp["ddl"],
-										"ready": true,
-										"valid": false,
-										"errorMessage": message,
-										"dbType": dbTypes.getSelectedType(),
-										"statement_separator": resp["schema_statement_separator"],
-										"schema_structure": []
-									});
-	
-									renderTerminator($(".panel.schema"), resp["schema_statement_separator"]);
-	
-									if (resp["sql"])
-									{
-										query.set({
-											"id": resp["id"],
-											"sql":  resp["sql"],
-											"statement_separator": resp["query_statement_separator"],
-											"schemaDef": schemaDef
-										});
-										query.trigger("reloaded");
-									}
-									
-									schemaDef.trigger("failed");
-									schemaDef.trigger("reloaded");
-	
-									$("body").unblock();
-									
-								}
-								
-							});
-						}
-						else // context not "browser"
-						{	
-								
-							schemaDef.set({
-								"short_code": resp["short_code"],
-								"ddl": resp["ddl"],
-								"ready": true,
-								"valid": true,
-								"errorMessage": "",
-								"statement_separator": resp["schema_statement_separator"],
-								"schema_structure": resp["schema_structure"]
-							});
-							renderTerminator($(".panel.schema"), resp["schema_statement_separator"]);
-							schemaDef.trigger("reloaded");
-							
-							if (resp["sql"])
-							{
-								myFiddleHistory.insert(new UsedFiddle({
-									"fragment": "!" + db_type_id + "/" + resp["short_code"] + "/" + resp["id"]
-								}));
-	
-								query.set({
-									"id": resp["id"],
-									"sql": resp["sql"],
-									"sets": resp["sets"],
-									"statement_separator": resp["query_statement_separator"]
-								});
-								query.trigger("reloaded");
-							}
-							else
-							{
-								myFiddleHistory.insert(new UsedFiddle({
-									"fragment": "!" + db_type_id + "/" + resp["short_code"]
-								}));									
-							}				
-	
-							$("body").unblock();
-					
-						}
-					
-					}
-					else
-					{
-						$("body").unblock();
-					}
-				});
-				
-						
-			}
-			
-		
-		});
-		
-		var router = new Router;
-		Backbone.history.start({pushState: false});
-				
-		return router;
-	};
+    var initialize = function(dbTypes, schemaDef, query, myFiddleHistory, dbTypesListView) {
+        
+        var Router = Backbone.Router.extend({
+        
+            routes: {
+                "!:db_type_id": "DBType", // #!1
+                "!:db_type_id/:short_code":"SchemaDef", // #!1/abc12
+                "!:db_type_id/:short_code/:query_id":"Query", // #!1/abc12/1
+                "!:db_type_id/:short_code/:query_id/:set_id":"SetAnchor" // #!1/abc12/1/1
+            },
+            
+            DBType: function (db_type_id) {
+                // update currently-selected dbtype
+                dbTypes.setSelectedType(parseInt(db_type_id), true);
+                dbTypesListView.render();
+            },
+            
+            SchemaDef: function (db_type_id, short_code) {
+                this.loadContent(db_type_id, "!" + db_type_id + "/" + short_code);
+            },
+            
+            Query: function (db_type_id, short_code, query_id) {
+                this.loadContent(db_type_id, "!" + db_type_id + "/" + short_code + "/" + query_id);
+            },
+            SetAnchor: function (db_type_id, short_code, query_id, set_id) {
+                
+                var selectSet = function () {
+                    if ($("#set_" + set_id).length)
+                    {
+                        window.scrollTo(0,$("#set_" + set_id).offset()["top"]-50);
+                        $("#set_" + set_id).addClass("highlight");
+                    }               
+                };
+                
+                if (
+                        !dbTypes.getSelectedType() ||
+                        dbTypes.getSelectedType().get("id") != db_type_id ||
+                        schemaDef.get("short_code") != short_code ||
+                        query.get("id") != query_id
+                    )           
+                {
+                    query.bind("reloaded", _.once(selectSet));
+                    this.loadContent(db_type_id, "!" + db_type_id + "/" + short_code + "/" + query_id);
+                }
+                else
+                {
+                    $(".set").removeClass("highlight");
+                    selectSet();
+                }           
+            },  
+            
+            loadContent: function (db_type_id,frag) {
+    
+                this.DBType(db_type_id);
+    
+                if (query.get("pendingChanges") && !confirm("Warning! You have made changes to your query which will be lost. Continue?'"))
+                    return false;
+    
+                schemaDef.set("loading", true);
+                
+                $(".helpTip").css("display", "none");
+                $("body").block({ message: "Loading..."});
+                        
+                $.getJSON("/openidm/endpoint/loadContent/" + frag.replace(/\//g, '_'), function (resp) {
+                    schemaDef.set("loading", false);
+    
+                    if (resp["short_code"])
+                    {
+                        
+                        var selectedDBType = dbTypes.getSelectedType();
+    
+                        if (selectedDBType.get("context") == "browser")
+                        {
+                            if (
+                                    selectedDBType.get("className") == "sqljs" &&
+                                    schemaDef.get("browserEngines")["websql"].nativeSQLite
+                                )
+                            {
+                                if (confirm("Fiddle originally built with SQL.js, but you have WebSQL available - would you like to use that instead (it'll be faster to load)?"))
+                                {
+                                    dbTypes.setSelectedType($("#db_type_id a:contains('WebSQL')").closest('li').attr('db_type_id'));
+                                    selectedDBType = dbTypes.getSelectedType();
+                                    schemaDef.set({
+                                        "ddl": resp["ddl"],
+                                        "dbType": selectedDBType,
+                                        "statement_separator": resp["schema_statement_separator"]
+                                    });
+                                    if (resp["sql"])
+                                    {
+                                        query.set({
+                                            "schemaDef": schemaDef, 
+                                            "sql":  resp["sql"],
+                                            "statement_separator": resp["query_statement_separator"]
+                                        });
+                                        schemaDef.on("built", _.once(function () {
+                                            query.execute();                    
+                                        }));
+    
+                                    }
+                                    schemaDef.build();
+    
+                                    
+                                }
+                            }
+                            
+                            schemaDef.get("browserEngines")[selectedDBType.get("className")].buildSchema({
+                                
+                                short_code: $.trim(resp["short_code"]),
+                                statement_separator: resp["schema_statement_separator"],
+                                ddl: resp["ddl"],
+                                success: function () {
+    
+                                    schemaDef.set({
+                                        "short_code": resp["short_code"],
+                                        "ddl": resp["ddl"],
+                                        "ready": true,
+                                        "valid": true,
+                                        "errorMessage": "",
+                                        "statement_separator": resp["schema_statement_separator"],
+                                        "dbType": dbTypes.getSelectedType()
+                                    });
+                                    renderTerminator($(".panel.schema"), resp["schema_statement_separator"]);
+                                                                    
+                                    if (resp["sql"])
+                                    {
+                                        myFiddleHistory.insert(new UsedFiddle({
+                                            "fragment": "!" + db_type_id + "/" + resp["short_code"] + "/" + resp["id"]
+                                        }));
+            
+                                        query.set({
+                                            "id": resp["id"],
+                                            "sql":  resp["sql"],
+                                            "statement_separator": resp["query_statement_separator"]
+                                        });
+                                    }
+                                    else
+                                    {
+                                        myFiddleHistory.insert(new UsedFiddle({
+                                            "fragment": "!" + db_type_id + "/" + resp["short_code"]
+                                        }));                                    
+                                    }               
+                                    
+                                    schemaDef.get("browserEngines")[selectedDBType.get("className")].getSchemaStructure({
+                                            callback: function (schemaStruct) {
+                                                schemaDef.set({
+                                                    "schema_structure": schemaStruct
+                                                });
+    
+                                                schemaDef.trigger("reloaded");
+                                                
+                                                if (resp["sql"])
+                                                {
+                                                    schemaDef.get("browserEngines")[selectedDBType.get("className")].executeQuery({
+                                                        sql: resp["sql"],
+                                                        statement_separator: resp["query_statement_separator"],
+                                                        success: function (sets) {
+    
+                                                            query.set({
+                                                                "sets": sets
+                                                            });             
+                
+                                                            query.trigger("reloaded");
+                    
+                                                            $("body").unblock();
+                                                        },
+                                                        error: function (e) {
+    
+                                                            query.set({
+                                                                "sets": []
+                                                            });             
+                                                            
+                                                            query.trigger("reloaded");
+                    
+                                                            $("body").unblock();
+                                                        }
+                                                    });
+                                                }
+                                                else
+                                                {
+                                                    $("body").unblock();    
+                                                } // end if resp["sql"]
+    
+                                            }
+                                        });
+                                    
+    
+                                },
+                                error: function (message) {
+    
+                                    schemaDef.set({
+                                        "short_code": resp["short_code"],
+                                        "ddl": resp["ddl"],
+                                        "ready": true,
+                                        "valid": false,
+                                        "errorMessage": message,
+                                        "dbType": dbTypes.getSelectedType(),
+                                        "statement_separator": resp["schema_statement_separator"],
+                                        "schema_structure": []
+                                    });
+    
+                                    renderTerminator($(".panel.schema"), resp["schema_statement_separator"]);
+    
+                                    if (resp["sql"])
+                                    {
+                                        query.set({
+                                            "id": resp["id"],
+                                            "sql":  resp["sql"],
+                                            "statement_separator": resp["query_statement_separator"],
+                                            "schemaDef": schemaDef
+                                        });
+                                        query.trigger("reloaded");
+                                    }
+                                    
+                                    schemaDef.trigger("failed");
+                                    schemaDef.trigger("reloaded");
+    
+                                    $("body").unblock();
+                                    
+                                }
+                                
+                            });
+                        }
+                        else // context not "browser"
+                        {   
+                                
+                            schemaDef.set({
+                                "short_code": resp["short_code"],
+                                "ddl": resp["ddl"],
+                                "ready": true,
+                                "valid": true,
+                                "errorMessage": "",
+                                "statement_separator": resp["schema_statement_separator"],
+                                "schema_structure": resp["schema_structure"]
+                            });
+                            renderTerminator($(".panel.schema"), resp["schema_statement_separator"]);
+                            schemaDef.trigger("reloaded");
+                            
+                            if (resp["sql"])
+                            {
+                                myFiddleHistory.insert(new UsedFiddle({
+                                    "fragment": "!" + db_type_id + "/" + resp["short_code"] + "/" + resp["id"]
+                                }));
+    
+                                query.set({
+                                    "id": resp["id"],
+                                    "sql": resp["sql"],
+                                    "sets": resp["sets"],
+                                    "statement_separator": resp["query_statement_separator"]
+                                });
+                                query.trigger("reloaded");
+                            }
+                            else
+                            {
+                                myFiddleHistory.insert(new UsedFiddle({
+                                    "fragment": "!" + db_type_id + "/" + resp["short_code"]
+                                }));                                    
+                            }               
+    
+                            $("body").unblock();
+                    
+                        }
+                    
+                    }
+                    else
+                    {
+                        $("body").unblock();
+                    }
+                });
+                
+                        
+            }
+            
+        
+        });
+        
+        var router = new Router;
+        Backbone.history.start({pushState: false});
+                
+        return router;
+    };
 
-	return {
-		initialize: initialize
-	};
-	
+    return {
+        initialize: initialize
+    };
+    
 });
\ No newline at end of file
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js
index 012a099..192e27b 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/fiddle_backbone/views/DBTypesList.js
@@ -1,37 +1,37 @@
 define (["jQuery", "Backbone", "Handlebars", "text!fiddle_backbone/templates/dbTypes.html"], 
-		function ($,Backbone,Handlebars,dbTypesTemplate) {
+        function ($,Backbone,Handlebars,dbTypesTemplate) {
 
-	var DBTypesListView = Backbone.View.extend({
-		initialize: function () {
-			this.compiledTemplate = Handlebars.compile(dbTypesTemplate); 
-		},
-		events: {
-			"click ul.dropdown-menu li": "clickDBType"
-		},
-		clickDBType: function (e) {
-			e.preventDefault();
-			this.collection.setSelectedType($(e.currentTarget).attr("db_type_id"));
-		},
-		render: function () {
-			var selectedDBType = this.collection.getSelectedType();
+    var DBTypesListView = Backbone.View.extend({
+        initialize: function () {
+            this.compiledTemplate = Handlebars.compile(dbTypesTemplate); 
+        },
+        events: {
+            "click ul.dropdown-menu li": "clickDBType"
+        },
+        clickDBType: function (e) {
+            e.preventDefault();
+            this.collection.setSelectedType(parseInt($(e.currentTarget).attr("db_type_id")));
+        },
+        render: function () {
+            var selectedDBType = this.collection.getSelectedType();
 
-			$(this.el).html(
-				this.compiledTemplate({
-					dbTypes: this.collection.map(function (dbType) {
-						var json = dbType.toJSON();
-						json.className = (json.selected ? "active" : "");
-						return json;
-					}),
-					selectedFullName: selectedDBType.get("full_name")
-				})
-			);
-			
-			$("#db_type_label_collapsed .navbar-text").text(selectedDBType.get("full_name"));
-			
-			return this;
-		}
-	}); 
-	
-	return DBTypesListView;
-	
+            $(this.el).html(
+                this.compiledTemplate({
+                    dbTypes: this.collection.map(function (dbType) {
+                        var json = dbType.toJSON();
+                        json.className = (json.selected ? "active" : "");
+                        return json;
+                    }),
+                    selectedFullName: selectedDBType.get("full_name")
+                })
+            );
+            
+            $("#db_type_label_collapsed .navbar-text").text(selectedDBType.get("full_name"));
+            
+            return this;
+        }
+    }); 
+    
+    return DBTypesListView;
+    
 });
diff --git a/src/main/resources/ui/sqlfiddle/www/javascript/main.js b/src/main/resources/ui/sqlfiddle/www/javascript/main.js
index fa8052a..851bb09 100644
--- a/src/main/resources/ui/sqlfiddle/www/javascript/main.js
+++ b/src/main/resources/ui/sqlfiddle/www/javascript/main.js
@@ -60,17 +60,16 @@ requirejs.config({
 require([
 		'jQuery',
 		'Underscore',
-		'dbTypes_cached', 
 		'fiddle_backbone/app',
 		'DDLBuilder/ddl_builder',
 		'libs/idselector'
 	], 
-	function($, _, dbTypesData, App, ddl_builder) {
+	function($, _, App, ddl_builder) {
 	
 	$.blockUI.defaults.overlayCSS.cursor = 'auto';
 	$.blockUI.defaults.css.cursor = 'auto';
 		
-	fiddleBackbone = App.initialize(dbTypesData);
+	fiddleBackbone = App.initialize();
 
 	// Now follows miscellaneous UI event bindings