Commit e7e0fe1f by Prem Sichanugrist

Fix element naming convention

parent 4e183dd6
...@@ -20,7 +20,7 @@ describe 'Problem', -> ...@@ -20,7 +20,7 @@ describe 'Problem', ->
@problem = new Problem 1, '/problem/url/' @problem = new Problem 1, '/problem/url/'
it 'set the element', -> it 'set the element', ->
expect(@problem.element).toBe '#problem_1' expect(@problem.el).toBe '#problem_1'
describe 'bind', -> describe 'bind', ->
beforeEach -> beforeEach ->
...@@ -69,7 +69,7 @@ describe 'Problem', -> ...@@ -69,7 +69,7 @@ describe 'Problem', ->
@problem.render 'Hello World' @problem.render 'Hello World'
it 'render the content', -> it 'render the content', ->
expect(@problem.element.html()).toEqual 'Hello World' expect(@problem.el.html()).toEqual 'Hello World'
it 're-bind the content', -> it 're-bind the content', ->
expect(@problem.bind).toHaveBeenCalled() expect(@problem.bind).toHaveBeenCalled()
...@@ -81,7 +81,7 @@ describe 'Problem', -> ...@@ -81,7 +81,7 @@ describe 'Problem', ->
@problem.render() @problem.render()
it 'load the content via ajax', -> it 'load the content via ajax', ->
expect(@problem.element.html()).toEqual 'Hello World' expect(@problem.el.html()).toEqual 'Hello World'
it 're-bind the content', -> it 're-bind the content', ->
expect(@problem.bind).toHaveBeenCalled() expect(@problem.bind).toHaveBeenCalled()
...@@ -104,13 +104,13 @@ describe 'Problem', -> ...@@ -104,13 +104,13 @@ describe 'Problem', ->
it 'call render with returned content', -> it 'call render with returned content', ->
spyOn($, 'postWithPrefix').andCallFake (url, answers, callback) -> callback(success: 'correct', contents: 'Correct!') spyOn($, 'postWithPrefix').andCallFake (url, answers, callback) -> callback(success: 'correct', contents: 'Correct!')
@problem.check() @problem.check()
expect(@problem.element.html()).toEqual 'Correct!' expect(@problem.el.html()).toEqual 'Correct!'
describe 'when the response is incorrect', -> describe 'when the response is incorrect', ->
it 'call render with returned content', -> it 'call render with returned content', ->
spyOn($, 'postWithPrefix').andCallFake (url, answers, callback) -> callback(success: 'incorrect', contents: 'Correct!') spyOn($, 'postWithPrefix').andCallFake (url, answers, callback) -> callback(success: 'incorrect', contents: 'Correct!')
@problem.check() @problem.check()
expect(@problem.element.html()).toEqual 'Correct!' expect(@problem.el.html()).toEqual 'Correct!'
describe 'when the response is undetermined', -> describe 'when the response is undetermined', ->
it 'alert the response', -> it 'alert the response', ->
...@@ -137,16 +137,16 @@ describe 'Problem', -> ...@@ -137,16 +137,16 @@ describe 'Problem', ->
spyOn($, 'postWithPrefix').andCallFake (url, answers, callback) -> spyOn($, 'postWithPrefix').andCallFake (url, answers, callback) ->
callback html: "Reset!" callback html: "Reset!"
@problem.reset() @problem.reset()
expect(@problem.element.html()).toEqual 'Reset!' expect(@problem.el.html()).toEqual 'Reset!'
describe 'show', -> describe 'show', ->
beforeEach -> beforeEach ->
@problem = new Problem 1, '/problem/url/' @problem = new Problem 1, '/problem/url/'
@problem.element.prepend '<div id="answer_1_1" /><div id="answer_1_2" />' @problem.el.prepend '<div id="answer_1_1" /><div id="answer_1_2" />'
describe 'when the answer has not yet shown', -> describe 'when the answer has not yet shown', ->
beforeEach -> beforeEach ->
@problem.element.removeClass 'showed' @problem.el.removeClass 'showed'
it 'log the problem_show event', -> it 'log the problem_show event', ->
@problem.show() @problem.show()
...@@ -172,11 +172,11 @@ describe 'Problem', -> ...@@ -172,11 +172,11 @@ describe 'Problem', ->
it 'add the showed class to element', -> it 'add the showed class to element', ->
spyOn($, 'postWithPrefix').andCallFake (url, callback) -> callback(answers: {}) spyOn($, 'postWithPrefix').andCallFake (url, callback) -> callback(answers: {})
@problem.show() @problem.show()
expect(@problem.element).toHaveClass 'showed' expect(@problem.el).toHaveClass 'showed'
describe 'multiple choice question', -> describe 'multiple choice question', ->
beforeEach -> beforeEach ->
@problem.element.prepend ''' @problem.el.prepend '''
<label for="input_1_1_1"><input type="checkbox" name="input_1_1" id="input_1_1_1" value="1"> One</label> <label for="input_1_1_1"><input type="checkbox" name="input_1_1" id="input_1_1_1" value="1"> One</label>
<label for="input_1_1_2"><input type="checkbox" name="input_1_1" id="input_1_1_2" value="2"> Two</label> <label for="input_1_1_2"><input type="checkbox" name="input_1_1" id="input_1_1_2" value="2"> Two</label>
<label for="input_1_1_3"><input type="checkbox" name="input_1_1" id="input_1_1_3" value="3"> Three</label> <label for="input_1_1_3"><input type="checkbox" name="input_1_1" id="input_1_1_3" value="3"> Three</label>
...@@ -194,8 +194,8 @@ describe 'Problem', -> ...@@ -194,8 +194,8 @@ describe 'Problem', ->
describe 'when the answers are alreay shown', -> describe 'when the answers are alreay shown', ->
beforeEach -> beforeEach ->
@problem.element.addClass 'showed' @problem.el.addClass 'showed'
@problem.element.prepend ''' @problem.el.prepend '''
<label for="input_1_1_1" correct_answer="true"> <label for="input_1_1_1" correct_answer="true">
<input type="checkbox" name="input_1_1" id="input_1_1_1" value="1" /> <input type="checkbox" name="input_1_1" id="input_1_1_1" value="1" />
One One
...@@ -216,7 +216,7 @@ describe 'Problem', -> ...@@ -216,7 +216,7 @@ describe 'Problem', ->
it 'remove the showed class from element', -> it 'remove the showed class from element', ->
@problem.show() @problem.show()
expect(@problem.element).not.toHaveClass 'showed' expect(@problem.el).not.toHaveClass 'showed'
describe 'save', -> describe 'save', ->
beforeEach -> beforeEach ->
...@@ -271,7 +271,7 @@ describe 'Problem', -> ...@@ -271,7 +271,7 @@ describe 'Problem', ->
describe 'refreshAnswers', -> describe 'refreshAnswers', ->
beforeEach -> beforeEach ->
@problem = new Problem 1, '/problem/url/' @problem = new Problem 1, '/problem/url/'
@problem.element.html ''' @problem.el.html '''
<textarea class="CodeMirror" /> <textarea class="CodeMirror" />
<input id="input_1_1" name="input_1_1" class="schematic" value="one" /> <input id="input_1_1" name="input_1_1" class="schematic" value="one" />
<input id="input_1_2" name="input_1_2" value="two" /> <input id="input_1_2" name="input_1_2" value="two" />
......
...@@ -12,7 +12,7 @@ describe 'Sequence', -> ...@@ -12,7 +12,7 @@ describe 'Sequence', ->
@sequence = new Sequence '1', @items, 'sequence', 1 @sequence = new Sequence '1', @items, 'sequence', 1
it 'set the element', -> it 'set the element', ->
expect(@sequence.element).toEqual $('#sequence_1') expect(@sequence.el).toEqual $('#sequence_1')
it 'build the navigation', -> it 'build the navigation', ->
classes = $('#sequence-list li>a').map(-> $(this).attr('class')).get() classes = $('#sequence-list li>a').map(-> $(this).attr('class')).get()
...@@ -74,7 +74,7 @@ describe 'Sequence', -> ...@@ -74,7 +74,7 @@ describe 'Sequence', ->
beforeEach -> beforeEach ->
spyOn $, 'postWithPrefix' spyOn $, 'postWithPrefix'
@sequence = new Sequence '1', @items, 'sequence' @sequence = new Sequence '1', @items, 'sequence'
spyOnEvent @sequence.element, 'contentChanged' spyOnEvent @sequence.el, 'contentChanged'
spyOn(@sequence, 'toggleArrows').andCallThrough() spyOn(@sequence, 'toggleArrows').andCallThrough()
describe 'with a different position than the current one', -> describe 'with a different position than the current one', ->
...@@ -109,13 +109,13 @@ describe 'Sequence', -> ...@@ -109,13 +109,13 @@ describe 'Sequence', ->
expect(@sequence.toggleArrows).toHaveBeenCalled() expect(@sequence.toggleArrows).toHaveBeenCalled()
it 'trigger contentChanged event', -> it 'trigger contentChanged event', ->
expect('contentChanged').toHaveBeenTriggeredOn @sequence.element expect('contentChanged').toHaveBeenTriggeredOn @sequence.el
describe 'with the same position as the current one', -> describe 'with the same position as the current one', ->
it 'should not trigger contentChanged event', -> it 'should not trigger contentChanged event', ->
@sequence.position = 2 @sequence.position = 2
@sequence.render 2 @sequence.render 2
expect('contentChanged').not.toHaveBeenTriggeredOn @sequence.element expect('contentChanged').not.toHaveBeenTriggeredOn @sequence.el
describe 'goto', -> describe 'goto', ->
beforeEach -> beforeEach ->
......
...@@ -9,7 +9,7 @@ describe 'Tab', -> ...@@ -9,7 +9,7 @@ describe 'Tab', ->
@tab = new Tab 1, @items @tab = new Tab 1, @items
it 'set the element', -> it 'set the element', ->
expect(@tab.element).toEqual $('#tab_1') expect(@tab.el).toEqual $('#tab_1')
it 'build the tabs', -> it 'build the tabs', ->
links = $('.navigation li>a').map(-> $(this).attr('href')).get() links = $('.navigation li>a').map(-> $(this).attr('href')).get()
...@@ -34,6 +34,6 @@ describe 'Tab', -> ...@@ -34,6 +34,6 @@ describe 'Tab', ->
expect($('#tab-1-2').html()).toEqual '' expect($('#tab-1-2').html()).toEqual ''
it 'trigger contentChanged event on the element', -> it 'trigger contentChanged event on the element', ->
spyOnEvent @tab.element, 'contentChanged' spyOnEvent @tab.el, 'contentChanged'
$('[href="#tab-1-1"]').click() $('[href="#tab-1-1"]').click()
expect('contentChanged').toHaveBeenTriggeredOn @tab.element expect('contentChanged').toHaveBeenTriggeredOn @tab.el
...@@ -13,7 +13,7 @@ describe 'VideoCaption', -> ...@@ -13,7 +13,7 @@ describe 'VideoCaption', ->
describe 'always', -> describe 'always', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
it 'set the youtube id', -> it 'set the youtube id', ->
expect(@caption.youtubeId).toEqual 'def456' expect(@caption.youtubeId).toEqual 'def456'
...@@ -43,7 +43,7 @@ describe 'VideoCaption', -> ...@@ -43,7 +43,7 @@ describe 'VideoCaption', ->
describe 'when on a non touch-based device', -> describe 'when on a non touch-based device', ->
beforeEach -> beforeEach ->
spyOn(window, 'onTouchBasedDevice').andReturn false spyOn(window, 'onTouchBasedDevice').andReturn false
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
it 'render the caption', -> it 'render the caption', ->
expect($('.subtitles').html()).toMatch new RegExp(''' expect($('.subtitles').html()).toMatch new RegExp('''
...@@ -67,7 +67,7 @@ describe 'VideoCaption', -> ...@@ -67,7 +67,7 @@ describe 'VideoCaption', ->
describe 'when on a touch-based device', -> describe 'when on a touch-based device', ->
beforeEach -> beforeEach ->
spyOn(window, 'onTouchBasedDevice').andReturn true spyOn(window, 'onTouchBasedDevice').andReturn true
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
it 'show explaination message', -> it 'show explaination message', ->
expect($('.subtitles li')).toHaveHtml "Caption will be displayed when you start playing the video." expect($('.subtitles li')).toHaveHtml "Caption will be displayed when you start playing the video."
...@@ -79,7 +79,7 @@ describe 'VideoCaption', -> ...@@ -79,7 +79,7 @@ describe 'VideoCaption', ->
beforeEach -> beforeEach ->
spyOn(window, 'setTimeout').andReturn 100 spyOn(window, 'setTimeout').andReturn 100
spyOn window, 'clearTimeout' spyOn window, 'clearTimeout'
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
describe 'when cursor is outside of the caption box', -> describe 'when cursor is outside of the caption box', ->
beforeEach -> beforeEach ->
...@@ -143,7 +143,7 @@ describe 'VideoCaption', -> ...@@ -143,7 +143,7 @@ describe 'VideoCaption', ->
describe 'search', -> describe 'search', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
it 'return a correct caption index', -> it 'return a correct caption index', ->
expect(@caption.search(0)).toEqual 0 expect(@caption.search(0)).toEqual 0
...@@ -157,7 +157,7 @@ describe 'VideoCaption', -> ...@@ -157,7 +157,7 @@ describe 'VideoCaption', ->
describe 'when the caption was not rendered', -> describe 'when the caption was not rendered', ->
beforeEach -> beforeEach ->
spyOn(window, 'onTouchBasedDevice').andReturn true spyOn(window, 'onTouchBasedDevice').andReturn true
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
@caption.play() @caption.play()
it 'render the caption', -> it 'render the caption', ->
...@@ -184,7 +184,7 @@ describe 'VideoCaption', -> ...@@ -184,7 +184,7 @@ describe 'VideoCaption', ->
describe 'pause', -> describe 'pause', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
@caption.playing = true @caption.playing = true
@caption.pause() @caption.pause()
...@@ -193,7 +193,7 @@ describe 'VideoCaption', -> ...@@ -193,7 +193,7 @@ describe 'VideoCaption', ->
describe 'updatePlayTime', -> describe 'updatePlayTime', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
describe 'when the video speed is 1.0x', -> describe 'when the video speed is 1.0x', ->
beforeEach -> beforeEach ->
...@@ -240,7 +240,7 @@ describe 'VideoCaption', -> ...@@ -240,7 +240,7 @@ describe 'VideoCaption', ->
describe 'resize', -> describe 'resize', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
$('.subtitles li[data-index=1]').addClass 'current' $('.subtitles li[data-index=1]').addClass 'current'
@caption.resize() @caption.resize()
...@@ -258,7 +258,7 @@ describe 'VideoCaption', -> ...@@ -258,7 +258,7 @@ describe 'VideoCaption', ->
describe 'scrollCaption', -> describe 'scrollCaption', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
describe 'when frozen', -> describe 'when frozen', ->
beforeEach -> beforeEach ->
...@@ -286,12 +286,12 @@ describe 'VideoCaption', -> ...@@ -286,12 +286,12 @@ describe 'VideoCaption', ->
@caption.scrollCaption() @caption.scrollCaption()
it 'scroll to current caption', -> it 'scroll to current caption', ->
expect($.fn.scrollTo).toHaveBeenCalledWith $('.subtitles .current:first', @caption.element), expect($.fn.scrollTo).toHaveBeenCalledWith $('.subtitles .current:first', @caption.el),
offset: - ($('.video-wrapper').height() / 2 - $('.subtitles .current:first').height() / 2) offset: - ($('.video-wrapper').height() / 2 - $('.subtitles .current:first').height() / 2)
describe 'seekPlayer', -> describe 'seekPlayer', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
@time = null @time = null
$(@caption).bind 'seek', (event, time) => @time = time $(@caption).bind 'seek', (event, time) => @time = time
...@@ -313,25 +313,25 @@ describe 'VideoCaption', -> ...@@ -313,25 +313,25 @@ describe 'VideoCaption', ->
describe 'toggle', -> describe 'toggle', ->
beforeEach -> beforeEach ->
@caption = new VideoCaption element: $('.video'), youtubeId: 'def456', currentSpeed: '1.0' @caption = new VideoCaption el: $('.video'), youtubeId: 'def456', currentSpeed: '1.0'
$('.subtitles li[data-index=1]').addClass 'current' $('.subtitles li[data-index=1]').addClass 'current'
describe 'when the caption is visible', -> describe 'when the caption is visible', ->
beforeEach -> beforeEach ->
@caption.element.removeClass 'closed' @caption.el.removeClass 'closed'
@caption.toggle jQuery.Event('click') @caption.toggle jQuery.Event('click')
it 'hide the caption', -> it 'hide the caption', ->
expect(@caption.element).toHaveClass 'closed' expect(@caption.el).toHaveClass 'closed'
describe 'when the caption is hidden', -> describe 'when the caption is hidden', ->
beforeEach -> beforeEach ->
@caption.element.addClass 'closed' @caption.el.addClass 'closed'
@caption.toggle jQuery.Event('click') @caption.toggle jQuery.Event('click')
it 'show the caption', -> it 'show the caption', ->
expect(@caption.element).not.toHaveClass 'closed' expect(@caption.el).not.toHaveClass 'closed'
it 'scroll the caption', -> it 'scroll the caption', ->
expect($.fn.scrollTo).toHaveBeenCalled() expect($.fn.scrollTo).toHaveBeenCalled()
...@@ -5,7 +5,7 @@ describe 'VideoControl', -> ...@@ -5,7 +5,7 @@ describe 'VideoControl', ->
describe 'constructor', -> describe 'constructor', ->
it 'render the video controls', -> it 'render the video controls', ->
new VideoControl(element: $('.video-controls')) new VideoControl(el: $('.video-controls'))
expect($('.video-controls').html()).toContain ''' expect($('.video-controls').html()).toContain '''
<div class="slider"></div> <div class="slider"></div>
<div> <div>
...@@ -22,7 +22,7 @@ describe 'VideoControl', -> ...@@ -22,7 +22,7 @@ describe 'VideoControl', ->
''' '''
it 'bind the playback button', -> it 'bind the playback button', ->
control = new VideoControl(element: $('.video-controls')) control = new VideoControl(el: $('.video-controls'))
expect($('.video_control')).toHandleWith 'click', control.togglePlayback expect($('.video_control')).toHandleWith 'click', control.togglePlayback
describe 'when on a touch based device', -> describe 'when on a touch based device', ->
...@@ -30,7 +30,7 @@ describe 'VideoControl', -> ...@@ -30,7 +30,7 @@ describe 'VideoControl', ->
spyOn(window, 'onTouchBasedDevice').andReturn true spyOn(window, 'onTouchBasedDevice').andReturn true
it 'does not add the play class to video control', -> it 'does not add the play class to video control', ->
new VideoControl(element: $('.video-controls')) new VideoControl(el: $('.video-controls'))
expect($('.video_control')).not.toHaveClass 'play' expect($('.video_control')).not.toHaveClass 'play'
expect($('.video_control')).not.toHaveHtml 'Play' expect($('.video_control')).not.toHaveHtml 'Play'
...@@ -40,13 +40,13 @@ describe 'VideoControl', -> ...@@ -40,13 +40,13 @@ describe 'VideoControl', ->
spyOn(window, 'onTouchBasedDevice').andReturn false spyOn(window, 'onTouchBasedDevice').andReturn false
it 'add the play class to video control', -> it 'add the play class to video control', ->
new VideoControl(element: $('.video-controls')) new VideoControl(el: $('.video-controls'))
expect($('.video_control')).toHaveClass 'play' expect($('.video_control')).toHaveClass 'play'
expect($('.video_control')).toHaveHtml 'Play' expect($('.video_control')).toHaveHtml 'Play'
describe 'play', -> describe 'play', ->
beforeEach -> beforeEach ->
@control = new VideoControl(element: $('.video-controls')) @control = new VideoControl(el: $('.video-controls'))
@control.play() @control.play()
it 'switch playback button to play state', -> it 'switch playback button to play state', ->
...@@ -56,7 +56,7 @@ describe 'VideoControl', -> ...@@ -56,7 +56,7 @@ describe 'VideoControl', ->
describe 'pause', -> describe 'pause', ->
beforeEach -> beforeEach ->
@control = new VideoControl(element: $('.video-controls')) @control = new VideoControl(el: $('.video-controls'))
@control.pause() @control.pause()
it 'switch playback button to pause state', -> it 'switch playback button to pause state', ->
...@@ -66,7 +66,7 @@ describe 'VideoControl', -> ...@@ -66,7 +66,7 @@ describe 'VideoControl', ->
describe 'togglePlayback', -> describe 'togglePlayback', ->
beforeEach -> beforeEach ->
@control = new VideoControl(element: $('.video-controls')) @control = new VideoControl(el: $('.video-controls'))
describe 'when the control does not have play or pause class', -> describe 'when the control does not have play or pause class', ->
beforeEach -> beforeEach ->
......
...@@ -21,19 +21,19 @@ describe 'VideoPlayer', -> ...@@ -21,19 +21,19 @@ describe 'VideoPlayer', ->
expect(@player.currentTime).toEqual 0 expect(@player.currentTime).toEqual 0
it 'set the element', -> it 'set the element', ->
expect(@player.element).toBe '#video_example' expect(@player.el).toBe '#video_example'
it 'create video control', -> it 'create video control', ->
expect(window.VideoControl).toHaveBeenCalledWith element: $('.video-controls', @player.element) expect(window.VideoControl).toHaveBeenCalledWith el: $('.video-controls', @player.el)
it 'create video caption', -> it 'create video caption', ->
expect(window.VideoCaption).toHaveBeenCalledWith element: @player.element, youtubeId: 'def456', currentSpeed: '1.0' expect(window.VideoCaption).toHaveBeenCalledWith el: @player.el, youtubeId: 'def456', currentSpeed: '1.0'
it 'create video speed control', -> it 'create video speed control', ->
expect(window.VideoSpeedControl).toHaveBeenCalledWith element: $('.secondary-controls', @player.element), speeds: ['0.75', '1.0'], currentSpeed: '1.0' expect(window.VideoSpeedControl).toHaveBeenCalledWith el: $('.secondary-controls', @player.el), speeds: ['0.75', '1.0'], currentSpeed: '1.0'
it 'create video progress slider', -> it 'create video progress slider', ->
expect(window.VideoProgressSlider).toHaveBeenCalledWith element: $('.slider', @player.element) expect(window.VideoProgressSlider).toHaveBeenCalledWith el: $('.slider', @player.el)
it 'create Youtube player', -> it 'create Youtube player', ->
expect(YT.Player).toHaveBeenCalledWith 'example' expect(YT.Player).toHaveBeenCalledWith 'example'
...@@ -83,7 +83,7 @@ describe 'VideoPlayer', -> ...@@ -83,7 +83,7 @@ describe 'VideoPlayer', ->
expect($('.hide-subtitles')).toHaveData 'qtip' expect($('.hide-subtitles')).toHaveData 'qtip'
it 'create video volume control', -> it 'create video volume control', ->
expect(window.VideoVolumeControl).toHaveBeenCalledWith element: $('.secondary-controls', @player.element) expect(window.VideoVolumeControl).toHaveBeenCalledWith el: $('.secondary-controls', @player.el)
describe 'when on a touch based device', -> describe 'when on a touch based device', ->
beforeEach -> beforeEach ->
...@@ -339,34 +339,34 @@ describe 'VideoPlayer', -> ...@@ -339,34 +339,34 @@ describe 'VideoPlayer', ->
describe 'when the video player is not full screen', -> describe 'when the video player is not full screen', ->
beforeEach -> beforeEach ->
@player.element.removeClass 'fullscreen' @player.el.removeClass 'fullscreen'
@player.toggleFullScreen(jQuery.Event("click")) @player.toggleFullScreen(jQuery.Event("click"))
it 'replace the full screen button tooltip', -> it 'replace the full screen button tooltip', ->
expect($('.add-fullscreen')).toHaveAttr 'title', 'Exit fill browser' expect($('.add-fullscreen')).toHaveAttr 'title', 'Exit fill browser'
it 'add a new exit from fullscreen button', -> it 'add a new exit from fullscreen button', ->
expect(@player.element).toContain 'a.exit' expect(@player.el).toContain 'a.exit'
it 'add the fullscreen class', -> it 'add the fullscreen class', ->
expect(@player.element).toHaveClass 'fullscreen' expect(@player.el).toHaveClass 'fullscreen'
it 'tell VideoCaption to resize', -> it 'tell VideoCaption to resize', ->
expect(@player.caption.resize).toHaveBeenCalled() expect(@player.caption.resize).toHaveBeenCalled()
describe 'when the video player already full screen', -> describe 'when the video player already full screen', ->
beforeEach -> beforeEach ->
@player.element.addClass 'fullscreen' @player.el.addClass 'fullscreen'
@player.toggleFullScreen(jQuery.Event("click")) @player.toggleFullScreen(jQuery.Event("click"))
it 'replace the full screen button tooltip', -> it 'replace the full screen button tooltip', ->
expect($('.add-fullscreen')).toHaveAttr 'title', 'Fill browser' expect($('.add-fullscreen')).toHaveAttr 'title', 'Fill browser'
it 'remove exit full screen button', -> it 'remove exit full screen button', ->
expect(@player.element).not.toContain 'a.exit' expect(@player.el).not.toContain 'a.exit'
it 'remove the fullscreen class', -> it 'remove the fullscreen class', ->
expect(@player.element).not.toHaveClass 'fullscreen' expect(@player.el).not.toHaveClass 'fullscreen'
it 'tell VideoCaption to resize', -> it 'tell VideoCaption to resize', ->
expect(@player.caption.resize).toHaveBeenCalled() expect(@player.caption.resize).toHaveBeenCalled()
......
...@@ -7,7 +7,7 @@ describe 'VideoProgressSlider', -> ...@@ -7,7 +7,7 @@ describe 'VideoProgressSlider', ->
beforeEach -> beforeEach ->
spyOn($.fn, 'slider').andCallThrough() spyOn($.fn, 'slider').andCallThrough()
spyOn(window, 'onTouchBasedDevice').andReturn false spyOn(window, 'onTouchBasedDevice').andReturn false
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
it 'build the slider', -> it 'build the slider', ->
expect(@slider.slider).toBe '.slider' expect(@slider.slider).toBe '.slider'
...@@ -35,7 +35,7 @@ describe 'VideoProgressSlider', -> ...@@ -35,7 +35,7 @@ describe 'VideoProgressSlider', ->
beforeEach -> beforeEach ->
spyOn($.fn, 'slider').andCallThrough() spyOn($.fn, 'slider').andCallThrough()
spyOn(window, 'onTouchBasedDevice').andReturn true spyOn(window, 'onTouchBasedDevice').andReturn true
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
it 'does not build the slider', -> it 'does not build the slider', ->
expect(@slider.slider).toBeUndefined expect(@slider.slider).toBeUndefined
...@@ -43,7 +43,7 @@ describe 'VideoProgressSlider', -> ...@@ -43,7 +43,7 @@ describe 'VideoProgressSlider', ->
describe 'play', -> describe 'play', ->
beforeEach -> beforeEach ->
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
spyOn($.fn, 'slider').andCallThrough() spyOn($.fn, 'slider').andCallThrough()
describe 'when the slider was already built', -> describe 'when the slider was already built', ->
...@@ -82,7 +82,7 @@ describe 'VideoProgressSlider', -> ...@@ -82,7 +82,7 @@ describe 'VideoProgressSlider', ->
describe 'updatePlayTime', -> describe 'updatePlayTime', ->
beforeEach -> beforeEach ->
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
spyOn($.fn, 'slider').andCallThrough() spyOn($.fn, 'slider').andCallThrough()
describe 'when frozen', -> describe 'when frozen', ->
...@@ -106,7 +106,7 @@ describe 'VideoProgressSlider', -> ...@@ -106,7 +106,7 @@ describe 'VideoProgressSlider', ->
describe 'onSlide', -> describe 'onSlide', ->
beforeEach -> beforeEach ->
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
@time = null @time = null
$(@slider).bind 'seek', (event, time) => @time = time $(@slider).bind 'seek', (event, time) => @time = time
spyOnEvent @slider, 'seek' spyOnEvent @slider, 'seek'
...@@ -124,7 +124,7 @@ describe 'VideoProgressSlider', -> ...@@ -124,7 +124,7 @@ describe 'VideoProgressSlider', ->
describe 'onChange', -> describe 'onChange', ->
beforeEach -> beforeEach ->
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
@slider.onChange {}, value: 20 @slider.onChange {}, value: 20
it 'update the tooltip', -> it 'update the tooltip', ->
...@@ -132,7 +132,7 @@ describe 'VideoProgressSlider', -> ...@@ -132,7 +132,7 @@ describe 'VideoProgressSlider', ->
describe 'onStop', -> describe 'onStop', ->
beforeEach -> beforeEach ->
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
@time = null @time = null
$(@slider).bind 'seek', (event, time) => @time = time $(@slider).bind 'seek', (event, time) => @time = time
spyOnEvent @slider, 'seek' spyOnEvent @slider, 'seek'
...@@ -153,7 +153,7 @@ describe 'VideoProgressSlider', -> ...@@ -153,7 +153,7 @@ describe 'VideoProgressSlider', ->
describe 'updateTooltip', -> describe 'updateTooltip', ->
beforeEach -> beforeEach ->
@slider = new VideoProgressSlider element: $('.slider') @slider = new VideoProgressSlider el: $('.slider')
@slider.updateTooltip 90 @slider.updateTooltip 90
it 'set the tooltip value', -> it 'set the tooltip value', ->
......
...@@ -6,7 +6,7 @@ describe 'VideoSpeedControl', -> ...@@ -6,7 +6,7 @@ describe 'VideoSpeedControl', ->
describe 'constructor', -> describe 'constructor', ->
describe 'always', -> describe 'always', ->
beforeEach -> beforeEach ->
@speedControl = new VideoSpeedControl element: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0' @speedControl = new VideoSpeedControl el: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0'
it 'add the video speed control to player', -> it 'add the video speed control to player', ->
expect($('.secondary-controls').html()).toContain ''' expect($('.secondary-controls').html()).toContain '''
...@@ -26,7 +26,7 @@ describe 'VideoSpeedControl', -> ...@@ -26,7 +26,7 @@ describe 'VideoSpeedControl', ->
beforeEach -> beforeEach ->
spyOn(window, 'onTouchBasedDevice').andReturn true spyOn(window, 'onTouchBasedDevice').andReturn true
$('.speeds').removeClass 'open' $('.speeds').removeClass 'open'
@speedControl = new VideoSpeedControl element: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0' @speedControl = new VideoSpeedControl el: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0'
it 'open the speed toggle on click', -> it 'open the speed toggle on click', ->
$('.speeds').click() $('.speeds').click()
...@@ -38,7 +38,7 @@ describe 'VideoSpeedControl', -> ...@@ -38,7 +38,7 @@ describe 'VideoSpeedControl', ->
beforeEach -> beforeEach ->
spyOn(window, 'onTouchBasedDevice').andReturn false spyOn(window, 'onTouchBasedDevice').andReturn false
$('.speeds').removeClass 'open' $('.speeds').removeClass 'open'
@speedControl = new VideoSpeedControl element: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0' @speedControl = new VideoSpeedControl el: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0'
it 'open the speed toggle on hover', -> it 'open the speed toggle on hover', ->
$('.speeds').mouseenter() $('.speeds').mouseenter()
...@@ -56,7 +56,7 @@ describe 'VideoSpeedControl', -> ...@@ -56,7 +56,7 @@ describe 'VideoSpeedControl', ->
describe 'changeVideoSpeed', -> describe 'changeVideoSpeed', ->
beforeEach -> beforeEach ->
@speedControl = new VideoSpeedControl element: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0' @speedControl = new VideoSpeedControl el: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0'
@video.setSpeed '1.0' @video.setSpeed '1.0'
describe 'when new speed is the same', -> describe 'when new speed is the same', ->
...@@ -80,7 +80,7 @@ describe 'VideoSpeedControl', -> ...@@ -80,7 +80,7 @@ describe 'VideoSpeedControl', ->
describe 'onSpeedChange', -> describe 'onSpeedChange', ->
beforeEach -> beforeEach ->
@speedControl = new VideoSpeedControl element: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0' @speedControl = new VideoSpeedControl el: $('.secondary-controls'), speeds: @video.speeds, currentSpeed: '1.0'
$('li[data-speed="1.0"] a').addClass 'active' $('li[data-speed="1.0"] a').addClass 'active'
@speedControl.setSpeed '0.75' @speedControl.setSpeed '0.75'
......
...@@ -6,7 +6,7 @@ describe 'VideoVolumeControl', -> ...@@ -6,7 +6,7 @@ describe 'VideoVolumeControl', ->
describe 'constructor', -> describe 'constructor', ->
beforeEach -> beforeEach ->
spyOn($.fn, 'slider') spyOn($.fn, 'slider')
@volumeControl = new VideoVolumeControl element: $('.secondary-controls') @volumeControl = new VideoVolumeControl el: $('.secondary-controls')
it 'initialize currentVolume to 100', -> it 'initialize currentVolume to 100', ->
expect(@volumeControl.currentVolume).toEqual 100 expect(@volumeControl.currentVolume).toEqual 100
...@@ -44,7 +44,7 @@ describe 'VideoVolumeControl', -> ...@@ -44,7 +44,7 @@ describe 'VideoVolumeControl', ->
beforeEach -> beforeEach ->
spyOnEvent @volumeControl, 'volumeChange' spyOnEvent @volumeControl, 'volumeChange'
@newVolume = undefined @newVolume = undefined
@volumeControl = new VideoVolumeControl element: $('.secondary-controls') @volumeControl = new VideoVolumeControl el: $('.secondary-controls')
$(@volumeControl).bind 'volumeChange', (event, volume) => @newVolume = volume $(@volumeControl).bind 'volumeChange', (event, volume) => @newVolume = volume
describe 'when the new volume is more than 0', -> describe 'when the new volume is more than 0', ->
...@@ -70,7 +70,7 @@ describe 'VideoVolumeControl', -> ...@@ -70,7 +70,7 @@ describe 'VideoVolumeControl', ->
describe 'toggleMute', -> describe 'toggleMute', ->
beforeEach -> beforeEach ->
@newVolume = undefined @newVolume = undefined
@volumeControl = new VideoVolumeControl element: $('.secondary-controls') @volumeControl = new VideoVolumeControl el: $('.secondary-controls')
$(@volumeControl).bind 'volumeChange', (event, volume) => @newVolume = volume $(@volumeControl).bind 'volumeChange', (event, volume) => @newVolume = volume
describe 'when the current volume is more than 0', -> describe 'when the current volume is more than 0', ->
......
...@@ -21,7 +21,7 @@ describe 'Video', -> ...@@ -21,7 +21,7 @@ describe 'Video', ->
expect(window.player).toBeNull() expect(window.player).toBeNull()
it 'set the elements', -> it 'set the elements', ->
expect(@video.element).toBe '#video_example' expect(@video.el).toBe '#video_example'
it 'parse the videos', -> it 'parse the videos', ->
expect(@video.videos).toEqual expect(@video.videos).toEqual
......
...@@ -7,7 +7,7 @@ class @Subview ...@@ -7,7 +7,7 @@ class @Subview
@bind() @bind()
$: (selector) -> $: (selector) ->
$(selector, @element) $(selector, @el)
initialize: -> initialize: ->
render: -> render: ->
......
...@@ -24,8 +24,8 @@ $ -> ...@@ -24,8 +24,8 @@ $ ->
# Preserved for backward compatibility # Preserved for backward compatibility
window.submit_circuit = (circuit_id) -> window.submit_circuit = (circuit_id) ->
$("input.schematic").each (index, element) -> $("input.schematic").each (index, el) ->
element.schematic.update_value() el.schematic.update_value()
schematic_value $("#schematic_#{circuit_id}").attr("value") schematic_value $("#schematic_#{circuit_id}").attr("value")
$.postWithPrefix "/save_circuit/#{circuit_id}", schematic: schematic_value, (data) -> $.postWithPrefix "/save_circuit/#{circuit_id}", schematic: schematic_value, (data) ->
......
class @Problem class @Problem
constructor: (@id, @element_id, url) -> constructor: (@id, @element_id, url) ->
@element = $("##{element_id}") @el = $("##{element_id}")
@render() @render()
$: (selector) -> $: (selector) ->
$(selector, @element) $(selector, @el)
bind: => bind: =>
MathJax.Hub.Queue ["Typeset", MathJax.Hub] MathJax.Hub.Queue ["Typeset", MathJax.Hub]
...@@ -18,16 +18,16 @@ class @Problem ...@@ -18,16 +18,16 @@ class @Problem
updateProgress: (response) => updateProgress: (response) =>
if response.progress_changed if response.progress_changed
@element.attr progress: response.progress_status @el.attr progress: response.progress_status
@element.trigger('progressChanged') @el.trigger('progressChanged')
render: (content) -> render: (content) ->
if content if content
@element.html(content) @el.html(content)
@bind() @bind()
else else
$.postWithPrefix "/modx/#{@id}/problem_get", (response) => $.postWithPrefix "/modx/#{@id}/problem_get", (response) =>
@element.html(response.html) @el.html(response.html)
@bind() @bind()
check: => check: =>
...@@ -47,7 +47,7 @@ class @Problem ...@@ -47,7 +47,7 @@ class @Problem
@updateProgress response @updateProgress response
show: => show: =>
if !@element.hasClass 'showed' if !@el.hasClass 'showed'
Logger.log 'problem_show', problem: @id Logger.log 'problem_show', problem: @id
$.postWithPrefix "/modx/#{@id}/problem_show", (response) => $.postWithPrefix "/modx/#{@id}/problem_show", (response) =>
answers = response.answers answers = response.answers
...@@ -59,12 +59,12 @@ class @Problem ...@@ -59,12 +59,12 @@ class @Problem
@$("#answer_#{key}, #solution_#{key}").html(value) @$("#answer_#{key}, #solution_#{key}").html(value)
MathJax.Hub.Queue ["Typeset", MathJax.Hub] MathJax.Hub.Queue ["Typeset", MathJax.Hub]
@$('.show').val 'Hide Answer' @$('.show').val 'Hide Answer'
@element.addClass 'showed' @el.addClass 'showed'
@updateProgress response @updateProgress response
else else
@$('[id^=answer_], [id^=solution_]').text '' @$('[id^=answer_], [id^=solution_]').text ''
@$('[correct_answer]').attr correct_answer: null @$('[correct_answer]').attr correct_answer: null
@element.removeClass 'showed' @el.removeClass 'showed'
@$('.show').val 'Show Answer' @$('.show').val 'Show Answer'
save: => save: =>
......
class @Sequence class @Sequence
constructor: (@id, @element_id, @elements, @tag, position) -> constructor: (@id, @element_id, @elements, @tag, position) ->
@element = $("#sequence_#{@element_id}") @el = $("#sequence_#{@element_id}")
@buildNavigation() @buildNavigation()
@initProgress() @initProgress()
@bind() @bind()
@render position @render position
$: (selector) -> $: (selector) ->
$(selector, @element) $(selector, @el)
bind: -> bind: ->
@$('#sequence-list a').click @goto @$('#sequence-list a').click @goto
...@@ -57,7 +57,7 @@ class @Sequence ...@@ -57,7 +57,7 @@ class @Sequence
when 'none' then element.addClass('progress-none') when 'none' then element.addClass('progress-none')
when 'in_progress' then element.addClass('progress-some') when 'in_progress' then element.addClass('progress-some')
when 'done' then element.addClass('progress-done') when 'done' then element.addClass('progress-done')
buildNavigation: -> buildNavigation: ->
$.each @elements, (index, item) => $.each @elements, (index, item) =>
link = $('<a>').attr class: "seq_#{item.type}_inactive", 'data-element': index + 1 link = $('<a>').attr class: "seq_#{item.type}_inactive", 'data-element': index + 1
...@@ -65,10 +65,10 @@ class @Sequence ...@@ -65,10 +65,10 @@ class @Sequence
# TODO (vshnayder): add item.progress_detail either to the title or somewhere else. # TODO (vshnayder): add item.progress_detail either to the title or somewhere else.
# Make sure it gets updated after ajax calls. # Make sure it gets updated after ajax calls.
# implementation note: will need to figure out how to handle combining detail # implementation note: will need to figure out how to handle combining detail
# statuses of multiple modules in js. # statuses of multiple modules in js.
list_item = $('<li>').append(link.append(title)) list_item = $('<li>').append(link.append(title))
@setProgress item.progress_status, link @setProgress item.progress_status, link
@$('#sequence-list').append list_item @$('#sequence-list').append list_item
toggleArrows: => toggleArrows: =>
...@@ -89,7 +89,7 @@ class @Sequence ...@@ -89,7 +89,7 @@ class @Sequence
if @position != undefined if @position != undefined
@mark_visited @position @mark_visited @position
$.postWithPrefix "/modx/#{@id}/goto_position", position: new_position $.postWithPrefix "/modx/#{@id}/goto_position", position: new_position
@mark_active new_position @mark_active new_position
@$('#seq_content').html @elements[new_position - 1].content @$('#seq_content').html @elements[new_position - 1].content
...@@ -97,7 +97,7 @@ class @Sequence ...@@ -97,7 +97,7 @@ class @Sequence
@position = new_position @position = new_position
@toggleArrows() @toggleArrows()
@hookUpProgressEvent() @hookUpProgressEvent()
@element.trigger 'contentChanged' @el.trigger 'contentChanged'
goto: (event) => goto: (event) =>
event.preventDefault() event.preventDefault()
......
class @Tab class @Tab
constructor: (@id, @items) -> constructor: (@id, @items) ->
@element = $("#tab_#{id}") @el = $("#tab_#{id}")
@render() @render()
$: (selector) -> $: (selector) ->
$(selector, @element) $(selector, @el)
render: -> render: ->
$.each @items, (index, item) => $.each @items, (index, item) =>
tab = $('<a>').attr(href: "##{@tabId(index)}").html(item.title) tab = $('<a>').attr(href: "##{@tabId(index)}").html(item.title)
@$('.navigation').append($('<li>').append(tab)) @$('.navigation').append($('<li>').append(tab))
@element.append($('<section>').attr(id: @tabId(index))) @el.append($('<section>').attr(id: @tabId(index)))
@element.tabs @el.tabs
show: @onShow show: @onShow
onShow: (element, ui) => onShow: (element, ui) =>
@$('section.ui-tabs-hide').html('') @$('section.ui-tabs-hide').html('')
@$("##{@tabId(ui.index)}").html(@items[ui.index]['content']) @$("##{@tabId(ui.index)}").html(@items[ui.index]['content'])
@element.trigger 'contentChanged' @el.trigger 'contentChanged'
tabId: (index) -> tabId: (index) ->
"tab-#{@id}-#{index}" "tab-#{@id}-#{index}"
class @Video class @Video
constructor: (@id, videos) -> constructor: (@id, videos) ->
window.player = null window.player = null
@element = $("#video_#{@id}") @el = $("#video_#{@id}")
@parseVideos videos @parseVideos videos
@fetchMetadata() @fetchMetadata()
@parseSpeed() @parseSpeed()
......
...@@ -118,16 +118,16 @@ class @VideoCaption extends Subview ...@@ -118,16 +118,16 @@ class @VideoCaption extends Subview
toggle: (event) => toggle: (event) =>
event.preventDefault() event.preventDefault()
if @element.hasClass('closed') if @el.hasClass('closed')
@$('.hide-subtitles').attr('title', 'Turn off captions') @$('.hide-subtitles').attr('title', 'Turn off captions')
@element.removeClass('closed') @el.removeClass('closed')
@scrollCaption() @scrollCaption()
else else
@$('.hide-subtitles').attr('title', 'Turn on captions') @$('.hide-subtitles').attr('title', 'Turn on captions')
@element.addClass('closed') @el.addClass('closed')
captionHeight: -> captionHeight: ->
if @element.hasClass('fullscreen') if @el.hasClass('fullscreen')
$(window).height() - @$('.video-controls').height() $(window).height() - @$('.video-controls').height()
else else
@$('.video-wrapper').height() @$('.video-wrapper').height()
...@@ -3,7 +3,7 @@ class @VideoControl extends Subview ...@@ -3,7 +3,7 @@ class @VideoControl extends Subview
@$('.video_control').click @togglePlayback @$('.video_control').click @togglePlayback
render: -> render: ->
@element.append """ @el.append """
<div class="slider"></div> <div class="slider"></div>
<div> <div>
<ul class="vcr"> <ul class="vcr">
......
...@@ -4,7 +4,7 @@ class @VideoPlayer extends Subview ...@@ -4,7 +4,7 @@ class @VideoPlayer extends Subview
YT.PlayerState.UNSTARTED = -1 YT.PlayerState.UNSTARTED = -1
@currentTime = 0 @currentTime = 0
@element = $("#video_#{@video.id}") @el = $("#video_#{@video.id}")
bind: -> bind: ->
$(@control).bind('play', @play) $(@control).bind('play', @play)
...@@ -20,16 +20,16 @@ class @VideoPlayer extends Subview ...@@ -20,16 +20,16 @@ class @VideoPlayer extends Subview
@addToolTip() unless onTouchBasedDevice() @addToolTip() unless onTouchBasedDevice()
bindExitFullScreen: (event) => bindExitFullScreen: (event) =>
if @element.hasClass('fullscreen') && event.keyCode == 27 if @el.hasClass('fullscreen') && event.keyCode == 27
@toggleFullScreen(event) @toggleFullScreen(event)
render: -> render: ->
@control = new VideoControl element: @$('.video-controls') @control = new VideoControl el: @$('.video-controls')
@caption = new VideoCaption element: @element, youtubeId: @video.youtubeId('1.0'), currentSpeed: @currentSpeed() @caption = new VideoCaption el: @el, youtubeId: @video.youtubeId('1.0'), currentSpeed: @currentSpeed()
unless onTouchBasedDevice() unless onTouchBasedDevice()
@volumeControl = new VideoVolumeControl element: @$('.secondary-controls') @volumeControl = new VideoVolumeControl el: @$('.secondary-controls')
@speedControl = new VideoSpeedControl element: @$('.secondary-controls'), speeds: @video.speeds, currentSpeed: @currentSpeed() @speedControl = new VideoSpeedControl el: @$('.secondary-controls'), speeds: @video.speeds, currentSpeed: @currentSpeed()
@progressSlider = new VideoProgressSlider element: @$('.slider') @progressSlider = new VideoProgressSlider el: @$('.slider')
@player = new YT.Player @video.id, @player = new YT.Player @video.id,
playerVars: playerVars:
controls: 0 controls: 0
...@@ -125,12 +125,12 @@ class @VideoPlayer extends Subview ...@@ -125,12 +125,12 @@ class @VideoPlayer extends Subview
toggleFullScreen: (event) => toggleFullScreen: (event) =>
event.preventDefault() event.preventDefault()
if @element.hasClass('fullscreen') if @el.hasClass('fullscreen')
@$('.exit').remove() @$('.exit').remove()
@$('.add-fullscreen').attr('title', 'Fill browser') @$('.add-fullscreen').attr('title', 'Fill browser')
@element.removeClass('fullscreen') @el.removeClass('fullscreen')
else else
@element.append('<a href="#" class="exit">Exit</a>').addClass('fullscreen') @el.append('<a href="#" class="exit">Exit</a>').addClass('fullscreen')
@$('.add-fullscreen').attr('title', 'Exit fill browser') @$('.add-fullscreen').attr('title', 'Exit fill browser')
@$('.exit').click @toggleFullScreen @$('.exit').click @toggleFullScreen
@caption.resize() @caption.resize()
......
...@@ -3,7 +3,7 @@ class @VideoProgressSlider extends Subview ...@@ -3,7 +3,7 @@ class @VideoProgressSlider extends Subview
@buildSlider() unless onTouchBasedDevice() @buildSlider() unless onTouchBasedDevice()
buildSlider: -> buildSlider: ->
@slider = @element.slider @slider = @el.slider
range: 'min' range: 'min'
change: @onChange change: @onChange
slide: @onSlide slide: @onSlide
......
...@@ -15,7 +15,7 @@ class @VideoSpeedControl extends Subview ...@@ -15,7 +15,7 @@ class @VideoSpeedControl extends Subview
$(this).removeClass('open') $(this).removeClass('open')
render: -> render: ->
@element.prepend """ @el.prepend """
<div class="speeds"> <div class="speeds">
<a href="#"> <a href="#">
<h3>Speed</h3> <h3>Speed</h3>
......
...@@ -10,7 +10,7 @@ class @VideoVolumeControl extends Subview ...@@ -10,7 +10,7 @@ class @VideoVolumeControl extends Subview
@$('.volume>a').click(@toggleMute) @$('.volume>a').click(@toggleMute)
render: -> render: ->
@element.prepend """ @el.prepend """
<div class="volume"> <div class="volume">
<a href="#"></a> <a href="#"></a>
<div class="volume-slider-container"> <div class="volume-slider-container">
......
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