"use strict"
const URL =`https://pages.icscareergps.com/index.php?choice=insert&pagename=painting`;
const painting={};
const scrollToTopButton = document.getElementById('back2Top');

class ValidateRule{
    static words(input){
        let str = /^[a-zA-Z ]*$/;
        if(!input.match(str)){
            return false;
        }
        return true;
    }
    static email(input){
        let emailFormat = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
        if (emailFormat.test(input) == false) {
            return false;
        }
        return true;
    }
    static contact(input){
        let numbers = /^[0-9]{10}$/;
        if(!input.match(numbers)){
            return false;
        }
        return true;
    }
}

class ICSPainting{
    constructor(){
        this.scrollToTop = this.scrollToTop.bind(this);
    }
    init(){
        //smooth scroll
        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
            anchor.addEventListener('click', function (e) {
                e.preventDefault();
                document.querySelector(this.getAttribute('href')).scrollIntoView({
                    behavior: 'smooth'
                });
            });
        });

        //carousel
        const swiper = new Swiper('.swiper', {
            // Optional parameters
            direction: 'horizontal',
            loop: true,
            slidesPerView: 3,
            spaceBetween: 30,
            breakpoints: {
                "@0.00": {
                  slidesPerView: 1,
                  spaceBetween: 10,
                },
                "@0.75": {
                  slidesPerView: 2,
                  spaceBetween: 20,
                },
                "@1.00": {
                  slidesPerView: 3,
                  spaceBetween: 40,
                },
                "@1.50": {
                  slidesPerView: 4,
                  spaceBetween: 50,
                },
            },
            // Navigation arrows
            navigation: {
              nextEl: '.swiper-button-next',
              prevEl: '.swiper-button-prev',
            },
          });

        //initialize animation effect while scrolling
        AOS.init();
    }
    validateForm(){
        let isValidateArr = [false, false, false, false, false,false, false, false, false, false, false, false ];
        const formElem = document.forms["ICSPaintingForm"].elements;
        //console.log(formElem);
        var flag=true;
        [].slice.call(formElem).forEach((elem) => {
            switch(elem.name){
                case "school":
                    parent.school = "";
                    if(elem.value === ""){
                        $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                    } else if(elem.value !== ""){
                        if(ValidateRule.words(elem.value)) {
                            isValidateArr.splice(0, 1, true);
                            parent.school = elem.value;
                            $(elem.parentElement).find(".ics-error-msg").html("");
                        } else {
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid name");
                        }
                    }
                    break;
                case "principal":
                    parent.principal = "";
                    if(elem.value === ""){
                        $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                        $(elem.parentElement).find(".ics-error-msg").html("Cannot be left blank");
                    } else if(elem.value !== ""){
                        if(ValidateRule.words(elem.value)) {
                            isValidateArr.splice(1, 1, true);
                            parent.principal = elem.value;
                            $(elem.parentElement).find(".ics-error-msg").html("");
                        } else {
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid name");
                        }
                    }
                    break;
                case "contact":
                    parent.contact = "";
                    if(elem.value === ""){
                        $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                    } else if(elem.value !== ""){
                        if(ValidateRule.contact(elem.value)) {
                            isValidateArr.splice(2, 1, true);
                            parent.contact = elem.value;
                            $(elem.parentElement).find(".ics-error-msg").html("");
                        } else {
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid contact");
                        }
                    }
                    break;
                case "email":
                    parent.email = "";
                    if(elem.value === ""){
                        $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                    } else if(elem.value !== ""){
                        if(ValidateRule.email(elem.value)) {
                            isValidateArr.splice(3, 1, true);
                            parent.email = elem.value;
                            $(elem.parentElement).find(".ics-error-msg").html("");
                        } else {
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid email");
                        }
                    }
                    break;
                case "city":
                    parent.city = "";
                    if(elem.value.trim() === ""){
                        $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                    } else if(elem.value !== ""){
                        if(ValidateRule.words(elem.value)) {
                            isValidateArr.splice(4, 1, true);
                            parent.city = elem.value;
                            $(elem.parentElement).find(".ics-error-msg").html("");
                        } else {
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid city name ");
                        }
                    }
                    break;
                case "artteacher":
                    parent.artteacher = "";
                    if(elem.value === ""){
                        $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                    } else if(elem.value !== ""){
                        if(ValidateRule.words(elem.value)) {
                            isValidateArr.splice(5, 1, true);
                            parent.artteacher = elem.value;
                            $(elem.parentElement).find(".ics-error-msg").html("");
                        } else {
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid name");
                        }
                    }
                    break;
                case "artteacheremail":
                    parent.artteacheremail = "";
                    if(elem.value === ""){
                        $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                    } else if(elem.value !== ""){
                        if(ValidateRule.email(elem.value)) {
                            isValidateArr.splice(6, 1, true);
                            parent.artteacheremail = elem.value;
                            $(elem.parentElement).find(".ics-error-msg").html("");
                        } else {
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid email");
                        }
                    }
                    break;
                    case "artteachertcontact":
                        parent.artteachertcontact = "";
                        if(elem.value === ""){
                            $(elem.parentElement).find(".ics-error-msg").removeClass("d-none");
                        } else if(elem.value !== ""){
                            if(ValidateRule.contact(elem.value)) {
                                isValidateArr.splice(7, 1, true);
                                parent.artteachertcontact = elem.value;
                                $(elem.parentElement).find(".ics-error-msg").html("");
                            } else {
                                $(elem.parentElement).find(".ics-error-msg").removeClass("d-none").html("Please enter valid contact");
                            }
                        }
                        break;
                        case "stdname[]":
                            // start
                            parent.stdname = "";
                           var nameCount=1;
                            $("[name^=stdname]").each(function (i, j) {
                                let names= $(this).val();
                                if(nameCount==1){
                                    if(names.length==0) { 
                                        flag=false;                               
                                      $(this).parent('td').find(".ics-error-msg").removeClass("d-none");
                                    }
                                    if(names.length>0) { 
                                        flag=true;                        
                                      $(this).parent('td').find(".ics-error-msg").addClass("d-none");
                                    }
                                }
                                nameCount++;                           
                            });
                            
                            if(flag){
                                    isValidateArr.splice(8, 1, true);
                                    parent.stdname = elem.value;  
                            }
                        
                           break;
                        case "sclass[]":
                            parent.sclass = "";
                            flag=true;
                            var classCount=1;
                            $("[name^=sclass]").each(function (i, j) {
                                let sclass= $(this).val();
                                if(classCount==1){
                                    if(sclass==null) { 
                                        flag=false;                        
                                    $(this).parent('td').find(".ics-error-msg").removeClass("d-none");
                                    $(this).parent('td').find(".ics-error-msg").html('Cannot be left blank');
                                    }
                                    if(sclass>0) { 
                                        flag=true;                        
                                    $(this).parent('td').find(".ics-error-msg").addClass("d-none");
                                    
                                    }
                                }
                                classCount++; 
                            });
                            
                            if(flag){
                                    isValidateArr.splice(9, 1, true);
                                    parent.sclass = elem.value;
                                     
                                }
                            break;
                        case "ptitle[]":
                            parent.title = "";
                            flag=true;
                            var titleCount = 1;
                            $("[name^=ptitle]").each(function (i, j) {
                                let title= $(this).val();
                                if(titleCount == 1){
                                    if(title.length==0) { 
                                        flag=false;                     
                                    $(this).parent('td').find(".ics-error-msg").removeClass("d-none");
                                    }
                                    if(title.length>0) { 
                                        flag=true;                        
                                    $(this).parent('td').find(".ics-error-msg").addClass("d-none");
                                    }
                                }
                                titleCount++; 
                            });
                            if(flag){
                                    isValidateArr.splice(10, 1, true);
                                    parent.title = elem.value;
                                }
                            break;
                        case "imgs[]":
                            parent.imgs = "";
                            flag=true;
                            var count=1;
                            $("[name^=imgs]").each(function (i, j) {
                                let names= $(this).val();
                                if(count==1){
                                    if(names.length==0) { 
                                        flag=false;                        
                                    
                                    $(this).parent('td').find(".ics-error-msg").removeClass("d-none");
                                    }
                                }
                                count++; 
                            });                     
                            if(flag){
                                    isValidateArr.splice(11, 1, true); 
                                }
                            break;
                    }
            });
            return isValidateArr.includes(false) ? false : true;
    }

    submitForm(){
        let isValidateSuccess = this.validateForm();
        if(isValidateSuccess){
            var form_data = new FormData(document.forms["ICSPaintingForm"]);
        //  POST request using fetch() 
            // fetch(`${document.URL}server/Crud.php?choice=insert&pagename='painting'`, {          
                fetch(URL, {          
                // Adding method type 
                method: "POST",            
                // Adding body or contents to send 
                body: form_data,              
                // Adding headers to the request 
                // headers: { 
                //     "Content-type": "application/json"
                // } 
            })
            
            // Converting to JSON 
            .then(response => response.json()) 
            // Displaying results to console 
            .then(json => {
                if(json.status){
                  $(".ics-form").html("<div style='padding: 4rem 2rem;font-size: 2rem;'>Thank you for your submission. <br><br>Our representative will be in touch with you shortly.</div>");
                }
            });
        }
    }
  
    scrollToTop(){       
        document.body.scrollTop = 0; // For Safari
        document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
        var elem = document.forms["ICSPaintingForm"] && document.forms["ICSPaintingForm"]["name"];
        elem && elem.focus();
    }
    // Let's set up a function that shows our scroll-to-top button if we scroll beyond the height of the initial window.
    scrollFunc(){
        if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
            scrollToTopButton.style.display = "block";
        } else {
            scrollToTopButton.style.display = "none";
        }
    }
}

const paintings = new ICSPainting();
paintings.init();

window.addEventListener("scroll", paintings.scrollFunc);