Skip to content

E
edx-platform
Commit dfb05bbb by Prem Sichanugrist
Options

Refactor and removed unused code

parent e58674f2
Showing with 32 additions and 655 deletions
static/coffee/src/courseware.coffee
......@@ -3,6 +3,7 @@ class window.Courseware
new CoursewareNavigation
new Calculator
new FeedbackForm
Logger.bind()
@renderModules()
@start: ->
......
static/coffee/src/main.coffee
$ ->
$.ajaxSetup
headers : { 'X-CSRFToken': $.cookie 'csrftoken' }
dataType: 'json'
window.onTouchBasedDevice = ->
navigator.userAgent.match /iPhone|iPod|iPad/i
$("a[rel*=leanModal]").leanModal()
$('#csrfmiddlewaretoken').attr 'value', $.cookie('csrftoken')
if $('body').hasClass('courseware')
Courseware.start()
# Preserved for backward compatibility
window.submit_circuit = (circuit_id) ->
$("input.schematic").each (index, element) ->
element.schematic.update_value()
schematic_value $("#schematic_#{circuit_id}").attr("value")
$.post "/save_circuit/#{circuit_id}", schematic: schematic_value, (data) ->
alert('Saved') if data.results == 'success'
static/js/video_player.js deleted 100644 → 0
// Things to abstract out to another file
// We do sync AJAX for just the page close event.
// TODO: This should _really_ not be a global.
var log_close_event = false;
function log_close() {
var d=new Date();
var t=d.getTime();
//close_event_logged = "waiting";
log_close_event = true;
log_event('page_close', {});
log_close_event = false;
// Google Chrome will close without letting the event go through.
// This causes the page close to be delayed until we've hit the
// server. The code below fixes it, but breaks Firefox.
// TODO: Check what happens with no network.
/*while((close_event_logged != "done") && (d.getTime() < t+500)) {
console.log(close_event_logged);
}*/
}
window.onbeforeunload = log_close;
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
// Does this cookie string begin with the name we want?
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
function postJSON(url, data, callback) {
$.ajax({type:'POST',
url: url,
dataType: 'json',
data: data,
success: callback,
headers : {'X-CSRFToken':getCookie('csrftoken')}
});
}
function postJSONAsync(url, data, callback) {
$.ajax({type:'POST',
url: url,
dataType: 'json',
data: data,
success: callback,
headers : {'X-CSRFToken':getCookie('csrftoken')},
async:true
});
}
// For easy embedding of CSRF in forms
$(function() {
$('#csrfmiddlewaretoken').attr("value", getCookie('csrftoken'))
});
// For working with circuits in wiki:
function submit_circuit(circuit_id) {
$("input.schematic").each(function(index,element){ element.schematic.update_value(); });
postJSON('/save_circuit/'+circuit_id,
{'schematic': $('#schematic_'+circuit_id).attr("value")},
function(data){ if (data.results=='success') alert("Saved");});
return false;
}
// Video player
var load_id = 0;
var caption_id;
var video_speed = "1.0";
var updateytPlayerInterval;
var ajax_videoInterval;
function change_video_speed(speed, youtube_id) {
new_position = ytplayer.getCurrentTime() * video_speed / speed;
video_speed = speed;
ytplayer.loadVideoById(youtube_id, new_position);
syncPlayButton();
log_event("speed", {"new_speed":speed, "clip":youtube_id});
$.cookie("video_speed", speed, {'expires':3650, 'path':'/'});
}
function caption_at(index) {
if (captions==0)
return "";
text_array=captions.text
if ((index>=text_array.length) || (index < 0))
return "";
return text_array[index];
}
function caption_time_at(index) {
if (captions==0)
return 0;
time_array=captions.start;
if (index < 0)
return 0;
if (index>=time_array.length)
return ytplayer.getDuration();
return time_array[index] / 1000.0 / video_speed;
}
function caption_index(now) {
// Returns the index of the current caption, given a time
now = now * video_speed;
if (captions==0)
return 0;
time_array=captions.start
// TODO: Bisection would be better, or something incremental
var i;
for(i=0;i<captions.start.length; i++) {
if(time_array[i]>(now*1000)) {
return i-1;
}
}
return i-1;
}
function format_time(t)
{
seconds = Math.floor(t);
minutes = Math.floor(seconds / 60);
hours = Math.floor(minutes / 60);
seconds = seconds % 60;
minutes = minutes % 60;
if (hours) {
return hours+":"+((minutes < 10)?"0":"")+minutes+":"+((seconds < 10)?"0":"")+(seconds%60);
} else {
return minutes+":"+((seconds < 10)?"0":"")+(seconds%60);
}
}
function update_captions(t) {
var i=caption_index(t);
$("#vidtime").html(format_time(ytplayer.getCurrentTime())+' / '+format_time(ytplayer.getDuration()));
var j;
for(j=1; j<9; j++) {
$("#std_n"+j).html(caption_at(i-j));
$("#std_p"+j).html(caption_at(i+j));
}
$("#std_0").html(caption_at(i));
}
function title_seek(i) {
// Seek video forwards or backwards by i subtitles
current=caption_index(getCurrentTime());
new_time=caption_time_at(current+i);
ytplayer.seekTo(new_time, true);
}
function updateHTML(elmId, value) {
document.getElementById(elmId).innerHTML = value;
}
function setytplayerState(newState) {
// updateHTML("playerstate", newState);
}
// Updates server with location in video so we can resume from the same place
// IMPORTANT TODO: Load test
// POSSIBLE FIX: Move to unload() event and similar
var ajax_video=function(){};
var ytplayer;
function onYouTubePlayerReady(playerId) {
ytplayer = document.getElementById("myytplayer");
updateytplayerInfoInterval = setInterval(updateytplayerInfo, 500);
ajax_videoInterval = setInterval(ajax_video,5000);
ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
ytplayer.addEventListener("onError", "onPlayerError");
if((typeof load_id != "undefined") && (load_id != 0)) {
var id=load_id;
loadNewVideo(caption_id, id, 0);
}
}
/* HTML5 YouTube iFrame API Specific */
function onYouTubePlayerAPIReady() {
ytplayer = new YT.Player('html5_player', {
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
updateytplayerInfoInterval = setInterval(updateHTML5ytplayerInfo, 200);
//ajax_videoInterval = setInterval(ajax_video, 5000);
}
// Need this function to call the API ready callback when we switch to a tab with AJAX that has a video
// That callback is not being fired when we switch tabs.
function loadHTML5Video() {
if (!ytplayer && switched_tab){
onYouTubePlayerAPIReady();
}
}
function isiOSDevice(){
var iphone = "iphone";
var ipod = "ipod";
var ipad = "ipad";
var uagent = navigator.userAgent.toLowerCase();
//alert(uagent);
if (uagent.search(ipad) > -1 || uagent.search(iphone) > -1
|| uagent.search(ipod) > -1) {
return true;
}
return false;
}
function onPlayerReady(event) {
//do not want to autoplay on iOS devices since its not enabled
//and leads to confusing behavior for the user
if (!isiOSDevice()) {
event.target.playVideo();
}
}
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING) {
}
}
/* End HTML5 Specific */
var switched_tab = false; // switch to true when we destroy so we know to call onYouTubePlayerAPIReady()
// clear pings to video status when we switch to a different sequence tab with ajax
function videoDestroy(id) {
// postJSON('/modx/video/'+id+'/goto_position',
// {'position' : ytplayer.getCurrentTime()});
load_id = 0;
clearInterval(updateytplayerInfoInterval);
clearInterval(ajax_videoInterval);
ytplayer = false;
switched_tab = true;
}
function log_event(e, d) {
data = {
"event_type" : e,
"event" : JSON.stringify(d),
"page" : document.URL
}
$.ajax({type:'GET',
url: '/event',
dataType: 'json',
data: data,
async: !log_close_event, // HACK: See comment on log_close_event
success: function(){},
headers : {'X-CSRFToken':getCookie('csrftoken')}
});
/*, // Commenting out Chrome bug fix, since it breaks FF
function(data) {
console.log("closing");
if (close_event_logged == "waiting") {
close_event_logged = "done";
console.log("closed");
}
});*/
}
function seek_slide(type,oe,value) {
//log_event('video', [type, value]);
if(type=='slide') {
// HACK/TODO: Youtube recommends this be false for slide and true for stop.
// Works better on my system with true/true.
// We should test both configurations on low/high bandwidth
// connections, and different browsers
// One issue is that we query the Youtube window every 250ms for position/state
// With false, it returns the old one (ignoring the new seek), and moves the
// scroll bar to the wrong spot.
ytplayer.seekTo(value, true);
} else if (type=='stop') {
ytplayer.seekTo(value, true);
log_event('video', [type, value]);
}
update_captions(value);
}
function get_state() {
if (ytplayer)
return [ytplayer.getPlayerState(),
ytplayer.getVideoUrl(),
ytplayer.getDuration(), ytplayer.getCurrentTime(),
ytplayer.getVideoBytesLoaded(), ytplayer.getVideoBytesTotal(),
ytplayer.getVideoStartBytes(),
ytplayer.getVolume(),ytplayer.isMuted(),
ytplayer.getPlaybackQuality(),
ytplayer.getAvailableQualityLevels()];
return [];
}
function onytplayerStateChange(newState) {
setytplayerState(newState);
log_event('video', ['State Change',newState, get_state()]);
}
function onPlayerError(errorCode) {
// alert("An error occured: " + errorCode);
log_event("player_error", {"error":errorCode});
}
// Currently duplicated to check for if video control changed by clicking the video for HTML5
// Hacky b/c of lack of control over YT player
function updateHTML5ytplayerInfo() {
var player_state = getPlayerState();
if(player_state != 3) {
$("#slider").slider("option","max",ytplayer.getDuration());
$("#slider").slider("option","value",ytplayer.getCurrentTime());
}
if (player_state == 1){
update_captions(getCurrentTime());
}
if (player_state == 1 && $("#video_control").hasClass("play"))
$("#video_control").removeClass().addClass("pause");
else if (player_state == 2 && $("#video_control").hasClass("pause"))
$("#video_control").removeClass().addClass("play");
}
function updateytplayerInfo() {
var player_state = getPlayerState();
if(player_state != 3) {
$("#slider").slider("option","max",ytplayer.getDuration());
$("#slider").slider("option","value",ytplayer.getCurrentTime());
}
if (player_state == 1){
update_captions(getCurrentTime());
handle = $('.ui-slider-handle', $('#slider'));
handle.qtip('option', 'content.text', '' + format_time(getCurrentTime()));
}
// updateHTML("videoduration", getDuration());
// updateHTML("videotime", getCurrentTime());
// updateHTML("startbytes", getStartBytes());
// updateHTML("volume", getVolume());
}
// functions for the api calls
function loadNewVideo(cap_id, id, startSeconds) {
captions={"start":[0],"end":[0],"text":["Attempting to load captions..."]};
$.getJSON("/static/subs/"+cap_id+".srt.sjson", function(data) {
captions=data;
});
caption_id = cap_id;
load_id = id;
//if ((typeof ytplayer != "undefined") && (ytplayer.type=="application/x-shockwave-flash")) {
// Try it every time. If we fail, we want the error message for now.
// TODO: Add try/catch
try {
ytplayer.loadVideoById(id, parseInt(startSeconds));
load_id=0;
}
catch(e) {
window['console'].log(JSON.stringify(e));
}
log_event("load_video", {"id":id,"start":startSeconds});
//$("#slider").slider("option","value",startSeconds);
//seekTo(startSeconds);
}
function syncPlayButton(){
var state = getPlayerState();
if (state == 1 || state == 3) {
$("#video_control").removeClass("play").addClass("pause");
} else if (state == 2 || state == -1 || state == 0){
$("#video_control").removeClass("pause").addClass("play");
}
}
function cueNewVideo(id, startSeconds) {
if (ytplayer) {
ytplayer.cueVideoById(id, startSeconds);
}
}
function play() {
if (ytplayer) {
ytplayer.playVideo();
}
log_event("play_video", {"id":getCurrentTime(), "code":getEmbedCode()});
}
function pause() {
if (ytplayer) {
ytplayer.pauseVideo();
}
log_event("pause_video", {"id":getCurrentTime(), "code":getEmbedCode()});
}
function stop() {
if (ytplayer) {
ytplayer.stopVideo();
}
log_event("stop_video", {"id":getCurrentTime(), "code":getEmbedCode()});
}
function getPlayerState() {
if (ytplayer) {
return ytplayer.getPlayerState();
}
}
function seekTo(seconds) {
if (ytplayer) {
ytplayer.seekTo(seconds, true);
}
}
function getBytesTotal() {
if (ytplayer) {
return ytplayer.getVideoBytesTotal();
}
}
function getCurrentTime() {
if (ytplayer) {
return ytplayer.getCurrentTime();
}
}
function getDuration() {
if (ytplayer) {
return ytplayer.getDuration();
}
}
function getStartBytes() {
if (ytplayer) {
return ytplayer.getVideoStartBytes();
}
}
function mute() {
if (ytplayer) {
ytplayer.mute();
}
}
function unMute() {
if (ytplayer) {
ytplayer.unMute();
}
}
function getEmbedCode() {
if(ytplayer) {
ytplayer.getVideoEmbedCode();
}
}
function getVideoUrl() {
if(ytplayer) {
ytplayer.getVideoUrl();
}
}
function setVolume(newVolume) {
if (ytplayer) {
ytplayer.setVolume(newVolume);
}
}
function getVolume() {
if (ytplayer) {
return ytplayer.getVolume();
}
}
function clearVideo() {
if (ytplayer) {
ytplayer.clearVideo();
}
}
templates/coffee/src/logger.coffee 0 → 100644
class @Logger
@log: (event_type, data) ->
$.getJSON '/event',
event_type: event_type
event: JSON.stringify(data)
page: window.location.href
@bind: ->
window.onunload = ->
$.ajax
url: '/event'
data:
event_type: 'page_close'
event: ''
page: window.location.href
async: false
return true
# Keeping this for conpatibility issue only.
@log_event = Logger.log
templates/video_init.js deleted 100644 → 0
var streams=${ streams }
var params = { allowScriptAccess: "always", bgcolor: "#cccccc", wmode: "transparent", allowFullScreen: "true" };
var atts = { id: "myytplayer" };
// If the user doesn't have flash, use the HTML5 Video instead. YouTube's
// iFrame API which supports HTML5 is still developmental so it is not default
if (swfobject.hasFlashPlayerVersion("10.1")){
swfobject.embedSWF(document.location.protocol + "//www.youtube.com/apiplayer?enablejsapi=1&playerapiid=ytplayer?wmode=transparent",
"ytapiplayer", "640", "385", "8", null, null, params, atts);
} else {
//end of this URL may need &origin=http://..... once pushed to production to prevent XSS
$("#html5_player").attr("src", document.location.protocol + "//www.youtube.com/embed/" + streams["1.0"] + "?enablejsapi=1&controls=0");
$("#html5_player").show();
var tag = document.createElement('script');
tag.src = document.location.protocol + "//www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// Make sure the callback is called once API ready, YT seems to be buggy
loadHTML5Video();
}
var captions=0;
/* Cache a reference to our slider element */
var slider = $('#slider')
.slider({
range: "min",
slide: function(event,ui) {
var slider_time = format_time(ui.value)
seek_slide('slide',event.originalEvent,ui.value);
handle.qtip('option', 'content.text', '' + slider_time);
},
stop:function(event,ui){seek_slide('stop',event.originalEvent,ui.value);}
}),
/* Grab and cache the newly created slider handle */
handle = $('.ui-slider-handle', slider);
/*
* Selector needs changing here to match your elements.
*
* Notice the second argument to the $() constructor, which tells
* jQuery to use that as the top-level element to seareh down from.
*/
handle.qtip({
content: '' + slider.slider('option', 'value'), // Use the current value of the slider
position: {
my: 'bottom center',
at: 'top center',
container: handle // Stick it inside the handle element so it keeps the position synched up
},
hide: {
delay: 700 // Give it a longer delay so it doesn't hide frequently as we move the handle
},
style: {
classes: 'ui-tooltip-slider',
widget: true // Make it Themeroller compatible
}
});
function good() {
window['console'].log(ytplayer.getCurrentTime());
}
ajax_video=good;
// load the same video speed your last video was at in a sequence
// if the last speed played on video doesn't exist on another video just use 1.0 as default
function add_speed(key, stream) {
var id = 'speed_' + stream;
if (key == video_speed) {
$("#video_speeds").append(' <li class="active" id="'+id+'">'+key+'x</li>');
$("p.active").text(key + 'x');
} else {
$("#video_speeds").append(' <li id="'+id+'">'+key+'x</li>');
}
$("#"+id).click(function(){
change_video_speed(key, stream);
$(this).siblings().removeClass("active");
$(this).addClass("active");
var active = $(this).text();
$("p.active").text(active);
});
}
var l=[]
for (var key in streams) {
l.push(key);
}
function sort_by_value(a,b) {
var x=parseFloat(a);
var y=parseFloat(b);
var r=((x < y) ? -1 : ((x > y) ? 1 : 0));
return r;
}
l.sort(sort_by_value);
$(document).ready(function() {
video_speed = $.cookie("video_speed");
//ugly hack to account for different formats in vid speed in the XML (.75 vs 0.75, 1.5 vs 1.50);
if (( !video_speed ) || ( !streams[video_speed] && !streams[video_speed + "0"]) && !streams[video_speed.slice(0,-1)] && !streams[video_speed.slice(1)] && !streams["0" + video_speed]) {
video_speed = "1.0";
}
if (streams[video_speed + "0"]){
video_speed = video_speed + "0";
} else if (streams[video_speed.slice(0, -1)]){
video_speed = video_speed.slice(0, -1);
} else if (streams[video_speed.slice(1)]) {
video_speed = video_speed.slice(1);
} else if (streams["0" + video_speed]) {
video_speed = "0" + video_speed;
}
loadNewVideo(streams["1.0"], streams[video_speed], ${ position });
for(var i=0; i<l.length; i++) {
add_speed(l[i], streams[l[i]])
}
var dropUpHeight = $('ol#video_speeds').height();
console.log(dropUpHeight);
$('ol#video_speeds').css('top', -(dropUpHeight + 2));
});
function toggleVideo(){
if ($("#video_control").hasClass("play")){
play();
$("#video_control").removeClass().addClass("pause");
} else {
pause();
$("#video_control").removeClass().addClass("play");
}
}
$("#video_control").click(toggleVideo);
// space bar to pause video
$(".video-wrapper").keyup(function(e){
active = document.activeElement;
if (e.which == 32) {
e.preventDefault();
$("#video_control").click();
}
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment