Re-use .previews to order incoming previews instead of extra links

client/js/renderPreview.js

@@ -8,6 +8,10 @@ const templates = require("../views");
 module.exports = renderPreview;
 
 function renderPreview(preview, msg) {
+	if (preview.type === "loading") {
+		return;
+	}
+
 	preview.shown = options.shouldOpenMessagePreview(preview.type);
 
 	const container = msg.closest(".chat");

client/views/actions/action.tpl

@@ -1,6 +1,6 @@
 {{> ../user_name nick=from}}
 <span class="text">{{{parse text}}}</span>
 
-{{#each links}}
+{{#each previews}}
-	<div class="preview" data-url="{{this}}"></div>
+	<div class="preview" data-url="{{link}}"></div>
 {{/each}}

client/views/msg.tpl

@@ -10,8 +10,8 @@
 	<span class="content">
 		<span class="text">{{{parse text}}}</span>
 
-		{{#each links}}
+		{{#each previews}}
-			<div class="preview" data-url="{{this}}"></div>
+			<div class="preview" data-url="{{link}}"></div>
 		{{/each}}
 	</span>
 </div>

src/models/msg.js

@@ -31,7 +31,6 @@ function Msg(attr) {
 	_.defaults(this, attr, {
 		from: "",
 		id: id++,
-		links: [],
 		previews: [],
 		text: "",
 		type: Msg.Type.MESSAGE,

src/plugins/irc-events/link.js

@@ -24,30 +24,28 @@ module.exports = function(client, chan, msg) {
 		return;
 	}
 
-	msg.links = Array.from(new Set( // Remove duplicate links
+	msg.previews = Array.from(new Set( // Remove duplicate links
 		links.map((link) => escapeHeader(link.link))
-	)).slice(0, 5); // Only preview the first 5 URLs in message to avoid abuse
+	)).map((link) => ({
+		type: "loading",
+		head: "",
+		body: "",
+		thumb: "",
+		link: link,
+	})).slice(0, 5); // Only preview the first 5 URLs in message to avoid abuse
 
-	msg.links.forEach((link) => {
+	msg.previews.forEach((preview) => {
-		fetch(link, function(res) {
+		fetch(preview.link, function(res) {
 			if (res === null) {
 				return;
 			}
 
-			parse(msg, link, res, client);
+			parse(msg, preview, res, client);
 		});
 	});
 };
 
-function parse(msg, url, res, client) {
+function parse(msg, preview, res, client) {
-	const preview = {
-		type: "",
-		head: "",
-		body: "",
-		thumb: "",
-		link: url,
-	};
-
 	switch (res.type) {
 	case "text/html":
 		var $ = cheerio.load(res.data);
@@ -130,8 +128,6 @@ function emitPreview(client, msg, preview) {
 		}
 	}
 
-	msg.previews.push(preview);
-
 	client.emit("msg:preview", {
 		id: msg.id,
 		preview: preview

test/plugins/link.js

@@ -34,6 +34,14 @@ describe("Link plugin", function() {
 
 		link(this.irc, this.network.channels[0], message);
 
+		expect(message.previews).to.deep.equal([{
+			body: "",
+			head: "",
+			link: url,
+			thumb: "",
+			type: "loading"
+		}]);
+
 		this.app.get("/basic", function(req, res) {
 			res.send("<title>test title</title><meta name='description' content='simple description'>");
 		});
@@ -44,7 +52,6 @@ describe("Link plugin", function() {
 			expect(data.preview.body).to.equal("simple description");
 			expect(data.preview.link).to.equal(url);
 
-			expect(message.links).to.deep.equal([url]);
 			expect(message.previews).to.deep.equal([data.preview]);
 			done();
 		});
@@ -181,10 +188,19 @@ describe("Link plugin", function() {
 
 		link(this.irc, this.network.channels[0], message);
 
-		expect(message.links).to.deep.equal([
+		expect(message.previews).to.eql([{
-			"http://localhost:9002/one",
+			body: "",
-			"http://localhost:9002/two"
+			head: "",
-		]);
+			link: "http://localhost:9002/one",
+			thumb: "",
+			type: "loading"
+		}, {
+			body: "",
+			head: "",
+			link: "http://localhost:9002/two",
+			thumb: "",
+			type: "loading"
+		}]);
 
 		this.app.get("/one", function(req, res) {
 			res.send("<title>first title</title>");
@@ -199,13 +215,14 @@ describe("Link plugin", function() {
 		this.irc.on("msg:preview", function(data) {
 			if (data.preview.link === "http://localhost:9002/one") {
 				expect(data.preview.head).to.equal("first title");
+				previews[0] = data.preview;
 			} else if (data.preview.link === "http://localhost:9002/two") {
 				expect(data.preview.head).to.equal("second title");
+				previews[1] = data.preview;
 			}
-			previews.push(data.preview);
 
-			if (previews.length === 2) {
+			if (previews[0] && previews[1]) {
-				expect(message.previews).to.deep.equal(previews);
+				expect(message.previews).to.eql(previews);
 				done();
 			}
 		});

test/util.js

@@ -21,7 +21,6 @@ MockClient.prototype.createMessage = function(opts) {
 		text: "dummy message",
 		nick: "test-user",
 		target: "#test-channel",
-		links: [],
 		previews: [],
 	}, opts);