+ aula, updated info dialog

This commit is contained in:
Denys Konovalov
2020-12-07 19:21:54 +01:00
parent b925b19e7d
commit d13884deb5
4131 changed files with 5569 additions and 1566 deletions

View File

@ -40,8 +40,8 @@ var APP_DATA = {
{
"yaw": 2.1959942749563464,
"pitch": 0.3502609665210201,
"title": "Lorem ipsum<br>",
"text": "<div><h1>Lorem ipsum</h1><br> dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.<img src='/media/gcg.JPG'></div>"
"title": "Lorem ipsum",
"text": "<details><summary>Lorem ipsum</summary><div class='content'><p class='content'><h1>Lorem ipsum</h1><br> dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. <br><img src='/media/gcg.JPG'></div></p></div></details>"
}
]
},
@ -206,7 +206,7 @@ var APP_DATA = {
"name": "Georg-Cantor-Gymnasium: Virtueller Tag der offenen Tür",
"settings": {
"mouseViewMode": "drag",
"autorotateEnabled": true,
"autorotateEnabled": false,
"fullscreenButton": true,
"viewControlButtons": true
}

View File

@ -140,10 +140,10 @@
// Set handler for scene list toggle.
sceneListToggleElement.addEventListener('click', toggleSceneList);
// Start with the scene list open on desktop.
if (!document.body.classList.contains('mobile')) {
showSceneList();
}
// // Start with the scene list open on desktop.
// if (!document.body.classList.contains('mobile')) {
// showSceneList();
// }
// Set handler for scene switch.
scenes.forEach(function(scene) {
@ -322,7 +322,7 @@
// Construct header element.
header.appendChild(iconWrapper);
header.appendChild(titleWrapper);
header.appendChild(closeWrapper);
// header.appendChild(closeWrapper);
// Create text element.
var text = document.createElement('div');
@ -331,11 +331,14 @@
// Place header and text into wrapper element.
wrapper.appendChild(header);
wrapper.appendChild(text);
// wrapper.appendChild(text);
// Create a modal for the hotspot content to appear on mobile mode.
var modal = document.createElement('div');
modal.innerHTML = wrapper.innerHTML;
modal.querySelector('.info-hotspot-header').appendChild(closeWrapper);
modal.appendChild(text);
modal.classList.add('info-hotspot-modal');
document.body.appendChild(modal);

View File

@ -28,6 +28,10 @@ html, body {
color: #fff;
}
h1, h2, h3, h4, h5, h6 {
font-family: : "Fira Sans Heavy", sans-serif;
}
a, a:hover, a:active, a:visited {
text-decoration: none;
color: inherit;
@ -458,20 +462,10 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
transition: opacity 0.2s 0.2s;
}
.no-touch .info-hotspot:hover {
opacity: 1;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.info-hotspot.visible {
opacity: 1
}
.info-hotspot .info-hotspot-header {
width: 40px;
height: 40px;
border-radius: 20px;
width: 50px;
height: 50px;
border-radius: 25px;
background-color: #1a1a37;
cursor: pointer;
-webkit-transition: width 0.3s ease-in-out 0.5s,
@ -480,28 +474,11 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
border-radius 0.3s ease-in-out 0.5s;
}
.mobile .info-hotspot .info-hotspot-header {
width: 50px;
height: 50px;
.info-hotspot.visible .info-hotspot-header,
.no-touch .info-hotspot.visible .info-hotspot-header:hover,
.no-touch .info-hotspot .info-hotspot-header:hover {
width: 300px;
border-radius: 25px;
}
.desktop.no-touch .info-hotspot .info-hotspot-header:hover {
width: 560px;
border-radius: 25px;
-webkit-transition: width 0.3s ease-in-out,
border-radius 0.3s ease-in-out;
transition: width 0.3s ease-in-out,
border-radius 0.3s ease-in-out;
}
.desktop .info-hotspot.visible .info-hotspot-header,
.desktop.no-touch .info-hotspot.visible .info-hotspot-header:hover {
width: 560px;
border-radius: 25px;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
-webkit-transition: width 0.3s ease-in-out,
border-radius 0.3s ease-in-out;
transition: width 0.3s ease-in-out,
@ -509,11 +486,6 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
}
.info-hotspot .info-hotspot-icon-wrapper {
width: 40px;
height: 40px;
}
.mobile .info-hotspot .info-hotspot-icon-wrapper {
width: 50px;
height: 50px;
}
@ -529,7 +501,7 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
left: 40px;
top: 0;
width: 0;
height: 40px;
height: 50px;
padding: 0;
overflow: hidden;
-webkit-transition: width 0s 0.4s,
@ -538,9 +510,9 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
padding 0s 0.4s;
}
.desktop .info-hotspot.visible .info-hotspot-title-wrapper,
.desktop.no-touch .info-hotspot .info-hotspot-header:hover .info-hotspot-title-wrapper {
width: 520px;
.info-hotspot.visible .info-hotspot-title-wrapper,
.no-touch .info-hotspot .info-hotspot-header:hover .info-hotspot-title-wrapper {
width: 260px;
padding: 0 5px;
-webkit-transition: width 0s 0.4s,
padding 0s 0.4s;
@ -564,111 +536,8 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
-ms-user-select: text;
user-select: text;
}
.info-hotspot .info-hotspot-close-wrapper {
position: absolute;
left: 560px;
top: 0;
height: 40px;
width: 40px;
border-radius: 20px;
border-bottom-right-radius: 20px;
background-color: #ffbc3b;
visibility: hidden;
-ms-transform: perspective(200px) rotateY(90deg);
-webkit-transform: perspective(200px) rotateY(90deg);
transform: perspective(200px) rotateY(90deg);
-ms-transform-origin: 0 50% 0;
-webkit-transform-origin: 0 50% 0;
transform-origin: 0 50% 0;
-webkit-transition: -ms-transform 0.3s 0.3s,
-webkit-transform 0.3s 0.3s,
transform 0.3s 0.3s,
visibility 0s 0.6s;
transition: -ms-transform 0.3s 0.3s,
-webkit-transform 0.3s 0.3s,
transform 0.3s 0.3s,
visibility 0s 0.6s;
margin-left: 10px;
}
.desktop .info-hotspot.visible .info-hotspot-close-wrapper {
visibility: visible;
-ms-transform: perspective(200px) rotateY(0deg);
-webkit-transform: perspective(200px) rotateY(0deg);
transform: perspective(200px) rotateY(0deg);
-webkit-transition: -ms-transform 0.3s,
-webkit-transform 0.3s,
transform 0.3s,
visibility 0s 0s;
transition: -ms-transform 0.3s,
-webkit-transform 0.3s,
transform 0.3s,
visibility 0s 0s;
}
.info-hotspot .info-hotspot-close-icon {
width: 70%;
height: 70%;
margin: 15%;
}
.info-hotspot .info-hotspot-text {
position: absolute;
width: 560px;
height: auto;
max-height: 400px;
top: 40px;
left: 0;
padding: 10px;
background-color: #1a1a37;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
overflow-y: auto;
visibility: hidden;
/* rotate(90deg) causes transition flicker on Firefox 58 */
-ms-transform: perspective(200px) rotateX(-89.999deg);
-webkit-transform: perspective(200px) rotateX(-89.999deg);
transform: perspective(200px) rotateX(-89.999deg);
-ms-transform-origin: 50% 0 0;
-webkit-transform-origin: 50% 0 0;
transform-origin: 50% 0 0;
-webkit-transition: -ms-transform 0.3s,
-webkit-transform 0.3s,
transform 0.3s,
visibility 0s 0.3s;
transition: -ms-transform 0.3s,
-webkit-transform 0.3s,
transform 0.3s,
visibility 0s 0.3s;
-moz-user-select: text;
-webkit-user-select: text;
-ms-user-select: text;
user-select: text;
}
.desktop .info-hotspot.visible .info-hotspot-text {
visibility: visible;
-ms-transform: perspective(200px) rotateX(0deg);
-webkit-transform: perspective(200px) rotateX(0deg);
transform: perspective(200px) rotateX(0deg);
-webkit-transition: -ms-transform 0.3s 0.3s,
-webkit-transform 0.3s 0.3s,
transform 0.3s 0.3s,
visibility 0s 0s;
transition: -ms-transform 0.3s 0.3s,
-webkit-transform 0.3s 0.3s,
transform 0.3s 0.3s,
visibility 0s 0s;
}
/* Info hotspot modal */
.desktop .info-hotspot-modal {
display: none;
}
.info-hotspot-modal {
top: 0;
left: 0;
@ -677,7 +546,7 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
height: 100%;
overflow: hidden;
z-index: 11000 !important;
background-color: rgba(0,0,0,.5);
background-color: rgba(0,0,0,0.5);
line-height: 1.2em;
opacity: 0;
visibility: hidden;
@ -703,11 +572,13 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
right: 10px;
width: auto;
height: 50px;
background-color: rgb(103,115,131);
background-color: rgba(103,115,131,0.8);
margin: 20px;
background-color: #1a1a37;
/* background-color: rgba(103,115,131,0.8); */
opacity: 0;
-webkit-transition: opacity 0.3s ease-in-out 0.2s;
transition: opacity 0.3s ease-in-out 0.2s;
border-radius: 25px;
}
.info-hotspot-modal.visible .info-hotspot-header {
@ -722,9 +593,9 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
}
.info-hotspot-modal .info-hotspot-icon {
width: 90%;
height: 90%;
margin: 5%;
width: 60%;
height: 60%;
margin: 20%;
}
.info-hotspot-modal .info-hotspot-title-wrapper {
@ -752,6 +623,7 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
-webkit-user-select: text;
-ms-user-select: text;
user-select: text;
font-family: "Fira Sans Heavy", sans-serif;
}
.info-hotspot-modal .info-hotspot-close-wrapper {
@ -760,9 +632,10 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
right: 0;
width: 50px;
height: 50px;
background-color: rgb(78,88,104);
background-color: rgba(78,88,104,0.8);
cursor: pointer;
background-color: #ffbc3b;
border-radius: 50%;
margin-left: 20px
/* background-color: rgba(78,88,104,0.8); */
}
.info-hotspot-modal .info-hotspot-close-icon {
@ -773,13 +646,13 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
.info-hotspot-modal .info-hotspot-text {
position: absolute;
top: 110px;
bottom: 10px;
left: 10px;
right: 10px;
padding: 10px;
background-color: rgb(58,68,84);
background-color: rgba(58,68,84,0.8);
top: 150px;
bottom: 30px;
left: 30px;
right: 30px;
padding: 30px;
background-color: #1a1a37;
/* background-color: rgba(58,68,84,0.8); */
overflow-y: auto;
opacity: 0;
-webkit-transition: opacity 0.3s ease-in-out;
@ -789,6 +662,7 @@ body.single-scene #sceneList, body.single-scene #sceneListToggle {
-webkit-user-select: text;
-ms-user-select: text;
user-select: text;
border-radius: 25px;
}
.info-hotspot-modal.visible .info-hotspot-text {

View File

@ -1,10 +1,10 @@
/*
* classList.js: Cross-browser full element.classList implementation.
* 2014-12-13
* 1.2.20171210
*
* By Eli Grey, http://eligrey.com
* Public Domain.
* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
* License: Dedicated to the public domain.
* See https://github.com/eligrey/classList.js/blob/master/LICENSE.md
*/
/*global self, document, DOMException */
@ -14,7 +14,12 @@
if ("document" in self) {
// Full polyfill for browsers with no classList support
if (!("classList" in document.createElement("_"))) {
// Including IE < Edge missing SVGElement.classList
if (
!("classList" in document.createElement("_"))
|| document.createElementNS
&& !("classList" in document.createElementNS("http://www.w3.org/2000/svg","g"))
) {
(function (view) {
@ -23,215 +28,236 @@ if (!("classList" in document.createElement("_"))) {
if (!('Element' in view)) return;
var
classListProp = "classList"
, protoProp = "prototype"
, elemCtrProto = view.Element[protoProp]
, objCtr = Object
, strTrim = String[protoProp].trim || function () {
return this.replace(/^\s+|\s+$/g, "");
}
, arrIndexOf = Array[protoProp].indexOf || function (item) {
var
i = 0
, len = this.length
;
for (; i < len; i++) {
if (i in this && this[i] === item) {
return i;
}
}
return -1;
}
// Vendors: please allow content code to instantiate DOMExceptions
, DOMEx = function (type, message) {
this.name = type;
this.code = DOMException[type];
this.message = message;
}
, checkTokenAndGetIndex = function (classList, token) {
if (token === "") {
throw new DOMEx(
"SYNTAX_ERR"
, "An invalid or illegal string was specified"
);
}
if (/\s/.test(token)) {
throw new DOMEx(
"INVALID_CHARACTER_ERR"
, "String contains an invalid character"
);
}
return arrIndexOf.call(classList, token);
}
, ClassList = function (elem) {
var
trimmedClasses = strTrim.call(elem.getAttribute("class") || "")
, classes = trimmedClasses ? trimmedClasses.split(/\s+/) : []
, i = 0
, len = classes.length
;
for (; i < len; i++) {
this.push(classes[i]);
}
this._updateClassName = function () {
elem.setAttribute("class", this.toString());
};
}
, classListProto = ClassList[protoProp] = []
, classListGetter = function () {
return new ClassList(this);
}
classListProp = "classList"
, protoProp = "prototype"
, elemCtrProto = view.Element[protoProp]
, objCtr = Object
, strTrim = String[protoProp].trim || function () {
return this.replace(/^\s+|\s+$/g, "");
}
, arrIndexOf = Array[protoProp].indexOf || function (item) {
var
i = 0
, len = this.length
;
for (; i < len; i++) {
if (i in this && this[i] === item) {
return i;
}
}
return -1;
}
// Vendors: please allow content code to instantiate DOMExceptions
, DOMEx = function (type, message) {
this.name = type;
this.code = DOMException[type];
this.message = message;
}
, checkTokenAndGetIndex = function (classList, token) {
if (token === "") {
throw new DOMEx(
"SYNTAX_ERR"
, "The token must not be empty."
);
}
if (/\s/.test(token)) {
throw new DOMEx(
"INVALID_CHARACTER_ERR"
, "The token must not contain space characters."
);
}
return arrIndexOf.call(classList, token);
}
, ClassList = function (elem) {
var
trimmedClasses = strTrim.call(elem.getAttribute("class") || "")
, classes = trimmedClasses ? trimmedClasses.split(/\s+/) : []
, i = 0
, len = classes.length
;
for (; i < len; i++) {
this.push(classes[i]);
}
this._updateClassName = function () {
elem.setAttribute("class", this.toString());
};
}
, classListProto = ClassList[protoProp] = []
, classListGetter = function () {
return new ClassList(this);
}
;
// Most DOMException implementations don't allow calling DOMException's toString()
// on non-DOMExceptions. Error's toString() is sufficient here.
DOMEx[protoProp] = Error[protoProp];
classListProto.item = function (i) {
return this[i] || null;
return this[i] || null;
};
classListProto.contains = function (token) {
token += "";
return checkTokenAndGetIndex(this, token) !== -1;
return ~checkTokenAndGetIndex(this, token + "");
};
classListProto.add = function () {
var
tokens = arguments
, i = 0
, l = tokens.length
, token
, updated = false
;
do {
token = tokens[i] + "";
if (checkTokenAndGetIndex(this, token) === -1) {
this.push(token);
updated = true;
}
}
while (++i < l);
var
tokens = arguments
, i = 0
, l = tokens.length
, token
, updated = false
;
do {
token = tokens[i] + "";
if (!~checkTokenAndGetIndex(this, token)) {
this.push(token);
updated = true;
}
}
while (++i < l);
if (updated) {
this._updateClassName();
}
if (updated) {
this._updateClassName();
}
};
classListProto.remove = function () {
var
tokens = arguments
, i = 0
, l = tokens.length
, token
, updated = false
, index
;
do {
token = tokens[i] + "";
index = checkTokenAndGetIndex(this, token);
while (index !== -1) {
this.splice(index, 1);
updated = true;
index = checkTokenAndGetIndex(this, token);
}
}
while (++i < l);
var
tokens = arguments
, i = 0
, l = tokens.length
, token
, updated = false
, index
;
do {
token = tokens[i] + "";
index = checkTokenAndGetIndex(this, token);
while (~index) {
this.splice(index, 1);
updated = true;
index = checkTokenAndGetIndex(this, token);
}
}
while (++i < l);
if (updated) {
this._updateClassName();
}
if (updated) {
this._updateClassName();
}
};
classListProto.toggle = function (token, force) {
token += "";
var
result = this.contains(token)
, method = result ?
force !== true && "remove"
:
force !== false && "add"
;
var
result = this.contains(token)
, method = result ?
force !== true && "remove"
:
force !== false && "add"
;
if (method) {
this[method](token);
}
if (method) {
this[method](token);
}
if (force === true || force === false) {
return force;
} else {
return !result;
}
if (force === true || force === false) {
return force;
} else {
return !result;
}
};
classListProto.replace = function (token, replacement_token) {
var index = checkTokenAndGetIndex(token + "");
if (~index) {
this.splice(index, 1, replacement_token);
this._updateClassName();
}
}
classListProto.toString = function () {
return this.join(" ");
return this.join(" ");
};
if (objCtr.defineProperty) {
var classListPropDesc = {
get: classListGetter
, enumerable: true
, configurable: true
};
try {
objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc);
} catch (ex) { // IE 8 doesn't support enumerable:true
if (ex.number === -0x7FF5EC54) {
classListPropDesc.enumerable = false;
objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc);
}
}
var classListPropDesc = {
get: classListGetter
, enumerable: true
, configurable: true
};
try {
objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc);
} catch (ex) { // IE 8 doesn't support enumerable:true
// adding undefined to fight this issue https://github.com/eligrey/classList.js/issues/36
// modernie IE8-MSW7 machine has IE8 8.0.6001.18702 and is affected
if (ex.number === undefined || ex.number === -0x7FF5EC54) {
classListPropDesc.enumerable = false;
objCtr.defineProperty(elemCtrProto, classListProp, classListPropDesc);
}
}
} else if (objCtr[protoProp].__defineGetter__) {
elemCtrProto.__defineGetter__(classListProp, classListGetter);
elemCtrProto.__defineGetter__(classListProp, classListGetter);
}
}(self));
} else {
}
// There is full or partial native classList support, so just check if we need
// to normalize the add/remove and toggle APIs.
(function () {
"use strict";
"use strict";
var testElement = document.createElement("_");
var testElement = document.createElement("_");
testElement.classList.add("c1", "c2");
testElement.classList.add("c1", "c2");
// Polyfill for IE 10/11 and Firefox <26, where classList.add and
// classList.remove exist but support only one argument at a time.
if (!testElement.classList.contains("c2")) {
var createMethod = function(method) {
var original = DOMTokenList.prototype[method];
// Polyfill for IE 10/11 and Firefox <26, where classList.add and
// classList.remove exist but support only one argument at a time.
if (!testElement.classList.contains("c2")) {
var createMethod = function(method) {
var original = DOMTokenList.prototype[method];
DOMTokenList.prototype[method] = function(token) {
var i, len = arguments.length;
DOMTokenList.prototype[method] = function(token) {
var i, len = arguments.length;
for (i = 0; i < len; i++) {
token = arguments[i];
original.call(this, token);
}
};
};
createMethod('add');
createMethod('remove');
}
for (i = 0; i < len; i++) {
token = arguments[i];
original.call(this, token);
}
};
};
createMethod('add');
createMethod('remove');
}
testElement.classList.toggle("c3", false);
testElement.classList.toggle("c3", false);
// Polyfill for IE 10 and Firefox <24, where classList.toggle does not
// support the second argument.
if (testElement.classList.contains("c3")) {
var _toggle = DOMTokenList.prototype.toggle;
// Polyfill for IE 10 and Firefox <24, where classList.toggle does not
// support the second argument.
if (testElement.classList.contains("c3")) {
var _toggle = DOMTokenList.prototype.toggle;
DOMTokenList.prototype.toggle = function(token, force) {
if (1 in arguments && !this.contains(token) === !force) {
return force;
} else {
return _toggle.call(this, token);
}
};
DOMTokenList.prototype.toggle = function(token, force) {
if (1 in arguments && !this.contains(token) === !force) {
return force;
} else {
return _toggle.call(this, token);
}
};
}
}
testElement = null;
// replace() polyfill
if (!("replace" in document.createElement("_").classList)) {
DOMTokenList.prototype.replace = function (token, replacement_token) {
var
tokens = this.toString().split(" ")
, index = tokens.indexOf(token + "")
;
if (~index) {
tokens = tokens.slice(index);
this.remove.apply(this, tokens);
this.add(replacement_token);
this.add.apply(this, tokens.slice(1));
}
}
}
testElement = null;
}());
}
}

File diff suppressed because it is too large Load Diff

View File

@ -1,7 +1,7 @@
/*!
* screenfull
* v4.0.0 - 2018-12-15
* v5.0.2 - 2020-02-13
* (c) Sindre Sorhus; MIT License
*/
!function(){"use strict";var u="undefined"!=typeof window&&void 0!==window.document?window.document:{},e="undefined"!=typeof module&&module.exports,t="undefined"!=typeof Element&&"ALLOW_KEYBOARD_INPUT"in Element,c=function(){for(var e,n=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],r=0,l=n.length,t={};r<l;r++)if((e=n[r])&&e[1]in u){for(r=0;r<e.length;r++)t[n[0][r]]=e[r];return t}return!1}(),l={change:c.fullscreenchange,error:c.fullscreenerror},n={request:function(l){return new Promise(function(e){var n=c.requestFullscreen,r=function(){this.off("change",r),e()}.bind(this);l=l||u.documentElement,/ Version\/5\.1(?:\.\d+)? Safari\//.test(navigator.userAgent)?l[n]():l[n](t?Element.ALLOW_KEYBOARD_INPUT:{}),this.on("change",r)}.bind(this))},exit:function(){return new Promise(function(e){var n=function(){this.off("change",n),e()}.bind(this);u[c.exitFullscreen](),this.on("change",n)}.bind(this))},toggle:function(e){return this.isFullscreen?this.exit():this.request(e)},onchange:function(e){this.on("change",e)},onerror:function(e){this.on("error",e)},on:function(e,n){var r=l[e];r&&u.addEventListener(r,n,!1)},off:function(e,n){var r=l[e];r&&u.removeEventListener(r,n,!1)},raw:c};c?(Object.defineProperties(n,{isFullscreen:{get:function(){return Boolean(u[c.fullscreenElement])}},element:{enumerable:!0,get:function(){return u[c.fullscreenElement]}},enabled:{enumerable:!0,get:function(){return Boolean(u[c.fullscreenEnabled])}}}),e?module.exports=n:window.screenfull=n):e?module.exports=!1:window.screenfull=!1}();
!function(){"use strict";var u="undefined"!=typeof window&&void 0!==window.document?window.document:{},e="undefined"!=typeof module&&module.exports,c=function(){for(var e,n=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],r=0,l=n.length,t={};r<l;r++)if((e=n[r])&&e[1]in u){for(r=0;r<e.length;r++)t[n[0][r]]=e[r];return t}return!1}(),l={change:c.fullscreenchange,error:c.fullscreenerror},n={request:function(t){return new Promise(function(e,n){var r=function(){this.off("change",r),e()}.bind(this);this.on("change",r);var l=(t=t||u.documentElement)[c.requestFullscreen]();l instanceof Promise&&l.then(r).catch(n)}.bind(this))},exit:function(){return new Promise(function(e,n){if(this.isFullscreen){var r=function(){this.off("change",r),e()}.bind(this);this.on("change",r);var l=u[c.exitFullscreen]();l instanceof Promise&&l.then(r).catch(n)}else e()}.bind(this))},toggle:function(e){return this.isFullscreen?this.exit():this.request(e)},onchange:function(e){this.on("change",e)},onerror:function(e){this.on("error",e)},on:function(e,n){var r=l[e];r&&u.addEventListener(r,n,!1)},off:function(e,n){var r=l[e];r&&u.removeEventListener(r,n,!1)},raw:c};c?(Object.defineProperties(n,{isFullscreen:{get:function(){return Boolean(u[c.fullscreenElement])}},element:{enumerable:!0,get:function(){return u[c.fullscreenElement]}},isEnabled:{enumerable:!0,get:function(){return Boolean(u[c.fullscreenEnabled])}}}),e?module.exports=n:window.screenfull=n):e?module.exports={isEnabled:!1}:window.screenfull={isEnabled:!1}}();

View File

@ -0,0 +1,10 @@
<video width="100%" height="100%" id="vid-1" poster="/media/school/Bild_11.jpg" controls>
<source src="/media/gcg.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<script>
document.getElementById('vid-1').addEventListener('ended',function(){
window.location.href = '/de/vr';
},false);
</script>