var UploadThirdPartyAds = (function(){
	'use strict';

	var toggleOpts = {
			'data': [
				{"value": "Ad Tag"},
				{"value": "Media URL"},
			],
			'className': 'toggle',
			'initialValue': 'Ad Tag'
		},
		toggleExtendedOpts = {
			'data': [
				{"value": "Ad Tag"},
				{"value": "Media URL"},
				{"value": "HTML Bundle"}
			],
			'className': 'toggle',
			'initialValue': 'Ad Tag'
		},
		tmpl = new Template();


	return newThirdPartyAds;

	function newThirdPartyAds(core, target, data, returnCB) {
		return new ThirdPartyAds(core, target, data, returnCB);
	}


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

		new ApiManager({
			'adGroupsList' : null,
			'htmlAds' : {
				"source" : "canPostAdType/htmlAd",
			}
		}, core.userID, init);

		this.exit = exit;

		function init(error, d){
			inboundData = d;
			data = getDataObj(d);

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

			initAdGroups();
			initFileUpload();
			initOptions();
			initSaveButton();

			events.add(elements.width, 'change', function(e) {
				currentSet.width = Math.round(e.target.value);
				updatePreview();
			});

			events.add(elements.height, 'change', function(e) {
				currentSet.height = Math.round(e.target.value);
				updatePreview();
			});

			events.add(elements.mediaURL, 'change', function(e) {
				e = e.target;
				if(urlCheck(e)) {
					currentSet.mediaURL = e.value;
					currentSet.thirdPartyCode = '';
					updatePreview();
				}
			});

			events.add(elements.mediaTestUrl, 'change', function(e) {
				e = e.target;
				if(urlCheck(e)) {
					currentSet.mediaTestUrl = e.value;
					currentSet.thirdPartyCode = '';
					updatePreview();
				}
			});

			events.add(elements.adTag, 'change', function(e) {
				currentSet.thirdPartyCode = cleanupQuotes(e.target.value);
				currentSet.mediaURL = currentSet.mediaTestUrl = '';
				updatePreview();
			});

			events.add(elements.landingPageURL, 'change', function(e) {
				e = e.target;
				if(urlCheck(e)) {
					currentSet.landingURL = e.value;
				}
			});

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

			returnCB();
			target.appendChild(element);
			returnCB = null;
		}

		function toggleTrackers(e) {
			if(e) {
				elements.trackers.classList.remove('noDisplay');
				return;
			}

			elements.trackers.classList.add('noDisplay')
			currentSet.impTrack = null;
			currentSet.clickTrack = null;
		}

		function trackerCheck(url, e) {
			if(typeof url === 'string' && url.toLowerCase().indexOf('https://') === 0 || url.length === 0) {
				return url;
			}

			core.notifications.setError("Please use an HTTPS url for the tracker.");
		}

		function getDataObj(o){
			return {
				"adGroups": {
					"data" : getAdGroups(getAdGroupData(o.adGroupsList)),
					"options" : {
						"dropdownClass" : "cool", "menuItemClass" : "cool", "carrotClass" : "cool"
					}
				},
				"adGroupsList" : getAdGroupsList(o.adGroupsList),
				"htmlBundle" : !!o.htmlAds ? o.htmlAds.data : false
			}
		}

		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 initAdGroups() {
			elements.adGroups = new Dropdown(element.querySelector('.adGroup'), data.adGroups, function(e) {
				currentSet.group = getIDFromName(e);
			});
		}

		function initFileUpload(){
			var input = elements.fileUpload.querySelector("input"),
				btn = elements.fileUpload.querySelector("a");

			input.classList.add("noDisplay");
			events.add(btn, "click", function(e){
				preventDefault(e);

				input.click();
			})

			events.add(input, 'change', function(e){
				new FileUploader(elements.fileUpload.querySelector("input"), function(e){
					currentSet.uploadFile = e;

					if(!!e){
						btn.textContent = "Change file";
						btn.classList.add('mist');
						btn.classList.remove('cool');
					} else {
						btn.classList.remove('mist');
						btn.classList.add('cool');
					}
				});
			});
		}

		function initOptions() {
			var opts = !data.htmlBundle ? toggleOpts : toggleExtendedOpts;
			elements.options = new ToggleNavigation(element.querySelector('.options'), opts, toggleAction);
		}

		function toggleAction(e){
			var adTagCL = elements.adTag.parentElement.classList,
				mediaURLCL = elements.mediaURL.parentElement.classList,
				mediaTestUrlCL = elements.mediaTestUrl.parentElement.classList,
				fileUpload = elements.fileUpload.classList,
				sidePanel = elements.sidePanel.classList;

			switch (e.value) {
			case "Ad Tag":
				currentSet.adType = 'thirdParty'
				adTagCL.remove('noDisplay');
				mediaURLCL.add('noDisplay');
				mediaTestUrlCL.add('noDisplay');
				fileUpload.add('noDisplay');
				sidePanel.remove('noDisplay');
				break;
			case "Media URL":
				currentSet.adType = 'mediaURL'
				mediaURLCL.remove('noDisplay');
				mediaTestUrlCL.remove('noDisplay');
				adTagCL.add('noDisplay');
				fileUpload.add('noDisplay');
				sidePanel.remove('noDisplay');
				break;
			case "HTML Bundle":
				currentSet.adType = "htmlBundle"
				mediaURLCL.add('noDisplay');
				mediaTestUrlCL.add('noDisplay');
				adTagCL.add('noDisplay');
				fileUpload.remove('noDisplay');
				sidePanel.add('noDisplay');
				break;
			}
		}

		function checkSet() {
			var errors = [],
				valid = true;

			if(getAdDimensionName(currentSet.width, currentSet.height) === '') {
				errors.push("Invalid ad size (Accepted: 300x250, 300x600, 300x1050, 160x600, 728x90, 720x90, 180x150, 970x90, 970x250, 300x50, 320x50, 320x480, 300x100, 468x60)");
				valid = false;
			}

			if(!validateTrackers()){
				errors.push("Invalid trackers");
				valid = false;
			}

			if(currentSet.landingURL.length <= 6) {
				errors.push("Invalid landing url");
				valid = false;
			}

			if(currentSet.group.length == 0) {
				errors.push("Invalid group");
				valid = false;
			}

			switch (currentSet.adType){
			case "mediaURL":
				if(!currentSet.mediaURL || currentSet.mediaURL.length <= 6){
					errors.push("Invalid media url");
					valid = false;
				}

				if(!currentSet.mediaTestUrl || currentSet.mediaTestUrl.length === 0) {
					currentSet.mediaTestUrl = currentSet.mediaURL;
				}

				break;

			case "thirdParty":
				if(!currentSet.thirdPartyCode || currentSet.thirdPartyCode.length <= 4){
					errors.push("Invalid third party code");
					valid = false;
				}

				break;
			}

			currentSet.name = elements.name.value;
			currentSet.size = currentSet.width + 'x' + currentSet.height;
			if(currentSet.name === '') {
				errors.push("Invalid name");
				valid = false;
			}

			if(!valid){
				core.notifications.setMissingFields(errors);
			}

			return valid;
		}

		function validateTrackers() {
			var it = currentSet.impTrack,
				ct = currentSet.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 initSaveButton() {
			elements.save = element.querySelector('.saveButton');
			events.add(elements.save, 'click', saveAction);
		}

		function saveAction(e){
			if(currentSet.adType === "htmlBundle"){
				uploadHTML();
				return;
			}

			saveAd();
		}

		function uploadHTML(){
			if(!currentSet.uploadFile || currentSet.uploadFile.length === 0){
				core.notifications.setError("Must upload an html bundle before saving");
				return;
			}

			apiRequest('POST', 'htmlAds', core.userID, currentSet.uploadFile, cb);

			function cb(e){
				if(!e.success) {
					var err = !!e.error ? e.error : "An error occurred while uploading the HTML bundle."
					core.notifications.setError(err)
					return
				}

				currentSet.mediaURL = e.data;
				currentSet.adType = "mediaURL";
				currentSet.uploadFile = "";
				saveAd();
			}
		}

		function saveAd(){
			var count = 0;

			if(!checkSet()){
				return;
			}

			apiRequest('POST', 'ads', core.userID, currentSet, cb);
			new AdGroupAdCountUpdate(currentSet.group, 1, core.userID, cb);

			function cb(e) {
				if(++count < 2){
					return;
				}

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

		function urlCheck(e){
			var s = e.value;
			if(isValidURL(s)){
				e.classList.remove('alert');
				return true;
			}
			e.classList.add('alert')
			core.notifications.setError('Please ensure you have entered a valid URL.');
		}

		function updatePreview() {
			if(currentSet.width === 0 || currentSet.height === 0) return;
			var opts = {
				Url: currentSet.mediaTestUrl || currentSet.mediaURL,
				Width: currentSet.width,
				Height: currentSet.height
			};
			if (currentSet.mediaURL.length > 6) {
				elements.result.innerHTML = render(tmpl.preview, opts);
			} else {
				opts.code = render(currentSet.thirdPartyCode, opts);
				elements.result.innerHTML = render(tmpl.previewThirdParty, opts);
			}
			if (elements.result.innerHTML.length > 0) {
				elements.sidePanel.classList.remove('noDisplay');
			} else {
				elements.sidePanel.classList.add('noDisplay');
			}
		}


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

	function cleanupQuotes(v) { // cleans up funky utf8 quotes, probably because Mac is evil or something.
		return v.replace(/[“”]/g, '"').replace(/[‘]/g, '\'');
	}
	function AdGroup(t){
		this.name = t.data.name;
		this.id = t.id;
	}

	function DataObj(){
		this.sidePanel = null;
	}

	function getElementsObj(){
		return {
			'section' : { 'selector' : 'section' },
			'footer' : {},
			'sidePanel' : { 'selector' : 'side-panel' },
			'result' : { 'selector' : '.result' },
			'landingPageURL' : { 'selector' : '.landingPageURL' },
			'adTag': {'selector': '.adTag > textarea'},
			'mediaURL': {'selector': '.mediaURL > input'},
			'mediaTestUrl': {'selector': '.mediaTestURL > input'},
			'name': {'selector': '.name > input'},
			'width': {'selector': '.width'},
			'height': {'selector': '.height'},
			'trackers' : { 'selector' : '.trackers + div' },
			'impTrack' : { 'selector' : '.impTrack' },
			'clickTrack' : { 'selector' : '.clickTrack' },
			'fileUpload' : { 'selector' : '.fileUpload' },
			'adGroups' : {},
			'options' : {},
			'save' : {},
			'addAnother' : {}
		};
	}


	function Advertisement(){
		this.landingURL = "";
		this.group = "";
		this.adType = "";
		this.name = "";
		this.size = "";
		this.width = 300;
		this.height = 250;
		this.mediaURL = "";
		this.mediaTestURL = "";
		this.thirdPartyCode = "";
		this.active = true;
		this.impTrack = "";
		this.clickTrack = "";


		this.uploadFile = "";
	}

	function Template(){
		var header = '<header><h2>Third Party Ads - Upload</h2></header>',
			footer = '<footer><a class="button mint saveButton">Save</a></footer>',
			availableMacros = getAvailableMacros(),
			options = '<row class="options"><h3>Options: </h3></row>',
			adGroup = '<row class="adGroup"><h3>Ad group: </h3></row>',
			adName = '<row class="name"><h3>Ad Name: </h3><input type="text" placeholder="Third Party Ad" class="wide"></row>',
			adTag = '<row class="adTag"><h3>Ad Tag: </h3><textarea placeholder="&lt;iframe src=&quot;https://mySite.com/ad1/&#123;&#123;UUID}}&quot;&gt;&lt;/iframe&gt;" class="wide"></textarea></row>',
			mediaURL = '<row class="mediaURL"><h3>Live URL: </h3><input type="text" placeholder="https://MyMediaURL.com/?s=&#123;&#123;Width}}x&#123;&#123;Height}}" class="wide"></row>',
			mediaTestURL = '<row class="mediaTestURL"><h3>Preview URL: </h3><input type="text" placeholder="https://MyMediaURL.com/?s=&#123;&#123;Width}}x&#123;&#123;Height}}" class="wide"></row>',
			width = '<row><h3>Width: </h3><input type="number" class="width" value="300"></row>',
			height = '<row><h3>Height: </h3><input type="number" class="height" value="250"></row>',
			landingPageURL = '<row><h3>Landing page url:</h3><input type="text" placeholder="https://www.mySite.com" class="landingPageURL wide" /></row>',
			fileUpload = '<row class="fileUpload"><h3>File upload:</h3><input type="file"/><a href="#" class="button cool tidySmall">Select file</a></row>',
			container = '<container>' + options + availableMacros + adGroup + adName + adTag + mediaURL + mediaTestURL + width + height + landingPageURL + advancedAdsTemplate() + fileUpload + '</container>',
			result = '<row class="result"></row>',
			sidePanel = '<side-panel class="previewAds dynamic noDisplay"><section><h2>Preview Ad:</h2><ads class="nativeAds">' + result + '</ads></section></side-panel>';

		this.index = '<div class="createPage">' + header + '<div></div><section>' + container + sidePanel + '</section>' + footer + '</div>';
		this.preview = '<iframe src="{{ Url }}" width="{{ Width }}" height="{{ Height }}" style="border: none;"></iframe>';
		this.previewThirdParty = '<div class="overflow" style="width:{{ Width }}px;height:{{ Height }}px">{{ code }}</div>';

		function getAvailableMacros(){
			// Let's break this apart and clean it up a bit soon'
			return '<row class="availableMacros"> <h2>Available Macros:</h2> <i><span class="cool">&#123;&#123;AdID}}</span> - Ad ID</i> <i><span class="cool">&#123;&#123;CampaignID}}</span> - Campaign ID</i> <i><span class="cool">&#123;&#123;UUID}}</span> - User ID</i> <i><span class="cool">&#123;&#123;Width}}</span> - Width of ad</i> <i><span class="cool">&#123;&#123;Height}}</span> - Height of Ad</i> <i><span class="cool">&#123;&#123;Size}}</span> - Width x Height</i> <i><span class="cool">&#123;&#123;Domain}}</span> - Impression Domain</i> <i><span class="cool">&#123;&#123;PageURL}}</span> - Impression Page</i> <i><span class="cool">&#123;&#123;Referrer}}</span> - Referring URL</i> <i><span class="cool">&#123;&#123;Cachebuster}}</span></i> <i><span class="cool">&#123;&#123;ClickURL}}</span> - Ad Click URL</i> <i><span class="cool">&#123;&#123;EncodedClickURL}}</span></i> </row>';
		}
}
})();