Add test youtube embed page

timvideos · Oct 5, 2014 · 0c78ac2 · 0c78ac2
1 parent ef80192
commit 0c78ac2
Show file tree

Hide file tree

Showing 3 changed files with 238 additions and 0 deletions.
diff --git a/website/frontend/templates/youtube-embed.html b/website/frontend/templates/youtube-embed.html
@@ -0,0 +1,233 @@
+{% extends "base.html" %}
+{% comment %}
+-*- coding: utf-8 -*-
+vim: set ts=2 sw=2 et sts=2 ai ft=htmldjango:
+{% endcomment %}
+{% load safe_js %}
+
+{% block head %}
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
+    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
+    <script type="text/javascript" src="/static/third_party/jwplayer/jwplayer.js"></script>
+
+    <script type="text/javascript" src="/static/js/jquery.tweet.js"></script>
+    <link href="/static/css/jquery.tweet.css" media="all" rel="stylesheet" type="text/css"/>
+
+    <title>Test Stream</title>
+{% endblock %}
+
+{% block content %}
+      <td id="now_cell now_cell_group" colspan=2 style="height: 1px;">
+        <div id="showing" class='now_div now_div_group'>
+          <div id='now_info' class='now_info now_info_group' onclick='$(".now_desc").fadeToggle();'>(More info)</div>
+          <div id='now_time' class='now_time now_time_group'></div>
+          <div id='now_title' class='now_title now_title_group'></div>
+          <div id='now_desc' class='now_desc now_desc_group'></div>
+        </div>
+      </td>
+    </tr><tr>
+      <td id="options" colspan=2>
+      </td>
+    </tr><tr>
+      <td id="player-cell">
+        <div id="player-container" class="container_2">
+          <div id="player-sizer" class="sizer">
+            <iframe width="800" height="450" src="//www.youtube.com/embed/nLV7FNCHjsE?rel=0" frameborder="0" allowfullscreen></iframe>
+          </div>
+        </div>
+      </td>
+      <td id="chat-cell">
+        <div id="chat-container" class="container_3">
+          <div id="chat-sizer" class="sizer">
+            <iframe id="chat-frame" src="http://webchat.freenode.net/?channels=%23timvideos&uio=MTA9dHJ1ZQ49"></iframe>
+          </div>
+        </div>
+      </td>
+    </tr><tr>
+      <td id="twitter-cell" colspan=2>
+        <div id="twitter-container" class="container_3">
+          <div id="twitter-sizer" class="sizer">
+            <div class="related-tweets" style="height: 48px; overflow: hidden;">Searching Twitter...</div>
+            <div id="twitter-search">Search on Twitter:
+              <a class=tag href="https://twitter.com/search?q=timvideos" rel="tag">timvideos</a>
+            </div>
+          </div>
+        </div>
+      </td>
+    </tr><tr>
+      <td id="next_cell next_cell_group" colspan=2 style="height: 1px;">
+        <div id="showing" class='next_div next_div_group'>
+          <div id='next_info' class='next_info next_info_group' onclick='$(".next_desc").fadeToggle();'>(More info)</div>
+          <div id='next_time' class='next_time next_time_group'></div>
+          <div id='next_title' class='next_title next_title_group'></div>
+          <div id='next_desc' class='next_desc next_desc_group'></div>
+        </div>
+      </td>
+{% endblock %}
+
+{% block script %}
+<script type="text/javascript">
+
+$(document).ready(function() {
+  $(".related-tweets").tweet({
+    twitter_api_proxy_url: '{% url "switter_tweets" %}',
+
+    query: "timvideos",
+    page: 1,
+    avatar_size: 32,
+    count: 20,
+    loading_text: "Searching Twitter...",
+    refresh_interval: 30,
+
+    retweet: false,
+  }).bind("loaded", function() {
+    var ul = $(".related-tweets").find(".tweet_list");
+    ul.css("position", "relative");
+    var ticker = function() {
+      setTimeout(function() {
+        var top = ul.position().top;
+        var h = ul.height();
+        var incr = (h / ul.children().length);
+        var newTop = top - incr;
+        if (h + newTop <= 0) newTop = 0;
+        ul.animate( {top: newTop+"px"}, 500 );
+        ticker();
+      }, 5000);
+    };
+    ticker();
+  });
+
+  // Get and set URLs for direct links
+  var direct_hd_url = streamer_{{group|safe_js}}.html5_streams.hd[0].file;
+  var direct_sd_url = streamer_{{group|safe_js}}.html5_streams.download;
+  var direct_audio_url = streamer_{{group|safe_js}}.audio_streams.download;
+  $("#direct_hd_url").attr("href", direct_hd_url);
+  $("#direct_sd_url").attr("href", direct_sd_url);
+  $("#direct_audio_url").attr("href", direct_audio_url);
+});
+</script>
+<script type="text/javascript">
+
+/**
+ * Resize the player to fit the window.
+ */
+function fit_player () {
+  var player_sizer = $("#player-cell");
+  if (player_jwobject) {
+    player_jwobject.resize(player_sizer.width()-20, player_sizer.height()-20);
+  }
+}
+
+function start_it () {
+  if (player_jwobject) {
+    var state = player_jwobject.getState();
+    if (state == player_jwobject.IDLE) {
+       player_jwobject.play(true);
+    }
+  }
+}
+setInterval(start_it, 1e3);
+
+
+// When the window's size changes, so does ours.
+$(window).resize(fit_player);
+// Universal fix for every layout problem ever, amirite?
+setTimeout(fit_player, 2000);
+
+/**
+ * HD stream options
+ */
+var quality_option = $('input[name=quality][type=radio]');
+function quality_set(value) {
+  if (player_jwobject) {
+    var format = player_format;
+    if (value == format)
+      return;
+
+    if (player_format == 'auto') {
+      format = player_jwobject.renderingMode;
+    }
+    if (format)
+      player_jwobject.load(streamer_{{group|safe_js}}.levels(format, value));
+  }
+  var option = $('input[name=quality][type=radio][value='+value+']');
+  option.attr('checked', true);
+}
+function quality_change(evt) {
+  var value = $('input[name=quality][type=radio]:checked').val();
+  quality_set(value);
+}
+quality_option.change(quality_change);
+
+/**
+ * Format of the streaming.
+ */
+var player_jwobject = null;
+var player_format = null;
+var format_option = $('input[name=format][type=radio]');
+function format_set(value) {
+
+  // Clean up the previous player
+  if (player_jwobject) {
+    player_jwobject.remove();
+    player_jwobject = null;
+  }
+  var jwplayer_create = false;
+  if (value == 'novideo') {
+  }
+
+  if (value == 'auto' || value == 'flash' || value == 'html5' || value == 'audio') {
+    // Create the player
+    var jwsettings = {
+      file: 'http://964bdd2f965bbc4ca8f5-3ebaa0e988d98119a4fead51a26da83a.r42.cf2.rackcdn.com/pyohio-2014/2845_diversity_in_tech.webm',
+      autostart: true,
+      plugins: {
+        'gapro-2': {
+          'trackstarts': true,
+          'trackpercentage': false,
+          'trackseconds': true
+        }
+      },
+    };
+    player_jwobject = jwplayer("player").setup(jwsettings);
+    fit_player();
+
+    player_jwobject.onPlaylist(start_it);
+    player_jwobject.onPlaylistItem(start_it);
+    player_jwobject.onComplete(start_it);
+
+    // Enable the quality widget
+    $('#quality-container').show();
+  } else {
+    // Disable the quality widget
+    $('#quality-container').hide();
+  }
+
+  player_format = value;
+
+  var option = $('input[name=format][type=radio][value='+value+']');
+  option.attr('checked', true);
+}
+function format_change(evt) {
+  var value = $('input[name=format][type=radio]:checked').val();
+  format_set(value);
+}
+format_option.change(format_change);
+
+format_change();
+quality_change();
+</script>
+<script type="text/javascript">
+function schedule_callback() {
+  update_schedule($('#now_title'), $('#now_desc'), '{{config.title|escapejs}}', $('#next_title'), $('#next_desc'), $('#next_time'), $('#now_time'), '{{group|escapejs}}');
+  fit_player();
+}
+
+function poll_schedule() {
+  get_schedule(schedule_callback, '{{group|escapejs}}');
+}
+setInterval(poll_schedule, 60e3);
+poll_schedule();
+
+</script>
+{% endblock %}
diff --git a/website/frontend/urls.py b/website/frontend/urls.py
@@ -14,6 +14,7 @@
     url(r'^(monitor)$', views.index),
     url(r'^graphs$', views.overall_stats_graphs),
     url(r'^test$', views.test),
+    url(r'^pytexas$', views.youtube),
 
     # Per room things
     url(r'^', include(feeds.urls)),       # room/rss - Schedule as RSS

diff --git a/website/frontend/views.py b/website/frontend/views.py
@@ -46,6 +46,10 @@ def test(request):
     return render_to_response('test.html', '')
 
 
+def youtube(request):
+    return render_to_response('youtube-embed.html', '')
+
+
 def group(request, group):
     if not CONFIG.valid(group):
         if settings.DEBUG: