Refactor charts component (#295)
All checks were successful
Website Prod/Test / Produktivumgebung (push) Successful in 12s
Website Prod/Test / Testumgebung (push) Successful in 8s
Website Pull Request / Pull-Request-Testbuild (pull_request) Successful in 24s

Reviewed-on: #295
This commit is contained in:
2024-09-19 20:26:42 +02:00
parent c3dbecca67
commit aa7c6de313
14 changed files with 458 additions and 594 deletions

123
assets/js/echarts-locale.js Normal file
View File

@ -0,0 +1,123 @@
// @ts-ignore
echarts.registerLocale("DE", {
time: {
month: [
"Januar",
"Februar",
"März",
"April",
"Mai",
"Juni",
"Juli",
"August",
"September",
"Oktober",
"November",
"Dezember",
],
monthAbbr: ["Jan", "Feb", "Mar", "Apr", "Mai", "Jun", "Jul", "Aug", "Sep", "Okt", "Nov", "Dez"],
dayOfWeek: ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"],
dayOfWeekAbbr: ["So", "Mo", "Di", "Mi", "Do", "Fr", "Sa"],
},
legend: {
selector: {
all: "Alle",
inverse: "Invertiert",
},
},
toolbox: {
brush: {
title: {
rect: "Box Auswahl",
polygon: "Lasso Auswahl",
lineX: "Horizontale Auswahl",
lineY: "Vertikale Auswahl",
keep: "Bereich Auswahl",
clear: "Auswahl zurücksetzen",
},
},
dataView: {
title: "Daten Ansicht",
lang: ["Daten Ansicht", "Schließen", "Aktualisieren"],
},
dataZoom: {
title: {
zoom: "Zoom",
back: "Zoom zurücksetzen",
},
},
magicType: {
title: {
line: "Zu Liniendiagramm wechseln",
bar: "Zu Balkendiagramm wechseln",
stack: "Stapel",
tiled: "Kachel",
},
},
restore: {
title: "Wiederherstellen",
},
saveAsImage: {
title: "Als Bild speichern",
lang: ["Rechtsklick zum Speichern des Bildes"],
},
},
series: {
typeNames: {
pie: "Tortendiagramm",
bar: "Balkendiagramm",
line: "Liniendiagramm",
scatter: "Streudiagramm",
effectScatter: "Welligkeits-Streudiagramm",
radar: "Radar-Karte",
tree: "Baum",
treemap: "Baumkarte",
boxplot: "Boxplot",
candlestick: "Kerzenständer",
k: "K Liniendiagramm",
heatmap: "Heatmap",
map: "Karte",
parallel: "Parallele Koordinatenkarte",
lines: "Liniendiagramm",
graph: "Beziehungsgrafik",
sankey: "Sankey-Diagramm",
funnel: "Trichterdiagramm",
gauge: "Meßanzeige",
pictorialBar: "Bildlicher Balken",
themeRiver: "Thematische Flusskarte",
sunburst: "Sonnenausbruch",
},
},
aria: {
general: {
withTitle: 'Dies ist ein Diagramm über "{title}"',
withoutTitle: "Dies ist ein Diagramm",
},
series: {
single: {
prefix: "",
withName: " mit Typ {seriesType} namens {seriesName}.",
withoutName: " mit Typ {seriesType}.",
},
multiple: {
prefix: ". Es besteht aus {seriesCount} Serienzählung.",
withName: " Die Serie {seriesId} ist ein {seriesType} welcher {seriesName} darstellt.",
withoutName: " Die {seriesId}-Reihe ist ein {seriesType}.",
separator: {
middle: "",
end: "",
},
},
},
data: {
allData: "Die Daten sind wie folgt: ",
partialData: "Die ersten {displayCnt} Elemente sind: ",
withName: "die Daten für {name} sind {value}",
withoutName: "{value}",
separator: {
middle: ",",
end: ".",
},
},
},
});

View File

@ -1,33 +1,33 @@
(($) => {
'use strict';
"use strict";
// adapt header to height
function adaptHeight () {
var height = $('.top-header').innerHeight();
if ($('header').offset().top > 10) {
$('.top-header').addClass('hide');
$('.navigation').addClass('nav-bg');
$('.navigation').css('margin-top','-'+height+'px');
function adaptHeight() {
var height = $(".top-header").innerHeight();
if ($("header").offset().top > 10) {
$(".top-header").addClass("hide");
$(".navigation").addClass("nav-bg");
$(".navigation").css("margin-top", "-" + height + "px");
} else {
$('.top-header').removeClass('hide');
if ( !$('#top-banner').length) {
$('.navigation').removeClass('nav-bg');
$(".top-header").removeClass("hide");
if (!$("#top-banner").length) {
$(".navigation").removeClass("nav-bg");
}
$('.navigation').css('margin-top','-'+0+'px');
$(".navigation").css("margin-top", "-" + 0 + "px");
}
}
// load scripts
$(window).on('load', function() {
$('.preloader').fadeOut(100);
$(window).on("load", function () {
$(".preloader").fadeOut(100);
adaptHeight();
if ($('#top-banner').length) {
$('.navigation').addClass('nav-bg');
$('.hero-section').addClass('hs-banner');
$('.page-title-section').addClass('pts-banner');
if ($("#top-banner").length) {
$(".navigation").addClass("nav-bg");
$(".hero-section").addClass("hs-banner");
$(".page-title-section").addClass("pts-banner");
} else {
$('.hero-section').removeClass('hs-banner');
$('.page-title-section').removeClass('pts-banner');
$(".hero-section").removeClass("hs-banner");
$(".page-title-section").removeClass("pts-banner");
}
});
@ -35,105 +35,121 @@
$(window).scroll(adaptHeight);
// hero slider
$('.hero-slider').slick({
$(".hero-slider").slick({
autoplay: true,
autoplaySpeed: 5000,
pauseOnFocus: false,
pauseOnHover: true,
infinite: true,
arrows: true,
prevArrow: '<button type=\'button\' class=\'prevArrow\'><svg xmlns="http://www.w3.org/2000/svg" id="mdi-chevron-left" class="arrowIcon" viewBox="0 0 24 24" height="1em" width="1em" fill="currentColor"><path d="M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z" /></svg></button>',
nextArrow: '<button type=\'button\' class=\'nextArrow\'><svg xmlns="http://www.w3.org/2000/svg" id="mdi-chevron-left" class="arrowIcon" viewBox="0 0 24 24" height="1em" width="1em" fill="currentColor"><path xmlns="http://www.w3.org/2000/svg" d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z"/></svg></button>',
dots: true
prevArrow:
'<button type=\'button\' class=\'prevArrow\'><svg xmlns="http://www.w3.org/2000/svg" id="mdi-chevron-left" class="arrowIcon" viewBox="0 0 24 24" height="1em" width="1em" fill="currentColor"><path d="M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z" /></svg></button>',
nextArrow:
'<button type=\'button\' class=\'nextArrow\'><svg xmlns="http://www.w3.org/2000/svg" id="mdi-chevron-left" class="arrowIcon" viewBox="0 0 24 24" height="1em" width="1em" fill="currentColor"><path xmlns="http://www.w3.org/2000/svg" d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z"/></svg></button>',
dots: true,
});
// venobox popup
$(document).ready(function() {
$(document).ready(function () {
// @ts-ignore
new VenoBox({
selector: '.vb-video',
spinner: 'grid'
selector: ".vb-video",
spinner: "grid",
});
// @ts-ignore
new VenoBox({
selector: '.vb-gallery',
selector: ".vb-gallery",
numeration: true,
infinigall: true,
share: true,
shareStyle: 'block',
spinner: 'grid',
shareStyle: "block",
spinner: "grid",
fitView: true,
navTouch: true,
});
});
// filter
$(document).ready(function() {
if ($('.filter-container').length != 0) {
const shuffleInstance = new Shuffle($('.filter-container'), {
itemSelector: '.filter-item',
sizer: '.filter-sizer',
delimiter: ',',
isCentered: true
$(document).ready(function () {
if ($(".filter-container").length != 0) {
// @ts-ignore
const shuffleInstance = new Shuffle($(".filter-container"), {
itemSelector: ".filter-item",
sizer: ".filter-sizer",
delimiter: ",",
isCentered: true,
});
$('.filter-controls li').on('click', function() {
$('.filter-controls li').removeClass('active');
$(this).addClass('active');
shuffleInstance.filter($(this).data('filter'))
$(".filter-controls li").on("click", function () {
$(".filter-controls li").removeClass("active");
$(this).addClass("active");
shuffleInstance.filter($(this).data("filter"));
});
}
});
// counter
$(window).on('scroll', function() {
var oTop;
if ($('.count').length !== 0) {
oTop = $('.count').offset().top - window.innerHeight;
$(window).on("scroll", function () {
var oTop = 0;
if ($(".count").length !== 0) {
oTop = $(".count").offset().top - window.innerHeight;
}
if ($(window).scrollTop() > oTop) {
$('.count').each(function() {
var $this = $(this), countTo = $this.attr('data-count');
$(".count").each(function () {
var $this = $(this),
countTo = $this.attr("data-count");
$({ countNum: $this.text() }).animate(
{ countNum: countTo },
{
duration: 1000,
easing: 'swing',
step: function() { return $this.text(Math.floor(this.countNum)) },
complete: function() { return $this.text(this.countNum) },
});
easing: "swing",
step: function () {
return $this.text(Math.floor(this.countNum));
},
complete: function () {
return $this.text(this.countNum);
},
}
);
});
}
});
$(window).on('DOMContentLoaded', function() {
if (window.PagefindUI != undefined) {
new window.PagefindUI({
element: "#search",
translations: {
placeholder: "Suchen...",
zero_results: "Leider konnten keine Ergebnisse zu [SEARCH_TERM] gefunden werden",
clear_search: "Löschen"
}
});
$('#pagefind-search').on('shown.bs.modal', function() {
$('.pagefind-ui__search-input').focus();
});
}
$(window).on("DOMContentLoaded", function () {
// @ts-ignore
new PagefindUI({
element: "#search",
translations: {
placeholder: "Suchen...",
zero_results: "Leider konnten keine Ergebnisse zu [SEARCH_TERM] gefunden werden",
clear_search: "Löschen",
},
});
$("#pagefind-search").on("shown.bs.modal", function () {
$(".pagefind-ui__search-input").focus();
});
});
// enable matomo analytics
var _paq = window._paq = window._paq || [];
// @ts-ignore
var _paq = (window._paq = window._paq || []);
_paq.push(["setDoNotTrack", true]);
_paq.push(["disableCookies"]);
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://analytics.cantorgymnasium.de/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '1']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
_paq.push(["trackPageView"]);
_paq.push(["enableLinkTracking"]);
(function () {
var u = "https://analytics.cantorgymnasium.de/";
_paq.push(["setTrackerUrl", u + "matomo.php"]);
_paq.push(["setSiteId", "1"]);
var d = document,
g = d.createElement("script"),
s = d.getElementsByTagName("script")[0];
g.async = true;
g.src = u + "matomo.js";
s.parentNode.insertBefore(g, s);
})();
// @ts-ignore
new LazyLoad();
// @ts-ignore
})(jQuery);