- forget old ajax wp, now use fetch wp

- trying js files without imports

plugins/fipfcard_plugin/fipfcard_plugin.php

@@ -20,7 +20,7 @@ if (!defined('ABSPATH')) {
 /**
  * plugin dir root
  */
-include_once( plugin_dir_path(__FILE__) . '/utils/plugin_tools.php');
+include_once( plugin_dir_path(__FILE__) . '/utils/plgntls_class.php');
 PLGNTLS_class::set_root_dir( plugin_dir_path(__FILE__), plugin_dir_url(__FILE__) );
 
 /**
@@ -369,7 +369,7 @@ function fipfcard_ajax_handler()
 	wp_send_json_success( array
 		(
 			'It works',
-			"data_received" => $_POST['postid'],
+			"data_received" => $_POST,
 		),
 		200
 	);

plugins/fipfcard_plugin/js/menu/example_menu.js

@@ -2,13 +2,16 @@ const inputElement = document.getElementById('mytext');
 const sendButton = document.getElementById('mybutton');
 
 sendButton.addEventListener('click', () => {
-	const inputValue = inputElement.value;
+	let inputValue = inputElement.value;
+	inputValue = {
+		key1: 'value1',
+		key2: 'value2'
+	};
+	inputValue = JSON.stringify(inputValue);
 	console.log("inputValue:");
 	console.log(inputValue);
-	//PLGNTLS_ajax('get_data', inputValue)
+	PLGNTLS_ajax('get_data', inputValue)
-	PLGNTLS_fetch('get_data', {
+	//PLGNTLS_fetch('get_data', {body: {inputValue}})
-		body: {inputValue},
-	})
 	.then((response) => response.json())
 	.then((data) => {
 		console.log("dataaa: ");

plugins/fipfcard_plugin/js/paypal/create_order.js

@@ -1,18 +1,20 @@
 
-import { resultMessage } from './result_message.js';
+//import { resultMessage } from './result_message.js';
 
 /**
  * @see https://developer.paypal.com/docs/checkout/standard/integrate/#link-integratebackend
  */
-export async function createOrder() {
+//export async function createOrder() {
+async function createOrder() {
 	try {
-		const fetch_create_url = PLGNTLS_data.fetch_url + "/fipf_plugin/api/v1/orders";
+		//const fetch_create_url = PLGNTLS_data.fetch_url + "/fipf_plugin/api/v1/orders";
-		console.log("fetch_create_url:", fetch_create_url);
+		//console.log("fetch_create_url:", fetch_create_url);
-		const response = await fetch(fetch_create_url, {
+		//const response = await fetch(fetch_create_url, {
+		const response = await PLGNTLS_fetch('/fipf_plugin/api/v1/orders', {
 			method: "POST",
 			headers: {
 				"Content-Type": "application/json",
-				"X-WP-Nonce": PLGNTLS_data.rest_nonce,
+				//"X-WP-Nonce": PLGNTLS_data.rest_nonce,
 			},
 			// use the "body" param to optionally pass additional order information
 			// like product ids and quantities

plugins/fipfcard_plugin/js/paypal/on_approve.js

@@ -1,18 +1,20 @@
 
-import { resultMessage } from './result_message.js';
+//import { resultMessage } from './result_message.js';
 
 /**
  * @see https://developer.paypal.com/docs/checkout/standard/integrate/#link-integratebackend
  */
-export async function onApprove(data, actions) {
+//export async function onApprove(data, actions) {
+async function onApprove(data, actions) {
 	try {
 		const fetch_approve_url = PLGNTLS_data.fetch_url + "/fipf_plugin/api/v1/orders/" + data.orderID + "/capture";
 		console.log("fetch_approve_url:", fetch_approve_url);
-		const response = await fetch(fetch_approve_url, {
+		//const response = await fetch(fetch_approve_url, {
+		const response = await PLGNTLS_fetch('/fipf_plugin/api/v1/orders/' + data.orderID + '/capture', {
 			method: "POST",
 			headers: {
 				"Content-Type": "application/json",
-				"X-WP-Nonce": PLGNTLS_data.rest_nonce,
+				//"X-WP-Nonce": PLGNTLS_data.rest_nonce,
 			},
 		});
 
@@ -39,14 +41,14 @@ export async function onApprove(data, actions) {
 			const transaction =
 				orderData?.purchase_units?.[0]?.payments?.captures?.[0] ||
 				orderData?.purchase_units?.[0]?.payments?.authorizations?.[0];
-			resultMessage(
+			// to show a message on page
-				`Transaction ${transaction.status}: ${transaction.id}<br><br>See console for all available details`,
+			//resultMessage(`Transaction ${transaction.status}: ${transaction.id}<br><br>See console for all available details`,);
-			);
 			console.log(
 				"Capture result",
 				orderData,
 				JSON.stringify(orderData, null, 2),
 			);
+			actions.redirect('https://local_fipfcard_plugin.com/');
 		}
 	} catch (error) {
 		console.error(error);

plugins/fipfcard_plugin/js/paypal/paypal.js

@@ -1,5 +1,5 @@
-import { createOrder } from './create_order.js';
+//import { createOrder } from './create_order.js';
-import { onApprove } from './on_approve.js';
+//import { onApprove } from './on_approve.js';
 
 
 window.paypal.Buttons({

plugins/fipfcard_plugin/js/paypal/result_message.js

@@ -1,6 +1,7 @@
 
 // Example function to show a result to the user. Your site's UI library can be used instead.
-export function resultMessage(message) {
+//export function resultMessage(message) {
+function resultMessage(message) {
   const container = document.querySelector("#result-message");
   container.innerHTML = message;
 }

plugins/fipfcard_plugin/php/paypal/paypal.php

@@ -56,6 +56,9 @@ function fipf_paypal_shortcode_content()
 	$added_to_front = $fipfcard_paypal->add_to_front(
 		array(
 			$pp_sdk_src,
+			'js/paypal/result_message.js',
+			'js/paypal/create_order.js',
+			'js/paypal/on_approve.js',
 			"js/paypal/paypal.js",
 			"html/paypal/paypal.html",
 		),

plugins/fipfcard_plugin/utils/plgntls_class.php

@@ -14,7 +14,6 @@ class PLGNTLS_class
 	private static $_root_path;
 	private static $_root_url;
 
-	private static $_ajax_already_there;
 	private $_first_script;
 	private $_prefix;
 	private $_js_dependencies;
@@ -23,8 +22,6 @@ class PLGNTLS_class
 	/**
 	 */
 	public function __construct() {
-		if (! isset( self::$_ajax_already_there ))
-			self::$_ajax_already_there = false;
 		$this->_prefix = "PLGNTLS";
 		$this->_first_script = null;
 		$this->_js_dependencies = array();
@@ -56,20 +53,16 @@ class PLGNTLS_class
 			$vars = array();
 		if (!is_null($scripts_arr))
 		{
-			// add ajax file at beginning of files list
+			// add fetch script at beginning of scripts list
-			array_unshift($scripts_arr, "utils/plugin_ajax.js");
+			array_unshift($scripts_arr, "utils/plgntls_fetch.js");
-			$ajax_nonce = array("ajax_nonce" => wp_create_nonce('wp-pageviews-nonce'));
 			// for the custom endpoints in rest api to work
 			// they need to have a nonce named 'wp_rest'
 			// see : https://developer.wordpress.org/rest-api/using-the-rest-api/authentication/
-			$rest_nonce = array("rest_nonce" => wp_create_nonce('wp_rest'));
+			$fetch_nonce = array("fetch_nonce" => wp_create_nonce('wp_rest'));
-			$ajax_url = array("ajax_url" => admin_url('admin-ajax.php'));
+			$fetch_url = array("fetch_url" => get_site_url() . "/wp-json");
-			$vars = array_merge($vars, $ajax_nonce);
+			$vars = array_merge($vars, $fetch_nonce);
-			$vars = array_merge($vars, $rest_nonce);
+			$vars = array_merge($vars, $fetch_url);
-			$vars = array_merge($vars, $ajax_url);
 		}
-		$fetch_url = array("fetch_url" => get_site_url() . "/wp-json");
-		$vars = array_merge($vars, $fetch_url);
 
 		$scripts = array();
 		foreach($scripts_arr as $key => $script_name) {
@@ -203,10 +196,10 @@ class PLGNTLS_class
 		}
 		/*
 		 * uncomment to print all enqueued scripts, can be usefull
+		 */
 				global $wp_scripts;
 				error_log("wp_scripts->queue:");
 				error_log(json_encode($wp_scripts->queue));
-		 */
 	}
 
 	private function check_dependencies(&$script, $previous_basename)

plugins/fipfcard_plugin/utils/plgntls_fetch.js

@@ -0,0 +1,12 @@
+
+function PLGNTLS_fetch(url, options = {}) {
+	console.log("inside PLGNTLS_fetch");
+	url = PLGNTLS_data.fetch_url + url;
+
+	options.headers = options.headers || {};
+	options.headers['X-WP-Nonce'] = PLGNTLS_data.fetch_nonce,
+	console.log("options:", options);
+
+	return fetch(url, options);
+}
+

plugins/fipfcard_plugin/utils/plugin_ajax.js

@@ -8,20 +8,25 @@
 // OLD VERSION
 console.log("PLGNTLS_data");
 console.log(PLGNTLS_data);
+*/
 function PLGNTLS_ajax(action, data_obj) {
 	const data = new FormData();
 	data.append("action", action);
 	data.append("_ajax_nonce", PLGNTLS_data.ajax_nonce);
-	for (const key in data_obj)
+//	for (const key in data_obj)
-		data.append(key, data_obj[key]);
+//	{
+//		data.append(key, data_obj[key]);
+//	}
+//	console.log("data:", data);
+	data.append(data_obj);
 
 	return fetch(PLGNTLS_data.ajax_url, {
 		method: "POST",
 		credentials: "same-origin",
-		body: data,
+		hedears: {"Content-Type": "application/json"},
+		body: JSON.stringify(data),
 	});
 }
-*/
 
 // https://stackoverflow.com/q/52657814/9497573
 function is_plain_object(obj)
@@ -35,6 +40,7 @@ function is_plain_object(obj)
 	return true;
 }
 
+/*
 function PLGNTLS_fetch(src = null, options = null)
 {
 	if (src === null)
@@ -108,3 +114,4 @@ function PLGNTLS_fetch(src = null, options = null)
 
 	return fetch(PLGNTLS_data.ajax_url, options);
 }
+*/