add Persian Subtitle

This commit is contained in:
Ali Zemani 2019-07-15 16:40:25 +04:30
parent 5464eae498
commit 19e613fb43
3 changed files with 15106 additions and 86 deletions

View file

@ -19,7 +19,7 @@ The only thing you need is 5hours video file of `Bandersnatch` episode, Drag & d
* Only work on google chrome (Doesn't work on Firefox; codec problems) * Only work on google chrome (Doesn't work on Firefox; codec problems)
* Download `Bandersnatch` video file (`5:12:14`) * Download `Bandersnatch` video file (`5:12:14`)
* Drag it on white box on [page](https://mehotkhan.github.io/BandersnatchInteractive/) :) * Drag it on white box on [page](https://mehotkhan.github.io/BandersnatchInteractive/) :)
* `English` , `Arabic` , `Spanish` , `Hebrew` ,`Portuguese` , `Greek` ,`Turkish` , `Czech` subtitle available, If you want add another language subtitle, tell me. * `Persian` , `English` , `Arabic` , `Spanish` , `Hebrew` ,`Portuguese` , `Greek` ,`Turkish` , `Czech` subtitle available, If you want add another language subtitle, tell me.
* to change subtitle : right click on video , enable show controls , after that . on bottom,right you see menu icon (3 vertical dot) then you can subtitle section * to change subtitle : right click on video , enable show controls , after that . on bottom,right you see menu icon (3 vertical dot) then you can subtitle section
* Note : after change subtitle , disable show controls ,if dont disable it on full screen video,you cant see option selector * Note : after change subtitle , disable show controls ,if dont disable it on full screen video,you cant see option selector

View file

@ -1,105 +1,121 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title>Bandersnatch Interactive Player</title> <title>Bandersnatch Interactive Player</title>
<meta name="description" content="With this online(html) video player you can watch Bandersnatch episode of Black Mirror interactively." /> <meta name="description"
<meta name="keywords" content="Bandersnatch,Bandersnatch Interactive Player,Interactive Player,whatch," /> content="With this online(html) video player you can watch Bandersnatch episode of Black Mirror interactively." />
<script src="assets/bandersnatch.js"></script> <meta name="keywords" content="Bandersnatch,Bandersnatch Interactive Player,Interactive Player,whatch," />
<script src="assets/SegmentMap.js"></script> <script src="assets/bandersnatch.js"></script>
<script src="assets/scripts.js"></script> <script src="assets/SegmentMap.js"></script>
<link rel="stylesheet" type="text/css" href="assets/styles.css"> <script src="assets/scripts.js"></script>
<!-- Global site tag (gtag.js) - Google Analytics --> <link rel="stylesheet" type="text/css" href="assets/styles.css">
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-132739093-1"></script> <!-- Global site tag (gtag.js) - Google Analytics -->
<script> <script async src="https://www.googletagmanager.com/gtag/js?id=UA-132739093-1"></script>
window.dataLayer = window.dataLayer || []; <script>
function gtag(){dataLayer.push(arguments);} window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date()); gtag('js', new Date());
gtag('config', 'UA-132739093-1'); gtag('config', 'UA-132739093-1');
</script> </script>
</head> </head>
<body onload=onload()> <body onload=onload()>
<div> <div>
<div id="c"> <div id="c">
<section role="banner"> <section role="banner">
<div id="file-selector"> <div id="file-selector">
<div class="file-area"> <div class="file-area">
<div class="contact"> <div class="contact">
<p> <p>
Developed by <a href="https://github.com/mehotkhan" target="_blank">Mehotkhan</a> ,for info <a href="https://github.com/mehotkhan/BandersnatchInteractive" Developed by <a href="https://github.com/mehotkhan" target="_blank">Mehotkhan</a> ,for
target="_blank">https://github.com/mehotkhan/BandersnatchInteractive</a> info <a href="https://github.com/mehotkhan/BandersnatchInteractive"
target="_blank">https://github.com/mehotkhan/BandersnatchInteractive</a>
,<b>if you want some donation : my bitcoin wallet :</b> ,<b>if you want some donation : my bitcoin wallet :</b>
<pr>1CxaCJbh4VMNicnpktsBVfnVU5xq4QYyHW</pr> <pr>1CxaCJbh4VMNicnpktsBVfnVU5xq4QYyHW</pr>
</p> </p>
</div>
<input id="fileinput" type="file">
<div class="file-dummy">
<h2>Bandersnatch Interactive Player</h2>
<span class="default">Select Bandersnatch video file ( 5:12:14 ) </span>
<span class="success">Great, your file is selected</span>
<ul class="file-tips">
<li>this player only work on google chrome ( on firefox dont work , codec problem,test other browser ?)</li>
<li>download Bandersnatch video file ( 5:12:14 )</li>
<li>drag it on white box on page :)</li>
<li>English , Arabic , Spanish , Hebrew ,Portuguese ,Greek ,Turkish ,Czech subtitle available , if you want add another language
subtitle , tell me</li>
<li>to change subtitle : right click on video , enable show controls , after that . on bottom,right you see
<span class="menu-item"></span> ,then you can subtitle section </li>
<li>Note : after change subtitle , disable show controls ,if dont disable it on full screen video,you cant see
option selector</li>
<li>tested with Black.Mirror.Bandersnatch.2018.720p.WEB-DL.x264.DUAL.mkv file</li>
</ul>
<ul class="controls-tips">
<h6>controls tips</h6>
<li><kbd>F</kbd> - Toggle fullscreen</li>
<li><kbd>R</kbd> - Restart video</li>
<li><kbd></kbd> - Jump to the next segment (or to the next interaction zone)</li>
<li><kbd></kbd> - Jump to the previous segment</li>
<li><kbd>Space</kbd> - Toggle play and pause</li>
</ul>
</div>
</div> </div>
<input id="fileinput" type="file">
<div class="file-dummy">
<h2>Bandersnatch Interactive Player</h2>
<span class="default">Select Bandersnatch video file ( 5:12:14 ) </span>
<span class="success">Great, your file is selected</span>
<ul class="file-tips">
<li>this player only work on google chrome ( on firefox dont work , codec problem,test
other browser ?)</li>
<li>download Bandersnatch video file ( 5:12:14 )</li>
<li>drag it on white box on page :)</li>
<li>Persian , English , Arabic , Spanish , Hebrew ,Portuguese ,Greek ,Turkish ,Czech
subtitle available , if you want add another language
subtitle , tell me</li>
<li>to change subtitle : right click on video , enable show controls , after that . on
bottom,right you see
<span class="menu-item"></span> ,then you can subtitle section </li>
<li>Note : after change subtitle , disable show controls ,if dont disable it on full
screen video,you cant see
option selector</li>
<li>tested with Black.Mirror.Bandersnatch.2018.720p.WEB-DL.x264.DUAL.mkv file</li>
</div> </ul>
<div id="wrapper-video">
<video id="video" loop preload="metadata">
<source id="video-source" src="">
<track label="English" kind="subtitles" srclang="en" src="subtitle/Black.Mirror.Bandersnatch.2018.WEBRip.x264-NoGRP.vtt" default>
<track label="Arabic" kind="subtitles" srclang="en" src="subtitle/Black.Mirror.Bandersnatch.2018-arabic.vtt">
<track label="Spanish" kind="subtitles" srclang="en" src="subtitle/Black.Mirror.Bandersnatch.2018.720p.espanish.vtt">
<track label="Hebrew" kind="subtitles" srclang="en" src="subtitle/Black.Mirror.Bandersnatch.2018.Web-05.12.14-NF-UniHebSubs-hebrew.vtt">
<track label="Portuguese" kind="subtitles" srclang="en" src="subtitle/Black.Mirror.Bandersnatch.2018.WEBRip.720p.portuguese.vtt">
<track label="Greek" kind="subtitles" srclang="en" src="subtitle/black-mirror-bandersnatch-2018-nf-web-dl-720p-greek.vtt">
<track label="Turkish" kind="subtitles" srclang="en" src="subtitle/BlackMirror.Bandersnatch-Turkish.vtt">
<track label="Czech" kind="subtitles" srclang="en" src="subtitle/Black-Mirror-Bandersnatch-Czech.vtt">
</video> <ul class="controls-tips">
<div class="controls"> <h6>controls tips</h6>
<div id="choiceCaption"></div> <li><kbd>F</kbd> - Toggle fullscreen</li>
<div id="progress"></div> <li><kbd>R</kbd> - Restart video</li>
<div class="buttons"> <li><kbd></kbd> - Jump to the next segment (or to the next interaction zone)</li>
<ul id="choices"></ul> <li><kbd></kbd> - Jump to the previous segment</li>
<ul id="interactionZones"></ul> <li><kbd>Space</kbd> - Toggle play and pause</li>
<ul id="nextSegments"></ul>
<ul id="nextSegment"></ul> </ul>
</div>
</div> </div>
</div> </div>
</div> </div>
</section> <div id="wrapper-video">
<video id="video" loop preload="metadata">
<source id="video-source" src="">
<track label="English" kind="subtitles" srclang="en"
src="subtitle/Black.Mirror.Bandersnatch.2018.WEBRip.x264-NoGRP.vtt" default>
<track label="Persian" kind="subtitles" srclang="en"
src="subtitle/Black.Mirror.Bandersnatch.2018.WEBRip.x264-NoGRP-persian-vtt-sharp.vtt">
<track label="Arabic" kind="subtitles" srclang="en"
src="subtitle/Black.Mirror.Bandersnatch.2018-arabic.vtt">
<track label="Spanish" kind="subtitles" srclang="en"
src="subtitle/Black.Mirror.Bandersnatch.2018.720p.espanish.vtt">
<track label="Hebrew" kind="subtitles" srclang="en"
src="subtitle/Black.Mirror.Bandersnatch.2018.Web-05.12.14-NF-UniHebSubs-hebrew.vtt">
<track label="Portuguese" kind="subtitles" srclang="en"
src="subtitle/Black.Mirror.Bandersnatch.2018.WEBRip.720p.portuguese.vtt">
<track label="Greek" kind="subtitles" srclang="en"
src="subtitle/black-mirror-bandersnatch-2018-nf-web-dl-720p-greek.vtt">
<track label="Turkish" kind="subtitles" srclang="en"
src="subtitle/BlackMirror.Bandersnatch-Turkish.vtt">
<track label="Czech" kind="subtitles" srclang="en"
src="subtitle/Black-Mirror-Bandersnatch-Czech.vtt">
</video>
<div class="controls">
<div id="choiceCaption"></div>
<div id="progress"></div>
<div class="buttons">
<ul id="choices"></ul>
<ul id="interactionZones"></ul>
<ul id="nextSegments"></ul>
<ul id="nextSegment"></ul>
</div>
</div>
</div>
</div> </div>
</body> </section>
</html>
</div>
</body>
</html>

File diff suppressed because it is too large Load diff