Updated all coffee scripts to define and use Alpha version of classes. Added missing functions for HTML5Video.Player prototype. Now bare bones works without errors. YouTube version also works without errors.
This commit is contained in:
@@ -9,7 +9,6 @@ class @VideoAlpha
|
||||
@show_captions = @el.data('show-captions') == "true"
|
||||
window.player = null
|
||||
@el = $("#video_#{@id}")
|
||||
|
||||
if @parseVideos(@el.data("streams")) is true
|
||||
@videoType = "youtube"
|
||||
@fetchMetadata()
|
||||
@@ -18,25 +17,21 @@ class @VideoAlpha
|
||||
@videoType = "html5"
|
||||
@parseVideoSources @el.data("mp4-source"), @el.data("webm-source"), @el.data("ogg-source")
|
||||
@speeds = ["0.75", "1.0", "1.25", "1.5"]
|
||||
@videos =
|
||||
"0.75": ""
|
||||
"1.0": ""
|
||||
"1.25": ""
|
||||
"1.5": ""
|
||||
@setSpeed($.cookie('video_speed'))
|
||||
|
||||
$("#video_#{@id}").data('video', this).addClass('video-load-complete')
|
||||
|
||||
@hide_captions = $.cookie('hide_captions') == 'true'
|
||||
|
||||
if ((@videoType is "youtube") and (YT.Player)) or ((@videoType is "html5") and (HTML5Video.Player))
|
||||
console.log 'one'
|
||||
@embed()
|
||||
else
|
||||
console.log 'two'
|
||||
if @videoType is "youtube"
|
||||
console.log 'three'
|
||||
window.onYouTubePlayerAPIReady = ->
|
||||
_this.embed()
|
||||
else if @videoType is "html5"
|
||||
console.log 'four'
|
||||
console.log @videoType
|
||||
console.log HTML5Video.Player
|
||||
window.onHTML5PlayerAPIReady = ->
|
||||
_this.embed()
|
||||
|
||||
@@ -45,10 +40,6 @@ class @VideoAlpha
|
||||
|
||||
VideoAlpha::parseVideos = (videos) ->
|
||||
return false if (typeof videos isnt "string") or (videos.length is 0)
|
||||
|
||||
console.log 'We got this far'
|
||||
console.log videos
|
||||
|
||||
@videos = {}
|
||||
_this = this
|
||||
$.each videos.split(/,/), (index, video) ->
|
||||
@@ -63,7 +54,6 @@ class @VideoAlpha
|
||||
mp4: null
|
||||
webm: null
|
||||
ogg: null
|
||||
|
||||
@html5Sources.mp4 = mp4Source if (typeof mp4Source is "string") and (mp4Source.length > 0)
|
||||
@html5Sources.webm = webmSource if (typeof webmSource is "string") and (webmSource.length > 0)
|
||||
@html5Sources.ogg = oggSource if (typeof oggSource is "string") and (oggSource.length > 0)
|
||||
@@ -82,7 +72,7 @@ class @VideoAlpha
|
||||
@speed = "1.0"
|
||||
|
||||
embed: ->
|
||||
@player = new VideoPlayer video: this
|
||||
@player = new VideoPlayerAlpha video: this
|
||||
|
||||
fetchMetadata: (url) ->
|
||||
@metadata = {}
|
||||
@@ -98,7 +88,6 @@ class @VideoAlpha
|
||||
code: @youtubeId()
|
||||
currentTime: @player.currentTime
|
||||
speed: @speed
|
||||
|
||||
if @videoType is "youtube"
|
||||
logInfo.code = @youtubeId()
|
||||
else logInfo.code = "html5" if @videoType is "html5"
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @Subview
|
||||
class @SubviewAlpha
|
||||
constructor: (options) ->
|
||||
$.each options, (key, value) =>
|
||||
@[key] = value
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
console.log('We are in "html5_video.js" script.');
|
||||
|
||||
this.HTML5Video = (function () {
|
||||
var HTML5Video = {};
|
||||
|
||||
@@ -55,8 +53,6 @@ this.HTML5Video = (function () {
|
||||
* }
|
||||
*/
|
||||
function Player(el, config) {
|
||||
console.log('We are inside HTML5Video.Player constructor.');
|
||||
|
||||
if (typeof el === 'string') {
|
||||
this.el = $(el);
|
||||
} else if ($.isPlainObject(el) === true) {
|
||||
@@ -70,8 +66,6 @@ this.HTML5Video = (function () {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log('We got a proper DOM element.');
|
||||
|
||||
if ($.isPlainObject(config) === true) {
|
||||
this.config = config;
|
||||
} else {
|
||||
@@ -91,9 +85,6 @@ this.HTML5Video = (function () {
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
console.log('The config is:');
|
||||
console.log(this.config);
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -122,11 +113,11 @@ this.HTML5Video = (function () {
|
||||
};
|
||||
|
||||
/*
|
||||
* The original YouTube API function player.setPlayBackQuality changed (if it was possible) the quality of the
|
||||
* The original YouTube API function player.setPlaybackQuality changed (if it was possible) the quality of the
|
||||
* played video. In our case, this function will not do anything because we can't change the quality of HTML5
|
||||
* video since we only get one source of video with one quality.
|
||||
*/
|
||||
Player.prototype.setPlayBackQuality = function (value) {
|
||||
Player.prototype.setPlaybackQuality = function (value) {
|
||||
|
||||
};
|
||||
|
||||
@@ -134,20 +125,30 @@ this.HTML5Video = (function () {
|
||||
|
||||
};
|
||||
|
||||
Player.prototype.sekkTo = function () {
|
||||
Player.prototype.seekTo = function () {
|
||||
|
||||
};
|
||||
|
||||
// YouTube API has player.loadVideoById, but since we are working with a video source, we will rename this
|
||||
// function accordingly.
|
||||
Player.prototype.loadVideoBySource = function () {
|
||||
// function accordingly. However, not to cause conflicts, there will also be a loadVideoById function which
|
||||
// will call this function.
|
||||
Player.prototype.loadVideoBySource = function (source) {
|
||||
|
||||
};
|
||||
|
||||
// YouTube API has player.cueVideoById, but since we are working with a video source, we will rename this
|
||||
// function accordingly.
|
||||
Player.prototype.cueVideoBySource = function () {
|
||||
Player.prototype.loadVideoById = function (id) {
|
||||
this.loadVideoBySource(id);
|
||||
}
|
||||
|
||||
// YouTube API has player.cueVideoById, but since we are working with a video source, we will rename this
|
||||
// function accordingly. However, not to cause conflicts, there will also be a cueVideoById function which
|
||||
// will call this function.
|
||||
Player.prototype.cueVideoBySource = function (source) {
|
||||
|
||||
};
|
||||
|
||||
Player.prototype.cueVideoById = function (id) {
|
||||
this.cueVideoBySource(id);
|
||||
};
|
||||
|
||||
Player.prototype.setVolume = function () {
|
||||
@@ -178,6 +179,12 @@ this.HTML5Video = (function () {
|
||||
|
||||
};
|
||||
|
||||
Player.prototype.getDuration = function () {
|
||||
// TODO: Return valid video duration.
|
||||
|
||||
return 0;
|
||||
};
|
||||
|
||||
return Player;
|
||||
}());
|
||||
|
||||
@@ -192,5 +199,3 @@ this.HTML5Video = (function () {
|
||||
|
||||
return HTML5Video;
|
||||
}());
|
||||
|
||||
console.log(HTML5Video);
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @VideoCaption extends Subview
|
||||
class @VideoCaptionAlpha extends SubviewAlpha
|
||||
initialize: ->
|
||||
@loaded = false
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @VideoControl extends Subview
|
||||
class @VideoControlAlpha extends SubviewAlpha
|
||||
bind: ->
|
||||
@$('.video_control').click @togglePlayback
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @VideoPlayer extends Subview
|
||||
class @VideoPlayerAlpha extends SubviewAlpha
|
||||
initialize: ->
|
||||
if @video.videoType is 'youtube'
|
||||
# Define a missing constant of Youtube API
|
||||
@@ -26,19 +26,17 @@ class @VideoPlayer extends Subview
|
||||
@toggleFullScreen(event)
|
||||
|
||||
render: ->
|
||||
console.log '1.1'
|
||||
@control = new VideoControl el: @$('.video-controls')
|
||||
@qualityControl = new VideoQualityControl el: @$('.secondary-controls')
|
||||
@caption = new VideoCaption
|
||||
@control = new VideoControlAlpha el: @$('.video-controls')
|
||||
@qualityControl = new VideoQualityControlAlpha el: @$('.secondary-controls')
|
||||
@caption = new VideoCaptionAlpha
|
||||
el: @el
|
||||
youtubeId: @video.youtubeId('1.0')
|
||||
currentSpeed: @currentSpeed()
|
||||
captionAssetPath: @video.caption_asset_path
|
||||
unless onTouchBasedDevice()
|
||||
@volumeControl = new VideoVolumeControl el: @$('.secondary-controls')
|
||||
console.log '1.2'
|
||||
@speedControl = new VideoSpeedControl el: @$('.secondary-controls'), speeds: @video.speeds, currentSpeed: @currentSpeed()
|
||||
@progressSlider = new VideoProgressSlider el: @$('.slider')
|
||||
@volumeControl = new VideoVolumeControlAlpha el: @$('.secondary-controls')
|
||||
@speedControl = new VideoSpeedControlAlpha el: @$('.secondary-controls'), speeds: @video.speeds, currentSpeed: @currentSpeed()
|
||||
@progressSlider = new VideoProgressSliderAlpha el: @$('.slider')
|
||||
@playerVars =
|
||||
controls: 0
|
||||
wmode: 'transparent'
|
||||
@@ -46,15 +44,12 @@ class @VideoPlayer extends Subview
|
||||
showinfo: 0
|
||||
enablejsapi: 1
|
||||
modestbranding: 1
|
||||
console.log '1.3'
|
||||
if @video.start
|
||||
@playerVars.start = @video.start
|
||||
@playerVars.wmode = 'window'
|
||||
if @video.end
|
||||
# work in AS3, not HMLT5. but iframe use AS3
|
||||
@playerVars.end = @video.end
|
||||
console.log '1.4'
|
||||
|
||||
if @video.videoType is 'html5'
|
||||
@player = new HTML5Video.Player @video.id,
|
||||
playerVars: @playerVars,
|
||||
@@ -182,7 +177,10 @@ class @VideoPlayer extends Subview
|
||||
@player.pauseVideo() if @player.pauseVideo
|
||||
|
||||
duration: ->
|
||||
@video.getDuration()
|
||||
if @video.videoType is "youtube"
|
||||
return @video.getDuration()
|
||||
else return @player.getDuration() if @video.videoType is "html5"
|
||||
0
|
||||
|
||||
currentSpeed: ->
|
||||
@video.speed
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @VideoProgressSlider extends Subview
|
||||
class @VideoProgressSliderAlpha extends SubviewAlpha
|
||||
initialize: ->
|
||||
@buildSlider() unless onTouchBasedDevice()
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @VideoQualityControl extends Subview
|
||||
class @VideoQualityControlAlpha extends SubviewAlpha
|
||||
initialize: ->
|
||||
@quality = null;
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @VideoSpeedControl extends Subview
|
||||
class @VideoSpeedControlAlpha extends SubviewAlpha
|
||||
bind: ->
|
||||
@$('.video_speeds a').click @changeVideoSpeed
|
||||
if onTouchBasedDevice()
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
class @VideoVolumeControl extends Subview
|
||||
class @VideoVolumeControlAlpha extends SubviewAlpha
|
||||
initialize: ->
|
||||
@currentVolume = 100
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<h2> ${display_name} </h2>
|
||||
% endif
|
||||
|
||||
<!-- data-streams="0.75:WL7anegEjsU,1.0:NUmLa2vBBLo,1.25:TygItMr4wY4,1.5:kctQ6liQdAE"-->
|
||||
<!-- data-streams="0.75:aHUgdwyxTF0,1.0:yJzQiemCIuY,1.25:ELCdMiV1tCQ,1.5:-7gIpfrQdAI"-->
|
||||
|
||||
%if settings.MITX_FEATURES['STUB_VIDEO_FOR_TESTING']:
|
||||
<div id="stub_out_video_for_testing"></div>
|
||||
|
||||
Reference in New Issue
Block a user