film pages

app/templates/film.html

@@ -43,7 +43,7 @@ body {
             </div>
 				
 		</div>	
-		<div class="video-block">	
+		<div class="video-block">
 			<img src="{{ stream_prefix }}{{ film.items.0.id }}/loop.jpg" class="video-fallback-block">
 			<video
 				id="timeline-video"
@@ -61,10 +61,10 @@ body {
                 <br>
             <p>{{ film.data.summary_zh|safe }}</p>
         </div>
-		<div class="videos">
+		<div class="items">
 			{% for item in film.data.items %}
-			<div class="video">
-				<a href="fixme">
+			<div class="item">
+				<a href="play/{{  item.id }}">
 					<figure>
 					<img src="https://archive.njp.ma/{{ item.id }}/480p.jpg">
 					<figcaption>
@@ -99,6 +99,9 @@ body {
 		<script>
 			var film = {{ film.json | safe }};
 			film.prefix = "{{ stream_prefix }}";
+			var pandoraURL =  "{{ pandora_url }}";
 		</script>
+		{% comment %}
 		<script src="{% static 'js/film.js' %}"></script>
+		{% endcomment %}
 {% endblock %}

app/templates/film_play.html

@@ -4,9 +4,8 @@
 {% endblock %}
 {% block end %}
 <script>
-	var film = {
-		id: "{{ film.pandora_id }}",
-	}
+	var config = {{ config | safe }};
+	var pandoraURL = "{{ pandora_url }}";
 </script>
-<script src="/static/js/ascroll.js"></script>
+<script src="/static/js/play.js"></script>
 {% endblock %}

app/templates/text.html

@@ -37,6 +37,7 @@
 {% block end %}
 <script>
 	var config = {{ text.json | safe }};
+	var pandoraURL = "{{ pandora_url }}";
 </script>
 <script src="/static/js/ascroll.js?2"></script>
 {% endblock %}