Highlight the Stock Tickers in Candy chat

highlight-stock-ticker.js

"use strict";

var CandyShop = (
	function (self) {
		return self;
	}(CandyShop || {})
);

CandyShop.HighlightStockTicker = (function (self, Candy, $) {

	self.tickerServices = {
		google: 'https://www.google.com/finance?q=',
		yahoo: 'http://finance.yahoo.com/q?s='
	};

	self.activeService = 'google';

	self.matchesFound = false;

	self.init = function () {
		/*
		 * Replace the default markup for message. We need a class for message only container to grab the text from it.
		 */
		Candy.View.Template.Message.item = '<li><small>{{time}}</small><div>' +
			'<a class="label" href="#" class="name">{{displayName}}</a>' +
			'<span class="spacer">▸</span><span class="message">{{{message}}}</span></div></li>';


		/*
		 * https://candy-chat.github.io/candy/docs/files/view/pane-js.html#candy:view.message.after-show
		 * Parameters which receive the afterShow()
		 *
		 * (String) roomJid	Room JID
		 * (jQuery.Element) element	User element
		 * (String) name	Name of the sending user
		 * (String) message	Message text
		 */
		$(Candy).on('candy:view.message.after-show', self.afterShow);
	};

	self.createLink = function (ticker, text) {
		return '<a href="' + self.tickerServices[self.activeService] + ticker + '" class="stock-ticker" target="_blank">' + text + '</a>';
	};

	self.tickerify = function (text) {

		/*
		 * JavaScript doesn't support lookbehinds
		 * so we use another capture (^|\\s|-)
		 * to detect the start of line or some whitespaces characters (space, linebreak, tab)
		 * before the ticker
		 */
		/*
		 * Patterns: $XYZ, $xyz
		 */
		var tickerReg = new RegExp ("(^|\\s|-)(\\$([A-Za-z]{1,5}))\\b", 'gm');

		var result = text.replace(
			tickerReg,
			function (match, spaces, tickerNameWithDollar, tickerName) {
				self.matchesFound = true;
				console.log ('we found something!');

				/*
				 * If replace function above find something our function receive 4 arguments
				 *
				 * 1) match - full ticker with whitespaces charackers before it from first capture
				 *
				 * 2) spaces - the content of the first capture in tickerReg
				 * (^|\\s|-)
				 *
				 * 3) tickerNameWithDollar — the content of the second capture
				 * (\\$([A-Za-z]{1,5}))
				 *
				 * 4) tickerName — the content of the third capture
				 * ([A-Za-z]{1,5})
				 *
				 */
				return match.replace(
					tickerNameWithDollar,

					// If replace function find a ticker place the link around it.
					self.createLink(tickerName, tickerNameWithDollar)
				);
			}
		);

		/*
		 * Patterns: XYZ
		 */
		tickerReg = new RegExp ("(^|\\s|-)([A-Z]{1,5})\\b", 'gm');
		result = result.replace (
			tickerReg,
			function (match, spaces, tickerName) {
				self.matchesFound = true;

				return match.replace(
					tickerName,

					// If replace function find a ticker place the link around it.
					self.createLink(tickerName, tickerName)
				);
			}
		);


		return result;
	};

	/*
	 * The main function in this plugin.
	 * Triggered each time after the message successfully placed in DOM by Candy.
	 * After it we add links to stock tickers inside the message.
	 */
	self.afterShow = function (e, args) {

		setTimeout(
			function (e, args) {
				// tickerify() function get multiline content	and return content with links to stock tickers
				var result = self.tickerify(

					// Replace all <br> tags to new lines characters and pass multiline text without <br> tags to tickerify() function
					args.element.find('.message').html().replace(new RegExp('<br>', 'g'), '\r\n')
				);

				// Tickerify method find tickers in the message, replace original message with message with links
				if (self.matchesFound) {

					// Turn off the flag for next messages
					self.matchesFound = false;

					// Convert newlines characters to <br>
					result = result.replace (new RegExp('\\r\\n', 'g'), '<br>');

					//console.log (result);
					// Put new message in container
					args.element.find('.message').html(result);
				}
			},
			30000,
			e,
			args
		);


	};

	return self;
}(CandyShop.HighlightStockTicker || {}, Candy, jQuery));