initial

3 files changed, 63 insertions, 0 deletions

diff --git a/init.js b/init.js
new file mode 100644
index 0000000..87a2299
--- /dev/null
+++ b/init.js
@@ -0,0 +1,40 @@
+/* global require, PluginHost */
+
+require(['dojo/_base/kernel', 'dojo/ready'], function  (dojo, ready) {
+	function set_placeholder(img) {
+
+		img.style.backgroundColor = '#bbb';
+		img.style.backgroundImage = 'url(plugins.local/af_img_placeholders/loading.png)';
+		img.style.backgroundPosition = 'center center';
+		img.style.backgroundRepeat = 'no-repeat';
+		img.style.minWidth = '300px';
+		img.style.minHeight = '300px';
+
+		img.onload = function() {
+			img.style.minWidth = '';
+			img.style.minHeight = '';
+		}
+
+		img.onerror = function() {
+			this.style.backgroundColor = '';
+			this.style.backgroundImage = '';
+		}
+
+	}
+
+	function set_placeholders(row) {
+		[...row.querySelectorAll("img")].forEach((img) => set_placeholder(img));
+	}
+
+	ready(function () {
+		PluginHost.register(PluginHost.HOOK_ARTICLE_RENDERED_CDM, function (row) {
+			set_placeholders(row.querySelector(".content"));
+			return true;
+		});
+
+		PluginHost.register(PluginHost.HOOK_ARTICLE_RENDERED, function (row) {
+			set_placeholders(row);
+			return true;
+		});
+	});
+});
diff --git a/init.php b/init.php
new file mode 100644
index 0000000..092334e
--- /dev/null
+++ b/init.php
@@ -0,0 +1,23 @@
+<?php
+class Af_Img_PlaceHolders extends Plugin {
+	private $host;
+
+	function about() {
+		return array(null,
+			"Add loading placeholders for images (for slow connections)",
+			"fox");
+	}
+
+	function init($host) {
+		$this->host = $host;
+	}
+
+	function get_js() {
+		return file_get_contents(__DIR__ . "/init.js");
+	}
+
+	function api_version() {
+		return 2;
+	}
+
+}
diff --git a/loading.png b/loading.png
new file mode 100644
index 0000000..cf55432
--- /dev/null
+++ b/loading.png