72 lines
4.8 KiB
JavaScript
72 lines
4.8 KiB
JavaScript
(function () {
|
||
const URL = "https://wiai.stuve-bamberg.de/vc-customization/"
|
||
|
||
if (!localStorage.getItem('wiai-eet-howto-seen')) {
|
||
window.addEventListener('load', function () {
|
||
const wrapper = document.createElement('div')
|
||
wrapper.classList.add('wiai-eet-howto')
|
||
document.getElementById('page').replaceWith(wrapper)
|
||
addLanguageChooser(wrapper)
|
||
|
||
wrapper.innerHTML += '<div class="wiai-eet-howto-header"><h1><span class="wiai-german">Unser Plan für die Einführungstage</span><span class="wiai-english">Our Plan for the Introductory Days</span></h1></div>'
|
||
|
||
const imageWrapper = document.createElement('div')
|
||
imageWrapper.classList.add('wiai-eet-howto-images')
|
||
wrapper.appendChild(imageWrapper)
|
||
|
||
const images = [
|
||
['/img/1-Grußworte.jpg', 'Grußworte ansehen: Verschiedene Gesichter der Fakultät brennen darauf, sich euch vorzustellen. Sie geben außerdem wichtige Infos für den erfolgreichen Start ins Studium.'],
|
||
['/img/2-Facheinführungen.jpg', 'Fächer kennenlernen: Damit die Selbstorganisation gut klappt, wird es Zeit, dass ihr euren Studiengang näher kennen lernt – gemeinsam mit euren Fachstudienberater:innen.'],
|
||
['/img/3-Technik.jpg', 'Technik einrichten: Viele IT-Dienste sollen euch das Studium hier einfach machen. Da das nicht immer gelingt, gibt es gleich zu Anfang eine ausführliche Einführung.'],
|
||
['/img/4-Stundenplan.jpg', 'Stundenplan erstellen: Jetzt seid ihr bereit, euren eigenen Stundenplan zu erstellen. Im Stundenplantutorium stehen euch hierfür Kommiliton:innen höherer Semester zur Seite.'],
|
||
['/img/5-Freunde.jpg', 'Freunde treffen: Die Hochschulgruppen der Universität, die Games Night, ein Buddyprogramm und vieles mehr laden zum Kennenlernen und Austauschen ein.'],
|
||
['/img/6-Universität.jpg', 'Universität erkunden: Die Fachschaft, die Studierendenvertretung und viele weitere Einrichtungen der Universität könnt ihr im VC und auf einer virtuellen Karte entdecken.']
|
||
]
|
||
|
||
images.forEach(function (image) {
|
||
imageWrapper.innerHTML += `<img class="wiai-eet-howto-image wiai-german" src="${URL}${image[0]}" alt="${image[1]}"/>`
|
||
})
|
||
|
||
const englishImages = [
|
||
['/img/1-Grußworte-en.jpg', 'Welcome Adresses: The entire faculty is keen to meet you! A handfull of representatives will introduce themselves and give important information for starting your studies successfully.'],
|
||
['/img/2-Facheinführungen-en.jpg', 'Degree Programs: In order for you to have a good start, it is time to have a detailed look at your degree program. Your advisor will cover all relevant documents and regulations.'],
|
||
['/img/3-Technik-en.jpg', 'IT Services: There is a multitude of IT services to make your life easier. Sometimes, however, they don\'t, which is why we provide in-depth tutorials for you to get you going.'],
|
||
['/img/4-Stundenplan-en.jpg', 'Schedules: Now you are ready to create your own schedule. Our tutors will assist you and answer your questions in the live scheduling tutorials.'],
|
||
['/img/5-Freunde-en.jpg', 'Friendships: The university\'s student associations, the Games Night, and a buddy program will help you get in touch with fellow freshmen and other students.'],
|
||
['/img/6-Universität-en.jpg', 'University: Meet your “Fachschaft” (Student Council), and explore many university facilities (e.g., the university library) in the VC course or on our virtual map.']
|
||
]
|
||
|
||
englishImages.forEach(function (image) {
|
||
imageWrapper.innerHTML += `<img class="wiai-eet-howto-image wiai-english" src="${URL}${image[0]}" alt="${image[1]}"/>`
|
||
})
|
||
|
||
wrapper.innerHTML += '<a href="#" class="wiai-eet-howto-cta"><span class="wiai-german">Los geht\'s!</span><span class="wiai-english">Let\'s go!</span></a>'
|
||
|
||
document.querySelector('.wiai-eet-howto-cta').addEventListener('click', function (event) {
|
||
event.preventDefault()
|
||
localStorage.setItem('wiai-eet-howto-seen', true)
|
||
window.location.reload()
|
||
})
|
||
})
|
||
}
|
||
|
||
const LANGUAGES = ['german', 'english'];
|
||
const LANGUAGE_NAMES = {'german': 'Deutsch', 'english': 'English'};
|
||
const LANGUAGE_PREFIXES = {'img[alt="German"]': 'german', 'img[alt="English"]': 'english'};
|
||
|
||
|
||
/**
|
||
* Add a language chooser element to the top of the targetElement.
|
||
*/
|
||
function addLanguageChooser(targetElement) {
|
||
targetElement.innerHTML += `
|
||
<div class="wiai-eet-howto-language-chooser">
|
||
<a href="javascript:document.body.classList.remove('wiai-language-german');document.body.classList.add('wiai-language-english')"
|
||
class="wiai-eet-howto-language-opion wiai-german">English version</a>
|
||
<a href="javascript:document.body.classList.remove('wiai-language-english');document.body.classList.add('wiai-language-german')"
|
||
class="wiai-eet-howto-language-opion wiai-english">Deutsche Variante</a>
|
||
</div>`
|
||
}
|
||
|
||
})()
|