//	Data targeting app
//	===============================================
//	Takes in data obj and an element to append to.
//
//	Data set:
//  - status           bool
//	- brandSafetyLevel uint8
//	- aboveTheFold     uint8
//	- noticability     uint8
//
//	Example data:
//	{
//      "status": true,
//		"brandSafetyLevel" : 0,
//		"aboveTheFold" : 3,
//		"noticeability" : 1
//	}
//
var dataTargeting = (function(){
	'use strict'

	var template = getTemplate();

	return newDataTargeting;

	function newDataTargeting(d, t, fns){ return new DataTargeting(d, t, fns); }

	function DataTargeting(d, t, fns){
		var isSelected = !!(d.brandSafetyLevel || d.aboveTheFold || d.noticeability),
			e = getElementFromString(template, { 'name' : fns.getAppName('dataTargeting') }),
			ctrls = e.querySelector('.view'),
			eles = new Elements(e, {
				'status': { 'target' : new ToggleInput(e.querySelector('.toggle'), updateStatus, { 'initialValue' : isSelected }) },
				'safety' : { 'target' : new Dropdown(e.querySelector('.safety'), getBrandSafetyLevel(), updateBrandSafety) },
				'aboveTheFold' : { 'target' : new Dropdown(e.querySelector('.aboveTheFold'), getAboveTheFold(), updateAboveTheFold) },
				'noticeability' : { 'target' : new Dropdown(e.querySelector('.noticeability'), getNoticeability(), updateNoticeability) },
				"remove" : { 'target' : new ConfirmationButton(e.querySelector('.remove'), {
					'text' : 'Remove app',
					'noClass' : true,
					'confirmText' : 'Confirm?'
				}, removeAction) },
			});

		this.exit = exit;

		t.appendChild(e);

		function updateStatus(e) {
			if(e) {
				ctrls.classList.remove('noDisplay');
				d.status = true;
			} else {
				ctrls.classList.add('noDisplay');
				d.brandSafetyLevel = d.aboveTheFold = d.noticeability = null;
				d.status = false;
			}
		}
		function updateBrandSafety(e){ d.brandSafetyLevel = e; }
		function updateAboveTheFold(e){ d.aboveTheFold = e; }
		function updateNoticeability(e){ d.noticeability = e; }
		function removeAction(e){ fns.removeApp('dataTargeting'); }

		function getBrandSafetyLevel(){ return new DropdownObj(getSafetyList(), d.brandSafetyLevel, null, null, null); }
		function getAboveTheFold(){ return new DropdownObj(getLikelyList(), d.aboveTheFold, null, null, null); }
		function getNoticeability(){ return new DropdownObj(getLikelyList(), d.noticeability, null, null, null); }

		function getLikelyList(){
			return [
				{ 'title' : 'None', 'value' : 0 },
				{ 'title' : 'Not likely', 'value' : 1 },
				{ 'title' : 'Likely', 'value' : 2 },
				{ 'title' : 'Very Likely', 'value' : 3 }
			];
		}

		function getSafetyList(){
			return [
				{ 'title' : 'None', 'value' : 0 },
				{ 'title' : 'Low Safety', 'value' : 1 },
				{ 'title' : 'Medium Safety', 'value' : 2 },
				{ 'title' : 'High Safety', 'value' : 3 },
				{ 'title' : 'Very High Safety', 'value' : 4 }
			];
		}

		function exit(){
			if(!!e) removeChild(t, e);
			if(!!eles) eles.exit();
			housekeeping();
		}
		function housekeeping(){ e = eles = null; }
	};

	function getTemplate(){
		var bs = '<row><h3>Brand safety:</h3><div class="safety"></div></row>',
			atf = '<row><h3>Above the fold:</h3><div class="aboveTheFold"></div></row>',
			noticemesenpai = '<row><h3>Noticeability:</h3><div class="noticeability"></div></row>',
			h = '<h3 class="medium">{{ name }}:</h3>',
			tgl = '<div class="toggle"></div>',
			rem = '<div class="remove"></div>',
			ext = '<div class="view">' + bs + atf + noticemesenpai + '</div>';
		return '<row class="dataTargeting">' + h + tgl + rem + ext + '</row>';
	}
})();