pics/public/js/photonav.js

function enableKeyDownNavigation() {
	document.addEventListener("keydown", function (event) {
		if (event.keyCode == 37) {
			var target = document.getElementById("previous_photo").href;
			if (target) {
				event.preventDefault();
				document.location.href = target + '#photo_frame';
			}
		}
		else if (event.keyCode == 39) {
			var target = document.getElementById("next_photo").href;
			if (target) {
				event.preventDefault();
				document.location.href = target + '#photo_frame';
			}
		}
	}, false);
}

function disableKeyDownPropagation(obj) {
	for (var x = 0; x < obj.length; x++) {
		obj[x].addEventListener("keydown", function (event) {
			if (event.keyCode == 37 || event.keyCode == 39) {
				event.stopPropagation();
			}
		});
	}
}

function enableTouchNavigation() {
	var x_down = null;
	var y_down = null;

	document.addEventListener('touchstart', function(event) {
		x_down = event.touches[0].clientX;
		y_down = event.touches[0].clientY;
	}, false);

	document.addEventListener('touchmove', function(event) {
		if (!x_down || !y_down) {
			return;
		}

		var x_diff = x_down - event.touches[0].clientX;
		var y_diff = y_down - event.touches[0].clientY;

		if (Math.abs(y_diff) > 50) {
			return;
		}

		if (Math.abs(x_diff) > Math.abs(y_diff)) {
			if (x_diff > 0) {
				var target = document.getElementById("previous_photo").href;
				if (target) {
					event.preventDefault();
					document.location.href = target + '#photo_frame';
				}
			} else {
				var target = document.getElementById("next_photo").href;
				if (target) {
					event.preventDefault();
					document.location.href = target + '#photo_frame';
				}
			}
		}
	}, false);
}

enableKeyDownNavigation();
enableTouchNavigation();
disableKeyDownPropagation(document.getElementsByTagName("textarea"));
disableKeyDownPropagation(document.getElementsByTagName("input"));