<div id="srv_show" class="srv_adminBox">
	<a href="#"><span>Expand toolbar &#187;</span></a>
</div>
<div id="srv_toolbar">
<div id="srv_adminBar" class="adminOut1 srv_adminBox">
	<ul id="srv_adminList">
		<li class="hideTools"><a href="#">Hide toolbar &#187;</a></li>
		{% 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>
	<!--<button class="srv active">Publish Edits</button>
	<p><a href="#">Save Draft</a></p>-->
</div>
    
{% for panel in panels %}
{% if panel.has_content %}
	<div id="{{ panel.dom_id }}" class="srv_toolPanel {{ panels.all.length }} x">
		 {{ panel.content|safe }}
	</div>
{% else %}
	<div id="{{ panel.dom_id}}">{{ panel.nav_title }}</div>
{% endif %}
{% endfor %}
</div><!--/#srv_toolbar-->

<!--<div class="drillRight1 srv_adminBox">
	<ul>
		<li class="hideTools"><a href="#">Close Content menu &#187;</a></li>
		<li><a href="#">New Standard Page</a></li>
		<li><a href="#">New External Link Container</a></li>
		<li><a href="#">New Blog Container</a></li>
		<li><a href="#">New Calendar Container</a></li>
		<li><a href="#">New <em>News</em> Entry</a></li>
		<li><a href="#">New <em>Editor's Blog</em> Entry</a></li>
		<li><a href="#">New <em>Upcoming Events</em> Entry</a></li>

		<li><a href="#">Edit this Template</a></li>
		<li><a href="#">Code Editor</a></li>
		<li><a href="#">Choose a different template for this page</a></li>
		<li><a href="#">Create a new template</a></li>
	</ul>    
</div>-->

<script type="text/javascript">
$(document).ready(function(){
	function allow_expand_cog(){
		$('div#srv_show a').hover(function(e){
		   	$('div#srv_show').animate({
				  right: 0
			}, 'fast');
		},
		function(){
		   		$('div#srv_show').animate({
					  right: -110
					}, 'fast');
		});
	}
	allow_expand_cog();
	$('div#srv_show a').click(function(e){
    	$('div#srv_show a').unbind('mouseover')
		$('div#srv_show a').unbind('mouseout')
		$("#srv_toolbar").show()
		$('div#srv_adminBar.adminOut1').animate({
			right: 0
		}, 'fast');
		$('div#srv_show').animate({
	  		right: -180
		}, 'fast');
		e.preventDefault();
		return false;
	 });
	 $('li.hideTools a').click(function(e){
		$("#srv_toolbar").hide()
		$('div#srv_adminBar.adminOut1').animate({
			right: -180
		}, 'fast');
		$('div#srv_show').animate({
			right: -110
		}, 'fast');
		allow_expand_cog()
		
		e.preventDefault()
		return false;
	 });
	
	$(".srv_toolPanel").children().andSelf().hide();
	$("ul#srv_adminList li a:not(:first)").click(function(e){
		$("div.srv_toolPanel").hide();
		$("ul.srv_adminList li").removeClass('active');
		console.log('Showing Panel: ' + $(this).attr('class'))
		$("div#" +$(this).attr('class')).children(':not(script)').andSelf().show();
		$(this).parent().addClass('active');
	});
});
</script>