Wir freuen uns sehr, dass so viele unserem Aufruf gefolgt sind und faszinierende Naturfotografien eingereicht haben. Nun sind Sie gefragt: Stimmen Sie im Online-Voting für Ihre Favoriten ab und entscheiden Sie so, welche drei Bilder mit einem Gewinn ausgezeichnet werden.

VoteAuswahl

Da es aufgrund der Vielzahl an tollen Einreichungen nicht einfach ist, sich nur für drei Aufnahmen zu entscheiden, können Sie ihre Favoriten in einer Vorauswahl sammeln. Durch Anklicken des Herzens in der rechten oberen Bildecke des Fotos können Sie beliebig viele Bilder auswählen und auch wieder abwählen. 

Für die finale Abstimmung können maximal drei Bilder eingereicht werden. Um Abstimmen zu können, müssen Sie die übrigen Bilder aus der Auswahl löschen.

Bei Fragen und Problemen wenden Sie sich bitte an 

Verwendung von Cookies

Funktionale Cookies

Notwendige Cookies

Performance Cookies

Cookie Einstellungen

Vielen Dank.

Ihr Browser ist leider veraltet

<div class = "menzFotoListe" id = "menzFotoAuswahl" ></div>
<div style = "padding-bottom: 1em; 	font-size: 1em;" id = "auswahlButton"><button id = "voteSendeButton" class = "voteSendeButton" disabled onclick = "voteAbsenden();">Sie haben bisher keine Fotos gewählt</button></div>

<a href="#VoteAuswahl" style="text-decoration: none;">
        <button class = "voteSendeButton">Zurück zu Ihrer Auswahl</button>
    </a>
<script type = "text/javascript">
// var url = 'http://localhost/fotowettbewerb/fotoJSON.php';
var url = 'https://fotowettbewerb.hlmd.de/fotoJSON.php';
var vurl = 'https://fotowettbewerb.hlmd.de/voterJSON.php';
var fotos = new Array();
var votes = new Array();
var menzFotoListe = document.getElementById('menzFotoListe');
var f = 0;
var fv = 0;
var auswahl = 0;
var end = 1;
var bFloat = ' floatLeft';
var stopClosing = false;
var hatAbgestimmt = false;

var clientString = 'S'+screen.width+'x'+screen.height+'CD'+screen.colorDepth+'D'+innerWidth+'x'+innerHeight+'TP'+navigator.maxTouchPoints+'K'+navigator.hardwareConcurrency+'M'+navigator.deviceMemory+'BS'+navigator.oscpu+'DNT'+navigator.doNotTrack;

clientString = clientString.replace(/[^a-zA-Z0-9]/g, '');
clientString = clientString.slice(0,200);

url += '?cs='+clientString;
vurl += '?cs='+clientString;


var params = new URLSearchParams(window.location.search);
var anzahlFotos =  params.get('az');
if (params.get('az') >= 1 )   var anzahlFotos =  params.get('az');
else var anzahlFotos = 5000;


const menzLayer = document.getElementById('menzLayer');
document.body.appendChild(menzLayer);

menzLayer.addEventListener('mousedown', (event) => {
	stopClosing = false;
});
menzLayer.addEventListener('click', (event) => {
	if (!stopClosing)	closeMenzLayer();
});

// ++++++++++++++++++++++++++++++++++++++++++++++++++++++ Prüfen, ob Cookie gesetzt
/*
function setCookie(name, value, expirationDate) {
    document.cookie = name + '=' + value + '; expires=' + expirationDate.toUTCString() + '; path=/; domain=.hlmd.de; SameSite=None;';
}

function getCookie(name) {
    const value = '; ' + document.cookie;
    const parts = value.split('; ' + name + '=');
    if (parts.length === 2) return parts.pop().split(';').shift();
    return null;
}

function getMicrotime() {
    const microtime = Date.now() * 1000; // current Unix timestamp in microseconds
    return microtime.toString();
}

// Check if the cookie exists
if (!getCookie('app_cookie_v')) {
    // Cookie does not exist, create it
    const expirationDate = new Date('2025-02-04T00:00:00');
    const microtimeValue = getMicrotime();
    setCookie('app_cookie_v', microtimeValue, expirationDate);
}
*/
// ++++++++++++++++++++++++++++++++++++++++++++++++++++++ Prüfen, ob gewählt

var xhrv = new XMLHttpRequest();
xhrv.open('GET', vurl, true);
xhrv.withCredentials = true;

xhrv.onload = function() 
{
    if (xhrv.status >= 200 && xhrv.status < 300) 
	{
        var rueckgabe = xhrv.response;

		if (rueckgabe == 'ja')
		{	
			var voteButton = document.getElementById('voteSendeButton');

			voteButton.disabled = true;
			voteButton.innerHTML = 'Sie haben bereits für Ihre Favoriten abgestimmt.';
			
			hatAbgestimmt = true;
		}
		else if (rueckgabe == 'vorStart')
		{	
			var voteButton = document.getElementById('voteSendeButton');

			voteButton.disabled = true;
			voteButton.innerHTML = 'Das Voting hat noch nicht begonnen.<br/>Die Abstimmung beginnt am 23. Dezember 2024 um 0:00 Uhr Mitteleuropäischer Zeit.';
			
			hatAbgestimmt = true;
		}
		else if (rueckgabe == 'nachEnde')
		{	
			var voteButton = document.getElementById('voteSendeButton');

			voteButton.disabled = true;
			voteButton.innerHTML = 'Das Voting über die schönsten Fotos ist bereits beendet.';
			
			hatAbgestimmt = true;
		}
	}
	else 
	{
//        console.log(xhr.statusText+" - "+xhr.response);
    }
}
xhrv.send();

// ++++++++++++++++++++++++++++++++++++++++++++++++++++++ Laden der Fotoliste

var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.withCredentials = true;

xhr.onload = function() 
{
    if (xhr.status >= 200 && xhr.status < 300) 
	{
        var rueckgabe = xhr.response;
		var data = JSON.parse(rueckgabe);
		var divWidth = 0;
		var fHeight = 0;
		
		for (const key in data) 
		{
			var foto = data[key];

			if (foto.tHeight > foto.tWidth)			ausrichtung = 'hoch';
			if (foto.tHeight == foto.tWidth)		ausrichtung = 'quadrat';
			else									ausrichtung = 'quer';

			f++;
			fotos[f] = new Array();			
			fotos[f]['tPfad'] = foto.tPfad;
			fotos[f]['mPfad'] = foto.mPfad;
			fotos[f]['vPfad'] = foto.vPfad;
			fotos[f]['oPfad'] = foto.oPfad;
			fotos[f]['tWidth'] = foto.tWidth;
			fotos[f]['tHeight'] = foto.tHeight;
			fotos[f]['tAusr'] = ausrichtung;
			fotos[f]['id'] = foto.id;
			fotos[f]['fid'] = foto.fid;
			fotos[f]['ext'] = foto.ext;
			fotos[f]['titel'] = foto.titel;
			fotos[f]['text'] = foto.text;
			fotos[f]['jahr'] = foto.jahr;
			fotos[f]['datum'] = foto.datum;
			fotos[f]['ort'] = foto.ort;
			fotos[f]['name'] = foto.name;
			fotos[f]['alter'] = foto.alter;
			fotos[f]['kamera'] = foto.kamera;	

			if (f == anzahlFotos)	break;
		};
		
		mehrBilder();
   } 
	else 
	{
//        console.log(xhr.statusText+" - "+xhr.response);
    }
};

function mehrBilder ()
{
	var ausAlt = '';

	for (i = 1; (i <= 12 && end <= f); i++)
	{
		var divWidth = fotos[end]['tWidth'];
		var fHeight = fotos[end]['tHeight'];
		var fotograf = fotos[end]['name'];
		var fototitel = fotos[end]['titel'];
		var fototext = fotos[end]['text'];
		var fotojahr = fotos[end]['jahr'];
		var fotodatum = fotos[end]['datum'];
		var fotoort = fotos[end]['ort'];
		var thumbPfad = fotos[end]['tPfad'];
		var bildPfad = fotos[end]['vPfad'];

		if (bFloat == ' floatLeft')		bFloat = ' floatRight';
	//	else if (bFloat == ' floatRight')	bFloat = '';
		else								bFloat = ' floatLeft';
	
		var beitrag = '<div class = "beitrag'+bFloat+'" style = "max-width: '+divWidth+'px;" id = "'+fotos[end]['fid']+'"><img src = "https://fotowettbewerb.hlmd.de/'+thumbPfad+'" class = "bild" onClick = "openMenzLayer(\''+bildPfad+'\');" /><svg class="heart-icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" id = "herz'+fotos[end]['fid']+'" onClick = "auswaehlen('+fotos[end]['fid']+','+end+',);" ><circle cx="16" cy="16" r="15" fill="white" stroke="grey" stroke-width="2" /><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" transform="translate(4, 5)"/></svg><div class="text-overlay">'+fototitel+'<br/>'+fotodatum+'<br/>'+fotoort+'</div></div>';
	
		menzFotoListe.innerHTML += beitrag;
		end++;
	}
}

function checkDiv()
{
    if (!document.getElementById('menzFotoListe'))
    {   end = 1;
    }
    else
    {    var rect = document.getElementById('menzFotoListe').getBoundingClientRect();
        var viewportHeight = window.innerHeight || document.documentElement.clientHeight;
	
//	alert (viewportHeight+" "+rect.bottom);

        if (document.getElementById('menzFotoListe').children.length == 0 )
		{	end = 1;
		}

        if ((rect.bottom - 300) <= viewportHeight )
		{	mehrBilder();
//			console.log('mehrBilder ausgeführt'+'-'+fotos[end]['id']);
		}
//       console.log (rect.bottom+' - '+end+' - '+f+ ' - '+document.getElementById('menzFotoListe').children.length);
    }
}

// ++++++++++++++++++++++++++++++++++++++++++++++++++++++ Auswahl / Voting

function auswaehlen(fotoid,end)
{
	if (hatAbgestimmt == true)	return;
	
	var beitragHerz = document.getElementById('herz'+fotoid);
//	var auswahlText = document.getElementById('auswahlText');
	var voteButton = document.getElementById('voteSendeButton');
	
	
	if (beitragHerz.classList.contains('favorited'))
	{
		beitragHerz.classList.remove('favorited');
		var beitragDiv = document.getElementById('A'+fotoid);
		beitragDiv.remove();
		auswahl--;
	}
	else
	{
		beitragHerz.classList.add('favorited');
	
		var divWidth = fotos[end]['tWidth'];
		var fHeight = fotos[end]['tHeight'];
		var fotograf = fotos[end]['name'];
		var fototitel = fotos[end]['titel'];
		var fototext = fotos[end]['text'];
		var fotojahr = fotos[end]['jahr'];
		var fotodatum = fotos[end]['datum'];
		var fotoort = fotos[end]['ort'];
		var thumbPfad = fotos[end]['tPfad'];
		var bildPfad = fotos[end]['vPfad'];

		if (bFloat == ' floatLeft')		bFloat = ' floatRight';
	//	else if (bFloat == ' floatRight')	bFloat = '';
		else								bFloat = ' floatLeft';
	
		var beitrag = '<div class = "beitrag'+bFloat+'" style = "max-width: '+divWidth+'px;" id = "A'+fotos[end]['fid']+'"><img src = "https://fotowettbewerb.hlmd.de/'+thumbPfad+'" class = "bild" onClick = "openMenzLayer(\''+bildPfad+'\');" /><svg class="heart-icon favorited" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" id = "Aherz'+fotos[end]['fid']+'" onClick = "auswaehlen('+fotos[end]['fid']+','+end+',);" ><circle cx="16" cy="16" r="15" fill="white" stroke="grey" stroke-width="2" /><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z" transform="translate(4, 5)"/></svg><div class="text-overlay">'+fototitel+'<br/>'+fotodatum+'<br/>'+fotoort+'</div></div>';
		
		menzFotoAuswahl.innerHTML += beitrag;
		auswahl++;
	}
	
	if (auswahl <= 0)	
	{	
		// auswahlText.innerHTML = 'Sie haben bisher kein Foto ausgewählt.';
		voteButton.disabled = true;
		voteButton.innerHTML = 'Sie haben noch kein Foto ausgewählt.';
	}
	else if (auswahl == 1)	
	{	
		// auswahlText.innerHTML = '';
		voteButton.disabled = false;
		voteButton.innerHTML = 'Sie können Ihre Stimme jetzt abgeben oder noch zwei weitere Fotos auswählen.';
	}
	else if (auswahl == 2)	
	{	
		// auswahlText.innerHTML = '';
		voteButton.disabled = false;
		voteButton.innerHTML = 'Sie können Ihre Stimme jetzt abgeben oder noch ein weiteres Fotos auswählen.';
	}
	else if (auswahl == 3)	
	{	
		// auswahlText.innerHTML = '';
		voteButton.disabled = false;
		voteButton.innerHTML = 'Geben Sie Ihre Stimme für Ihre drei Favoriten ab.';
	}
	else if (auswahl >= 4)	
	{	
		// auswahlText.innerHTML = 'Sie haben vier Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
		voteButton.innerHTML = 'Sie dürfen nur für drei Bilder abstimmen. Bitte reduzieren Sie Ihre Auswahl.';
	}

/*
	else if (auswahl == 5)	
	{	
		// auswahlText.innerHTML = 'Sie haben fünf Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else if (auswahl == 6)	
	{	
		// auswahlText.innerHTML = 'Sie haben sechs Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else if (auswahl == 7)	
	{	
		// auswahlText.innerHTML = 'Sie haben sieben Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else if (auswahl == 8)	
	{	
		// auswahlText.innerHTML = 'Sie haben acht Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else if (auswahl == 9)	
	{	
		// auswahlText.innerHTML = 'Sie haben neun Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else if (auswahl == 10)	
	{	
		// auswahlText.innerHTML = 'Sie haben zehn Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else if (auswahl == 11)	
	{	
		// auswahlText.innerHTML = 'Sie haben elf Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else if (auswahl == 12)	
	{	
		// auswahlText.innerHTML = 'Sie haben zwölf Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
	else 	
	{	
		// auswahlText.innerHTML = 'Sie haben '+auswahl+' Fotos ausgewählt. Nur die ersten drei Fotos werden bei der Abstimmung berücksichtigt. Tippen Sie erneut auf das Herz, um überzählige Fotos aus der Auswahl zu löschen.';
		voteButton.disabled = true;
	}
*/
}

function voteAbsenden()
{
	var voteButton = document.getElementById('voteSendeButton');

	const container = document.getElementById('menzFotoAuswahl');
	const favoritedElements = container.querySelectorAll('.favorited');
	const ids = Array.from(favoritedElements).map(element => element.id);
	const idsString = ids.join('|');
	vurl += '&v='+idsString;

	var xhrvs = new XMLHttpRequest();
	xhrvs.open('GET', vurl, true);
	xhrvs.withCredentials = true;

	xhrvs.onload = function() 
	{
		if (xhrvs.status >= 200 && xhrvs.status < 300) 
		{
			var rueckgabe = xhrvs.response;

			if (rueckgabe == 'ja')
			{	

				const heartIcons = document.querySelectorAll("svg.heart-icon");
				heartIcons.forEach(svg => {
					svg.onclick = null; // Entfernt das Inline-Onclick-Attribut
					svg.removeEventListener("click", () => {}); // Versucht, alle Click-Eventlistener zu entfernen
				});
				
				voteButton.disabled = true;
				voteButton.innerHTML = 'Vielen Dank. Wir haben Ihre Stimmen gespeichert.';
				
				hatAbgestimmt = true;
			}
			else if (rueckgabe == 'cookie')
			{
				voteButton.disabled = true;
				voteButton.innerHTML = 'Sie müssen in Ihrem Browser das Setzen von Cookies erlauben, um Abstimmen zu können.';
			}
			else if (rueckgabe == 'hatschon')
			{
				voteButton.disabled = true;
				voteButton.innerHTML = 'Sie hatten bereits abgestimmt.';

				hatAbgestimmt = true;
			}
			else if (rueckgabe == 'fehler')
			{
				voteButton.innerHTML = 'Es ist ein Fehler 1 aufgetreten. Bitte drücken Sie diesen Knopf erneut.';
			}
		}
		else 
		{
				voteButton.innerHTML = 'Es ist ein Fehler 2 aufgetreten. Bitte drücken Sie diesen Knopf erneut.';
		}
	}
	xhrvs.send();


}


// ++++++++++++++++++++++++++++++++++++++++++++++++++++++ Zoom etc


function getDistance(touch1, touch2) 
{
    return Math.sqrt(
        Math.pow(touch2.pageX - touch1.pageX, 2) +
        Math.pow(touch2.pageY - touch1.pageY, 2)
    );
}

function closeMenzLayer()
{	var menzLayer = document.getElementById('menzLayer');
	menzLayer.innerHTML = '';
	menzLayer.style.display = 'none';
}

function openMenzLayer(bildPfad)
{
	var menzLayer = document.getElementById('menzLayer');
	menzLayer.innerHTML = '<img src = "https://fotowettbewerb.hlmd.de/'+bildPfad+'" class = "menzLayerBild" id = "menzLayerBild" />';
	menzLayer.style.display = 'block';
	
	var menzLayerBild = document.getElementById('menzLayerBild');
	let menzScale = 1;
	let posX = 0;
	let posY = 0;
	let isDragging = false;
	let startX, startY;
	let initialPinchDistance = null;

	function updateTransform() {
		menzLayerBild.style.transform = `translate(${posX}px, ${posY}px) scale(${menzScale})`;
	}
	
	menzLayerBild.addEventListener('wheel', (event) => 
	{
		event.preventDefault();
		if (event.ctrlKey) {
			menzScale += event.deltaY * -0.01;
		} else {
			menzScale += event.deltaY * -0.001;
		}
		menzScale = Math.min(Math.max(0.5, menzScale), 5);
		updateTransform();
	});

	menzLayerBild.addEventListener('touchstart', (event) => 
	{
		stopClosing = false;
		if (event.touches.length === 2) {
			event.preventDefault();
			initialPinchDistance = getDistance(event.touches[0], event.touches[1]);
		} else if (event.touches.length === 1) {
			isDragging = true;
			startX = event.touches[0].clientX - posX;
			startY = event.touches[0].clientY - posY;
		}
	});

	menzLayerBild.addEventListener('touchmove', (event) => 
	{
		stopClosing = true;
		if (event.touches.length === 2 && initialPinchDistance) {
			event.preventDefault();
			const currentPinchDistance = getDistance(event.touches[0], event.touches[1]);
			menzScale *= currentPinchDistance / initialPinchDistance;
			menzScale = Math.min(Math.max(0.5, menzScale), 5);
			initialPinchDistance = currentPinchDistance;
			updateTransform();
		} else if (event.touches.length === 1 && isDragging) {
			event.preventDefault();
			posX = event.touches[0].clientX - startX;
			posY = event.touches[0].clientY - startY;
			updateTransform();
		}
	});

	menzLayerBild.addEventListener('touchend', () => {
		isDragging = false;
	});

	menzLayerBild.addEventListener('mousedown', (event) => {
		event.preventDefault(); 
		isDragging = true;
		stopClosing = false;
		startX = event.clientX - posX;
		startY = event.clientY - posY;
		menzLayerBild.style.cursor = 'grabbing';
	});

	menzLayerBild.addEventListener('mousemove', (event) => {
		if (isDragging) {
			stopClosing = true;
			event.preventDefault(); 
			posX = event.clientX - startX;
			posY = event.clientY - startY;
			updateTransform();
		}
	});

	menzLayerBild.addEventListener('mouseup', () => {
		if (isDragging) {
			event.preventDefault(); 
			isDragging = false;
			menzLayerBild.style.cursor = 'grab';
		}
	});

}

// Sende die Anfrage
const nextBilder = setInterval(checkDiv, 1000);
xhr.send();
</script>

Voting

Stimmen Sie für ihre Favoriten ab!

[YOUR MESSAGE]%0D%0A%0D%0A%0D%0ALocation: ${location}%0D%0A%0D%0AReport:%0D%0A${report}

Voting

Stimmen Sie für ihre Favoriten ab!

Ihre Auswahl

Alle Einsendungen

Immer auf dem neuesten Stand

Abonnieren Sie unseren Newsletter und erhalten Sie regelmäßig aktuelle Informationen zu Ausstellungen, Sonderführungen und Events.

Follow HLMD

Besuchen

Entdecken

Mitmachen

Presse

Team

Offene Stellen

Freunde des HLMD

Fotobestellungen