Enabling/disabling of interactive transcripts #47
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
z4y4ts
suggested changes
Jan 3, 2017
| @@ -38,7 +38,7 @@ domReady(function() { | |||
| var el = event.currentTarget; | |||
| el.classList.toggle('vjs-control-enabled'); | |||
| var _event = this.hasClass('vjs-control-enabled') ? this.enabledEventName() : this.disabledEventName(); | |||
There was a problem hiding this comment.
Rename _event -> eventName
To avoid confusion.
| }); | ||
|
|
||
| // attach the widget to the page | ||
| var transcriptContainer = document.getElementById('transcript'); | ||
| transcriptContainer.appendChild(transcript.el()); | ||
|
|
||
| // Show or hide the transcripts block in depend of the transcript state |
| this.toggleButton({ | ||
| style: "fa-cc", | ||
| enabledEvent: "captionenabled", | ||
| disabledEvent: "captiondisabled", | ||
| cssClasses: "vjs-custom-caption-button vjs-control", | ||
| }); | ||
| var cssClasses = "vjs-custom-transcript-button vjs-control"; | ||
| this.transcriptEnabled ? cssClasses += ' vjs-control-enabled': ''; |
There was a problem hiding this comment.
Ternary operator. Your using it semantically wrong here.
Rewrite with if (...) {...}
| @@ -116,6 +116,12 @@ class VideoXBlock(StudioEditableXBlockMixin, XBlock): | |||
| help=_("Video muted or not") | |||
| ) | |||
|
|
|||
| transcript_enabled = Boolean( | |||
There was a problem hiding this comment.
transcripts_enabled to be consistent with transcripts field.
Also there may be more that one transcript.
| @@ -45,7 +46,8 @@ var setInitialState = function (player, state) { | |||
| player | |||
| .volume(state.volume) | |||
| .muted(state.muted) | |||
| .playbackRate(state.playbackRate); | |||
| .playbackRate(state.playbackRate) | |||
| .transcriptEnabled = state.transcriptEnabled; | |||
polesye
reviewed
Jan 3, 2017
| }); | ||
|
|
||
| // attach the widget to the page | ||
| var transcriptContainer = document.getElementById('transcript'); | ||
| transcriptContainer.appendChild(transcript.el()); | ||
|
|
||
| // Show or hide the transcripts block in depend of the transcript state | ||
| transcriptContainer.style.display = this.transcriptEnabled ? 'block' : 'none'; |
There was a problem hiding this comment.
please use classNames + css to show/hide element
polesye
reviewed
Jan 3, 2017
| @@ -1,5 +1,6 @@ | |||
| body { | |||
| margin: 0; | |||
| display: flex; | |||
There was a problem hiding this comment.
To make video container shrink when side-transcripts are displayed, I guess.
There was a problem hiding this comment.
don't we need to set flex rule on a child node?
There was a problem hiding this comment.
This solution was suggested by @madeira and is working. Setting display: flex; on a video container doesn't work as far as I can see.
polesye
reviewed
Jan 3, 2017
| @@ -24,6 +24,7 @@ var player_state = { | |||
| 'currentTime': {{ player_state.current_time }}, | |||
| 'playbackRate': {{ player_state.playback_rate }}, | |||
| 'muted': {{ player_state.muted | yesno:"true,false" }}, | |||
| 'transcriptEnabled': {{ player_state.transcript_enabled | yesno:"true,false" }} | |||
…e/interactive_transcripts_display Fix conflicts
sendr
force-pushed
the
feature/interactive_transcripts_display
branch
from
10d3acb to
8de712f
Compare
z4y4ts
approved these changes
Jan 3, 2017
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.