/* For Coaches Training Institute
   By Thomas Beutel, 2018 */
/* Example:
{
   "webinars" : [
      {
         "title" : "CTI (US) : Webinar 8/30/18 Co-Active Experience (CLE)",
         "webinarid" : "E26576",
         "timezone" : "5",
         "type" : "179",
         "date" : "8/30/2018",
         "internaiid" : "572950",
         "status" : "3",
         "calltime" : "Thur 9:00 AM - 10:00 AM Pacific Time",
         "ukdate" : "30-08-2018"
      },
      {
         "webinarid" : "E22451",
         "timezone" : "5",
         "title" : "CTI (US) : 12/31.Neuroscience Recording.Online",
         "date" : "12/30/2020",
         "internaiid" : "194459",
         "type" : "180",
         "ukdate" : "30-12-2020",
         "status" : "3",
         "calltime" : ""
      }
   ]
}
*/

/*
axios.post('/user', {
    firstName: 'Fred',
    lastName: 'Flintstone'
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });
*/

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;
}

function getUrlParam(parameter, defaultvalue){
    var urlparameter = defaultvalue;
    if(window.location.href.indexOf(parameter) > -1){
        urlparameter = getUrlVars()[parameter];
        }
    return urlparameter;
}

Vue.component('course-selector2',{
    props: ['courses','value'],
    template: '<div class="fieldset" style="border:none;"><fieldset style="border:none" class="courseunit"><div><label id="l_fundloc1" for="fundloc1">Select the date for which you would like to register.</label><select v-model="selected_webinar" v-bind:name="courses.type"><option v-for="option in options" v-bind:value="option.value">{{ option.label }}</option></select></div></fieldset></div>',
    computed: {
        options: function() {
            var type = this.courses.type;
            var locations = {
                'SEA':'Seattle, WA',
                'ATL':'Atlanta, GA',
                'DC':'Washington, DC',
                'DVR':'Denver, CO',
                'VAN':'Vancouver, BC',
                'BOS':'Boston, MA',
                'TOR':'Toronto, ON',
                'SR':'San Rafael, CA',
                'CGY':'Calgary, AB',
                'CHI':'Chicago, IL',
                'OC':'Orange County, CA',
                'SF':'San Francisco, CA',
                'Berkeley':'Berkeley, CA',
                'Palo':'Palo Alto, CA',
                'SG':'Singapore',
                'Oslo':'Olso, Norway',
                'NY':'New York, NY',
                'SC':'Los Angeles, CA',
                'LON':'London, UK'
                    };
            var list = this.courses.list.map(
                function(obj){
                    var event   = new Date(Date.parse(obj.date));
                    var options = { year: 'numeric', month: 'short', day: 'numeric' };
                    var date    = event.toLocaleDateString('en-US',options);
                    // we are expecting something like this: CTI(US) : INTRO 1/10/19 NY-MARUIS
                    //                              or this: CTI (US) : Webinar 2/20/19 Why Co-Active Coaching
                    var title   = obj.title;
                    var label   = title;
                    var re      = /[0-9][0-9] ([A-Za-z]+)/;  
                    var matches = re.exec(obj.title);
                    if(matches){
                        if(matches[1] == 'Why' || matches[1] == 'Co'){
                            label = date+' at '+obj.calltime;
                        }
                        else if(matches[1] == 'Discovering') {
                            label = title;
                        }
                        else {
                            title = locations[matches[1]];
                            label = title+': '+date;
                        }
                    }
                    if(obj.internaiid == 911132){
                        //label = date+' at '+obj.calltime;
                        label = title;
                    }
                    return {'value':obj.internaiid,'label':label};
                }
            );
            //list.push({'value':'-1','label':'Please notify me about future dates and/or locations.'});
            list.unshift({'value':'','label':'You have not made a selection'});
            console.log('in options: '+this.courses.selected);
            if(this.courses.selected > 0){
                for(i=0;i<list.length;i++){
                    if(list[i].value == this.courses.selected){
                        this.selected_webinar = this.courses.selected;
                    }
                }
            }
            return list;
        }
    },
    data: function() {  
        return {
            selected_webinar: ''
        }
    },
    watch: {
        course: function() {
            this.$emit('input',this.selected_webinar);
        }
    }
});  

if(typeof addOnloadEvent !== "function"){
    function addOnloadEvent(element, eventName, fn) {
        if (element.addEventListener)
            element.addEventListener(eventName, fn, false);
        else if (element.attachEvent)
            element.attachEvent('on' + eventName, fn);
    }
}

addOnloadEvent(window, 'load', function(){
    //const router = new VueRouter({
    //    mode: 'history',
    //    routes: [ ]
    //});
    var app = new Vue({
        el: '#app',
        //router: router,
        data: {
            // Internal values
            errors: [ ],
            webinars: [ ],
            states: [ ],
            country_states: { },
            countries: [ ],
            result_message: '',
            // States
            state_list_available: true,
            submit_state: 0,
            // Form values
            first_name: '',
            last_name: '',
            email: '',
            phone: '',
            city: '',
            state: '',
            country: 'United States',
            webinar: '',
            webinar_filter: '',
            intro_event: '',
            utm_source: '',
            utm_medium: '',
            utm_campaign: '',
            utm_term: '',
            utm_content: '',
            gclid: '',
            fbclid: '',
            form_action: '',
            type: 'webinar',
            selected: '',
            lead_source: 'Webinar - Coaching',
            thank_you_url: 'https://learn.coactive.com/experience-co-active-coaching-webinar-thank-you',
            subsidiary: 1,
            foo: 0
        },
        mounted: function() {
            console.log('checking query');
            this.utm_source   = getUrlParam('utm_source','');
            console.log('utm_source is '+this.utm_source);
            this.utm_medium   = getUrlParam('utm_medium','');
            this.utm_campaign = getUrlParam('utm_campaign','');
            this.utm_term     = getUrlParam('utm_term','');
            this.utm_content  = getUrlParam('utm_content','');
            this.gclid  = getUrlParam('gclid','');
            this.fbclid  = getUrlParam('fbclid','');
            this.selected     = getUrlParam('nid','');
            if(this.selected){ console.log('selected is '+this.selected); }
        },
        beforeMount: function () {
            this.webinar_filter = this.$el.attributes['data-webinar-filter'].value;
            //this.form_action = 'https://forms.na1.netsuite.com/app/site/hosting/scriptlet.nl?script=519&deploy=1&compid=3958684&h=b90dfdc4de68af5b6bc1';
            this.form_action = 'https://forms.na1.netsuite.com/app/site/hosting/scriptlet.nl?script=491&deploy=1&compid=3958684&h=3dc02fa5978b346094b6';
            if(this.webinar_filter.match(/intro/i)){
                this.form_action = 'https://forms.na1.netsuite.com/app/site/hosting/scriptlet.nl?script=518&deploy=1&compid=3958684&h=c8225407e94c94e6aefa';
                this.type = 'intro_event';
                this.lead_source = '2018SueJ';
                this.thank_you_url = 'https://learn.coactive.com/experience-co-active-coaching-live-event-thank-you';
            }
        },
        methods: {
            checkForm: function (e) {
                var internal_id = 0;
                if(document.getElementById("cle-form").elements["intro_event"]){
                  internal_id = document.getElementById("cle-form").elements["intro_event"].value;
                }
                console.log(internal_id);
                var subsidiary_map = {
                    'SEA':1,
                    'ATL':1,
                    'DC':1,
                    'DVR':1,
                    'VAN':1,
                    'BOS':1,
                    'TOR':1,
                    'SR':1,
                    'CGY':1,
                    'CHI':1,
                    'OC':1,
                    'SF':1,
                    'Berkeley':1,
                    'Palo':1,
                    'SG':1,
                    'Oslo':2,
                    'NY':1,
                    'SC':1,
                    'LON':2
                };
                for(i=0;i<this.webinars.length;i++){
                    if(this.webinars[i].internaiid == internal_id){
                        var title   = this.webinars[i].title;
                        var re      = /[0-9][0-9] ([A-Za-z]+)/;  
                        var matches = re.exec(title);
                        if(matches){
                            if(subsidiary_map[matches[1]] > 0){
                                this.subsidiary = subsidiary_map[matches[1]];
                            }
                        }
                    }
                }
                console.log('Subsidiary is now '+this.subsidiary);
                if(this.country == 'United Kingdom'){
                    this.state = 'Avon'; // to get past bug in Netsuite suitelet
                }
                console.log('State is '+this.state);
                this.errors = [];

                if (!this.state && (this.country == 'United States' || this.country == 'Canada') ) {
                    this.errors.push('State/Province required.');
                }
                
                if (!this.first_name) {
                    this.errors.push('First name required.');
                }
                if (!this.last_name) {
                    this.errors.push('Last name required.');
                }
                if (!this.email) {
                    this.errors.push('Email required.');
                }
                if (!this.phone) {
                    this.errors.push('Phone required.');
                }
                if (!this.city) {
                    this.errors.push('City required.');
                }
                if (!this.errors.length) {
                    console.log('submitted');
                    this.submit_state=1;
                    return true;
                }
                e.preventDefault();
            },
            onSubmit: function(e) {
/* Required fields, ids and types:
Field: First Name	ID: first_name	Type: input
Field: Last Name	ID: last_name	Type: input
Field: Email		ID: email	Type: input
Field: City		ID: city		Type: input
Field: State		ID: state	Type: select
Field: Country		ID: country	Type: select
Field: Phone		ID: phone	Type: input
Field: Webinar		ID: webinar	Type: select
*/
               
                this.submit_state=1;
                console.log('submitted');
                if(this.country == 'United Kingdom'){
                    this.state = 'Avon'; // to get past bug in Netsuite suitelet
                }
                var post_data = { // the data to post
                    first_name: this.first_name, 
                    last_name: this.last_name, 
                    email: this.email, 
                    city: this.city, 
                    state: this.state, 
                    country: this.country, 
                    phone: this.phone, 
                    webinar: this.webinar
                };
                console.log(post_data);
                axios({
                    method: 'post',
                    /* url:'https://forms.netsuite.com/app/site/hosting/scriptlet.nl?script=452&deploy=1&compid=3958684_SB1&h=e01ea1bd7173e51c9f06', */
                    url:'https://forms.na1.netsuite.com/app/site/hosting/scriptlet.nl?script=492&deploy=1&compid=3958684&h=bbde7c179cf5d854fb66',
                    data: post_data,
                    headers: { 'Content-type': 'multipart/form-data' },
                    mode: 'no-cors'
                })
                    .then(function (response) {
                        console.log(response);
                        this.submit_state = 2;
                        if(response.data.result == 'success'){
                            this.result_message = 'Success! Thank you for your registration.';
                        }
                        else {
                            this.result_message = response.data.details;
                        }
/* Result - 
 Success: {
	"result" : "success",
	"details" : "The webinar registration record was successfully created.  Registration ID: OR36533, Student Name: C135832 Tom Armbruster, Webinar Name: E26576 CTI (US) : Webinar 8/30/18 Co-Active Experience (CLE), Status: "
 }
 Error:  {
	"result" : "error",
	"details" : "Last name is required\nEmail address is required\nCity is required\nWebinar selection is required"
 }
*/

                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            }
        },
 
        watch: {
            country: function() {
                console.log('Country changed');
                var country = this.country;
                if(country in this.country_states){
                    this.state_list_available = true;
                    this.states = this.country_states[country];
                    console.log(this.state_list_available);
                    console.log(this.states);
                } else {
                    this.state_list_available = false;
                    console.log(this.state_list_available);
                }
            }
        },
        template: /* prod - webinar: https://forms.na1.netsuite.com/app/site/hosting/scriptlet.nl?script=519&deploy=1&compid=3958684&h=b90dfdc4de68af5b6bc1
                     prod - intros:  https://forms.na1.netsuite.com/app/site/hosting/scriptlet.nl?script=518&deploy=1&compid=3958684&h=c8225407e94c94e6aefa  
                  sandbox: https://forms.netsuite.com/app/site/hosting/scriptlet.nl?script=452&deploy=1&compid=3958684_SB1&h=e01ea1bd7173e51c9f06 */
        //'<form @submit="checkForm" id="cle-form" style="border:none" method="post" action="https://forms.na1.netsuite.com/app/site/hosting/scriptlet.nl?script=491&deploy=1&compid=3958684&h=3dc02fa5978b346094b6">'
        '<form @submit="checkForm" id="cle-form" style="border:none" method="post" v-bind:action="form_action">'
        + '<p v-if="errors.length">'
        + '<b>Please correct the following error(s):</b>'
        + '<ul>'
        + '<li v-for="error in errors" style="color:red;">{{ error }}</li>'
        + '</ul>'
        + '</p>'
        + '<input type="hidden" name="Lead Source" :value="lead_source"  />'
        + '<input type="hidden" name="Subsidiary" :value="subsidiary"  />'
        + '<input type="hidden" name="utm_source" :value="utm_source"  />'
        + '<input type="hidden" name="utm_medium" :value="utm_medium" />'
        + '<input type="hidden" name="utm_campaign" :value="utm_campaign" />'
        + '<input type="hidden" name="utm_term" :value="utm_term"  />'
        + '<input type="hidden" name="utm_content" :value="utm_content"  />'
        + '<input type="hidden" name="gclid" :value="gclid"  />'
        + '<input type="hidden" name="fbclid" :value="fbclid"  />'
        + '<input type="hidden" name="redirect_success" :value="thank_you_url"  />'
        + '<input type="hidden" name="redirect_failure" value="https://learn.coactive.com/co-active-event-error-page" />'
            + '<div class="fieldset" style="border:none"><fieldset style="border:none" class="courseunit webinar_reg">'
            + '<label id="l_first_name" for="first_name">First Name</label>'
            + '<input v-model="first_name" type="text" name="first_name" value="" /><br>'
            + '<label id="l_last_name" for="last_name">Last Name</label>'
            + '<input v-model="last_name" type="text" name="last_name" value="" /><br>'
            + '<label id="l_email" for="email">Email Address</label>'
            + '<input v-model="email" type="text" name="email" value="" /><br>'
            + '<label id="l_phone" for="phone">Phone</label>'
            + '<input v-model="phone" type="text" name="phone" value="" /><br>'
            + '<label id="l_city" for="city">City/Town</label>'
            + '<input v-model="city" type="text" name="city" value="" /><br>'
            + '<label id="l_country" for="country">Country</label>'
            + '<select v-model="country" name="country"><option value="" selected>--</option><option v-for="country in countries" v-bind:value="country">{{ country }}</option></select>'
            + '<div v-show="state_list_available">'
            + '<label id="l_state" for="state">State or Province (select Country first)</label>'
            + '<select v-model="state" name="state"><option value="" selected>--</option><option v-for="state in states" v-bind:value="state">{{ state }}</option></select>'
            + '</div>'
             + '</fieldset></div>'
            + '<course-selector2 v-model="webinar" v-bind:courses="{type:type,list:webinars,selected:selected}"></course-selector2>'
            + '<label style="margin-left:13px;" v-show="type != \'webinar\'"><!-- See below for venue addresses. --></label>'
            + '<input  v-show="submit_state == 0" type="submit" value="Submit" />'
            //+ '<p v-show="submit_state == 0" align="left"><input id="addtocart" name="addtocart" type="image" src="https://learn.coactive.com/hs-fs/hubfs/ALL-intro-event-register-interest-landing-page-NA-18-12-05/image.png?width=149&height=35&name=image.png" alt="Add to Cart"></p>'
            + '<p v-show="submit_state == 1"><img src="//launchpad.coactive.com/assets/img/loading_spinner.gif" style="width:65px;float:left;" /> Processing registration</p>'
            //+ '<p v-show="submit_state == 2">{{ result_message }}</p>'
            + '</form>'
    });


    // get the courses and populate the v-select
    getCourses();
    getStatesCountries();

    
    
    function getCourses(){
        axios.get('//launchpad.coactive.com/data/cache/webinars.json')
            .then(function (response) {
                console.log(response);
                if(app.webinar_filter == ''){
                    app.webinars = response.data.webinars;
                }
                else {
                    var re = new RegExp(app.webinar_filter);
                    var test_string = 'INTRO';
                    var webinar_type = 179; // regular webinars
                    if(test_string.match(re)){
                        var webinar_type = 337; // we are looking for INTRO events 
                    }
                    
                    for(i=0;i<response.data.webinars.length;i++){
                        console.log('Trying: '+response.data.webinars[i].internaiid+' '+response.data.webinars[i].title+' '+response.data.webinars[i].publish);
                        if( (response.data.webinars[i].publish == 'T' && response.data.webinars[i].type == webinar_type && response.data.webinars[i].title.match(re) )
                            || (response.data.webinars[i].type == webinar_type && (response.data.webinars[i].internaiid == 963945 || response.data.webinars[i].internaiid == 1098715 ))){
                            if('cap' in response.data.webinars[i] && response.data.webinars[i].cap > 0){ // if .cap exists, use it to determine whether to show this webinar
                                if(0 + parseInt(response.data.webinars[i].registered) + parseInt(response.data.webinars[i].waitlisted) < parseInt(response.data.webinars[i].cap) ){
                                    app.webinars.push(response.data.webinars[i]);
                                    console.log('Pushed to array! registered:'+response.data.webinars[i].registered+' cap:'+response.data.webinars[i].cap);
                                }
                                else {
                                    console.log('Exceeded cap');
                                    console.log('registered: '+response.data.webinars[i].registered);
                                    console.log('waitlisted: '+response.data.webinars[i].waitlisted);
                                    console.log('cap: '+response.data.webinars[i].cap);
                                }
                            }
                            else { // .cap does not exist, so add the webinar regardless
                                app.webinars.push(response.data.webinars[i]);
                                console.log('Pushed to array! .cap does not exist');
                            }
                        }
                        else console.log('No match');
                    }

                    // Exception: add webinar manually
                    if(0 && webinar_type == 179){
                        var extra_webinar = {
  
         "cap" : "",
         "webinarid" : "E29175",
         "waitlisted" : 0,
         "registered" : 0,
         "attendees" : "",
         "timezone" : "5",
         "status" : "3",
         "date" : "8/2/2019",
         "ukdate" : "02-08-2019",
         "calltime" : "",
         "publish" : "T",
         "internaiid" : "1123180",
         "title" : "CTI (US) : Test Coaching Webinar 12 - 8/2/19",
         "type" : "179",
         "maxreg" : ""


                        }
                        app.webinars.push( extra_webinar );
                    }
                }
                
            })
            .catch(function (error) {
                console.log(error);
            });
    }

    function getStatesCountries(){
        axios.get('//launchpad.coactive.com/data/cache/states_countries.json?v=2.0')
            .then(function (response) {
                console.log(response);
                app.country_states = response.data.states;
                app.countries = response.data.countries;
                app.states = app.country_states[app.country];
            })
            .catch(function (error) {
                console.log(error);
            });
        }

   

}); // end addOnloadEvent()