Modified scripts to use jQuery, and moved 'em to a better place.

4 files changed, 35 insertions, 38 deletions

diff --git a/debug_toolbar/media/toolbar.css b/debug_toolbar/media/toolbar.css
new file mode 100644
index 0000000..11dd978
--- /dev/null
+++ b/debug_toolbar/media/toolbar.css
@@ -0,0 +1,14 @@
+#djDebugToolbar {height:30px; background:orange; color:#000; z-index:100000000; border:1px solid #06171D; border-width:1px 0;}
+#djDebugToolbar ul {margin:0; padding:0 10px; list-style:none;}
+#djDebugToolbar li {display:inline; width:auto; position:relative; float:none; margin:0 10px 0 0; padding:0; height:20px; line-height:30px; padding:8px 10px 8px 0; border-right: 1px solid #06171D;}
+#djDebugToolbar #djDebugButton {color:red; font-weight:bold;}
+#djDebug * {margin:0; padding:0; float:none; position:static; }
+#djDebug .panelContent {display:none; position:absolute; margin:0; padding:5px; top:35px; width:auto; left:5px; right:5px; bottom:5px; background:white; color:black; border:1px solid black; z-index:1000000; overflow:auto;}
+#djDebug .panelContent p {padding: 0 5px;}
+#djDebug .panelContent p, #djDebug .panelContent table, #djDebug .panelContent ul, #djDebug .panelContent dl {margin:5px 0;}
+#djDebug .close {float:right; font-weight:bold;}
+#djDebug .panelContent dt, #djDebug .panelContent dd {display: block;}
+#djDebug .panelContent dd {margin-left:10px;}
+#djDebug th, #djDebug td {padding: 5px;}
+#djDebug .row1 td {background:#fff;}
+#djDebug .row2 td {background:#ddd;}
diff --git a/debug_toolbar/media/toolbar.js b/debug_toolbar/media/toolbar.js
new file mode 100644
index 0000000..8c0a86d
--- /dev/null
+++ b/debug_toolbar/media/toolbar.js
@@ -0,0 +1,15 @@
+jQuery.noConflict();
+jQuery(document).ready(function() {
+    var current = null;
+    jQuery('#djDebugPanelList li a').click(function() {
+        if (current) { current.hide(); }
+        current = jQuery('#djDebug #' + this.className);
+        current.show();
+        return false;
+    });
+    jQuery('#djDebug a.close').click(function() {
+        if (current) { current.hide(); }
+        current = null;
+        return false;
+    })
+});
diff --git a/debug_toolbar/templates/debug_toolbar/base.html b/debug_toolbar/templates/debug_toolbar/base.html
index 637e04d..8ee29d2 100644
--- a/debug_toolbar/templates/debug_toolbar/base.html
+++ b/debug_toolbar/templates/debug_toolbar/base.html
@@ -1,39 +1,7 @@
-<script type="text/javascript">
-	var djDebugLastObj = null;
-	function djDebugToggle(obj) {
-		if (djDebugLastObj) djDebugLastObj.style.display = 'none';
-		var obj = document.getElementById(obj);
-		if (!obj) return;
-		if (djDebugLastObj == obj) {
-			djDebugLastObj = null;
-			return;
-		}
-		if (obj.style.display != 'block') {
-			obj.style.display = 'block';
-			djDebugLastObj = obj;
-		}
-	}
-	function djDebugClose() {
-		if (!djDebugLastObj) return;
-		djDebugLastObj.style.display = 'none';
-		djDebugLastObj = null;
-	}
-</script>
+<script src="/__debug__/m/jquery.js" type="text/javascript" charset="utf-8"></script>
+<script src="/__debug__/m/toolbar.js" type="text/javascript" charset="utf-8"></script>
 <style type="text/css">
-	#djDebugToolbar {height:30px; background:orange; color:#000; z-index:100000000; border:1px solid #06171D; border-width:1px 0;}
-	#djDebugToolbar ul {margin:0; padding:0 10px; list-style:none;}
-	#djDebugToolbar li {display:inline; width:auto; position:relative; float:none; margin:0 10px 0 0; padding:0; height:20px; line-height:30px; padding:8px 10px 8px 0; border-right: 1px solid #06171D;}
-	#djDebugToolbar #djDebugButton {color:red; font-weight:bold;}
-	#djDebug * {margin:0; padding:0; float:none; position:static; }
-	#djDebug .panelContent {display:none; position:absolute; margin:0; padding:5px; top:35px; width:auto; left:5px; right:5px; bottom:5px; background:white; color:black; border:1px solid black; z-index:1000000; overflow:auto;}
-	#djDebug .panelContent p {padding: 0 5px;}
-	#djDebug .panelContent p, #djDebug .panelContent table, #djDebug .panelContent ul, #djDebug .panelContent dl {margin:5px 0;}
-	#djDebug .close {float:right; font-weight:bold;}
-	#djDebug .panelContent dt, #djDebug .panelContent dd {display: block;}
-	#djDebug .panelContent dd {margin-left:10px;}
-	#djDebug th, #djDebug td {padding: 5px;}
-	#djDebug .row1 td {background:#fff;}
-	#djDebug .row2 td {background:#ddd;}
+  @import url(/__debug__/m/toolbar.css);
 </style>
 <div id="djDebug">
 	<div id="djDebugToolbar">
@@ -42,7 +10,7 @@
 			{% for panel in panels %}
 				<li>
 					{% if panel.has_content %}
-						<a href="{{ panel.url|default:"#" }}" onclick="djDebugToggle('{{ panel.dom_id }}')" title="{{ panel.title }}" class="{{ panel.dom_id }}">{{ panel.title }}</a>
+						<a href="{{ panel.url|default:"#" }}" title="{{ panel.title }}" class="{{ panel.dom_id }}">{{ panel.title }}</a>
 					{% else %}
 						{{ panel.title }}
 					{% endif %}
@@ -54,7 +22,7 @@
 		{% if panel.has_content %}
 			<div id="{{ panel.dom_id }}" class="panelContent">
 				<div class="title">
-					<a href="" onclick="djDebugClose()" class="close">Close</a>
+					<a href="" class="close">Close</a>
 				</div>
 				{{ panel.content|safe }}
 			</div>
diff --git a/debug_toolbar/urls.py b/debug_toolbar/urls.py
index c8ec7cd..26a5ca2 100644
--- a/debug_toolbar/urls.py
+++ b/debug_toolbar/urls.py
@@ -9,5 +9,5 @@ from django.conf.urls.defaults import *
 from django.conf import settings
 
 urlpatterns = patterns('', 
-    url('^__debug__/m/(.*)$', 'debug_toolbar.views.debug_media', name='debug_toolbar_media'),
+    url('^__debug__/m/(.*)$', 'debug_toolbar.views.debug_media'),
 )
\ No newline at end of file