Skip to content

Commit e488ed5

Browse files
terrillterrill
committed
Fix external transcript container bug
1 parent f323ce7 commit e488ed5

4 files changed

Lines changed: 42 additions & 18 deletions

File tree

‎build/ableplayer.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2103,7 +2103,7 @@ console.log('number of matching parent elements: ' + prevHeading.length);
21032103

21042104
// If client has provided separate transcript location, put it there instead.
21052105
if (this.transcriptDivLocation) {
2106-
$(this.transcriptDivLocation).append(this.$transcriptArea);
2106+
$('#' + this.transcriptDivLocation).append(this.$transcriptArea);
21072107
}
21082108
else {
21092109
// Place adjacent to player with reactive flow.
@@ -2114,7 +2114,8 @@ console.log('number of matching parent elements: ' + prevHeading.length);
21142114
this.$ableColumnRight.width(this.playerWidth);
21152115
}
21162116

2117-
if (!this.prefTranscript) {
2117+
// If client has provided separate transcript location, override user's preference for hiding transcript
2118+
if (!this.prefTranscript && !this.transcriptDivLocation) {
21182119
this.$transcriptArea.hide();
21192120
}
21202121
};
@@ -5077,7 +5078,6 @@ console.log('fast forwarding ' + this.seekInterval + ' seconds');
50775078
};
50785079

50795080
AblePlayer.prototype.generateTranscript = function(captions, descriptions) {
5080-
50815081
var thisObj = this;
50825082

50835083
var main = $('<div class="able-transcript-container"></div>');

‎scripts/buildplayer.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -218,7 +218,7 @@ console.log('number of matching parent elements: ' + prevHeading.length);
218218

219219
// If client has provided separate transcript location, put it there instead.
220220
if (this.transcriptDivLocation) {
221-
$(this.transcriptDivLocation).append(this.$transcriptArea);
221+
$('#' + this.transcriptDivLocation).append(this.$transcriptArea);
222222
}
223223
else {
224224
// Place adjacent to player with reactive flow.
@@ -229,7 +229,8 @@ console.log('number of matching parent elements: ' + prevHeading.length);
229229
this.$ableColumnRight.width(this.playerWidth);
230230
}
231231

232-
if (!this.prefTranscript) {
232+
// If client has provided separate transcript location, override user's preference for hiding transcript
233+
if (!this.prefTranscript && !this.transcriptDivLocation) {
233234
this.$transcriptArea.hide();
234235
}
235236
};

‎scripts/transcript.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,6 @@
8585
};
8686

8787
AblePlayer.prototype.generateTranscript = function(captions, descriptions) {
88-
8988
var thisObj = this;
9089

9190
var main = $('<div class="able-transcript-container"></div>');

‎tests/test7b.html‎

Lines changed: 36 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,28 @@
1919
<!-- Able Player JavaScript -->
2020
<script src="../build/ableplayer.js"></script>
2121

22+
<!-- Style for this example only -->
23+
<style>
24+
main {
25+
position: relative;
26+
width: 100%;
27+
margin: 0;
28+
}
29+
#player {
30+
float: left;
31+
width: 480px;
32+
margin: 0;
33+
}
34+
#transcript {
35+
height: 500px;
36+
margin: 0;
37+
padding-left: 500px;
38+
}
39+
#transcript div.able-desc {
40+
width: 90%;
41+
}
42+
</style>
43+
2244
</head>
2345

2446
<body>
@@ -28,18 +50,20 @@ <h1>Able Player Test #7b:<br/>Video player with interactive transcript in an ext
2850
<p>For additional test see the <a href="index.html">Index of <em>Able Player</em> Tests</a>.</p>
2951

3052
<!-- to write transcript to an external div, pass id of an empty div via data-transcript-div -->
53+
<main role="main">
54+
<div id="player">
55+
<video id="video1" preload="auto" width="480" height="360" poster="../media/wwa.jpg" data-able-player data-transcript-div="transcript">
56+
<source type="video/webm" src="../media/wwa.webm" data-desc-src="../media/wwa_described.webm"/>
57+
<source type="video/mp4" src="../media/wwa.mp4" data-desc-src="../media/wwa_described.mp4"/>
58+
<track kind="captions" src="../media/wwa_captions_en.vtt" srclang="en" label="English"/>
59+
<track kind="captions" src="../media/wwa_captions_es.vtt" srclang="es" label="Espanol"/>
60+
<track kind="descriptions" src="../media/wwa_description_en.vtt" srclang="en"/>
61+
<track kind="descriptions" src="../media/wwa_description_es.vtt" srclang="es"/>
62+
<track kind="chapters" src="../media/wwa_chapters_en.vtt"/>
63+
</video>
64+
</div>
65+
<div id="transcript"></div>
66+
</main>
3167

32-
<video id="video1" preload="auto" width="480" height="360" poster="../media/wwa.jpg" data-able-player data-transcript-div="transcript" data-seek-interval="5">
33-
<source type="video/webm" src="../media/wwa.webm" data-desc-src="../media/wwa_described.webm"/>
34-
<source type="video/mp4" src="../media/wwa.mp4" data-desc-src="../media/wwa_described.mp4"/>
35-
<track kind="captions" src="../media/wwa_captions_en.vtt" srclang="en" label="English"/>
36-
<track kind="captions" src="../media/wwa_captions_es.vtt" srclang="es" label="Espanol"/>
37-
<track kind="descriptions" src="../media/wwa_description_en.vtt" srclang="en"/>
38-
<track kind="descriptions" src="../media/wwa_description_es.vtt" srclang="es"/>
39-
<track kind="chapters" src="../media/wwa_chapters_en.vtt"/>
40-
</video>
41-
42-
<h2>Transcript</h2>
43-
<div id="transcript"></div>
4468
</body>
4569
</html>

0 commit comments

Comments
 (0)