Team-Liste, Header mit verkleinertem Logo für normale Seiten.

2023-10-25 23:20:48 +02:00 · 2023-10-25 23:20:48 +02:00 · adb7294552
parent 4cd1695f58
commit adb7294552
8 changed files with 202 additions and 52 deletions
--- a/css/default.css
+++ b/css/default.css
@ -431,33 +431,33 @@ body .JSW.OuterBox .JSW.Title, body .video-js {



-ol.faq {
+.faq {
 counter-reset : faq;
 padding-left : 1.3em;
 }

-ol.faq li {
+.faq > li {
 list-style-type : none;
 background-color : #efebdc;
 padding : 3px;
 margin-bottom : 6px;
 }

-ol.faq li b {
+.faq > li > b {
 display : block;
 cursor : s-resize;
 }

-ol.faq li b:before {
+ol.faq > li > b:before {
 counter-increment : faq;
 content : counter(faq) ". ";
 }

-ol.faq li.open b {
+.faq > li.open > b {
 cursor : n-resize;
 }

-ol.faq li:before {
+.faq > li:before {
 content : '';
 float : left;
 width : 1.3em;
@ -475,19 +475,23 @@ ol.faq li:before {
 transform-origin : 0.5em 1em;
 }

-ol.faq li.open:before {
+.faq > li li:before {
+ background-image: none;
+}
+
+.faq > li.open:before {
 transform : rotate(45deg);
 }

-ol.faq li .compressing {
+.faq > li .compressing {
 overflow: hidden;
 transition : 0.5s;
 }
-ol.faq li.open .compressing {
+.faq > li.open .compressing {
 height : 0px !important;
 }

-ol.faq li .expanding {
+.faq > li .expanding {
 max-height : 0px;
 overflow : hidden;
 margin-bottom : 0px;
@ -495,14 +499,14 @@ ol.faq li .expanding {
 transition-timing-function: linear(0, 0.9, 0.96, 0.975, 0.983, 0.99, 0.995, 1);
 }

-ol.faq li.open .expanding {
+.faq > li.open .expanding {
 max-height : 10000px;
 margin-bottom : inherit;
 transition : 1s;
 transition-timing-function: linear(0, 0.005, 0.01, 0.017, 0.025, 0.04, 0.1, 1);
 }

-ol.faq li .expanding:last-child {
+.faq > li .expanding:last-child {
 margin-bottom : 0px;
 }

@ -612,6 +616,49 @@ aside {



+.candidates {
+ list-style-type: none;
+}
+.candidates .nr {
+ float: left;
+ width: 2em;
+ margin-right: 1em;
+ text-align: right;
+ margin-left: -3em;
+}
+.candidates .nr:after {
+ content: '.';
+}
+.candidates li  {
+ margin-bottom: 15px;
+ border-radius: 5px;
+ padding-top: 4px;
+ padding-left: 8px;
+ padding-right: 8px;
+ padding-bottom: 4px;
+ border-left: 2px solid #00aff0;
+ border-right: 2px solid #00aff0;
+}
+.candidates li:after {
+ content: '';
+ display: block;
+ clear: both;
+}
+.candidates img {
+ float: right;
+ width: 150px;
+ height: auto;
+ border: 3px solid #bedc0a;
+ border-radius: 3px;
+ margin-left: 5px;
+}
+.candidates i {
+ display: block;
+ margin-top: 2px;
+}
+
+
+
 .dateList {
 list-style-type : none;
 }
--- a/css/default/windows.css
+++ b/css/default/windows.css
@ -9,6 +9,14 @@
 }
 .JSW.OuterBox.active { background-color : #888; }

+.JSWNoBorders .JSW.Bar, .JSWNoBorders .JSW.BorderTop, .JSWNoBorders .JSW.BorderLeft, .JSWNoBorders .JSW.BorderRight, .JSWNoBorders .JSW.BorderBottom, .JSWNoBorders .JSW.EdgeTopRight, .JSWNoBorders .JSW.EdgeTopLeft, .JSWNoBorders .JSW.EdgeBottomRight, .JSWNoBorders .JSW.EdgeBottomLeft {
+ display : none;
+}
+
+.JSWNoBorders .JSW.OuterBox {
+ padding-top: 0px;
+}
+
 .JSW .InnerBox {
 box-sizing : border-box;
 position : relative;
@ -225,7 +233,6 @@
 padding-left : 0px;
 padding-right : 0px;
 padding-bottom : 0px;
- position : fixed !important;
 }
 .JSW.maximized .EdgeTopLeft { display : none; }
 .JSW.maximized .EdgeTopRight { display : none; }
--- a/css/main.css
+++ b/css/main.css
@ -98,8 +98,32 @@ iframe {
 position : relative;
 top : 64px;
 left : 10%;
+ transition: height 2s, top 2s, left 2s, margin-right 2s;
 }

+#BoxTop.smallLogo .logo {
+ height : 40px;
+ top : 20px;
+ left : 20px;
+ margin-right : 2.8px;
+}
+
+#BoxTop.smallLogo h1, #BoxTop.smallLogo h2 {
+ height : 14px;
+ top : 20px;
+ left : 20px;
+ font-size : 22.8px;
+}
+
+#BoxTop.smallLogo h1 {
+ line-height : 22.4px;
+}
+
+#BoxTop.smallLogo h2 {
+ line-height : 36.5px;
+}
+
+
 #BoxTop h1, #BoxTop h2 {
 font-size : 65px;
 letter-spacing: -0.02em;
@ -114,6 +138,7 @@ iframe {
 overflow : visible;
 top : 64px;
 left : 10%;
+ transition: height 2s, top 2s, left 2s, font-size 2s, line-height 2s;
 }

 #BoxTop h1 a, #BoxTop h2 a {
@ -123,7 +148,7 @@ iframe {

 #BoxTop h1 {
 color : #00aff0;
- line-height : 1em;
+ line-height : 64px;
 }

 #BoxTop h2 {
@ -283,6 +308,13 @@ iframe {
 float : left;
 overflow : hidden;
 white-space : nowrap;
+ height: 100vh;
+ overflow-y: scroll;
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+}
+#BoxLeft::-webkit-scrollbar {
+ display : none;
 }
 #BoxMiddle.leftBoxVisible {
 padding-left : 300px;
@ -290,7 +322,7 @@ iframe {
 .NoJsHeight #BoxLeft {
 display : none;
 }
-#inhaltsverzeichnis {
+.inhaltsverzeichnis {
 margin : 0px;
 padding-top : 10px;
 position : relative;
@ -303,41 +335,41 @@ iframe {
 text-align : left;
 padding-left : 20px;
 }
-#inhaltsverzeichnis li {
+.inhaltsverzeichnis li {
 list-style-type : none;
 padding-left : 1em;
 line-height : 1.3em;
 margin-bottom : 0.2em;
 }
-#inhaltsverzeichnis li span {
+.inhaltsverzeichnis li span {
 display : inline-block;
 margin-right : 0.08em;
 margin-left : -1em;
 min-width : 1em;
 }
-#inhaltsverzeichnis ol li {
+.inhaltsverzeichnis ol li {
 padding-left : 2em;
 }
-#inhaltsverzeichnis ol li span {
+.inhaltsverzeichnis ol li span {
 margin-left : -2em;
 min-width : 2em;
 }
-#inhaltsverzeichnis ol ol li {
+.inhaltsverzeichnis ol ol li {
 padding-left : 3em;
 }
-#inhaltsverzeichnis ol ol li span {
+.inhaltsverzeichnis ol ol li span {
 margin-left : -3em;
 min-width : 3em;
 }
-#inhaltsverzeichnis ol {
+.inhaltsverzeichnis ol {
 padding : 0px;
 padding-left : 10px;
 margin : 0px;
 }
-#inhaltsverzeichnis a {
+.inhaltsverzeichnis a {
 text-decoration : none;
 }
-#inhaltsverzeichnis a.active {
+.inhaltsverzeichnis a.active {
 text-decoration : underline;
 color : black;
 }
@ -350,7 +382,7 @@ iframe {
 }
 #BoxTop .logo, #BoxTop h1, #BoxTop h2 {
  top : 20px;
-  left : 5%;
+  left : 20px;
 }
 #BoxTop .subheadingLink {
  font-size : 1.3em;
@ -389,6 +421,7 @@ iframe {
   top: 5px;
   right: 0px;
 }
+ .desktop-only { display: none; }
 #BoxMiddle.withLeftBox {
  left : 0px !important;
 }
@ -424,6 +457,7 @@ iframe {
  z-index : 3;
  margin-left : 0px;
  background-color : white;
+  height: auto;
 }
 #BoxMiddle.leftBoxVisible {
  padding-left : 0px;
@ -440,7 +474,7 @@ iframe {
  top : 5px;
  right : 0px;
 }
- #inhaltsverzeichnis {
+ .inhaltsverzeichnis {
  margin-top : 0px !important;
  white-space : nowrap;
  overflow-x : scroll;
--- a/js/DynamicIFrame.js
+++ b/js/DynamicIFrame.js
@ -668,7 +668,7 @@ function DynamicIFrame (FrameBox, debugLogging=false) { with (this) {
          // remove li-element from DOM (maybe add it to an other location, later)
          if (link == hirachy[h]['link']) continue; // don't touch root link
          link['el'].parentElement.parentElement.removeChild(currentSiteAnchors[i]['link']['el'].parentElement);
-        } else if (currentSiteAnchors[i]['hNr'] <= autoFillMenu) {
+        } else if (currentSiteAnchors[i]['hNr'] <= autoFillMenu && (!currentSiteAnchors[i]['el'] || currentSiteAnchors[i]['el'].getAttribute('autocompletemenu') !== 'no')) {
          // create a new menu link, if missing
          link = {
         	  href: comm.contentURL.split('#')[0] + '#' + currentSiteAnchors[i]['id'],
@ -756,7 +756,7 @@ function DynamicIFrame (FrameBox, debugLogging=false) { with (this) {
    if (loadWithoutEffect && loadingSiteAnchor != '') {
      debugLog('Try to scroll to #'+loadingSiteAnchor);
      scrollTo(loadingSiteAnchor, 2);
-    }
+    } else if (loadingSiteAnchor == '') scrollTo(0, 2);
  };

  var sitescroll = /* private */ function () { // funktion fuer Scrollevent
--- a/js/JSWindow.js
+++ b/js/JSWindow.js
@ -418,7 +418,10 @@ JSWindow.prototype = {
  if (this.freed) throw 'Object is freed';
  JSWEffect_terminate(this); // falls gerade ein hide-Effekt laeuft, muss dieser beendet werden, damit appended auf false gesetzt wird, bevor show durchlaeuft!
  if ((this.visible && (!parent || parent == this.parentElement)) || (!this.parentElement && !parent)) return;
-  if (parent) this.parentElement = parent;
+  if (parent) {
+    if (this.parentElement && (this.parentElement != parent)) this.appended = false;
+    this.parentElement = parent;
+  }
  this.visible = true;
  if (!this.excluded) this.el['OuterBox'].style.visibility = 'hidden';
  if (!this.appended) {
--- a/js/fetchText.js
+++ b/js/fetchText.js
@ -83,34 +83,34 @@ function makeupText (win) {
  switch (makeupForm.genderSelect.selectedIndex) {
    case 0:
      css += ""
-        +":lang(de-f)::after { content: 'innen'; }\n"
-        +":lang(de-m)::before { content: ' und '; }\n"
-        +".or:lang(de-m)::before { content: ' oder '; }\n"
-        +".dash:lang(de-m)::before { content: '- und '; }\n";
+        +".end-f::after { content: 'innen'; }\n"
+        +".end-m::before { content: ' und '; }\n"
+        +".or.end-m::before { content: ' oder '; }\n"
+        +".dash.end-m::before { content: '- und '; }\n";
      break;
    case 1:
      css += ""
-        +":lang(de-f)::after { content: '*innen'; }\n"
-        +":lang(de-m) { display: none; }\n";
+        +".end-f::after { content: '*innen'; }\n"
+        +".end-m { display: none; }\n";
      break;
    case 2:
      css += ""
-        +":lang(de-f)::after { content: ':innen'; }\n"
-        +":lang(de-m) { display: none; }\n";
+        +".end-f::after { content: ':innen'; }\n"
+        +".end-m { display: none; }\n";
      break;
    case 3:
      css += ""
-        +":lang(de-f)::after { content: 'Innen'; }\n"
-        +":lang(de-m) { display: none; }\n";
+        +".end-f::after { content: 'Innen'; }\n"
+        +".end-m { display: none; }\n";
      break;
    case 4:
      css += ""
-        +":lang(de-f) { display: none; }\n";
+        +".end-f { display: none; }\n";
      break;
    case 5:
      css += ""
-        +":lang(de-f)::after { content: 'innen'; }\n"
-        +":lang(de-m) { display: none; }\n";
+        +".end-f::after { content: 'innen'; }\n"
+        +".end-m { display: none; }\n";
      break;
  }
  if (!makeupForm.showDeletedContent.checked) css += "del, .rejected { display: none; }\n";
--- a/js/headerlogo.js
+++ b/js/headerlogo.js
@ -0,0 +1,32 @@
+(function () {
+  var boxTop = document.getElementById('BoxTop');
+  var logoIsSmall = false;
+  var rootPath = '';
+  function setClass (add) {
+    let spl = boxTop.className.split(' ');
+    for (let i = spl.length-1; i >= 0; i--)
+      if (spl[i] == 'smallLogo')
+        spl.splice(i, 1);
+    if (add) spl.push('smallLogo');
+    boxTop.className = spl.join(' ');
+  }
+  let spl = document.cookie.split(';');
+  for (let i = 0; i < spl.length; i++) {
+    spl[i] = spl[i].split('=');
+    if (spl[i][0] == 'headerLogoState' && spl[i].length > 1) {
+      logoIsSmall = spl[i][1] == 'small';
+      break;
+    }
+  }
+  setClass(logoIsSmall);
+  let selfScript = document.getElementsByTagName('script')[document.getElementsByTagName('script').length-1];
+  if (selfScript.getAttribute('rootpath'))
+    rootPath = selfScript.getAttribute('rootpath');
+  let sitePath = window.location.href.split('#')[0];
+  var logoShouldBeSmall = !(rootPath != '' && sitePath.indexOf(rootPath) == 0 && sitePath.length - rootPath.length <= 2);
+  if (logoShouldBeSmall != logoIsSmall) window.setTimeout(function () {
+    setClass(logoShouldBeSmall);
+    if (logoShouldBeSmall) document.cookie = 'headerLogoState=small;path=/';
+    else document.cookie = 'headerLogoState=big;path=/';
+  }, 1000);
+})();
--- a/js/interactivePlayer.js
+++ b/js/interactivePlayer.js
@ -19,7 +19,8 @@ function loadJsWindows (callback) {
 }

 window.previewVideoWin = null;
-window.showPreview = function (preview, video) {
+window.showPreview = function (preview, video, asWindow=true) {
+  if (player && player.currentVideo >= 0) return;
  loadJsWindows(function () {
    let img = document.createElement('img');
    img.src = preview;
@ -28,7 +29,8 @@ window.showPreview = function (preview, video) {
    img.style.cursor = 'pointer';
    let previewVideoWin = new JSWindow();
    window.previewVideoWin = previewVideoWin;
-    previewVideoWin.pos.position = 'fixed';
+    if (asWindow) previewVideoWin.pos.position = 'fixed';
+    else previewVideoWin.pos.position = 'absolute';
    previewVideoWin.pos.top = Number.NaN;
    previewVideoWin.pos.left = 10;
    previewVideoWin.pos.width = 300;
@ -36,14 +38,15 @@ window.showPreview = function (preview, video) {
    previewVideoWin.pos.right = Number.NaN;
    previewVideoWin.pos.bottom = 10;
    previewVideoWin.minimizable = false;
-    previewVideoWin.maximizable = false;
+    previewVideoWin.maximizable = !asWindow;
    previewVideoWin.setTitle('Video');
    previewVideoWin.el['InnerBox'].appendChild(img);
    previewVideoWin.el['InnerBox'].style.overflow = 'hidden';
    previewVideoWin.addEventListener('hide', function () {
      window.previewVideoWin = null;
    });
-    previewVideoWin.show(document.body);
+    previewVideoWin.show((asWindow)?document.body:document.getElementById('SideVideo'));
+    if (!asWindow) previewVideoWin.maximize();
    img.addEventListener('click', function () {
      player.play(video, 0, true);
    }, false);
@ -78,7 +81,9 @@ function InteractivePlayer () {
      window.HELP_IMPROVE_VIDEOJS = false;
      var videojsStyle = document.createElement('link');
      videojsStyle.setAttribute('rel', 'stylesheet');
-      videojsStyle.href = 'system/css/video-js.min.css';
+      let cssPath = _this.selfScriptPath.split('/');
+      if (cssPath.pop() == '') cssPath.pop();
+      videojsStyle.href = cssPath.join('/')+'/css/video-js.min.css';
      document.getElementsByTagName('head')[0].appendChild(videojsStyle);
      var videoScript = document.createElement('script');
      videoScript.setAttribute('type', 'text/javascript');
@ -101,6 +106,21 @@ InteractivePlayer.prototype = {
  currentAction : 0,
  prevBut : null,
  nextBut : null,
+  _asWindow : true,
+  get asWindow () { return this._asWindow; }, set asWindow (v) {
+    if (this.win) {
+      this.win.maximizable = !this._asWindow;
+      if (v) {
+        this.win.show(document.body);
+        this.win.normalize();
+        if (!this._asWindow) this.win.hide();
+      } else {
+        this.win.show(document.getElementById('SideVideo'));
+        this.win.maximize();
+      }
+    }
+    this._asWindow = v;
+  },
  timeset : -1,
  playall : false,
  lastWaiting : null, // contains alternating pairs of video time and real time
@ -227,6 +247,10 @@ InteractivePlayer.prototype = {
        this.currentAction++;
      }
    this.player.dispose();
+    this.freePlayer();
+  },
+
+  freePlayer : /* private */ function () {
    this.video = null;
    this.player = null;
    this.win = null;
@ -248,9 +272,10 @@ InteractivePlayer.prototype = {
    this.win.pos.right = 150;
    this.win.pos.bottom = 10;
    this.win.excludable = true;
-    this.win.minimizable = false;
+    this.win.minimizable = !this.asWindow;
    this.win.setTitle('Video');
    this.win.addEventListener('hide', function () { _this.closeWindow(); });
+    this.win.addEventListener('free', function () { _this.freePlayer(); });
    this.video = document.createElement('video');
    this.video.className = 'video-js';
    this.video.setAttribute('controls', '');
@ -259,7 +284,8 @@ InteractivePlayer.prototype = {
    this.video.addEventListener('ended', function () { _this.videoended(); }, false);
    this.video.addEventListener('waiting', function () { _this.videowaiting(); }, false);
    this.win.el['InnerBox'].appendChild(this.video);
-    this.win.show(document.body);
+    this.win.show((this.asWindow)?document.body:document.getElementById('SideVideo'));
+    if (!this.asWindow) this.win.maximize();
    this.player = videojs(this.video);
    this.player.controlBar.addChild('QualitySelector');
    var divs = this.video.parentElement.getElementsByTagName('div');
@ -299,9 +325,9 @@ InteractivePlayer.prototype = {
    var url = this.playlist[nr].src;
    var quality = this.getCurrentQuality();
    this.player.src([
-      {type: "video\/mp4", src: url+'-1080p.mp4', label: '1080p 50fps', selected: (quality == '1080p 50fps')},
-      {type: "video\/mp4", src: url+'-720p.mp4', label: '720p 25fps', selected: (quality == '720p 25fps')},
-      {type: "video\/mp4", src: url+'-400p.mp4', label: '400p 25fps', selected: (quality == '400p 25fps')},
+      {type: "video\/mp4", src: url+((this.playlist[nr].fixedResolution)?'.mp4':'-1080p.mp4'), label: '1080p 50fps', selected: (quality == '1080p 50fps')},
+      {type: "video\/mp4", src: url+((this.playlist[nr].fixedResolution)?'.mp4':'-720p.mp4'), label: '720p 25fps', selected: (quality == '720p 25fps')},
+      {type: "video\/mp4", src: url+((this.playlist[nr].fixedResolution)?'.mp4':'-400p.mp4'), label: '400p 25fps', selected: (quality == '400p 25fps')},
    ]);
    this.lastWaiting = [0, Math.floor(Date.now() / 1000)];
  },
@ -331,6 +357,7 @@ InteractivePlayer.prototype = {
    this.currentAction = 0;
    if (!this.win)
      this.createWindow();
+    else if (!this.win.visible) this.win.show((this.asWindow)?document.body:document.getElementById('SideVideo'));
    this.loadVideo(i);
    this.timeset = time;
    try {