var dmlneckfitWrapperElement = document.getElementById("dml_neckfit_wrapper");
dmlneckfitWrapperElement.style.transition = "all 0.5s;";

dmlneckfitWrapperElement.innerHTML += "<div id='dmlneckfitWrapperAnchor'></div>";

var neckfitCSSid = 'neckfitStyleSheet';

let sessionTimeString = (new Date()).getTime();

var neckfitFlLgPp = false;

var neckfit_pagelink  = document.createElement('link');
neckfit_pagelink.id   = neckfitCSSid;
neckfit_pagelink.rel  = 'stylesheet';
neckfit_pagelink.type = 'text/css';
neckfit_pagelink.href = 'https://neckfit.herokuapp.com/stylesheets/style.min.css?'+sessionTimeString;
neckfit_pagelink.media = 'all';
dmlneckfitWrapperElement.appendChild(neckfit_pagelink);

window.neckfit_maxwidth = typeof window.neckfit_maxwidth != "undefined" ? window.neckfit_maxwidth : "100%";
window.neckfit_maxheight = typeof window.neckfit_maxheight != "undefined" ? window.neckfit_maxheight : window.innerHeight +"px";
window.neckfit_bannerwidth= typeof window.neckfit_bannerwidth != "undefined" ? window.neckfit_bannerwidth : "100%";


window.neckfit_hasBanner = typeof window.neckfit_hasBanner != "undefined" ? window.neckfit_hasBanner: false;
window.neckfit_isEmbed = typeof window.neckfit_isEmbed != "undefined" ? window.neckfit_isEmbed: true;

window.neckfit_forcedLanguageCode = typeof window.neckfit_forcedLanguageCode != "undefined" ? window.neckfit_forcedLanguageCode: "";

window.neckfit_banner_subtitle = typeof window.neckfit_banner_subtitle != "undefined" ? window.neckfit_banner_subtitle: "Discover how to train, tighten and tone the skin around your neck to achieve a more visibly lifted appearance.";
window.neckfit_banner_cta = typeof window.neckfit_banner_cta != "undefined" ? window.neckfit_banner_cta: "choose your workout";
window.neckfit_banner_qr_header = typeof window.neckfit_banner_qr_header != "undefined" ? window.neckfit_banner_qr_header: "Available on mobile only";
window.neckfit_banner_qr_text = typeof window.neckfit_banner_qr_text != "undefined" ? window.neckfit_banner_qr_text: "Scan the QR code or simply visit neckfitcontour.com on your mobile device.";



dmlneckfitWrapperElement.style.width = window.neckfit_maxwidth;

function logOnLocalHostFrontEnd(inStringBefore,inVariable){
	inStringBefore = (inStringBefore === undefined) ? '' : inStringBefore;
	if (/localhost/g.test("https://neckfit.herokuapp.com") || /192\.168\.0\./g.test("https://neckfit.herokuapp.com") || neckfitFlLgPp){
		if (inVariable == undefined){
			console.log(inStringBefore)
		}else{
			console.log(inStringBefore, inVariable)
		}
	}
}
// GA - START

window.neckfitGAsetup = false;

function neckfitSendGA(eventName,eventValue){
	logOnLocalHostFrontEnd("GOOGLE ANALYTICS: ",eventName + " - " + eventValue)
	eventValue = (eventValue == undefined) ? "" : eventValue;

	let eventLabel;
	if (typeof neckfitCustomUID == "undefined"){
		eventLabel = "";
	}else{
		eventLabel = neckfitCustomUID;
	}

	if (window.neckfitGAsetup){
		if (window.gtag) {
			if (eventLabel != ""){
				window.gtag('event', eventValue, {event_category: eventName, event_label: eventLabel}); // action - {category - label}
			}else{
				window.gtag('event', eventName, {event_category: eventName}); // action - {category}
			}

		}else if (window.ga) {
			if (eventLabel != ""){
				window.ga('neckfit_gtag.send', 'event', eventName, eventValue, eventLabel); // category - action - label
			}else{
				window.ga('neckfit_gtag.send', 'event', eventName, eventValue); // category - action
			}
		}
		 else if (window._gaq) {

			window._gaq.push(['neckfit_gtag._trackEvent',eventName,eventValue]); // category - action
		}
	}
}

function neckfitSendPageViewGA(pagePath){
	if (window.neckfitGAsetup){
		if (window.gtag) {
			dmlSendScreenViewGA(pagePath);
			logOnLocalHostFrontEnd("GOOGLE ANALYTICS: gtag pageview event will be send");
			window.gtag('config', "G-PRN07M4586", {"page_title": window.location.hostname, "page_path": pagePath});
		}else if (window.ga) {
			logOnLocalHostFrontEnd("GOOGLE ANALYTICS: ga pageview event will be send");
			window.ga('neckfit_gtag.set', 'page', pagePath);
			window.ga('neckfit_gtag.send', 'pageview');
		} else if (window._gaq) {
			logOnLocalHostFrontEnd("GOOGLE ANALYTICS: _gaq pageview event will be send");
			window._gaq.push(['neckfit_gtag._trackPageview',pagePath]);
		}
	}
}

function dmlSendScreenViewGA(screenName){
	gtag('event', 'screen_view', {
  'app_name': 'Neck fit Contour',
  'screen_name' : screenName
});
}

function neckfitSetupGA(){
	let pageTitle ="not found";
	pageTitle = window.location.hostname;
	if (window.ga) {
		logOnLocalHostFrontEnd("setting up GA for 'ga'","");
		window.ga('create', "G-PRN07M4586", 'auto', 'neckfit_gtag');
		window.ga('neckfit_gtag.set','anonymizeIp', true);
		window.ga('neckfit_gtag.send','pageview',window.location.href);
	}else if (window.gtag) {
		logOnLocalHostFrontEnd("setting up GA for 'gtag'","");
    window.gtag('config', "G-PRN07M4586", { 'anonymize_ip': true, 'page_title': pageTitle , 'page_location': window.location.href });
  } else if (window._gaq) {
		logOnLocalHostFrontEnd("setting up GA for '_gaq'","");
    window._gaq.push(['neckfit_gtag._setAccount',"G-PRN07M4586"],['neckfit_gtag._trackPageview']);
	}
	window.neckfitGAsetup = true;
}


// GA - END

function getEmbedHtmlData(url, callback){
	let request = new XMLHttpRequest();
	request.open('GET', url, true);

	request.onload = function() {
		if (request.status >= 200 && request.status < 400) {
	    callback({"status": "success","status_code":request.status, "data" : request.responseText});
	  } else {
			callback({"status": "success","status_code":request.status, "data" : "We reached our target server, but it returned an error"});
	  }
	};

	request.onerror = function() {
		callback({"error": "success","status_code":request.status, "data" : "Error occured in getting html data"});
	};
	request.send();
}

function dml_getScript(source, callback) {
    var script = document.createElement('script');
    script.async = 1;

    script.onload = function(evt) {
			callback({"status":"success","message":"done"});
    };

		script.onerror = function(err){
			console.log(err)
			callback({"status":"error", "message":"error in getting script " + source});
		}

		script.setAttribute('type','text/javascript');

		script.src = source;
		dmlneckfitWrapperElement.appendChild(script);


}

function dml_getScript_withAttributes(source, attributeObj, callback) {
    var script = document.createElement('script');
    script.async = 1;

    script.onload = function(evt) {
			callback({"status":"success","message":"done"});
    };

		script.onerror = function(err){
			console.log(err)
			callback({"status":"error", "message":"error in getting script " + source});
		}

		script.setAttribute('type','text/javascript');
		try{
			Object.keys(attributeObj).forEach( function(attrKey){
				script.setAttribute(attrKey,attributeObj[attrKey]);
			});

		}catch(err){
			console.log(err);
		}

		script.src = source;
		dmlneckfitWrapperElement.appendChild(script);


}


function neckfitOpenApp(){

	let gaTimer = 100;
	let gacheckinterval = setInterval(function(){
		if (window.ga || window.gtag){
			logOnLocalHostFrontEnd("GA AVAILABLE - "+ gaTimer/1000 + "s","");
			clearInterval(gacheckinterval);
			neckfitSetupGA();
		}else{
			if (gaTimer > 10000){
				logOnLocalHostFrontEnd("GA NOT AVAILABLE - "+ gaTimer/1000 + "s");
				clearInterval(gacheckinterval);
			}
			gaTimer += 100;
		}
	},100)

	if (navigator.appName == 'Microsoft Internet Explorer' ||  !!(navigator.userAgent.match(/Trident/) || navigator.userAgent.match(/rv:11/))){
		setTimeout(function(){neckfitSendGA("openApp","Browser Not Supported");},2000);
		//alert("We don't currently support this browser. Please reopen this page in a different browser.")
		if (!window.neckfit_isEmbed){
			dmlneckfitWrapperElement.style.height = "100vh";
		}
		if (document.getElementById("neckfit_banner_container")){
			document.getElementById("neckfit_banner_container").style.display="none"
		}

		dmlneckfitWrapperElement.innerHTML = '<div id="neckfit_browser_not_sup_wrapper"><div id="neckfit_browser_error_image"><img src="https://neckfit.herokuapp.com/img/neckfit_face_error.svg"/></div><p>We don\'t currently support this browser. Please reopen this page in a different browser, such as <a href="https://www.google.com/chrome/" target="_blank">Chrome</a>.</p></div>' + dmlneckfitWrapperElement.innerHTML;

		if (dmlneckfitWrapperElement.offsetWidth >= 768){
			dmlneckfitWrapperElement.style.background = "url('https://neckfit.herokuapp.com/img/neckfit_onboarding_bg_desktop.jpg') no-repeat center center";
		}else{
			dmlneckfitWrapperElement.style.background = "url('https://neckfit.herokuapp.com/img/neckfit_onboarding_mobile_bg.jpg') no-repeat center center";
		}
		dmlneckfitWrapperElement.style.backgroundSize= "cover";


	}else{
		setTimeout(function(){neckfitSendGA("openApp","loading full script");},2000);
		getEmbedHtmlData('https://neckfit.herokuapp.com/neckfit?'+sessionTimeString, function(res)  {
			//window.data = res.data;
			if (document.getElementById("neckfit_banner_container")){
				document.getElementById("neckfit_banner_container").style.display="none"
			}
			dmlneckfitWrapperElement.innerHTML = res.data + dmlneckfitWrapperElement.innerHTML;


			setTimeout(function(){
				document.getElementById("neckfit_body").style.height=window.innerHeight + "px";
				dmlneckfitWrapperElement.style.height = window.innerHeight + "px";

				dml_getScript('https://neckfit.herokuapp.com/script.js?'+sessionTimeString,function(){});

			},100);


		})

	}

}

function neckfitMakeBanner(){

	dmlneckfitWrapperElement.innerHTML = "<div id='neckfit_banner_container' onclick='neckfitOpenApp()'></div>" + dmlneckfitWrapperElement.innerHTML;
	var bannerEl = document.getElementById("neckfit_banner_container");

	if (dmlneckfitWrapperElement.offsetWidth >=768){
		document.getElementById("neckfit_banner_container").style.pointerEvents = "none";

		let curUrl = window.location.href;

		if (curUrl.indexOf("?") > -1){
			curUrl += "&widget_in_view=1";
		}else{
			curUrl += "?widget_in_view=1";
		}


		bannerEl.innerHTML = "<div id='neckfit_banner_content'>" +
			"<p id='neckfit_banner_app_name'>neck fit</p>" +
			"<p id='neckfit_banner_subtitle'>"+window.neckfit_banner_subtitle+"</p>" +
			"<div id='neckfit_banner_card'>" +
				"<div id='neckfit_banner_text_wrapper'>" +
					"<p id='neckfit_banner_card_header'>"+window.neckfit_banner_qr_header+"</p>" +
					"<p id='neckfit_banner_card_text'>"+window.neckfit_banner_qr_text+"</p>" +
				"</div>" +
				"<img id='neckfit_banner_qr_code' width='200' height='200' src='https://chart.apis.google.com/chart?cht=qr&chs=500x500&choe=UTF-8&chld=H&chl=" + curUrl+"'/>"+
			"</div>"+
		"</div>";
	}else{

		bannerEl.innerHTML = "<div id='neckfit_banner_content'><p id='neckfit_banner_app_name'>neck fit</p><p id='neckfit_banner_subtitle'>"+window.neckfit_banner_subtitle+"</p><div id='neckfit_banner_cta_wrapper'><p id='neckfit_banner_cta'>"+window.neckfit_banner_cta+"</p><div class='neckfit_right_arrow_white'></div></div></div>";

	}



	if (dmlneckfitWrapperElement.offsetWidth >=768){
		dmlneckfitWrapperElement.style.height = "400px";

	}else{
		bannerEl.classList.add("neckfit_768")
		dmlneckfitWrapperElement.style.height = Math.round(1.64 * dmlneckfitWrapperElement.offsetWidth ) + "px";
	}
}


// global functions


window.neckfitSetCookie = function(cname,cvalue, exdays){
	var d = new Date();
  d.setTime(d.getTime() + (exdays*24*60*60*1000));
  var expires = "expires="+ d.toUTCString();
	document.cookie = cname + "=" + cvalue + ";" + expires + ";";
}

window.neckfitReadCookie= function(cname){
	let name = cname + "=";
  let decodedCookie = decodeURIComponent(document.cookie);
  let ca = decodedCookie.split(';');
  for(var i = 0; i <ca.length; i++) {
    let c = ca[i];
    while (c.charAt(0) == ' ') {
    	c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}

// start app/banner

document.addEventListener("DOMContentLoaded",function(){
	console.log("NECKFIT WIDGET LOADED")
})

if (window.location.search.indexOf("widget_in_view=1") > -1){
	if ( /dermalogica.com($|:)/g.test(window.location.hostname)){
		try{
			dmlneckfitWrapperElement.parentElement.parentElement.parentElement.setAttribute("open",true);
			setTimeout(function(){
				document.getElementById("dmlneckfitWrapperAnchor").scrollIntoView();
			},2000)
		}catch(e){
			console.error(e);
		}
	}else{
		document.getElementById("dmlneckfitWrapperAnchor").scrollIntoView();
	}
}


let dmlWidgetWidthInterval = setInterval(function(){
	if (dmlneckfitWrapperElement.offsetWidth > 0){
		clearInterval(dmlWidgetWidthInterval)
		if (window.neckfit_hasBanner){
			neckfitMakeBanner()
		}else{
			neckfitOpenApp()
		}
	}
},100)