89 lines
3.7 KiB
JavaScript
89 lines
3.7 KiB
JavaScript
/* desfoto.de - progressive enhancement only. */
|
|
(function () {
|
|
'use strict';
|
|
|
|
/* Mobile navigation */
|
|
var toggle = document.querySelector('[data-nav-toggle]');
|
|
var nav = document.getElementById('site-nav');
|
|
if (toggle && nav) {
|
|
toggle.addEventListener('click', function () {
|
|
var open = nav.classList.toggle('is-open');
|
|
toggle.setAttribute('aria-expanded', open ? 'true' : 'false');
|
|
});
|
|
nav.addEventListener('click', function (event) {
|
|
if (event.target.closest('a') && window.innerWidth < 832) {
|
|
nav.classList.remove('is-open');
|
|
toggle.setAttribute('aria-expanded', 'false');
|
|
}
|
|
});
|
|
}
|
|
|
|
/* Click-to-load YouTube (youtube-nocookie) */
|
|
document.querySelectorAll('[data-video-id]').forEach(function (facade) {
|
|
facade.addEventListener('click', function () {
|
|
var id = facade.getAttribute('data-video-id');
|
|
var iframe = document.createElement('iframe');
|
|
iframe.setAttribute('src', 'https://www.youtube-nocookie.com/embed/' + encodeURIComponent(id) +
|
|
'?autoplay=1&rel=0&modestbranding=1&playsinline=1');
|
|
iframe.setAttribute('title', facade.getAttribute('aria-label') || 'Video');
|
|
iframe.setAttribute('loading', 'eager');
|
|
iframe.setAttribute('allow', 'accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture');
|
|
iframe.setAttribute('allowfullscreen', '');
|
|
iframe.setAttribute('referrerpolicy', 'strict-origin-when-cross-origin');
|
|
var shell = facade.parentElement;
|
|
shell.replaceChild(iframe, facade);
|
|
iframe.focus();
|
|
});
|
|
});
|
|
|
|
/* Contact form -> local mail draft, nothing is transmitted by this page */
|
|
var form = document.querySelector('[data-contact-form]');
|
|
if (form) {
|
|
var status = form.querySelector('[data-contact-status]');
|
|
form.addEventListener('submit', function (event) {
|
|
event.preventDefault();
|
|
var data = new FormData(form);
|
|
var name = (data.get('name') || '').toString().trim();
|
|
var email = (data.get('email') || '').toString().trim();
|
|
var topic = (data.get('topic') || '').toString().trim();
|
|
var date = (data.get('date') || '').toString().trim();
|
|
var message = (data.get('message') || '').toString().trim();
|
|
if (!name || !email || !message) {
|
|
if (status) {
|
|
status.hidden = false;
|
|
status.textContent = 'Bitte Name, E-Mail und Nachricht ausfüllen.';
|
|
status.style.color = '#95330F';
|
|
}
|
|
return;
|
|
}
|
|
var subject = 'Anfrage über desfoto.de: ' + topic;
|
|
var body = 'Name: ' + name + '\nE-Mail: ' + email + '\nBereich: ' + topic +
|
|
(date ? '\nWunschtermin: ' + date : '') + '\n\n' + message + '\n';
|
|
window.location.href = 'mailto:info@dennyschulz.de?subject=' +
|
|
encodeURIComponent(subject) + '&body=' + encodeURIComponent(body);
|
|
if (status) {
|
|
status.hidden = false;
|
|
status.textContent = 'Dein Mailprogramm sollte sich mit dem fertigen Entwurf öffnen.';
|
|
status.style.color = '';
|
|
}
|
|
});
|
|
}
|
|
|
|
/* Soft reveal on scroll, disabled for reduced motion */
|
|
var reduce = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
|
|
var items = document.querySelectorAll('.reveal');
|
|
if (reduce || !('IntersectionObserver' in window)) {
|
|
items.forEach(function (item) { item.classList.add('is-in'); });
|
|
} else {
|
|
var observer = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (entry.isIntersecting) {
|
|
entry.target.classList.add('is-in');
|
|
observer.unobserve(entry.target);
|
|
}
|
|
});
|
|
}, { rootMargin: '0px 0px -10% 0px', threshold: 0.05 });
|
|
items.forEach(function (item) { observer.observe(item); });
|
|
}
|
|
}());
|