const at = document.getElementById('at_ddl');
const ld = document.getElementById('load_status');
const st_lbl = document.getElementById('s_type_lbl');
const st_div = document.getElementById('s_type_div');

    const at_divs = ['monthly', 'yearly'];
    const rid = document.getElementById('rid');

    at.addEventListener("change",loadOption);
    at.addEventListener("keyup",loadOption);
	
	function showDiv(divToShow){
		at_divs.forEach((x) => {
            x == divToShow ? document.getElementById(x).style.display = '' : document.getElementById(x).style.display = 'none';
        });
	};
	
    function loadPayPal_opts(type = null){
		
        let st = document.createElement("script");

 
        st.src = "https://www.paypal.com/sdk/js?client-id=AbzYYw2V2NNoCP4d01Q-jYS83sGHGiOCCyxJ86dSN-qr7Sy7nHnN0GidczMZCVES6-VZ1ZPdnFoZmCsh&vault=true&intent=subscription";
        

        if(type){
            st.setAttribute("data-sdk-integration-source", "button-factory");
            document.getElementById('mahScripts').appendChild(st);

            st.addEventListener('load', function() {
                let pid = null;
                let pr = null;

                switch(type){
                    
                    case "monthly":
                        pid = 'P-1L5718111V693633GMHTRISQ';
						//pid = 'P-0FV73752EM492602NMWEYU7Q';
                        pr = '#paypal-button-container-P-1L5718111V693633GMHTRISQ';
						//pr = '#paypal-button-container-P-0FV73752EM492602NMWEYU7Q';
                        break;
					case "yearly":
                        pid = 'P-92S87027YM9935727MHU5ACA';
                        pr = '#paypal-button-container-P-92S87027YM9935727MHU5ACA';
                        break;
                    
                }

                if(type != "lifetime") {
                    paypal.Buttons({
                        style: {
                            shape: 'rect',
                            color: 'gold',
                            layout: 'vertical',
                            label: 'subscribe'
                        },
                        createSubscription: function (data, actions) {
                            return actions.subscription.create({
                                /* Creates the subscription */
                                plan_id: pid,
								"category":"DIGITAL_GOODS",
								custom_id: ("Method_Test_" + rid.value)
                            });
                        },
                        onApprove: function (data, actions) {
							return actions.order.capture().then(function(orderData) {
								saveOrderDetails(orderData);
							});
                            //alert(data.subscriptionID); // You can add optional success message for the subscriber here
										saveOrderDetails(data);
										  //console.log(details);
										  //if(details.status == "COMPLETED"){
												  //localStorage.clear();
												  //window.location.href = "thank-you";
										  //}
								
                                // Or go to another URL:  actions.redirect('thank_you.html');
                        }
                    }).render(pr).then(()=> {
						showDiv(type);
						ld.style.display = 'none';
						st_div.style.display = '';
						st_lbl.innerHTML = type;
						//document.getElementById('sInfo').innerHTML = '<h1><label style="font-weight: bold;">Monthly Access (5$ per month): </label></h1>';
					}); // Renders the PayPal button
                }
            });
        }

        

    }

    function loadOption() {
		st_div.style.display = 'none';
		
		at_divs.forEach((x) => {
             document.getElementById(x).style.display = 'none';
        });
		
        document.getElementById('mahScripts').innerHTML = '';

        let at_sel = null;
		let show_load = true;
		
        switch(at.value){
            case "mt":
                at_sel = 'monthly';
                break;
			 case "yr":
                at_sel = 'yearly';
                break;
			default:
				show_load = false;
				break;
        }
		if(show_load == true){
			ld.style.display = '';	
		}
		else{
			ld.style.display = 'none';
		}
		
        loadPayPal_opts(at_sel);


    }

	function saveOrderDetails(od){


	return new Promise(function(resolve, reject) {
    // Do the usual XHR stuff
    var req = new XMLHttpRequest();

	req.open('POST', "/api/paypal/sod", true);
	req.setRequestHeader('Content-Type', 'application/json'); 

	req.onload = function() {
      // This is called even on 404 etc
      // so check the status
      if (req.status == 200) {
        // Resolve the promise with the response text
        resolve(req.response);
		console.log(req.response);
      }
      else {
        // Otherwise reject with the status text
        // which will hopefully be a meaningful error
        reject(Error(req.statusText));
		//console.log(req.statusText);
      }
    };

    // Handle network errors
    req.onerror = function() {
      reject(Error("Network Error"));
    };

    // Make the request
	let data = {
		"order_details" : od
	}


	req.send(JSON.stringify(data));

	
	});






}

    loadOption();