var Pixels = function(core, target, data, returnCB) {
	'use strict';

	var events = new EventManager(),
		template = new Template(),
		element = null,
		elements = null,
		inboundData = null,
		data = null,
		timeframe = 7,
		apiObj = {
			'advStats': {
				'source': 'actionStats/period/advertisers/' + core.userID + '/-/-/' + timeframe,
				'noID': true
			},
			'advStatsToday': {
				'source': 'actionStats/period/advertisers/' + core.userID + '/-/-/0',
				'noID': true
			},
		},
		apiManager = new ApiManager(apiObj, core.userID, init);

	this.exit = exit;

	function getDataTimeframe() {
		return {
			"data": [{
					"title": "Last 7 days",
					"value": 7
				},
				{
					"title": "Last 15 days",
					"value": 15
				},
				{
					"title": "Last 30 days",
					"value": 30
				}
			],
			"options": {
				"dropdownClass": "cool",
				"menuItemClass": "cool",
				"carrotClass": "cool"
			}
		}
	}

	function getDataAlerts() {
		return {
			"title": "Uh Oh! Your pixels have never loaded.",
			"message": "In order for us to properly track, retarget, and optimize your advertising campaigns, we need our pixels to be placed on your website. Please download and follow our instructions:",
			"highlight": "we need our pixels to be placed on your website."
		}
	}

	function getDataInfo(d) {
		return [{
				"title": "Loads",
				"value": fmtNum(d.views, 1)
			},
			{
				"title": "Avg. daily loads",
				"value": fmtNum(d.views / timeframe, 1)
			}
		]
	}

	function Data(d) {
		this.timeframe = getDataTimeframe();
		this.alert = getDataAlerts();
		this.info = getDataInfo(d.advStats || {
			views: 0
		});

		this.dailyUsers = (d.advStatsToday && d.advStatsToday.views) ? d.advStatsToday.views : 'None Yet';
		// this.lastPixelHit = isString(d.pixelStats.lastPixelHit) ? d.pixelStats.lastPixelHit : 'None Yet';
		// this.lastConversion = isString(d.pixelStats.latestPixelConversion) ? d.pixelStats.latestPixelConversion : 'None Yet';

		this.requiredPixel = getRequiredPixel(core.brand, core.userID);
		this.conversionPixel = getConversionPixel();
		this.advancedProductsPixel = getAdvancedProductsPixel();
	}

	function Template() {
		var header = '<header><h2>Manage Pixels</h2></header>';

		var alertTitle = '<h3>{{ title }}</h3>',
			alertMessage = '<p>{{ message }}</p><div class="buttonContainer"><a href="#" class="button {{ buttonColor }}">Turn it off now.</a><a href="#" class="button grey">It\'s ok</a></div>';

		var requiredPixel = '<row><p><span class="hot">Required Pixel:</span><strong>Place this code within your &lt;head&gt; tags on all pages:</strong></p><textarea>{{ requiredPixel }}</textarea></row>',
			conversionPixel = '<row><p><span class="hot">Conversion Pixel:</span>Place this code on your conversion pages:</p><textarea>{{ conversionPixel }}</textarea></row>',
			advanced = '<row class="advanced"><p><span class="hot">Advanced:</span>Place these codes within the &lt;body&gt; tags on pages of your choice:</p><a href="#" class="engagingProducts">Click here to track the products a user is engaging with...</a><textarea class="noDisplay engagingProductsTA">{{ advancedProductsPixel }}</textarea></row>',
			container = '<container>' + requiredPixel + conversionPixel + advanced + '</container>';

		var info = '<info>{{# info }}<p><b>{{ title }}:</b><label class="fresh">{{ value }}</label></p>{{/ info }}</info>',
			sidePanel = '<side-panel><div class="timeframe"><p><b>Timeframe:</b></p></div>' + info +
			// '<p><b>Regular pixel valid as of:</b><label class="mint wide">{{ lastPixelHit }}</label></p>' +
			// '<p><b>Conversion pixel valid as of:</b><label class="mint wide">{{ lastConversion }}</label></p>' +
			'<p><b>Users segmented today:</b><label class="mint wide">{{ dailyUsers }}</label></p>' +
			'</side-panel>';


		this.index = '<div class="pixels">' + header + '<div class="alerts"></div><section>' + container + sidePanel + '</section></div>';
		this.sidePanel = sidePanel;
		this.info = info;
		this.alert = alertTitle + alertMessage;
	}

	function init(error, d) {
		d = cleanRTBObject(core.userID, d);
		inboundData = d;
		data = new Data(d)

		setElement(data);
		setElements(data);
		returnCB();
		insertElement();
		ga('send', 'event', 'Pixels', 'View');
	}

	function setElement(d) {
		element = getElementFromString(render(template.index, d));
	}

	function setAlert(d) {
		if (d.alert) core.alerts.alert(element.querySelector('.alerts'), template.alert, 'danger', d.alert);
	}

	function setElements(d) {
		var timeframeObj = d.timeframe;
		elements = new Elements(element, {
			'engagingProducts': {
				'target': new ToggleItem(element.querySelector('.engagingProducts'), element.querySelector('.engagingProductsTA'))
			},
			'timeframe': {
				'target': new Dropdown(element.querySelector('.timeframe'), timeframeObj, updateTimeframe)
			},
			'sidePanel': {
				'selector': 'side-panel'
			},
			'info': {
				'selector': 'info'
			}
		});
	}

	function insertElement() {
		target.appendChild(element);
	}

	function ToggleItem(element, textarea) {
		var state = false;
		events.add(element, 'click', toggle);

		function toggle(e) {
			if (e && e.preventDefault) e.preventDefault();
			if (!state) open();
			else close();
		}

		function open() {
			state = true;
			textarea.classList.remove('noDisplay');
		}

		function close() {
			state = false;
			textarea.classList.add('noDisplay');
		}
	}

	function updateTimeframe(d) {
		core.notifications.setLoading();
		elements.info.classList.add('loading');
		apiObj = {
			'advStats': {
				'source': 'actionStats/period/advertisers/' + core.userID + '/-/-/' + d,
				'noID': true
			}
		};
		apiManager = new ApiManager(apiObj, core.userID, updateLoads);
	}

	function updateLoads(error, d) {
		core.notifications.setSuccess('w00t!');
		data.info = getDataInfo(d.advStats || {
			views: 0
		});
		var newInfo = getElementFromString(render(template.info, data));
		elements.sidePanel.insertBefore(newInfo, elements.info)
		elements.sidePanel.removeChild(elements.info)
		elements.info = newInfo;
	}

	function exit() {
		if (element) target.removeChild(element);
		if (events) events.reset();
		if (elements) elements.exit();
		housekeeping();
	}

	function housekeeping() {
		core = target = data = returnCB = events = template = element = elements = inboundData = null;
	}
};