//	Weather app
//	===============================================
//	Takes in data obj, an element to append to, and utility functions
//
//	Data set:
//	- status  bool
//	- type    string
//	- range   string
//	- action  bool
//
//	Example data:
//	{
//		"status" : true,
//		"type" : "Ra",
//		"range" : "-7",
//		"action" : false
//	}
//
var weather = (function(){
	'use strict'

	var template = getTemplate();

	return newWeather;

	function newWeather(d, t, fns){ return new Weather(d, t, fns); }

	function Weather(d, t, fns){
		var e = getElementFromString(template, { 'name':  fns.getAppName('weather') }),
			opt = e.querySelector('.weatherOptions'),
			map = null,
			ele = new Elements(e, {
				'type' : { 'target' : new Dropdown(e.querySelector('.wtSet'), getType(), updateType) },
				'range' : { 'target' : new Dropdown(e.querySelector('.wrSet'), getRange(), updateRange) },
				'action' : { 'target' : new Dropdown(e.querySelector('.waSet'), getAction(), updateAction) },
				'status' : { 'target' :  new ToggleInput(e.querySelector('.weatherToggle'), updateStatus, { 'initialValue' : d.status === true }) },
				'remove' : { 'target' : new ConfirmationButton(e.querySelector('.remove'), {
					'text' : 'Remove app',
					'noClass' : true,
					'confirmText' : 'Confirm?'
				}, removeAction) },
			}),
			isSet = false;

		this.exit = exit;
		this.set = set;

		t.appendChild(e);

		function hide(){ opt.classList.add('noDisplay'); }
		function show(){ opt.classList.remove('noDisplay'); if(isSet) setMap(); }
		function set(){ if(d.status) setMap(); isSet = true; }

		function updateStatus(e){ if(e) show(); else hide(); d.status = e; }
		function updateType(e){ d.type = e; if(map) map.update(e, d.range); }
		function updateRange(e){ d.range = e; if(map) map.update(d.type, e)}
		function updateAction(e){ d.action = e; }

		function removeAction(e){ fns.removeApp('weather'); }

		function setMap(){ if(!map){ map = new WeatherMap(e.querySelector('#weatherMap')); if(isDefined(d.type)) map.update(d.type); } }

		function getType(){
			return new DropdownObj([
				{ 'title' : 'Select weather type', 'value' : '', 'placeholder' : true },
				{ 'title' : 'high temperature', 'value': 'HT'},
				{ 'title' : 'low temperature ', 'value': 'LT'},
				{ 'title' : 'freezing', 'value': 'Fr'},
				{ 'title' : '< 20 degrees', 'value': '20'},
				{ 'title' : 'rain', 'value': 'Ra'},
				{ 'title' : 'snow', 'value': 'Sn'},
				{ 'title' : 'hail', 'value': 'Ha'},
				{ 'title' : 'heavy rain', 'value': 'HR'},
				{ 'title' : 'heavy snow', 'value': 'HS'},
				{ 'title' : 'heavy hail', 'value': 'HH'},
				{ 'title' : 'high winds', 'value': 'HW'},
				{ 'title' : 'wildfire', 'value': 'WF'},
				{ 'title' : 'tornado', 'value': 'To'},
				{ 'title' : 'hurricane', 'value': 'Hu'},
				{ 'title' : 'dust', 'value': 'Du'},
				{ 'title' : 'foggy', 'value': 'Fo'},
				{ 'title' : 'normal weather', 'value': 'NW'},
				{ 'title' : 'other weather', 'value': 'OW'}
			], d.type);
		}

		function getRange(){
			return new DropdownObj([
				{ 'title' : 'Select range', 'value' : '', 'placeholder' : true },
				{ 'title' : 'Current', 'value' : '0' },
				{ 'title' : 'last 7 days', 'value' : '-7' },
				{ 'title' : 'next 7 days', 'value' : '+7' },
				{ 'title' : 'last and next 7 days', 'value' : '+-7' }
			], d.range);
		}

		function getAction(){
			return new DropdownObj([
				{ 'title' : 'Select action', 'value' : '', 'placeholder' : true },
				{ 'title' : 'do target', 'value' : true },
				{ 'title' : 'do not target', 'value' : false }
			], d.action);
		}

		function exit(){
			if(!!e) removeChild(t, e);
			if(!!ele) ele.exit();
			e = opt = ele = map = null;
		}
	}

	function getTemplate(){
		var h = '<h3 class="medium">{{ name }}:</h3>',
			t = '<div class="weatherToggle"></div>',
			rem = '<div class="remove"></div>',
			map = '<div class="map" id="weatherMap"></div><br>',
			span1 = '<span>If the following weather type is</span>',
			wtset = '<div class="wtSet"></div>',
			span2 = '<span>in the</span>',
			wrset = '<div class="wrSet"></div>',
			waset = '<div class="waSet"></div>',
			opt = '<div class="weatherOptions noDisplay">' + map + span1 + wtset + span2 + wrset + waset + '</div>';
		return '<row class="weather">' + h + t + rem + opt + '</row>';
	}
})();