Fixing new nav for episodes/emissions

panikweb/urls.py

@@ -14,8 +14,9 @@ urlpatterns = patterns('',
     url(r'^program/(?P<year>\d{4})/(?P<week>\d+)/$', 'panikweb.views.program', name='program_week'),
     url(r'^grid$', 'panikweb.views.grid', name='grid'),
     url(r'^emissions/$', 'panikweb.views.emissions', name='emissions'),
-    url(r'^emissions/(?P<slug>[\w,-]+)/$', 'panikweb.views.emission', name='emission-view'),
     url(r'^emissions/(?P<emission_slug>[\w,-]+)/(?P<slug>[\w,-]+)/$', 'panikweb.views.episode', name='episode-view'),
+    url(r'^emissions/(?P<slug>[\w,-]+)/\+', 'panikweb.views.emissionEpisodes', name='emissionEpisodes'),
+    url(r'^emissions/(?P<slug>[\w,-]+)', 'panikweb.views.emission', name='emission-view'),
     url(r'^ckeditor/', include('ckeditor.urls')),
     url(r'^archives$', 'panikweb.views.archives', name='archives'),
     url(r'^get$', 'panikweb.views.get', name='get'),

panikweb/views.py

@@ -76,6 +76,18 @@ class EpisodeDetailView(DetailView, EmissionMixin):
 episode = EpisodeDetailView.as_view()
 
 
+class EmissionEpisodesDetailView(DetailView, EmissionMixin):
+    model = Emission
+    template_name = 'emissions/episodes.html'
+
+    def get_context_data(self, **kwargs):
+        context = super(EmissionEpisodesDetailView, self).get_context_data(**kwargs)
+        context['sectionName'] = "Emissions"
+        context['schedules'] = Schedule.objects.select_related().filter(emission=self.object).order_by('datetime')
+        context.update(self.get_emission_context(self.object))
+        return context
+emissionEpisodes = EmissionEpisodesDetailView.as_view()
+
 class ProgramView(TemplateView):
     template_name = 'program.html'
 

panikweb_templates/static/css/general.css

@@ -96,10 +96,10 @@ nav{
 }
 hr {
 	height: 0;
-	margin:0;
+	margin:0.5em 0 0.5em 0;
 	padding:0;
 	border-style:solid;
-	border-width:1px 0;
+	border-width:2px 0 0 0 ;
 	border-color:black;
 }
 table{

panikweb_templates/static/css/specifics.css

@@ -182,8 +182,6 @@ body{
 	float:right;
 	padding:1em;
 }
-
-
 #metaNav {
 	height: 2em;
 	color:white;
@@ -241,6 +239,11 @@ body{
 	text-align:center;
 	border-bottom:1px solid #000;
 	background:#003446;
+	/*
+	-moz-box-shadow: 0px 0px 100px rgb(0, 0, 0) inset;
+	-webkit-box-shadow: 0px 0px 100px rgb(0, 0, 0) inset;
+	box-shadow: 0px 0px 100px rgb(0, 0, 0) inset;
+	*/
 }
 #Nav nav{padding:0.1em;}
 #Nav *{	color:#ccc;border-color:#ddd;}
@@ -288,15 +291,15 @@ body{
 /**** PLAYER ****/
 /*#Home #player{   float: left; } */
 #player-container{
-	color:white;
+	color:#000;
 	-moz-box-shadow: 0px 5px 5px #000;
 	-webkit-box-shadow:  0px 5px 5px #000;
 	box-shadow: 0px 5px 10px #000;
 	font-size:1em;
 background-color:#ff6633; border-color:#fff;}
-#player-container button{
+#player-container button,#player-container a{
 	border-color:#fff;
-	color:white;
+	color:#000;
 	background-color:transparent;
 }
 #player-container .metas, #player-container img{border-color:#fff;}
@@ -308,10 +311,9 @@ background-color:#ff6633; border-color:#fff;}
 }
 #player-container .metas{
 	text-align:center;
-	color:white !important;
 }
 #player-container .label{
-	color:white !important;
+	color:#000;
 }
 #player-container{
 	border-top:2px solid black;
@@ -460,7 +462,7 @@ background-color:#ff6633; border-color:#fff;}
 #Emission .emission-detail .title{}
 /*
 */
-@media screen and (min-width: 800px) {
+@media screen and (min-width: 600px) {
 	#Emissions #Changing .wrapper.sided{
 		max-width:1000px;
 	}
@@ -801,6 +803,8 @@ background-color:#ff6633; border-color:#fff;}
 	color:#1663d5 !important;
 }*/
 
+#player-container{}
+#Nav{}
 
 #Search a.icon-check-empty.count-0{
 	display:none;

panikweb_templates/static/js/specifics.js

@@ -12,7 +12,7 @@ $(function() {
 		controlContainer: $('<div>',{class:"playListControls label"}).sortable(),
 		playlistContainer: $('<ol>',{id:"myPlaylist",class:"custom"}).sortable(),
 		onLoad:function(self){
-			$('#localList').children('.label').on('click',function(){ 
+			$('#playlistLabel').on('click',function(){ 
 				self.playlistContainer.toggleClass('deploy');
 			});
 			if(self.isActive){self.playlistContainer.scrollTo(self.isActive, 800 );}

panikweb_templates/templates/emissions/detail.html

 {% load i18n %}
 {% load paniktags %}
 <div class="emission emission-detail cf">
-	<div class="metas cf">
+	<div class="metas">
+		{% if emission.email and emission.website %}
+		<div class="contacts">
+			{% if emission.email %}
+				<div class="email ellipsis">{{ emission.email|strreplace:"@, (AT) "|strreplace:"., (DOT) "}}</div>
+			{% endif %}
+			{% if emission.website %}
+				<div class="contact ellipsis"><a href="{{ emission.website}}">{{ emission.website}}</a></div>
+			{% endif %}
+		</div>
+		<hr />
+		{% endif %}
+		{% if emission.image %}
+			<img class="logo" src="{{ emission.image.url }}"/>
+		{% endif %}
 		{% if schedules %}
-			<ul class="schedule custom left">
+			<ul class="schedule custom">
 				{% for schedule in schedules %}
 				<li>
 					<div>
@@ -14,20 +28,8 @@
 				{% endfor %}
 			</ul>
 		{% endif %}
-		<div class="contacts right">
-			{% if emission.email %}
-				<div class="email ellipsis">{{ emission.email|strreplace:"@, (AT) "|strreplace:"., (DOT) "}}</div>
-			{% endif %}
-			{% if emission.email and emission.website %}{% endif %}
-			{% if emission.website %}
-				<div class="contact ellipsis"><a href="{{ emission.website}}">{{ emission.website}}</a></div>
-			{% endif %}
-		</div>
 	</div>
 
-	{% if emission.image %}
-		<img class="logo" src="{{ emission.image.url }}"/>
-	{% endif %}
 
 	{% if emission.description %}
 	<div class="description">

panikweb_templates/templates/emissions/emission_detail.html

 {% extends "emissions.html" %}
 {% load paniktags %}
+{% load thumbnails %}
+{% load staticfiles %}
 {% block bodyID %}Emissions{% endblock %}
 {% block nav %}
 	{% emission_nav %}
@@ -9,14 +11,11 @@
 	<div id="Emission-container" class="emission padded">
 		<div data-tabbed="true" id="Emission-tabs-default">
 			<div id="Emission-tabs-detail">
-				<h5 class="sectionLabel">À propos</h5>
 				{% emission_detail %}
 			</div>
 
 			<div id="Emission-tabs-last" class="episodes">
-			{% if episode %}
-				{% episode_detail %} 
-			{% elif episodes %}
+			{% if episodes %}
 					<h5 class="sectionLabel">Derniers épisodes</h5>
 				{% with episodes|slice:"0:1" as episodes %}
 					{% for episode in episodes %}
@@ -33,32 +32,24 @@
 			{% endif %}
 			</div>
 		</div>
-		{% if episodes %}
-		<div data-tabbed="true" id="Emission-tabs-episodes" class="episodes">
-			{% with episodes as episodes %}
-				{% regroup episodes by first_diffusion|date:"F Y"|capfirst as month_list %}
-				<div>
-				{% for month in month_list %}
-					<div class="monthGroup {% if forloop.counter|divisibleby:2 %}even{% else %}odd{% endif %}">
-						<div 
-							class="legend button" 						
-							onclick="$('#{{ month.grouper|slugify }}').toggle();"
-						>{{ month.grouper }}</div>
-						<ul class="custom list" id="{{ month.grouper|slugify }}" 
-							{% if forloop.counter >= 3 %}style="display:none;"{% endif %}
-						>
-						{% for episode in month.list %}
-							<li>{% episode_resume model="inline" date="daytime" %}</li>
-						{% endfor %}
-						</ul>
-					</div>
-				{% endfor %}
-				</div>
-			{% endwith %}
-		</div>
-		{% endif %}
 	</div>
 </div>
 {% endblock %}
-{% block pageend %}
+{% block links %}
+	{% if episodes %}
+	<div class="wrapper padded">	
+		<h2>Archives</h2>
+		<ul class="custom list columns padded episodes">
+		{% for episode in episodes %}
+			<li class="ellipsis">
+				<a href="{% url 'episode-view' emission_slug=episode.emission.slug slug=episode.slug %}">
+						{% if episode.main_sound %}<span class="icon-headphones" ></span>{% endif %}
+					<strong>{{episode.first_diffusion|date:"d M y"}}</strong>|
+					{{ episode.title }}
+				</a>
+			</li>
+		{% endfor %}
+		</ul>
+	</div>
+	{% endif %}
 {% endblock %}

panikweb_templates/templates/emissions/episode_detail.html

 {% extends "emissions/emission_detail.html" %}
 
+{% load paniktags %}
+{% load thumbnails %}
+{% load staticfiles %}
+{% block main %}
+<div class="wrapper {% if episodes %}sided{% endif %}">
+	<div id="Emission-container" class="emission padded">
+		<div data-tabbed="true" id="Emission-tabs-default">
+			<div id="Emission-tabs-last" class="episodes">
+				{% episode_detail %} 
+			</div>
+			<div id="Emission-tabs-detail">
+				<h5 class="sectionLabel">À propos</h5>
+				{% emission_resume %}
+
+				<h5 class="sectionLabel">Derniers épisodes</h5>
+				{% with episodes|slice:"0:3" as episodes %}
+					{% for episode in episodes %}
+						{% episode_resume model="inline" %}
+					{% endfor %}
+				{% endwith %}
+			</div>
+		</div>
+	</div>
+</div>
+{% endblock %}

panikweb_templates/templates/emissions/episodes.html

+{% extends "emissions/emission_detail.html" %}
+{% load paniktags %}
+{% block nav %}
+	{% emission_nav %}
+{% endblock %}
+
+{% block main %}
+<div class="wrapper {% if episodes %}sided{% endif %}">
+	<div id="Emission-container" class="emission padded">
+		{% if episodes %}
+			{% with episodes as episodes %}
+				{% regroup episodes by first_diffusion|date:"F Y"|capfirst as month_list %}
+				<div>
+				{% for month in month_list %}
+					<div class="monthGroup {% if forloop.counter|divisibleby:2 %}even{% else %}odd{% endif %}">
+						<div 
+							class="legend button" 						
+							onclick="$('#{{ month.grouper|slugify }}').toggle();"
+						>{{ month.grouper }}</div>
+						<ul class="custom list" id="{{ month.grouper|slugify }}" 
+							{% if forloop.counter >= 3 %}style="display:none;"{% endif %}
+						>
+						{% for episode in month.list %}
+							<li>{% episode_resume model="inline" date="daytime" %}</li>
+						{% endfor %}
+						</ul>
+					</div>
+				{% endfor %}
+				</div>
+			{% endwith %}
+		{% endif %}
+	</div>
+</div>
+{% endblock %}

panikweb_templates/templates/emissions/nav.html

@@ -53,29 +53,21 @@
 			</div>
 		{% endif %}
 		</header>
+		<!--
 		{% if episodes %}
 		<div class="wrapper half">
-			<nav class="tabs" data-tab-about="#Emission-container">
+			<nav>
 				<ul class="distributed">
 					<li>
-						<button data-tab="#Emission-tabs-default" class="active" >
-							<span class="iconLabel">En bref</span>
-						</button>
+						<a href="{% url 'emission-view' slug=emission.slug %}">En bref</a>
 					</li>
 					<li>
-						<button data-tab="#Emission-tabs-episodes">
-							<span class="iconLabel">Episodes ({{ episodes.count }})</span>
-						</button >
+						<a href="{% url 'emissionEpisodes' slug=emission.slug %}">Episodes ({{ episodes.count }})</a>
 					</li>
 				</ul>
-				<!--
-				{% if episode %}
-				<hr />
-					<h4 class="active button padded " data-tab="#Emission-tabs-current">{{ episode.title }}</h4>
-				{% endif %}
-				-->
 			</nav>
 		</div>
+		-->
 		{% endif %}
 	{% endif %}
 </div>

panikweb_templates/templates/emissions/resume.html

 {% load thumbnails %}
-<div class="emission emission-resume resume">
+{% load staticfiles %}
+<div class="emission emission-resume resume cf">
 	<div class="{% if emission.archived %}archived{% endif %}">
 		<a class="block" href="{% url 'emission-view' slug=emission.slug %}">
 			<div class="logo left">
 				{% if emission.image %}
 					<img width="50" height="50" src="{{ emission.image|thumbnail:'50x50' }}"/>
 				{% else %}
-					<img src="http://placehold.it/50x50">
+					<img width="50" height="50" src="{% static "img/defaultLogo.png" %}"/>
 				{% endif %}
 			</div>
 			<h5 class="title ellipsis">{{ emission.title }}</h5>

panikweb_templates/templates/episodes/resume.html

@@ -11,7 +11,7 @@
 			</div>
 			{% if date != "daytime" %}
 			<div class="month">
-			    {{ episode.first_diffusion|date:"M Y" }}
+			    {{ episode.first_diffusion|date:"M y" }}
 			</div>
 			{% endif %}
 			<div class="time">

panikweb_templates/templates/home.html

 {% extends "base.html" %}
 {% load thumbnails %}
 {% load paniktags %}
+{% load staticfiles %}
 {% block bodyID %}Home{% endblock %}
 {% block title %}Home{% endblock %}
 {% block nav %}
@@ -36,8 +37,13 @@
 		<h2>Emissions</h2>
 		<ul class="custom list columns padded">
 		{% for emission in emissions %}
-			<li class="item">
-				<a href="{% url 'emission-view' slug=emission.slug %}">{{ emission.title }}</a>
+			<li class="item ellipsis">
+				<a href="{% url 'emission-view' slug=emission.slug %}">
+					{% if emission.image %}
+						<img style="float:right;margin-left:1em;" src="{{ emission.image|thumbnail:'20x20' }}"/>
+					{% endif %}
+					{{ emission.title }}
+				</a>
 			</li>
 		{% endfor %}
 		</ul>