janishutz-website/old-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

youtube embed component, libreevent page

Browse Source
This commit is contained in:
Janis Hutz
2024-08-30 11:22:06 +02:00
parent f70b846a40
commit 242ec159a2
11 changed files with 175 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
components/slider/js/slider.js
View File

@@ -10,6 +10,7 @@ function sliderGoToIndex(index) {
// Determine next and previous elements
let previousElement = 0;
let nextElement = 0;
let beforePreviousElement = 0;
if (index < sliderElements.length - 1) {
nextElement = index + 1;
}
@@ -22,6 +23,15 @@ function sliderGoToIndex(index) {
else {
previousElement = index - 1;
}
if (index === 0) {
beforePreviousElement = sliderElements.length - 2;
}
else if (index === 1) {
beforePreviousElement = sliderElements.length - 1;
}
else {
beforePreviousElement = index - 2;
}
// Determine move direction:
// true = next, false = previous
let moveDirection = true;
@@ -34,6 +44,7 @@ function sliderGoToIndex(index) {
// New current element
sliderElements[index].classList.add('current');
sliderElements[index].classList.remove('next');
sliderElements[index].classList.remove('last');
sliderElements[index].classList.remove('past');
// New next element
if (moveDirection) {
@@ -44,10 +55,16 @@ function sliderGoToIndex(index) {
}
sliderElements[nextElement].classList.remove('current');
sliderElements[nextElement].classList.remove('past');
sliderElements[nextElement].classList.remove('last');
// new past element
sliderElements[previousElement].classList.add('past');
sliderElements[previousElement].classList.add('last');
sliderElements[previousElement].classList.remove('current');
sliderElements[previousElement].classList.remove('past');
sliderElements[previousElement].classList.remove('next');
sliderElements[beforePreviousElement].classList.add('past');
sliderElements[beforePreviousElement].classList.remove('last');
sliderElements[beforePreviousElement].classList.remove('next');
sliderElements[beforePreviousElement].classList.remove('current');
// Glitch fixes
setTimeout(() => {
if (moveDirection) {
@@ -57,7 +74,7 @@ function sliderGoToIndex(index) {
currentSlideIndex = index;
setTimeout(() => {
okToMove = true;
}, 750);
}, 500);
}, 1000);
}
else if (index < 0) {

5
components/slider/slider.css
View File

@@ -52,6 +52,11 @@
}
.slider-element.past {
z-index: 2;
left: 0;
}
.slider-element.last {
z-index: 3;
left: 0;
}

18
components/slider/ts/slider.ts
View File

@@ -11,6 +11,7 @@ function sliderGoToIndex ( index: number ) {
// Determine next and previous elements
let previousElement = 0;
let nextElement = 0;
let beforePreviousElement = 0;
if ( index < sliderElements.length - 1 ) {
nextElement = index + 1;
} else {
@@ -23,6 +24,14 @@ function sliderGoToIndex ( index: number ) {
previousElement = index - 1;
}
if ( index === 0 ) {
beforePreviousElement = sliderElements.length - 2;
} else if ( index === 1 ) {
beforePreviousElement = sliderElements.length - 1;
} else {
beforePreviousElement = index - 2;
}
// Determine move direction:
// true = next, false = previous
let moveDirection = true;
@@ -37,6 +46,7 @@ function sliderGoToIndex ( index: number ) {
// New current element
sliderElements[ index ].classList.add( 'current' );
sliderElements[ index ].classList.remove( 'next' );
sliderElements[ index ].classList.remove( 'last' );
sliderElements[ index ].classList.remove( 'past' );
// New next element
@@ -47,11 +57,17 @@ function sliderGoToIndex ( index: number ) {
}
sliderElements[ nextElement ].classList.remove( 'current' );
sliderElements[ nextElement ].classList.remove( 'past' );
sliderElements[ nextElement ].classList.remove( 'last' );
// new past element
sliderElements[ previousElement ].classList.add( 'past' );
sliderElements[ previousElement ].classList.add( 'last' );
sliderElements[ previousElement ].classList.remove( 'current' );
sliderElements[ previousElement ].classList.remove( 'past' );
sliderElements[ previousElement ].classList.remove( 'next' );
sliderElements[ beforePreviousElement ].classList.add( 'past' );
sliderElements[ beforePreviousElement ].classList.remove( 'last' );
sliderElements[ beforePreviousElement ].classList.remove( 'next' );
sliderElements[ beforePreviousElement ].classList.remove( 'current' );
// Glitch fixes
setTimeout( () => {