//	Tradeshow app
//	===============================================
//	Takes in data obj, an element to append to, and utility functions
//
//	Data is a array of admin inputted tradeshows.
//
var tradeShow = (function(){
	'use strict'

	var template = getTemplate();

	return newTradeShow;

	function newTradeShow(d, t, fns){ return new TradeShow(d, t, fns); }

	function TradeShow(d, t, fns){
		var sysAppsList = fns.data['system/apps/list'] || {},
			showList = sysAppsList.tradeShow || [],
			e = getElementFromString(template, {name: fns.getAppName('tradeShow'), shows: showList }),
			eV = e.querySelector('div.view'),
			eles = new Elements(e, {
				'remove' : { 'target' : new ConfirmationButton(e.querySelector(".remove"), {
					'text' : 'Remove app',
					'noClass' : true,
					'confirmText' : 'Confirm?'
				}, removeAction) },
				'status': { 'target' : new ToggleInput(e.querySelector('.toggle'), updateStatus, { 'initialValue' : d.status}) },
				'shows' : {
					"target" : new MultiSelect(eV.querySelector('div:last-child'), updateShows, { "selected" : getSelected() })
				}
			});

		this.exit = exit;

		t.appendChild(e);

		function updateStatus(e) {
			d.status = e;
			if(d.status) {
				eV.classList.remove('noDisplay');
			} else {
				eV.classList.add('noDisplay');
				delete d['locations'];
			}
		}

		function updateShows(_, ms){
			var o = [];
			loop(ms.getSelected(), function(_, v) {
				var row = showList[v.index];
				if(!!row) o.push({name: row.name, lat: row.coords.lat, lng: row.coords.lng});
			});
			d.radius = 1;
			d.period = 7;
			d.locations = [{coords: o}];
		}

		function getSelected() { return (isArray(d.locations) && !!d.locations[0].coords) ? d.locations[0].coords.map(function(v) { return v.name; }) : [];}
		function removeAction(e){ fns.removeApp('tradeShow'); }
		function exit(){
			if(!!e) removeChild(t, e);
			if(!!eles) eles.exit();
			e = eles = null;
		}
	}

	function getTemplate(){
		var title = '<p>Select trade shows to target (We will target all visitors to the trade show location):</p>',
			ms = '<div><select name="shows">{{#shows}}<option value="{{name}}">{{name}} - {{from}}-{{to}}</option>{{/shows}}</select></div>';
		return '<row class="tradeShow"><h3 class="medium">{{ name }}:</h3><div class="toggle"></div><div class="remove"></div><div class="view">' + title + ms + '</div></row>';
	}
})();