(function (angular) {

    'use strict';

    angular
        .module('scm')
        .component('jobApplicationForm', {
            templateUrl: 'js/components/request-form/request-form.html',
            bindings: {},
            controller: controller
        });
        
        
    function MyController($scope, $http) {
      // ... your code
    }   

    function controller($document, $uibModal) {

        var vm = this;

        vm.$onInit = function () {

            vm.form = {}

            vm.form.date = [];

            vm.number_of_timeslot = [1,2];

            vm.title_options = [
                'Miss', 'Ms', 'Mrs', 'Mr', 'Dr'
            ]

            vm.timeslot_option = [
                '10:00 - 11:00',
                '10:30 - 11:30',
                '11:00 - 12:00',
                '11:30 - 12:30',
                '14:00 - 15:00',
                '14:30 - 15:30',
                '15:00 - 16:00',
                '15:30 - 16:30',
                '16:00 - 17:00'
            ];

            vm.purpose_options = [
                {
                    name: 'Admissions Talk',
                    value: 'Admissions Talk'
                }, {
                    name: 'School and Facilities Tour',
                    value: 'School and Facilities Tour'
                }, {
                    name: 'Others (Please specify)',
                    value: 'others'
                }
            ];

            vm.purpose_options2 = vm.purpose_options.map(function(obj) {
                return obj.value
            })

            vm.grade_of_participants_options = [
                {
                    name: 'F.1',
                    value: 'F.1'
                }, {
                    name: 'F.2',
                    value: 'F.2'
                }, {
                    name: 'F.3',
                    value: 'F.3'
                }, {
                    name: 'F.4',
                    value: 'F.4'
                }, {
                    name: 'F.5',
                    value: 'F.5'
                }, {
                    name: 'F.6',
                    value: 'F.6'
                }, {
                    name: 'Year 1 of Higher Diploma/Associate Degree Programmes',
                    value: 'Year 1 of Higher Diploma/Associate Degree Programmes'
                }, {
                    name: 'Year 2 of Higher Diploma/Associate Degree Programmes',
                    value: 'Year 2 of Higher Diploma/Associate Degree Programmes'
                }, {
                    name: 'Others (Please specify)',
                    value: 'others'
                }
            ]

            vm.grade_of_participants_options2 = vm.grade_of_participants_options.map(function(obj) {
                return obj.value
            })

            vm.preferred_panguage_options = [
                {
                    name: 'Cantonese',
                    value: 'Cantonese'
                },
                {
                    name: 'English',
                    value: 'English'
                },
                {
                    name: 'Putonghua',
                    value: 'Putonghua'
                }
            ]

            vm.preferred_panguage_options2 = vm.preferred_panguage_options.map(function(obj) {
                return obj.value
            })

            vm.school_district_option = [
                {
                    name: 'Hong Kong',
                    value: 'Hong Kong'
                },{
                    name: 'Kowloon',
                    value: 'Kowloon'
                },{
                    name: 'New Territories',
                    value: 'New Territories'
                }
            ]

            vm.school_district_option2 = vm.school_district_option.map(function(obj) {
                return obj.value
            })



            vm.school_type_option = [
                {
                    name: 'International School',
                    value: 'International School'
                }, {
                    name: 'Local Secondary School',
                    value: 'Local Secondary School'
                }, {
                    name: 'Post-secondary Institution',
                    value: 'Post-secondary Institution'
                }, {
                    name: 'Others (Please specify)',
                    value: 'others'
                }
            ]

            vm.school_type_option2 = vm.school_district_option.map(function(obj) {
                return obj.value;
            })

            vm.school_curriculum_option = [
                {
                    name: 'HKDSE',
                    value: 'HKDSE'
                }, {
                    name: 'IB Diploma',
                    value: 'IB Diploma'
                }, {
                    name: 'GSE',
                    value: 'GSE'
                }, {
                    name: 'Associate Degree/ Higher Diploma',
                    value: 'Associate Degree/ Higher Diploma'
                }, {
                    name: 'Others (Please specify)',
                    value: 'others'
                }
            ]

            vm.school_curriculum_option2 = vm.school_curriculum_option.map(function(obj) {
                return obj.value;
            })


            var d = new Date();
            d.setMonth(d.getMonth() + 3);

            vm.datepickerConfig = {
                dateFormat: "DD/MM/YYYY",
                minDate: new Date(),
                maxDate: d
            };
        };

        vm.submit = function() {
          
          //  var captcharesponse = grecaptcha.getResponse(); 
            if (vm.validate()){
                
           //   if (captcharesponse.length > 0 ) {   
            //    console.log(vm.form);
                 //**********************************************************************//
                for ( var prop in vm.form ) {
   
                if (prop == "time"){
                  var dataInput = document.createElement('INPUT') ;
                   dataInput.type= "hidden" ;
                   dataInput.name = 'time_0' ;
                   dataInput.value = vm.form['time'][0];
                   
                  document.getElementById("RequestForm").appendChild(dataInput);
                  var dataInput = document.createElement('INPUT') ;
                   dataInput.type= "hidden" ;
                   dataInput.name = 'time_1' ;
                   dataInput.value = vm.form['time'][1];
                   document.getElementById("RequestForm").appendChild(dataInput);
                 
                  document.getElementById("RequestForm").appendChild(dataInput);
                  var dataInput = document.createElement('INPUT') ;
                   dataInput.type= "hidden" ;
                   dataInput.name = 'SSID' ;
                   dataInput.value = "";
                   document.getElementById("RequestForm").appendChild(dataInput);
                   
                } else {
                  var dataInput = document.createElement('INPUT') ;
                   dataInput.type= "hidden" ;
                   dataInput.name = prop ;
                   dataInput.value = vm.form[prop];
                   document.getElementById("RequestForm").appendChild(dataInput);
                }

             }
          
         
               
            document.getElementById("RequestForm").submit();
           //**********************************************************************// 
          //  }
         
         
           }
            
            //else {
           //  document.getElementById("recaptcha").style.border = "1px solid #ff0000;" ; 
           // }
        }

        vm.validate = function() {
            var form = vm.form;
            var is_valid =
                !!form.school_type &&
                !!form.school_curriculum &&
                !!form.school_district &&
                !!form.title &&
                !!form.time[0] &&
                !!form.time[1] &&
                form.grade_of_participants.length > 0 &&
                !!form.preferred_language &&
                form.purpose_of_visit.length > 0;



           // console.log('is valid: ', is_valid)

            if (vm.ng_form.$invalid || !is_valid) {

                for(var key in vm.ng_form.$error) {
                    vm.ng_form.$error[key].forEach(function(v){
                        v.$setDirty();
                    });
                }

                angular.element(document.getElementsByTagName('select')).addClass('dirty')
                angular.element(document.getElementsByClassName('checkbox-group-message')).addClass('dirty')

                var element = angular.element(document.querySelector('#form-title'));

                if(element) {
                    $document.scrollToElementAnimated(element);
                }
            }

        
            return vm.ng_form.$valid;
        };

        vm.openModal = function() {
            var modalInstance = $uibModal.open({
                component: 'note'
            });

            modalInstance.result.then(function () {
                // $ctrl.selected = selectedItem;
            }, function () {
                // $log.info('modal-component dismissed at: ' + new Date());
            });
        }
    }

})(window.angular);