(function () {
	var articles = document.querySelectorAll ('[data-gallery="carousel"], [data-page="portfolio"], [data-page="fotogalereya"]');
	var images = document.querySelectorAll ('[data-gallery="images"]');
	if (!articles.length && !images.length)
		return;

	var viewer = document.createElement ('dialog');
	viewer.className = 'photo-viewer';
	viewer.setAttribute ('aria-label', 'Просмотр фотографий');
	viewer.innerHTML =
		'<button type="button" class="close">Закрыть</button>' +
		'<button type="button" class="prev" aria-label="Предыдущая фотография">‹</button>' +
		'<img alt="">' +
		'<button type="button" class="next" aria-label="Следующая фотография">›</button>';
	document.body.appendChild (viewer);

	var preview = viewer.querySelector ('img');
	var photos = [];
	var index = 0;

	function ShowPhoto (offset) {
		index = (index + offset + photos.length) % photos.length;
		preview.src = photos[index].href;
		preview.alt = photos[index].firstElementChild.alt;
	}

	viewer.querySelector ('.close').onclick = function () { viewer.close (); };
	viewer.querySelector ('.prev').onclick = function () { ShowPhoto (-1); };
	viewer.querySelector ('.next').onclick = function () { ShowPhoto (1); };
	viewer.addEventListener ('keydown', function (event) {
		if (event.key === 'ArrowLeft')
			ShowPhoto (-1);
		else if (event.key === 'ArrowRight')
			ShowPhoto (1);
	});
	viewer.addEventListener ('click', function (event) {
		if (event.target === viewer)
			viewer.close ();
	});

	function OpenGallery (event) {
		var link = event.target.closest ('a');
		if (!link)
			return;
		event.preventDefault ();
		photos = Array.prototype.slice.call (this.children);
		index = photos.indexOf (link);
		ShowPhoto (0);
		viewer.showModal ();
	}

	Array.prototype.forEach.call (images, function (group) {
		group.addEventListener ('click', OpenGallery);
	});

	Array.prototype.forEach.call (articles, function (article) {
		var gallery;
		var strip;
		var carousel = article.dataset.gallery === 'carousel' || article.dataset.page === 'portfolio';
		Array.prototype.slice.call (article.children).forEach (function (paragraph) {
			var image = paragraph.firstElementChild;
			if (paragraph.tagName !== 'P' || paragraph.children.length !== 1 ||
				image.tagName !== 'IMG' || paragraph.textContent.trim ()) {
				gallery = null;
				return;
			}
			if (!gallery) {
				gallery = document.createElement ('div');
				gallery.className = carousel ? 'photo-gallery carousel' : 'photo-gallery';
				strip = document.createElement ('div');
				gallery.appendChild (strip);
				article.insertBefore (gallery, paragraph);
				strip.addEventListener ('click', OpenGallery);

				if (carousel) {
					['prev', 'next'].forEach (function (direction) {
						var button = document.createElement ('button');
						button.type = 'button';
						button.className = direction;
						button.setAttribute ('aria-label', direction === 'prev' ? 'Предыдущая фотография' : 'Следующая фотография');
						gallery.appendChild (button);
						button.onclick = function () {
							var track = this.parentNode.firstElementChild;
							if (direction === 'prev')
								track.insertBefore (track.lastElementChild, track.firstElementChild);
							else
								track.appendChild (track.firstElementChild);
							track.scrollLeft = 0;
						};
					});
				}
			}
			var link = document.createElement ('a');
			link.href = image.src;
			image.loading = 'lazy';
			link.appendChild (image);
			strip.appendChild (link);
			paragraph.remove ();
		});
	});
}) ();