var UploadNativeAds = function(core, target, data, returnCB){
	var events = new EventManager(),
		template = new Template(),
		data = null,
		dataObj = new DataObj(),
		element = getElementFromString(render(template.index, dataObj)),
		elements = null,
		inboundData = null,
		currentSet = null;

	new ApiManager({ 'adGroupsList' : null }, core.userID, init);

	this.exit = exit;

	function DataObj(){ this.sidePanel = null; this.saveState = false; }
	function Image(data, rects, name, fileSize){ this.data = data; this.rects = rects; this.name = name; this.fileSize = fileSize; }

	function init(error, d){
		inboundData = d;
		data = getDataObj(d);
		elements = new Elements(element, {
			'section' : { 'selector' : 'section' },
			'footer' : {},
			'sidePanel' : { 'selector' : 'side-panel' },
			'hiddenInput' : { 'target' : getHiddenInput() },
			'uploadImage' : { 'selector' : '.uploadImage' },
			'result' : { 'selector' : '.result' },
			'resultImage' : {},
			'titleText' : { 'selector' : '.titleText' },
			'captionText' : { 'selector' : '.captionText' },
			'landingPageURL' : { 'selector' : '.landingPageURL' },
			'trackers' : { 'selector' : '.trackers + div' },
			'impTrack' : { 'selector' : '.impTrack' },
			'clickTrack' : { 'selector' : '.clickTrack' },
			'adGroups' : {},
			'save' : {},
			'addAnother' : {}
		});
		elements.resultImage = elements.result.querySelector('img');

		currentSet = new AdSet({
			'landingURL' : null,
			'adGroup' : null,
			'titleText' : null,
			'captionText' : null,
			'impTrack': null,
			'clickTrack': null,
		}, elements.hiddenInput, elements.result, {'impTrack': true, 'clickTrack': true});

		initAdGroups();
		initUpload();

		events.add(elements.titleText, 'change', updateTitle);
		events.add(elements.captionText, 'change', updateCaption);
		events.add(elements.landingPageURL, 'change', updateLandingPageURL);

		events.add(elements.impTrack, 'change', getInputSetter(currentSet, 'impTrack', trackerCheck));
		events.add(elements.clickTrack, 'change', getInputSetter(currentSet, 'clickTrack', trackerCheck));

		elements.trackersToggle = new ToggleInput(element.querySelector('.trackers'), toggleTrackers, { 'initialValue': false });

		returnCB();
		insertElement();
		returnCB = null;

		function toggleTrackers(e) {
			if(e) return elements.trackers.classList.remove('noDisplay');
			elements.trackers.classList.add('noDisplay');
			currentSet.impTrack = null;
			currentSet.clickTrack = null;
		}
	}

	function initAdGroups(){ elements.adGroups = new Dropdown(element.querySelector('.adGroup'), data.adGroups, updateAdGroup); }
	function initUpload(){ events.add(elements.uploadImage, 'click', openFileInput); events.add(elements.hiddenInput, 'change', checkFileInput); }
	function initSaveButton(){ elements.save = element.querySelector('.saveButton'); events.add(elements.save, 'click', saveAction, 'footer'); }
	function initAddAnother(){ elements.addAnother = element.querySelector('.addAnother'); events.add(elements.addAnother, 'click', addAnotherAction, 'footer'); }

	function getDataObj(o){
		return {
			"adGroups" :{
				"data" : getAdGroups(getAdGroupData(o.adGroupsList)),
				"options" : {
					"dropdownClass" : "cool", "menuItemClass" : "cool", "carrotClass" : "cool"
				}
			},
			"adGroupsList" : getAdGroupsList(o.adGroupsList)
		}
	}
	function getAdGroups(d){ var a = [{ "title" : "Change Ad Group", "value" : "", "placeholder" : true }]; forEach(d, p); return a; function p(t){ a.push({ 'title' : t.name, 'value' : t.name });  } }
	function getAdGroupsList(list){
		var a = [];
		forEach(list, p);
		return a;
		function p(t, d, i){ a.push(new AdGroup(t)); }
	}
	function getAdGroupData(list){
		var a = [];
		forEach(list, p);
		return a;
		function p(t, d, i){ a.push(t.data); }
	}
	function getIDFromName(adGroup){
		var match = null;
		forEach(data.adGroupsList, p);
		return match;
		function p(t, d, i){ if(t.name == adGroup){ match = t.id; return true; } }
	}

	function AdGroup(t){
		this.name = t.data.name;
		this.id = t.id;
	}

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

	function saveAction(){
		if(currentSet.isValid() && validateTrackers()) new AdSave(core, dataObj.sidePanel.ads, 'native', core.userID, saveCB);
		else core.notifications.setError("Please populate all the required fields before saving.");
	}

	function validateTrackers() {
		var it = currentSet.getValue('impTrack'),
			ct = currentSet.getValue('clickTrack');
		if(!!it && it.length > 0 && it.indexOf('https://') !== 0) return false;
		if(!!ct && ct.length > 0 && ct.indexOf('https://') !== 0) return false;
		return true;
	}

	function saveCB(){ pop('Pop!', 'Dashboard - Ads', '/dashboard/ads'); }

	function addAnotherAction(e){
		preventDefault(e);
		if(currentSet.isValid()){
			updateSaveState(false);
			new AdSave(core, dataObj.sidePanel.ads, 'native', core.userID, addAnotherCB);
		}
		else core.notifications.setError("Please populate all the required fields before saving.");

	}
	function addAnotherCB(){
		core.notifications.setSuccess("Saved!");
		elements.titleText.value = '';
		elements.captionText.value = '';
		elements.landingPageURL.value = '';
		clearFileInput();

		currentSet.resetAds();
		currentSet.setValue('titleText', null);
		currentSet.setValue('captionText', null);
		currentSet.setValue('landingURL', null);

		setUploadToDefault();
		updateAds(currentSet.getAds());
	}

	function getHiddenInput(){ var t = document.createElement('input'); t.type = 'file'; return t; }
	function getImage(d, i){ var f = elements.hiddenInput.files[i]; return new Image(d.result, getImageRects(resultImage), f.name, getKilobytesFromBytes(f.size) + 'K') }
	function getImageRects(t){ var o = t.getClientRects()[0];  return { 'width' : o.width, 'height' : o.height }; }

	function SetAdImages(d){
		var l = d.length,
			c = 0,
			r = elements.result,
			ri = elements.resultImage;

		setUploadToValid();
		next();

		function Set(d, i){
			currentSet.resetAds();
			ri.src = d.result; setTimeout(setCurrent, 10);
			function setCurrent(){
				r.classList.remove('noDisplay');
				currentSet.setCurrentImage(d, i);
				r.classList.add('noDisplay');
				next();
				updateAds(currentSet.getAds());
			}
		}

		function next(){ if(c < l) new Set(d[c], c++); else complete(); }
		function complete(){ elements.uploadImage.textContent = 'file selected'; }
	}
	function setUploadToValid(){ var u = elements.uploadImage; u.classList.add('mist'); u.classList.remove('cool'); }
	function setUploadToDefault(){ var u = elements.uploadImage; u.classList.remove('mist'); u.classList.add('cool'); u.textContent = 'Select file'; }

	function updateAdGroup(e){ currentSet.setValue('adGroup', getIDFromName(e)); }
	function updateTitle(e){
		if(titleCheck(e.target.value)){
			currentSet.setValue('titleText', e.target.value);
			updateAds(currentSet.getAds());
		}
	}
	function updateCaption(e){
		if(captionCheck(e.target.value)){
			currentSet.setValue('captionText', e.target.value);
			updateAds(currentSet.getAds());
		}
	}
	function updateLandingPageURL(e){ if(landingPageCheck(e.target.value)) currentSet.setValue('landingURL', e.target.value); }

	function titleCheck(s){
		if(s.length == 0){
			elements.titleText.classList.add('alert')
			core.notifications.setError("Please ensure your title is populated.");
			return false;
		} else if (s.length > 25){
			elements.titleText.classList.add('alert')
			core.notifications.setError("Please ensure your title is 25 characters or less.");
			return false;
		}
		else elements.titleText.classList.remove('alert')
		return true;
	}

	function captionCheck(s){
		if(s.length ==  0){
			elements.captionText.classList.add('alert')
			core.notifications.setError("Please ensure your caption is populated.");
			return false;
		} else if(s.length > 150){
			elements.captionText.classList.add('alert')
			core.notifications.setError("Please ensure your caption is 150 characters or less.");
			return false;
		}
		else elements.captionText.classList.remove('alert')
		return true;
	}

	function trackerCheck(url) {
		if(typeof url !== 'string' || url.length > 0 && url.toLowerCase().indexOf('https://') !== 0) {
			core.notifications.setError("Please use an HTTPS url for the tracker.");
		}
		return url;
	}

	function landingPageCheck(s){
		if(!isValidURL(s)){
			elements.landingPageURL.classList.add('alert')
			core.notifications.setError("Please ensure you have entered a valid URL.");
			return false;
		}
		else elements.landingPageURL.classList.remove('alert')
		return true;
	}

	function updateAds(ads){
		if(!dataObj.sidePanel) dataObj.sidePanel = { 'ads' : [] };
		updateSaveState(!!ads[0]);
		if(ads[0]) ads[0].setIndex(0);
		dataObj.sidePanel.ads = ads;
		refreshSidePanel();
	}
	function updateSaveState(state){
		dataObj.saveState = state;
		if(state) addFooter();
		else removeFooter();
	}

	function openFileInput(e){ if(e && e.preventDefault) e.preventDefault(); elements.hiddenInput.click(); }
	function checkFileInput(){ new FileToImageData(elements.hiddenInput, returnFileInputData); }
	function clearFileInput(){ elements.hiddenInput.value = null; }
	function returnFileInputData(a){ var v = getValidImages(a); if(v.length > 0){ new SetAdImages(v); } }

	function getValidImages(a){
		var v = [],
			tooLarge = false;
		for(var i=0, l=a.length; i<l; i++){ if(a[i].e.total < 1000000){ v.push(a[i]); } else { tooLarge = true; } }

		if(tooLarge == true){
			core.notifications.setError('One or more images were not added due to being too large in filesize. Please use an image which is less than 1 megabyte.');
		}

		return v;
	}

	function refreshSidePanel(){
		if(dataObj.sidePanel.ads.length > 0){
			var e = getElementFromString(render(template.sidePanel, dataObj)),
				s = elements.section;
			s.insertBefore(e, elements.sidePanel);
		} else {
			var e = null,
				s = elements.section;
		}

		if(!!elements.sidePanel) removeChild(s, elements.sidePanel);
		elements.sidePanel = e;
	}

	function addFooter(){
		if(!elements.footer){
			var e = getElementFromString(render(template.footer, dataObj));
			element.appendChild(e)
			elements.footer = e;
			initSaveButton();
			initAddAnother();
		}
	}

	function removeFooter(){
		if(elements.footer){
			element.removeChild(elements.footer);
			elements.footer = null;
			elements.saveButton = null;
			elements.addAnother = null;
			events.removeByTag('footer');
		}
	}

	function exit(){ if(element) removeChild(target, element); if(events) events.reset(); if(elements) elements.exit(); housekeeping(); }
	function housekeeping(){ core = target = data = returnCB = events = template = dataObj = element = elements = inboundData = data = currentSet = null; }

	function Template(){
		var header = '<header><h2>Banner Ads - Native</h2></header>',
			footer = '{{# saveState }}<footer><a class="button mint saveButton">Save</a><a class="addAnother" href="#">Save and add another</a></footer>{{/ saveState }}';
		var upload = '<row class="upload"><h3>Add banners:</h3><a href="#" class="uploadImage button mint auto">Select file</a></row>',
			adGroup = '<row class="adGroup"><h3>Ad group:</h3></row>',
			titleText = '<row><h3>Title text:</h3><input type="text" placeholder="25 characters max" class="titleText wide" /></row>',
			captionText = '<row><h3>Caption text:</h3><textarea placeholder="150 characters max" class="captionText wide"></textarea></row>',
			landingPageURL = '<row><h3>Landing page url:</h3><input type="text" placeholder="http://www.mySite.com" class="landingPageURL wide" /></row>',
			result = '<row class="result noDisplay"><h3>Result:</h3><img /></row>';

		var container = '<container>' + upload + adGroup + titleText + captionText + landingPageURL + advancedAdsTemplate() + result + '</container>';

		var ad = '<ad><p>{{ titleText }}{{^ titleText }}Title text{{/ titleText }}</p><img src="{{ image.data }}" /><p>{{ captionText }}{{^ captionText }}Caption text{{/ captionText }}</p></ad>',
			sidePanel = '{{# sidePanel }}<side-panel class="previewAds"><section><h2>Preview Ad:</h2><ads class="nativeAds">{{# ads }}' + ad + '{{/ ads }}</ads></section></side-panel>{{/ sidePanel }}';

		this.index = '<div class="createPage">' + header + '<div></div><section>' + container + sidePanel + '</section>' + footer + '</div>';
		this.sidePanel = sidePanel;
		this.footer = footer;
	}

};