add audio, useragent check, direct links, interface stuff

1 files changed, 113 insertions, 0 deletions

diff --git a/contrib/site/js/player.js b/contrib/site/js/player.js
new file mode 100644
index 0000000..619bf08
--- /dev/null
+++ b/contrib/site/js/player.js
@@ -0,0 +1,113 @@
+'use strict';
+
+function Player() {
+  this.init = function(video) {
+    if (video) {
+      this.$media = $('#video');
+    } else {
+      this.$media = $('#audio');
+    }
+    this.media = this.$media.get()[0];
+  };
+
+  this.play = function() {
+    $('#video-overlay').hide();
+    $('#player-state').css('background-position', '-25px -125px');
+    this.media.load();
+    this.media.play();
+  };
+
+  this.stop = function() {
+    $('#video-overlay').show();
+    $('#player-state').css('background-position', '0px -125px');
+    this.media.pause();
+  };
+
+  this.playstop = function() {
+    if(this.media.paused == true) {
+      this.play();
+    } else {
+      this.stop();
+    }
+  };
+
+  this.repaintVolumeControls = function() {
+    if(this.media.muted) {
+      $('#player-mute').css('background-position', '0px -150px');
+      return;
+    }
+
+    if(this.media.volume <= 0) {
+      $('#player-mute').css('background-position', '-25px -150px');
+      return;
+    }
+
+    if(this.media.volume < 0.5) {
+      $('#player-mute').css('background-position', '-50px -150px');
+      return;
+    }
+
+    $('#player-mute').css('background-position', '-75px -150px');
+  };
+
+  this.updatevolume = function() {
+    this.media.volume = $('#player-volume').val() / 100;
+    this.repaintVolumeControls();
+  };
+
+  this.togglemute = function() {
+    this.media.muted = !this.audio.muted;
+    $('#player-volume').prop('disabled', this.media.muted);
+    this.repaintVolumeControls();
+  };
+
+  this.fullscreen = function() {
+    if (this.media.requestFullscreen) {
+      this.media.requestFullscreen();
+    } else if (this.media.msRequestFullscreen) {
+      this.media.msRequestFullscreen();
+    } else if (this.media.mozRequestFullScreen) {
+      this.media.mozRequestFullScreen();
+    } else if (this.media.webkitRequestFullscreen) {
+      this.media.webkitRequestFullscreen();
+    }
+  };
+}
+
+var player = new Player();
+
+function player_init(video) {
+  player.init(video);
+  $('#player-playstop').on('click', player_playstop);
+  $('#player-state').on('click', player_playstop);
+  player.playstop();
+  if(navigator.userAgent.match(/(\(iPod|\(iPhone|\(iPad)/)) {
+    $('#player-volume').prop('disabled', true);
+    this.repaintVolumeControls();
+  } else {
+    $('#player-volume').on('change input', player_updatevolume);
+    $('#player-mute').on('click', player_togglemute);
+  }
+  $('#fullscreen').on('click', function(event) {
+    event.preventDefault();
+    player.fullscreen();
+  });
+
+  $(document).on('keypress', function(e) {
+    if(e.which == 32) {
+      player.playstop();
+    }
+  });
+}
+
+function player_playstop() {
+  player.playstop();
+}
+
+function player_updatevolume() {
+  player.updatevolume();
+}
+
+function player_togglemute() {
+  player.togglemute();
+}