{% load i18n %}
<script type="text/javascript" charset="utf-8">
	// When jQuery is sourced, it's going to overwrite whatever might be in the
	// '$' variable, so store a reference of it in a temporary variable...
	var _$ = window.$;
	if (typeof jQuery == 'undefined') {
		var jquery_url = '{{ BASE_URL }}/__debug__/m/jquery.js';
		document.write(unescape('%3Cscript src="' + jquery_url + '" type="text/javascript"%3E%3C/script%3E'));
	}
</script>
<script type="text/javascript" src="{{ BASE_URL }}/__debug__/m/toolbar.min.js"></script>
<script type="text/javascript" charset="utf-8">
	// Now that jQuery is done loading, put the '$' variable back to what it was...
	var $ = _$;
</script>
<style type="text/css">
	@import url({{ BASE_URL }}/__debug__/m/toolbar.min.css);
</style>
<div id="djDebug">
	<div style="display:none;" id="djDebugToolbar">
		<ul id="djDebugPanelList">
			{% if panels %}
			<li><a id="djHideToolBarButton" href="#" title="Hide Toolbar">{% trans "Hide" %} &raquo;</a></li>
			{% else %}
			<li id="djDebugButton">DEBUG</li>
			{% endif %}
			{% for panel in panels %}
				<li>
					{% if panel.has_content %}
						<a href="{{ panel.url|default:"#" }}" title="{{ panel.title }}" class="{{ panel.dom_id }}">
					{% else %}
					    <div class="contentless">
					{% endif %}
					{{ panel.nav_title }}
					{% with panel.nav_subtitle as subtitle %}
						{% if subtitle %}<br><small>{{ subtitle }}</small>{% endif %}
					{% endwith %}
					{% if panel.has_content %}
						</a>
					{% else %}
					    </div>
					{% endif %}
				</li>
			{% endfor %}
		</ul>
	</div>
	<div style="display:none;" id="djDebugToolbarHandle">
		<a title="Show Toolbar" id="djShowToolBarButton" href="#">&laquo;</a>
	</div>
	{% for panel in panels %}
		{% if panel.has_content %}
			<div id="{{ panel.dom_id }}" class="panelContent">
				<div class="djDebugPanelTitle">
					<a href="" class="close">{% trans "Close" %}</a>
					<h3>{{ panel.title|safe }}</h3>
				</div>
				<div class="djDebugPanelContent">
				    <div class="scroll">
				        {{ panel.content|safe }}
				    </div>
				</div>
			</div>
		{% endif %}
	{% endfor %}
	<div id="djDebugWindow" class="panelContent"></div>
</div>