File:EmbedPlugin.js

/**
 * @module Container
 * @namespace springroll
 */
(function(undefined)
{
	// Class include
	var $ = include('jQuery');
	var SavedData = include('springroll.SavedData');

	/**
	 * @class Container
	 */
	var plugin = new springroll.ContainerPlugin();

	plugin.setup = function()
	{
		// EnvironmentPlugin is required!
		this.isProduction = RELEASE;

		// Add the logging service controls for debugging analytic events
		if (DEBUG)
		{
			if (this.loggingService === undefined)
				throw "Embed Plugin requires loggingService";

			// ---> Converted JADE to HTML
			// button#settingsButton.btn.btn-primary.main.disabled(data-toggle-div='#settings', data-placement='bottom', data-toggle='tooltip', title='Logging Service')
			// 	span.icon.icon-gear
			// form#settings.drop-down.form.form-horizontal
			// 	.form-group.form-title
			// 		button#cancelSettings.close(data-toggle-div='#settings')
			// 			| ×
			// 		| Logging Service
			// 	.form-group
			// 		label.col-xs-4.control-label Host or IP
			// 		.col-xs-8: input.pause-on-focus.form-control#remoteHost(type='text', name='remoteHost')
			// 	.form-group
			// 		label.col-xs-4.control-label Channel Name
			// 		.col-xs-8: input.pause-on-focus.form-control#remoteChannel(type='text', name='remoteChannel')
			// 	.form-group.text-center
			// 		.col-xs-8.col-xs-offset-4
			// 			button#remoteConnect.btn.btn-primary.btn-block
			// 				| Connect

			// Inject the HTML to the Embed controls
			$(".controls").append('<button id="settingsButton" data-toggle-div="#settings" data-placement="bottom" data-toggle="tooltip" title="Logging Service" class="btn btn-primary main disabled"><span class="icon icon-gear"></span></button><form id="settings" class="drop-down form form-horizontal"><div class="form-group form-title"><button id="cancelSettings" data-toggle-div="#settings" class="close">&times; </button>Logging Service </div><div class="form-group"><label class="col-xs-4 control-label">Host or IP</label><div class="col-xs-8"><input id="remoteHost" type="text" name="remoteHost" class="pause-on-focus form-control"/></div></div><div class="form-group"><label class="col-xs-4 control-label">Channel Name</label><div class="col-xs-8"><input id="remoteChannel" type="text" name="remoteChannel" class="pause-on-focus form-control"/></div></div><div class="form-group text-center"><div class="col-xs-8 col-xs-offset-4"><button id="remoteConnect" class="btn btn-primary btn-block">Connect </button></div></div></form>');

			// Re-query the drop downs
			this.setupUI();

			/**
			 * The name of the remote cookie for saving the host name
			 * @property {String} REMOTE_HOST_COOKIE
			 * @static
			 * @final
			 * @private
			 */
			var REMOTE_HOST_COOKIE = 'remoteHost';

			// The settings panel for remote logging
			var settings = $("#settings");

			/**
			 * Handler to connect to the remote host for logging progress tracker
			 * @method connectLoggingService
			 */
			this.connectLoggingService = function()
			{
				var host = this.remoteHost.val();
				var channel = this.remoteChannel.val();
				SavedData.write(REMOTE_HOST_COOKIE, host);
				if (host)
				{
					this.loggingService.connect(host);
					settings.removeClass('on');
				}
				if (channel)
				{
					this.loggingService.channel = channel;
				}
			};

			/**
			 *  Button for connecting to the remote host
			 *  @property {jquery} remoteConnect
			 */
			this.remoteConnect = $("#remoteConnect")
				.click(this.connectLoggingService.bind(this));

			/**
			 *  The name of the remote host or ip address
			 *  @property {jquery} remoteHost
			 */
			this.remoteHost = $("#remoteHost")
				.val(SavedData.read(REMOTE_HOST_COOKIE));

			/**
			 *  The name of the remote channel name
			 *  @property {jquery} remoteChannel
			 */
			this.remoteChannel = $("#remoteChannel");

			/**
			 *  The toggle button for the settings
			 *  @property {jquery} remoteButton
			 */
			this.remoteButton = $("#settingsButton");
		}
	};

	if (DEBUG)
	{
		plugin.open = function()
		{
			// Change the channel and connect to logging service
			this.remoteChannel.val(this.release.game.slug);
			this.connectLoggingService();
		};
	}

	plugin.teardown = function()
	{
		if (DEBUG)
		{
			this.remoteConnect.off('click');
			delete this.remoteChannel;
			delete this.remoteHost;
			delete this.remoteConnect;
			delete this.remoteButton;
			delete this.connectLoggingService;
		}
	};

}());