Web feed

web-feed/scripts/script.js

@@ -0,0 +1,81 @@
+let lastImage = null;
+
+$(document).ready(function() {
+	poll();
+	setInterval(poll, UPDATE_EVERY_SECONDS * 1000);
+});
+
+function poll() {
+	// Polls last photos from gallery service
+	$.ajax({
+		url: `${BASEURL}/api/gallery_item/read.php`,
+		headers: {
+			"Authentication": TOKEN
+		},
+		crossDomain: true
+	}).then(function(data){
+		let image = data.records[0];
+		if (!lastImage || lastImage.id != image.id) {
+			lastImage = image;
+			preloadImage(urlFromImageObj(lastImage), function(event) {
+				const imgDiv = $("#feed #image");
+				let preloadedUrl = event.target.src;
+				imgDiv.animate(
+					{
+						opacity: 0.0
+					},
+					500,
+					"swing",
+					function() {
+						showImage(preloadedUrl);
+						imgDiv.animate(
+							{
+								opacity: 1.0
+							},
+							500,
+							"swing");
+						}
+				);
+			});
+		}
+	});
+}
+
+function urlFromImageObj(image) {
+	return LOW_RES_PROJECTOR ?
+		`${BASEURL}${image.imageThumbUrl}` :
+		`${BASEURL}${image.imageUrl}`;
+}
+
+/**
+ * Preloads the image and executes callback
+ * @param {string} url
+ * @param {function} callback
+ */
+function preloadImage(url, callback) {
+	var img=new Image();
+	img.src=url;
+	img.onload = callback;
+}
+
+/**
+ * Replaces image and user name in div.
+ * No animation is performed here.
+ * @param {image} image json object as returned by the gallery service
+ */
+function showImage(imageUrl) {
+	$("#feed #image").css("background-image", `url(${imageUrl})`);
+	if (urlFromImageObj(lastImage) != imageUrl) {
+		// Connection hiccup? Hide user badge
+		$('#userbadge').hide()
+		return;
+	}
+
+	// Show user badge
+	$('#userbadge').show()
+	$('#userbadge .name').text(`${lastImage.author.name} ${lastImage.author.surname}`);
+	if (lastImage.author.picture)
+		$('#userbadge .avatar').attr('src', `${BASEURL}/user-pictures/${lastImage.author.picture}`)
+	else
+		$('#userbadge .avatar').attr('src', 'user-placeholder.png');
+}