aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--assets/css/_mejs_hacks.less30
-rw-r--r--assets/css/_structure.less1
-rw-r--r--assets/css/_subtitles.less36
-rw-r--r--assets/img/subtitles-controls.svg550
-rw-r--r--assets/js/lustige-subtitles.js117
-rw-r--r--assets/js/lustiges-script.js154
-rw-r--r--index.php2
-rw-r--r--model/Room.php10
-rw-r--r--model/Subtitles.php26
-rw-r--r--template/assemblies/player/video.phtml6
-rw-r--r--template/page.phtml14
11 files changed, 766 insertions, 180 deletions
diff --git a/assets/css/_mejs_hacks.less b/assets/css/_mejs_hacks.less
index 5a58c58..b89ee96 100644
--- a/assets/css/_mejs_hacks.less
+++ b/assets/css/_mejs_hacks.less
@@ -1,34 +1,4 @@
.mejs-container {
- .mejs-subs-line {
- position: absolute;
- bottom: 50px;
- height: 85px;
- width: 100%;
- background-color: fade(white, 85%);
- color: black;
- font-size: 65px;
- text-align: center;
- opacity: 0;
- display: none;
- padding: 5px 0;
- overflow: hidden;
-
- .silence {
- font-size: 49%;
- opacity: 0;
- display: none;
- color: #555;
- }
- &.silence .silence { opacity: 1; display: block; }
-
- .error {
- color: red;
- opacity: 0;
- display: none;
- }
- &.error .error { opacity: 1; display: block; }
- }
-
&.mejs-video .mejs-controls {
@factor: 1.5;
diff --git a/assets/css/_structure.less b/assets/css/_structure.less
index d6e4257..422bfab 100644
--- a/assets/css/_structure.less
+++ b/assets/css/_structure.less
@@ -89,3 +89,4 @@ body {
@import "_embed.less";
@import "_feedback.less";
@import "_allconferences.less";
+@import "_subtitles.less";
diff --git a/assets/css/_subtitles.less b/assets/css/_subtitles.less
new file mode 100644
index 0000000..81c776e
--- /dev/null
+++ b/assets/css/_subtitles.less
@@ -0,0 +1,36 @@
+.mejs-container.mejs-video .mejs-controls .mejs-button.mejs-subtitles {
+ button {
+ background-image: url(../img/subtitles-controls.svg);
+ background-size: 240px 48px !important;
+ }
+
+ &.mejs-subtitles-button button {
+ background-position: -174px -24px;
+ }
+ &.mejs-subtitles-popup-button button {
+ background-position: -202px -24px;
+ }
+}
+
+.mejs-container.mejs-video {
+ .mejs-subtitles-lines {
+ position: absolute;
+ bottom: 40px;
+ height: 182px !important;
+ width: 100%;
+ background-color: fade(white, 85%);
+ color: black;
+ font-size: 42px;
+ text-align: center;
+ padding: 5px 0;
+ overflow: hidden;
+
+ display: none;
+
+ .mejs-subtitles-lines-inner {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ }
+ }
+}
diff --git a/assets/img/subtitles-controls.svg b/assets/img/subtitles-controls.svg
new file mode 100644
index 0000000..1b714cd
--- /dev/null
+++ b/assets/img/subtitles-controls.svg
@@ -0,0 +1,550 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:xlink="http://www.w3.org/1999/xlink"
+ height="32"
+ width="160"
+ y="0px"
+ x="0px"
+ xml:space="preserve"
+ version="1.1"
+ viewBox="0 0 160 32"
+ id="controls.fw-Page%201"><metadata
+ id="metadata4546"><rdf:RDF><cc:Work
+ rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+ id="defs4341"><radialGradient
+ gradientUnits="userSpaceOnUse"
+ fy="9.4657277"
+ fx="74.373574"
+ gradientTransform="scale(1.183216,0.84515425)"
+ r="5.9160798"
+ cy="9.4657277"
+ cx="74.373574"
+ id="gradient1"><stop
+ id="stop4344"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4346"
+ offset="100%"
+ stop-opacity="0.2"
+ stop-color="#f2f2f2" /></radialGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(1.0385816,0.96285167)"
+ y2="31.832523"
+ x2="69.32532"
+ y1="2.0771595"
+ x1="69.32532"
+ id="gradient2"><stop
+ id="stop4349"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4351"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="13.9375"
+ x2="68.5"
+ y1="2"
+ x1="68.5"
+ id="gradient3"><stop
+ id="stop4354"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4356"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(1.0801234,0.9258201)"
+ y2="15.121728"
+ x2="51.845926"
+ y1="2.1602469"
+ x1="51.845926"
+ id="gradient4"><stop
+ id="stop4359"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4361"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(0.91287093,1.0954451)"
+ y2="12.8943"
+ x2="21.36118"
+ y1="2.7386145"
+ x1="21.36118"
+ id="gradient5"><stop
+ id="stop4364"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4366"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(0.57735027,1.7320508)"
+ y2="8.0829038"
+ x2="39.837169"
+ y1="1.1547005"
+ x1="39.837169"
+ id="gradient6"><stop
+ id="stop4369"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4371"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(0.91287093,1.0954451)"
+ y2="27.500235"
+ x2="21.36118"
+ y1="17.344549"
+ x1="21.36118"
+ id="gradient7"><stop
+ id="stop4374"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4376"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(0.57735027,1.7320508)"
+ y2="17.320508"
+ x2="39.837169"
+ y1="10.392305"
+ x1="39.837169"
+ id="gradient8"><stop
+ id="stop4379"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4381"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="14"
+ x2="8.5"
+ y1="3"
+ x1="8.5"
+ id="gradient9"><stop
+ id="stop4384"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4386"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(0.5,2)"
+ y2="15"
+ x2="9"
+ y1="9"
+ x1="9"
+ id="gradient10"><stop
+ id="stop4389"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4391"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ gradientTransform="scale(0.5,2)"
+ y2="15"
+ x2="23"
+ y1="9"
+ x1="23"
+ id="gradient11"><stop
+ id="stop4394"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4396"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="13.9375"
+ x2="36.5"
+ y1="2"
+ x1="36.5"
+ id="gradient12"><stop
+ id="stop4399"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4401"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="13.9375"
+ x2="36"
+ y1="2.0000001"
+ x1="36"
+ id="gradient13"><stop
+ id="stop4404"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4406"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="13.9375"
+ x2="43.5"
+ y1="2"
+ x1="43.5"
+ id="gradient14"><stop
+ id="stop4409"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4411"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="13.9375"
+ x2="44"
+ y1="2.0000001"
+ x1="44"
+ id="gradient15"><stop
+ id="stop4414"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4416"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="29.9375"
+ x2="44"
+ y1="18"
+ x1="44"
+ id="gradient16"><stop
+ id="stop4419"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4421"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="27.55"
+ x2="36"
+ y1="18"
+ x1="36"
+ id="gradient17"><stop
+ id="stop4424"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4426"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="30"
+ x2="36"
+ y1="18"
+ x1="36"
+ id="gradient18"><stop
+ id="stop4429"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4431"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="30.4375"
+ x2="44"
+ y1="18"
+ x1="44"
+ id="gradient19"><stop
+ id="stop4434"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4436"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ y2="1"
+ x2="0.55000001"
+ y1="0"
+ x1="0.55000001"
+ id="gradient20"><stop
+ id="stop4439"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4441"
+ offset="100%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ y2="1"
+ x2="0.5"
+ y1="0"
+ x1="0.5"
+ id="gradient21"><stop
+ id="stop4444"
+ offset="0%"
+ stop-opacity="1"
+ stop-color="#ffffff" /><stop
+ id="stop4446"
+ offset="99.4444%"
+ stop-opacity="1"
+ stop-color="#c8c8c8" /></linearGradient><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="1406.2863"
+ x2="1017.2181"
+ y1="-139.92293"
+ x1="1017.2181"
+ id="linearGradient4554"
+ xlink:href="#gradient21" /><linearGradient
+ y2="1285.141"
+ x2="980.77423"
+ y1="-285.6619"
+ x1="980.77423"
+ gradientUnits="userSpaceOnUse"
+ id="linearGradient4741"
+ xlink:href="#gradient20" /><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="13"
+ x2="120.5"
+ y1="3"
+ x1="120.5"
+ id="linearGradient4743"
+ xlink:href="#gradient20" /><linearGradient
+ gradientUnits="userSpaceOnUse"
+ y2="14.5824"
+ x2="136"
+ y1="1.4176"
+ x1="136"
+ id="linearGradient4745"
+ xlink:href="#gradient21" /><linearGradient
+ gradientTransform="matrix(0.00837054,0,0,0.00837054,135,19.285709)"
+ y2="1285.141"
+ x2="980.77423"
+ y1="-285.6619"
+ x1="980.77423"
+ gradientUnits="userSpaceOnUse"
+ id="linearGradient4741-3"
+ xlink:href="#gradient20" /></defs><g
+ id="BG" /><g
+ id="controls"><path
+ style="fill:none;stroke:#ffffff;stroke-width:1"
+ d="m 98.5,7.5 11,0"
+ id="Line" /><path
+ style="fill:none;stroke:#ffffff;stroke-width:1"
+ d="m 98.5,3.5 11,0"
+ id="Line2" /><path
+ style="fill:none;stroke:#ffffff;stroke-width:1"
+ d="m 98.5,11.5 11,0"
+ id="Line3" /><path
+ style="fill:#ffffff"
+ d="m 108,11.5 c 0,-0.8284 0.4477,-1.5 1,-1.5 0.5523,0 1,0.6716 1,1.5 0,0.8284 -0.4477,1.5 -1,1.5 -0.5523,0 -1,-0.6716 -1,-1.5 z"
+ id="Ellipse" /><path
+ style="fill:#ffffff"
+ d="m 104,7.5 c 0,-0.8284 0.4477,-1.5 1,-1.5 0.5523,0 1,0.6716 1,1.5 0,0.8284 -0.4477,1.5 -1,1.5 -0.5523,0 -1,-0.6716 -1,-1.5 z"
+ id="Ellipse2" /><path
+ style="fill:#ffffff"
+ d="m 108,3.5 c 0,-0.8284 0.4477,-1.5 1,-1.5 0.5523,0 1,0.6716 1,1.5 0,0.8284 -0.4477,1.5 -1,1.5 -0.5523,0 -1,-0.6716 -1,-1.5 z"
+ id="Ellipse3" /></g><g
+ id="backlight"><g
+ id="off"><rect
+ style="fill:#333333;stroke:#ffffff;stroke-width:1"
+ id="rect4458"
+ height="6"
+ width="10"
+ y="21"
+ x="83" /></g><g
+ id="on"><path
+ style="fill:url(#gradient1)"
+ d="m 81,8 c 0,-2.7615 3.134,-5 7,-5 3.866,0 7,2.2385 7,5 0,2.7615 -3.134,5 -7,5 -3.866,0 -7,-2.2385 -7,-5 z"
+ id="Ellipse4" /><rect
+ style="fill:#333333;stroke:#ffffff;stroke-width:1"
+ id="rect4462"
+ height="6"
+ width="10"
+ y="5"
+ x="83" /></g></g><g
+ id="loop"><g
+ id="on2"><path
+ style="fill:url(#gradient2)"
+ id="path4466"
+ d="M 73.795,4.205 C 75.2155,4.8785 76.2,6.3234 76.2,8 c 0,2.3196 -1.8804,4.2 -4.2,4.2 -2.3196,0 -4.2,-1.8804 -4.2,-4.2 0,-1.6766 0.9845,-3.1215 2.405,-3.795 l -1.33,-1.33 C 67.1501,3.9289 66,5.8306 66,8 c 0,3.3138 2.6862,6 6,6 3.3138,0 6,-2.6862 6,-6 0,-2.1694 -1.1501,-4.0711 -2.875,-5.125 l -1.33,1.33 z" /><path
+ style="fill:url(#gradient3)"
+ id="path4468"
+ d="m 71,2 -5,0 5,5 0,-5 z" /></g><g
+ id="off2"><path
+ style="fill:#a8a8b7"
+ id="path4471"
+ d="m 73.795,20.205 c 1.4205,0.6735 2.405,2.1184 2.405,3.795 0,2.3196 -1.8804,4.2 -4.2,4.2 -2.3196,0 -4.2,-1.8804 -4.2,-4.2 0,-1.6766 0.9845,-3.1215 2.405,-3.795 l -1.33,-1.33 C 67.1501,19.9289 66,21.8306 66,24 c 0,3.3138 2.6862,6 6,6 3.3138,0 6,-2.6862 6,-6 0,-2.1694 -1.1501,-4.0711 -2.875,-5.125 l -1.33,1.33 z" /><path
+ style="fill:#a8a8b7"
+ id="path4473"
+ d="m 71,18 -5,0 5,5 0,-5 z" /></g></g><g
+ id="cc"><rect
+ style="visibility:hidden;fill:none;stroke:#b0b0b0;stroke-width:1"
+ id="rect4476"
+ height="12"
+ width="14"
+ y="2"
+ x="49"
+ visibility="hidden" /><text
+ id="text4478"
+ style="color:#ffffff;font-size:10px;font-family:Arial;text-align:center;visibility:hidden;fill:#ffffff"
+ width="14"
+ y="17"
+ x="49"
+ visibility="hidden"><tspan
+ id="tspan4480"><![CDATA[cc]]></tspan></text>
+<path
+ style="fill:none;stroke:#ffffff;stroke-width:1"
+ id="path4482"
+ d="m 55,7 c -4.7187,-3.2187 -4.937,5.9405 0,3" /><path
+ style="fill:none;stroke:#ffffff;stroke-width:1"
+ id="path4484"
+ d="m 60,7 c -4.7187,-3.2187 -4.937,5.9405 0,3" /><path
+ style="fill:url(#gradient4)"
+ id="path4486"
+ d="M 50,3 62,3 62,13 50,13 50,3 Z M 49,2 49,14 63,14 63,2 49,2 Z" /><rect
+ style="fill:none"
+ id="rect4488"
+ height="12"
+ width="14"
+ y="2"
+ x="49" /></g><g
+ id="volume"><g
+ id="no%20sound"><rect
+ style="fill:url(#gradient5)"
+ id="rect4492"
+ height="6"
+ width="5"
+ y="5"
+ x="17" /><path
+ style="fill:url(#gradient6)"
+ id="path4494"
+ d="M 21,5 25,2 25,14 21,11.0625 21,5 Z" /></g><g
+ id="sound%20bars"><rect
+ style="fill:url(#gradient7)"
+ id="rect4497"
+ height="6"
+ width="5"
+ y="21"
+ x="17" /><path
+ style="fill:url(#gradient8)"
+ id="path4499"
+ d="M 21,21 25,18 25,30 21,27.0625 21,21 Z" /><path
+ style="fill:none;stroke:#ffffff;stroke-width:1"
+ id="path4501"
+ d="m 27,18 c 0,0 3.0625,-0.625 3,6 -0.0625,6.625 -3,6 -3,6" /><path
+ style="fill:none;stroke:#ffffff;stroke-width:1"
+ id="path4503"
+ d="m 26,21.0079 c 0,0 2.041,-0.3117 1.9994,2.9921 C 27.9577,27.3038 26,26.9921 26,26.9921" /></g></g><g
+ id="play/pause"><g
+ id="play"><path
+ style="fill:url(#gradient9)"
+ d="M 14,8.5 3,14 3,3 14,8.5 Z"
+ id="Polygon" /></g><g
+ id="pause"><rect
+ style="fill:url(#gradient10)"
+ id="rect4509"
+ height="12"
+ width="3"
+ y="18"
+ x="3" /><rect
+ style="fill:url(#gradient11)"
+ id="rect4511"
+ height="12"
+ width="3"
+ y="18"
+ x="10" /></g></g><g
+ id="fullscreen"><g
+ id="enter%201"><path
+ style="fill:url(#gradient12)"
+ id="path4515"
+ d="m 34,2 5,0 -5,5 0,-5 z" /><path
+ style="fill:url(#gradient13)"
+ id="path4517"
+ d="m 34,14 5,0 -5,-5 0,5 z" /><path
+ style="fill:url(#gradient14)"
+ id="path4519"
+ d="m 46,2 -5,0 5,5 0,-5 z" /><path
+ style="fill:url(#gradient15)"
+ id="path4521"
+ d="m 46,14 -5,0 5,-5 0,5 z" /></g><g
+ id="exit"><path
+ style="fill:url(#gradient16)"
+ id="path4524"
+ d="m 42,22 4,0 -4,-4 0,4 z" /><path
+ style="fill:url(#gradient17)"
+ id="path4526"
+ d="m 38,22 0,-4 -4,4 4,0 z" /><path
+ style="fill:url(#gradient18)"
+ id="path4528"
+ d="m 38,26 -4,0 4,4 0,-4 z" /><path
+ style="fill:url(#gradient19)"
+ id="path4530"
+ d="m 42,26 0,4 4,-4 -4,0 z" /></g></g><g
+ id="stop"><rect
+ style="fill:url(#linearGradient4743)"
+ id="rect4533"
+ height="10"
+ width="10"
+ y="3"
+ x="115" /></g><g
+ id="chooser"><path
+ style="fill:url(#linearGradient4745)"
+ id="path4536"
+ d="m 135.2346,6.1522 c 1.0205,-0.4227 2.1905,0.0619 2.6132,1.0824 0.4226,1.0205 -0.0619,2.1904 -1.0824,2.6132 -1.0205,0.4227 -2.1905,-0.0619 -2.6132,-1.0824 -0.4227,-1.0205 0.0619,-2.1905 1.0824,-2.6132 z M 133.2735,1.4176 136,4.0054 l 2.7265,-2.5878 0.0981,3.7578 3.7578,0.0981 -2.5878,2.7265 2.5878,2.7265 -3.7578,0.0981 -0.0981,3.7578 -2.7265,-2.5878 -2.7265,2.5878 -0.0981,-3.7578 -3.7578,-0.0981 2.5878,-2.7265 -2.5878,-2.7265 3.7578,-0.0981 0.0981,-3.7578 z" /></g><g
+ transform="matrix(0.00732422,0,0,0.00732422,98,19.687498)"
+ id="closed-caption"><path
+ style="fill:url(#linearGradient4554);fill-opacity:1"
+ id="path4539"
+ d="m 785,528 207,0 Q 978,370 893.5,279.5 809,189 679,189 517,189 424.5,305 332,421 332,621 q 0,194 93,311.5 93,117.5 233,117.5 148,0 232,-87 84,-87 97,-247 l -203,0 q -5,64 -35.5,99 Q 718,850 667,850 610,850 578.5,789.5 547,729 547,612 q 0,-48 5,-84 5,-36 18,-69.5 13,-33.5 40,-51.5 27,-18 66,-18 95,0 109,139 z m 712,0 206,0 Q 1689,370 1605,279.5 1521,189 1391,189 q -162,0 -254.5,116 -92.5,116 -92.5,316 0,194 93,311.5 93,117.5 233,117.5 148,0 232,-87 84,-87 97,-247 l -204,0 q -4,64 -35,99 -31,35 -81,35 -57,0 -88.5,-60.5 Q 1259,729 1259,612 q 0,-48 5,-84 5,-36 18,-69.5 13,-33.5 39.5,-51.5 26.5,-18 65.5,-18 49,0 76.5,38 27.5,38 33.5,101 z m 359,119 q 0,207 -15.5,307 -15.5,100 -60.5,161 -6,8 -13.5,14 -7.5,6 -21.5,15 -14,9 -16,11 -86,63 -697,63 -625,0 -710,-63 -5,-4 -17.5,-11.5 -12.5,-7.5 -21,-14 Q 275,1123 269,1115 224,1055 209,955.5 194,856 194,647 194,439 209,339.5 224,240 269,179 q 6,-8 15,-15 9,-7 20.5,-14 Q 316,143 322,138 366,105 561.5,89 757,73 1032,73 q 610,0 697,65 5,4 17,11 12,7 20.5,14 8.5,7 13.5,16 46,60 61,159 15,99 15,309 z m 192,761 0,-1536 -2048,0 0,1536 2048,0 z" /></g><g
+ transform="matrix(0.00837054,0,0,0.00837054,116,19.285709)"
+ id="commenting-1"><path
+ style="fill:url(#linearGradient4741);fill-opacity:1"
+ id="path4542-0"
+ d="M 640,640 Q 640,587 602.5,549.5 565,512 512,512 459,512 421.5,549.5 384,587 384,640 q 0,53 37.5,90.5 Q 459,768 512,768 565,768 602.5,730.5 640,693 640,640 Z m 384,0 q 0,-53 -37.5,-90.5 Q 949,512 896,512 843,512 805.5,549.5 768,587 768,640 q 0,53 37.5,90.5 Q 843,768 896,768 949,768 986.5,730.5 1024,693 1024,640 Z m 384,0 q 0,-53 -37.5,-90.5 Q 1333,512 1280,512 q -53,0 -90.5,37.5 -37.5,37.5 -37.5,90.5 0,53 37.5,90.5 37.5,37.5 90.5,37.5 53,0 90.5,-37.5 Q 1408,693 1408,640 Z M 896,1152 Q 692,1152 514.5,1082.5 337,1013 232.5,895 128,777 128,640 128,528 199.5,426.5 271,325 401,251 l 87,-50 -27,-96 Q 437,14 391,-67 543,-4 666,104 l 43,38 57,-6 q 69,-8 130,-8 204,0 381.5,69.5 177.5,69.5 282,187.5 104.5,118 104.5,255 0,137 -104.5,255 -104.5,118 -282,187.5 Q 1100,1152 896,1152 Z M 1792,640 Q 1792,466 1672,318.5 1552,171 1346,85.5 1140,0 896,0 826,0 751,8 553,-167 291,-234 242,-248 177,-256 l -5,0 q -15,0 -27,10.5 -12,10.5 -16,27.5 l 0,1 q -3,4 -0.5,12 2.5,8 2,10 -0.5,2 4.5,9.5 l 6,9 q 0,0 7,8.5 7,8.5 8,9 7,8 31,34.5 24,26.5 34.5,38 10.5,11.5 31,39.5 20.5,28 32.5,51 12,23 27,59 15,36 26,76 Q 181,228 90.5,359 0,490 0,640 0,770 71,888.5 142,1007 262,1093 q 120,86 286,136.5 166,50.5 348,50.5 182,0 348,-50.5 166,-50.5 286,-136.5 120,-86 191,-204.5 71,-118.5 71,-248.5 z" /></g><g
+ transform="matrix(0.00837054,0,0,0.00837054,135,19.285709)"
+ id="commenting-1-2"><path
+ id="path4542-0-4"
+ transform="matrix(119.46661,0,0,119.46661,-16127.992,-2303.9982)"
+ d="M 136.43945 17.142578 C 136.35575 17.142578 136.27985 17.171875 136.21289 17.230469 C 136.14593 17.289063 136.1024 17.366071 136.08008 17.460938 L 136.08008 17.46875 C 136.06334 17.491071 136.06222 17.52567 136.07617 17.570312 C 136.09012 17.614955 136.09459 17.643136 136.0918 17.654297 C 136.08901 17.665458 136.10296 17.690569 136.13086 17.732422 L 136.17969 17.808594 L 136.23828 17.878906 C 136.27734 17.926339 136.30106 17.952288 136.30664 17.955078 C 136.3457 17.999721 136.43052 18.096261 136.56445 18.244141 C 136.69838 18.39202 136.79492 18.498326 136.85352 18.5625 C 136.91211 18.626674 136.99888 18.736328 137.11328 18.892578 C 137.22768 19.048828 137.3178 19.190011 137.38477 19.318359 C 137.45173 19.446708 137.52762 19.611607 137.61133 19.8125 C 137.69503 20.013393 137.76869 20.226004 137.83008 20.449219 C 136.95396 20.945871 136.26284 21.559988 135.75781 22.291016 C 135.25279 23.022043 135 23.805524 135 24.642578 C 135 25.368025 135.19754 26.061384 135.59375 26.722656 C 135.98996 27.383929 136.52372 27.955636 137.19336 28.435547 C 137.863 28.915458 138.66155 29.296317 139.58789 29.578125 C 140.51423 29.859933 141.48437 30 142.5 30 C 143.51563 30 144.48577 29.859933 145.41211 29.578125 C 146.33845 29.296317 147.137 28.915458 147.80664 28.435547 C 148.47628 27.955636 149.01004 27.383929 149.40625 26.722656 C 149.80246 26.061384 150 25.368025 150 24.642578 C 150 23.671595 149.66574 22.774275 148.99609 21.951172 C 148.5982 21.4621 148.10443 21.042704 147.53711 20.675781 L 146.75195 21.460938 C 147.25893 21.761806 147.69914 22.106335 148.05469 22.507812 C 148.63784 23.166295 148.92773 23.878069 148.92773 24.642578 C 148.92773 25.407087 148.63784 26.118861 148.05469 26.777344 C 147.47154 27.435826 146.68387 27.959821 145.69336 28.347656 C 144.70285 28.735491 143.63839 28.927734 142.5 28.927734 C 141.36161 28.927734 140.29715 28.735491 139.30664 28.347656 C 138.31613 27.959821 137.52846 27.435826 136.94531 26.777344 C 136.36216 26.118861 136.07227 25.407087 136.07227 24.642578 C 136.07227 24.017578 136.27093 23.421875 136.66992 22.855469 C 137.06892 22.289062 137.63198 21.799665 138.35742 21.386719 L 139.08398 20.96875 L 138.85938 20.164062 C 138.72545 19.65625 138.53013 19.176619 138.27344 18.724609 C 139.12165 19.076172 139.88783 19.553571 140.57422 20.15625 L 140.93555 20.474609 L 141.41211 20.423828 C 141.79715 20.379185 142.1596 20.357422 142.5 20.357422 C 143.22279 20.357422 143.91299 20.443263 144.57617 20.599609 L 145.46094 19.714844 C 144.53658 19.43079 143.5506 19.285156 142.5 19.285156 C 142.10937 19.285156 141.70564 19.308873 141.28711 19.353516 C 140.1822 18.376953 138.8976 17.700056 137.43555 17.326172 C 137.16211 17.248047 136.84515 17.187221 136.48242 17.142578 L 136.43945 17.142578 z M 139.28516 23.572266 C 138.9894 23.572266 138.73661 23.675502 138.52734 23.884766 C 138.31808 24.094029 138.21484 24.346819 138.21484 24.642578 C 138.21484 24.938337 138.31808 25.191127 138.52734 25.400391 C 138.73661 25.609654 138.9894 25.714844 139.28516 25.714844 C 139.58092 25.714844 139.83371 25.609654 140.04297 25.400391 C 140.25223 25.191127 140.35742 24.938337 140.35742 24.642578 C 140.35742 24.346819 140.25223 24.094029 140.04297 23.884766 C 139.83371 23.675502 139.58092 23.572266 139.28516 23.572266 z M 142.5 23.572266 C 142.20424 23.572266 141.95145 23.675502 141.74219 23.884766 C 141.53292 24.094029 141.42773 24.346819 141.42773 24.642578 C 141.42773 24.938337 141.53292 25.191127 141.74219 25.400391 C 141.95145 25.609654 142.20424 25.714844 142.5 25.714844 C 142.79576 25.714844 143.04855 25.609654 143.25781 25.400391 C 143.46708 25.191127 143.57227 24.938337 143.57227 24.642578 C 143.57227 24.346819 143.46708 24.094029 143.25781 23.884766 C 143.04855 23.675502 142.79576 23.572266 142.5 23.572266 z M 145.71484 23.572266 C 145.41908 23.572266 145.16629 23.675502 144.95703 23.884766 C 144.74777 24.094029 144.64258 24.346819 144.64258 24.642578 C 144.64258 24.938337 144.74777 25.191127 144.95703 25.400391 C 145.16629 25.609654 145.41908 25.714844 145.71484 25.714844 C 146.0106 25.714844 146.26339 25.609654 146.47266 25.400391 C 146.68192 25.191127 146.78516 24.938337 146.78516 24.642578 C 146.78516 24.346819 146.68192 24.094029 146.47266 23.884766 C 146.26339 23.675502 146.0106 23.572266 145.71484 23.572266 z "
+ style="fill:url(#linearGradient4741-3);fill-opacity:1" /><g
+ transform="matrix(0.68889122,-0.72486474,0.72486474,0.68889122,546.54751,1586.6879)"
+ id="g5292"><path
+ transform="matrix(84.475647,84.475647,-84.475647,84.475647,-8871.9881,-14508.337)"
+ id="rect5260"
+ d="m 145.98928,19.80101 -3.19631,3.152115 -0.008,0.0059 c -0.16799,0.133409 -0.26582,0.336262 -0.26563,0.550782 -3.3e-4,0.388463 0.31467,0.703456 0.70313,0.703125 0.1717,-0.0011 0.33706,-0.065 0.46484,-0.179688 0.0258,-0.02167 0.0499,-0.04517 0.0723,-0.07031 l 0.006,-0.0078 3.20999,-3.165787 -0.98633,-0.988281 z"
+ style="color:#000000;display:inline;overflow:visible;visibility:visible;opacity:1;fill:#dbdbde;fill-opacity:0.97058835;fill-rule:nonzero;stroke:none;stroke-width:1;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /><path
+ d="m 2275.4479,-391.72825 -422.378,-422.3783 0,844.756503 422.378,-422.378203 z"
+ id="path4473-0"
+ style="fill:#dbdbde;fill-opacity:0.97058835" /></g></g></svg> \ No newline at end of file
diff --git a/assets/js/lustige-subtitles.js b/assets/js/lustige-subtitles.js
new file mode 100644
index 0000000..c7aa1b4
--- /dev/null
+++ b/assets/js/lustige-subtitles.js
@@ -0,0 +1,117 @@
+MediaElementPlayer.prototype.buildsubtitles = function(player, controls, layers, media) {
+ var $btns = $([
+ '<span>',
+ '<div class="mejs-button mejs-subtitles mejs-subtitles-button">',
+ '<button type="button" title="Subtitles" aria-label="Subtitles"></button>',
+ '</div>',
+ '<div class="mejs-button mejs-subtitles mejs-subtitles-popup-button">',
+ '<button type="button" title="Subtitles in Popup" aria-label="Subtitles in Popup"></button>',
+ '</div>',
+ '</span>'
+ ].join(''));
+
+ $btns
+ .appendTo(controls)
+ .on('click', '.mejs-subtitles-button', function() {
+ connectToL2S2()
+ })
+ .on('click', '.mejs-subtitles-popup-button', function() {
+ var
+ frontend_url = $('.js-subtitles-settings').data('frontend-url'),
+ room = $('.video-wrap').data('subtitles-room-id');
+
+ window.open(frontend_url+''+room, 'subtitles-'+room, 'width=1000,height=560');
+ });
+
+
+ var $lines = $([
+ '<div class="mejs-subtitles-lines">',
+ '<div class="mejs-subtitles-lines-inner"></div>',
+ '</div>'
+ ].join(''));
+
+ $lines.appendTo(layers);
+};
+
+function connectToL2S2()
+{
+ var
+ baseurl = $('.js-subtitles-settings').data('primus-url');
+
+ if(window.io)
+ {
+ return openSocket();
+ }
+
+ $.getScript(baseurl+'primus/primus.js', openSocket);
+}
+
+function openSocket()
+{
+ var
+ baseurl = $('.js-subtitles-settings').data('primus-url'),
+ room = $('.video-wrap').data('subtitles-room-id'),
+ $lines = $('.mejs-subtitles-lines');
+
+ var primus = Primus.connect(baseurl);
+
+ primus.on('open', function()
+ {
+ primus.emit('join', room);
+ $lines.css({
+ display: 'block'
+ });
+ });
+
+ // primus.on('lineStart', function(roomId, userId, text)
+ // {
+ // console.log('lineStart', roomId, userId, text);
+ // });
+
+ primus.on('line', function(roomId, text, userId, color)
+ {
+ if (text && text.trim().length > 0 && roomId == room) {
+ console.log('line', roomId, userId, text, color);
+ appendLine(text);
+ }
+ });
+}
+
+function appendLine(line)
+{
+ var
+ $inner = $('.mejs-subtitles-lines .mejs-subtitles-lines-inner'),
+ $line = $('<div>').text(line),
+ cnt = 3;
+
+ $inner
+ .append($line)
+ .find('> div')
+ .slice(0, -cnt)
+ .remove()
+
+
+ $line.autoScale();
+}
+
+
+
+
+$.fn.autoScale = function() {
+ if(!this.data('autoScaleOriginal')) {
+ this.data('autoScaleOriginal', parseInt(this.css('font-size')));
+ }
+
+ var
+ maxSize = this.data('autoScaleOriginal');
+ maxH = this.closest('.mejs-subtitles-lines').innerHeight(),
+ thisH = this.css('font-size', maxSize).outerHeight();
+
+ console.log(thisH, maxH, maxSize);
+ while(thisH > maxH && maxSize > 0) {
+ console.log(thisH, maxH, maxSize);
+ thisH = this.css('font-size', --maxSize).outerHeight();
+ }
+
+ return this;
+}
diff --git a/assets/js/lustiges-script.js b/assets/js/lustiges-script.js
index 3b3ab6d..52ac9b9 100644
--- a/assets/js/lustiges-script.js
+++ b/assets/js/lustiges-script.js
@@ -1,148 +1,3 @@
-$.fn.pulseSubsLine = function(klass) {
- var e = this;
- e
- .find('.text')
- .hide()
- .end()
- .addClass(klass)
- .css({display: 'block'})
- .animate({opacity: 1, duration: .75}, function() {
- setTimeout(function() {
- e.animate({opacity: 0, duration: .5}, function() {
- e.css({display: 'none'}).removeClass(klass);
- })
- }, 5000);
- });
-}
-
-$.fn.autoScale = function() {
- if(!this.data('autoScaleOriginal')) {
- this.data('autoScaleOriginal', parseInt(this.css('font-size')));
- }
-
- var
- maxSize = this.data('autoScaleOriginal');
- maxH = this.parent().innerHeight(),
- thisH = this.css('font-size', maxSize).outerHeight();
-
- while(thisH > maxH && maxSize > 0) {
- thisH = this.css('font-size', --maxSize).outerHeight();
- }
-
- return this;
-}
-
-// mediaelement subtitles button
-MediaElementPlayer.prototype.buildsubs = function(player, controls, layers, media) {
- var
- host = 'http://subtitles.c3voc.de/',
- room = $('.room.video').data('room'),
- isLoaded = false,
- t = 200,
- $btn = $([
- '<div class="mejs-button mejs-subs-button">',
- '<span class="fa fa-comments-o"></span>',
- '</div>'
- ].join('')),
- $line = $([
- '<div class="mejs-subs-line">',
- '<div class="text"></div>',
- '<div class="silence">',
- '<i>(silence)</i>',
- '<br />',
- 'Maybe no-one is currently writing Live-Subtitles',
- '</div>',
- '<div class="error">',
- 'Sorry, an Error occured.',
- '</div>',
- '</div>'
- ].join('')),
- $text = $line.find('.text'),
- $silence = $line.find('.silence'),
- $error = $line.find('.error');
-
-
-
- $btn
- .appendTo(controls)
- .click(function() {
- $.ajax({
- url: host+'status/'+encodeURIComponent(room),
- //dataType: $.support.cors ? 'json' : 'jsonp',
- dataType: 'jsonp',
- success: function(status) {
- if(!status)
- return $line.pulseSubsLine('silence');
-
- if(!isLoaded) {
- isLoaded = true;
- return loadAndOpenSocket();
- }
-
- $line.fadeToggle(t);
- },
- error: function() {
- $line.pulseSubsLine('error');
- }
- });
- });
-
- function loadAndOpenSocket() {
- if(window.io)
- return openSocket();
-
- $.getScript(host+'socket.io/socket.io.js', openSocket);
- }
-
- function silence() {
- $text.hide();
- $silence.show().animate({opacity: 1, duration: .75});
- }
-
- function openSocket() {
- var hideTimeout, silenceTimeout, silenceWait = 15*1000;
- var socket = io(host);
-
- socket.on('connect', function() {
- $line.show().animate({opacity: 1}, t);
- socket.emit('join', room);
- });
-
- silenceTimeout = setTimeout(silence, silenceWait);
-
- socket.on('line', function(stamp, line, duration) {
- if(hideTimeout)
- clearTimeout(hideTimeout);
-
- hideTimeout = setTimeout(function() {
- $text.animate({opacity: 0}, t)
- clearTimeout(hideTimeout);
- hideTimeout = null;
- }, duration*1000);
-
-
- if(silenceTimeout)
- clearTimeout(silenceTimeout);
-
- silenceTimeout = setTimeout(silence, silenceWait);
-
-
- $text.animate({
- opacity: 0
- }, {
- duration: t,
- complete: function() {
- $text.show().text(line).autoScale().animate({
- opacity: 1
- });
- }
- });
- });
- }
-
- $line.appendTo(layers);
-}
-
// mediaelement-player
$(function() {
(function(strings) {
@@ -151,10 +6,15 @@ $(function() {
}
})(mejs.i18n.locale.strings);
+ var feat = ['playpause', 'volume', 'fullscreen'];
+ if($('.video-wrap').hasClass('has-subtitles'))
+ feat.push('subtitles');
+
$('body.room video, body.embed video').mediaelementplayer({
- features: ['playpause', 'volume', 'fullscreen'],
+ features: feat,
enableAutosize: true
});
+
$('body.room audio, body.embed audio').mediaelementplayer({
features: ['playpause', 'volume', 'current']
});
@@ -207,7 +67,7 @@ $(function() {
updateTimer = 500,
/* offset to the browsers realtime (for simulation) */
- offset = $('.js-settings').data('scheduleoffset');
+ offset = $('.js-schedule-settings').data('scheduleoffset');
$schedule.on('mouseenter mouseleave touchstart touchend', function(e) {
if(e.type == 'mouseleave' || e.type == 'touchend') {
diff --git a/index.php b/index.php
index 69feeae..b3f0b34 100644
--- a/index.php
+++ b/index.php
@@ -16,6 +16,7 @@ require_once('model/Conference.php');
require_once('model/GenericConference.php');
require_once('model/Feedback.php');
require_once('model/Schedule.php');
+require_once('model/Subtitles.php');
require_once('model/Overview.php');
require_once('model/Room.php');
require_once('model/RoomTab.php');
@@ -128,6 +129,7 @@ $tpl->set(array(
'conference' => $conference,
'feedback' => new Feedback(),
'schedule' => new Schedule(),
+ 'subtitles' => new Subtitles(),
));
ob_start();
diff --git a/model/Room.php b/model/Room.php
index 124d057..b4fc1d1 100644
--- a/model/Room.php
+++ b/model/Room.php
@@ -76,6 +76,16 @@ class Room extends ModelBase
return $this->get('ROOMS.'.$this->getSlug().'.SCHEDULE') && $this->has('SCHEDULE');
}
+ public function hasSubtitles() {
+ return
+ $this->get('ROOMS.'.$this->getSlug().'.SUBTITLES') &&
+ $this->has('ROOMS.'.$this->getSlug().'.SUBTITLES_ROOM_ID') &&
+ $this->has('SUBTITLES');
+ }
+ public function getSubtitlesRoomId() {
+ return $this->get('ROOMS.'.$this->getSlug().'.SUBTITLES_ROOM_ID');
+ }
+
public function hasFeedback() {
return $this->get('ROOMS.'.$this->getSlug().'.FEEDBACK') && $this->has('FEEDBACK');
}
diff --git a/model/Subtitles.php b/model/Subtitles.php
new file mode 100644
index 0000000..e1878f2
--- /dev/null
+++ b/model/Subtitles.php
@@ -0,0 +1,26 @@
+<?php
+
+class Subtitles extends ModelBase
+{
+ public function isEnabled() {
+ return $this->has('SUBTITLES');
+ }
+
+ public function getEnabledRooms($slug) {
+ $rooms = [];
+ foreach(Room::rooms() as $room)
+ {
+ if($room->hasSubtitles())
+ $rooms[] = $room;
+ }
+
+ return $rooms;
+ }
+
+ public function getPrimusURL() {
+ return $this->get('SUBTITLES.PRIMUS_URL');
+ }
+ public function getFrontendURL() {
+ return $this->get('SUBTITLES.FRONTEND_URL');
+ }
+}
diff --git a/template/assemblies/player/video.phtml b/template/assemblies/player/video.phtml
index 9149a4f..cbbf06b 100644
--- a/template/assemblies/player/video.phtml
+++ b/template/assemblies/player/video.phtml
@@ -1,4 +1,8 @@
-<div style="max-width: <?=h($stream->getVideoWidth())?>px; max-height: <?=h($stream->getVideoHeight())?>px;" class="video-wrap">
+<div
+ style="max-width: <?=h($stream->getVideoWidth())?>px; max-height: <?=h($stream->getVideoHeight())?>px;"
+ class="video-wrap <? if($room->hasSubtitles()): ?>has-subtitles<? endif ?>"
+ data-subtitles-room-id="<?=h($room->getSubtitlesRoomId())?>"
+>
<video
<? if(!isset($autoplay) || $autoplay == true): ?>
autoplay="autoplay"
diff --git a/template/page.phtml b/template/page.phtml
index ae797c0..a358a27 100644
--- a/template/page.phtml
+++ b/template/page.phtml
@@ -42,6 +42,10 @@
<script type="text/javascript" src="<?=h($assets)?>mejs/mediaelement-and-player.min.js"></script>
<script type="text/javascript" src="<?=h($assets)?>js/lustiges-script.js"></script>
+
+ <? if(isset($subtitles) && $subtitles->isEnabled()): ?>
+ <script type="text/javascript" src="<?=h($assets)?>js/lustige-subtitles.js"></script>
+ <? endif ?>
</head>
<body class="<?=h(is_numeric($page[0]) ? 'e'.$page : $page)?>">
<? if(!@$naked): ?>
@@ -54,10 +58,16 @@
<? include("$assemblies/footer.phtml") ?>
<? endif ?>
- <? if(isset($schedule)): ?>
- <span class="js-settings"
+ <? if(isset($schedule) && $schedule->isEnabled()): ?>
+ <span class="js-schedule-settings"
data-scheduleoffset="<?=h($schedule->getSimulationOffset())?>"
></span>
<? endif ?>
+ <? if(isset($subtitles) && $subtitles->isEnabled()): ?>
+ <span class="js-subtitles-settings"
+ data-primus-url="<?=h($subtitles->getPrimusURL())?>"
+ data-frontend-url="<?=h($subtitles->getFrontendURL())?>"
+ ></span>
+ <? endif ?>
</body>
</html>
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-05 22:52:39 +0000