| OLD | NEW |
|---|
| (Empty) |
| 1 <!DOCTYPE html> | |
| 2 <html> | |
| 3 <head> | |
| 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | |
| 5 | |
| 6 <script src=../../media-controls.js></script> | |
| 7 <script src=../../media-file.js></script> | |
| 8 <script src=../../video-test.js></script> | |
| 9 <script> | |
| 10 var testTrack; | |
| 11 var region; | |
| 12 var container; | |
| 13 var totalVisibleLines; | |
| 14 | |
| 15 var seekTimes = [0.2, 0.5, 1.0, 2.3, 3.0]; | |
| 16 var crtSeekTime = 0; | |
| 17 | |
| 18 function countVisibleLines(cueElement) | |
| 19 { | |
| 20 var cueRect = cueElement.getBoundingClientRect(); | |
| 21 var regionRect = region.getBoundingClientRect(); | |
| 22 | |
| 23 var linesMatch = cueElement.textContent.match(/\n/g); | |
| 24 var linesCount = 1 + (linesMatch == null ? 0 : linesMatch.length); | |
| 25 var lineHeight = cueRect.height / linesCount; | |
| 26 | |
| 27 var visibleLines = 0; | |
| 28 for (i = 0; i < linesCount; ++i) { | |
| 29 var lineTop = cueRect.top + i * lineHeight; | |
| 30 var lineBottom = cueRect.top + (i+1) * lineHeight; | |
| 31 | |
| 32 if (lineTop >= regionRect.top && lineBottom <= regionRect.bottom) | |
| 33 visibleLines++; | |
| 34 } | |
| 35 | |
| 36 return visibleLines; | |
| 37 } | |
| 38 | |
| 39 function testRegionsDisplay() | |
| 40 { | |
| 41 testTrack = video.textTracks[0]; | |
| 42 | |
| 43 consoleWrite("** The text track has only one region **"); | |
| 44 testExpected("testTrack.regions.length", 1); | |
| 45 | |
| 46 try { | |
| 47 region = textTrackDisplayElement(video, 'region'); | |
| 48 container = textTrackDisplayElement(video, 'region-container'); | |
| 49 } catch(e) { | |
| 50 consoleWrite(e); | |
| 51 } | |
| 52 | |
| 53 consoleWrite("<br>** Inspecting cues displayed within region**"); | |
| 54 | |
| 55 waitForEvent("seeked", inspectRegionTree); | |
| 56 seekVideo(); | |
| 57 } | |
| 58 | |
| 59 function seekVideo() | |
| 60 { | |
| 61 consoleWrite(""); | |
| 62 run("video.currentTime = " + seekTimes[crtSeekTime++]); | |
| 63 } | |
| 64 | |
| 65 function inspectRegionTree() | |
| 66 { | |
| 67 consoleWrite("Total cues in region: " + container.children.length); | |
| 68 totalVisibleLines = 0; | |
| 69 | |
| 70 for (var i = 0; i < container.children.length; ++i) { | |
| 71 var cue = container.children[i]; | |
| 72 var cueVisibleLines = countVisibleLines(cue); | |
| 73 consoleWrite("Cue content is: " + cue.textContent); | |
| 74 consoleWrite("Cue lines visible from this cue: " + cueVisibleLin
es); | |
| 75 | |
| 76 totalVisibleLines += cueVisibleLines; | |
| 77 } | |
| 78 | |
| 79 testExpected("totalVisibleLines <= testTrack.regions[0].height", tru
e); | |
| 80 | |
| 81 if (crtSeekTime == seekTimes.length) | |
| 82 endTest(); | |
| 83 else | |
| 84 seekVideo(); | |
| 85 } | |
| 86 | |
| 87 function startTest() | |
| 88 { | |
| 89 if (!window.TextTrackRegion) { | |
| 90 failTest(); | |
| 91 return; | |
| 92 } | |
| 93 | |
| 94 findMediaElement(); | |
| 95 | |
| 96 video.src = findMediaFile('video', '../../content/test'); | |
| 97 waitForEvent('canplaythrough', testRegionsDisplay); | |
| 98 } | |
| 99 | |
| 100 </script> | |
| 101 </head> | |
| 102 <body> | |
| 103 <p>Tests default rendering for TextTrackCues that belong to a TextTrackR
egion.</p> | |
| 104 <video controls> | |
| 105 <track src="../captions-webvtt/captions-regions.vtt" kind="captions"
default onload="startTest()"> | |
| 106 </video> | |
| 107 </body> | |
| 108 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 55653003:
Rename TextTrackRegion/TextTrackRegionList to VTTRegion/VTTRegionList (Closed)
Base URL: https://chromium.googlesource.com/chromium/blink.git@master