From 04c4ea31d59982d44f818ce61a9afbb9ddc07817 Mon Sep 17 00:00:00 2001 From: asus Date: Mon, 19 Feb 2024 00:46:03 +0100 Subject: [PATCH] - moving ajax script outside plugin class, as a js file - wip trying to use the wordpress image editor --- plugins/fipfcard_plugin/fipfcard_plugin.php | 48 +++++++++--- .../fipfcard_plugin/html/image_editor.html | 2 + plugins/fipfcard_plugin/js/image_editor.js | 19 +++++ .../fipfcard_plugin/js/menu/example_menu.js | 3 +- plugins/fipfcard_plugin/js/utils/ajax.js | 34 --------- plugins/fipfcard_plugin/utils/plugin_ajax.js | 19 +++++ .../{php => }/utils/plugin_tools.php | 73 +++++-------------- private | 2 +- wordpress_docker | 2 +- 9 files changed, 97 insertions(+), 105 deletions(-) create mode 100644 plugins/fipfcard_plugin/html/image_editor.html create mode 100644 plugins/fipfcard_plugin/js/image_editor.js delete mode 100644 plugins/fipfcard_plugin/js/utils/ajax.js create mode 100644 plugins/fipfcard_plugin/utils/plugin_ajax.js rename plugins/fipfcard_plugin/{php => }/utils/plugin_tools.php (79%) diff --git a/plugins/fipfcard_plugin/fipfcard_plugin.php b/plugins/fipfcard_plugin/fipfcard_plugin.php index e1e2bc3..c359a46 100644 --- a/plugins/fipfcard_plugin/fipfcard_plugin.php +++ b/plugins/fipfcard_plugin/fipfcard_plugin.php @@ -29,19 +29,18 @@ Author URI: * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * plugin dir root */ -define( 'FIPFCARD_PLUGIN_DIR', plugin_dir_path(__FILE__) ); -define( 'FIPFCARD_PLUGIN_URL', plugin_dir_url(__FILE__) ); -include_once( plugin_dir_path(__FILE__) . '/php/utils/plugin_tools.php'); +include_once( plugin_dir_path(__FILE__) . '/utils/plugin_tools.php'); PLGNTLS_class::set_root_dir( plugin_dir_path(__FILE__), plugin_dir_url(__FILE__) ); /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * inclusions */ -include_once(FIPFCARD_PLUGIN_DIR . '/php/utils/globals.php'); +include_once(PLGNTLS_class::get_path() . '/php/utils/globals.php'); +include_once(PLGNTLS_class::get_path() . '/php/menu/example_menu.php'); +//include_once(PLGNTLS_class::get_path() . '/php/images/image-edit.php'); -include_once(FIPFCARD_PLUGIN_DIR . '/php/menu/example_menu.php'); @@ -52,6 +51,7 @@ plugin shortcode */ function fipfcard_main_shortcode() { + $fipfcard_tools = new PLGNTLS_class(); @@ -67,9 +67,9 @@ $data = $data->data; $data = $data->user_email; //error_log("data->data"); //error_log($data); -delete_post_meta(get_the_ID(), "_data_user_email"); -delete_post_meta(get_the_ID(), "_data"); -add_post_meta(get_the_ID(), "data_user_email", $data); +//delete_post_meta(get_the_ID(), "_data_user_email"); +//delete_post_meta(get_the_ID(), "_data"); +//add_post_meta(get_the_ID(), "data_user_email", $data); $post_metadata = get_metadata( 'post', get_the_ID() ); $post_meta = get_post_meta( get_the_ID() ); @@ -112,6 +112,31 @@ add_post_meta(get_the_ID(), "data_user_email", $data); add_shortcode('fipfcard_plugin', 'fipfcard_main_shortcode'); +function fipfcard_image_editor() +{ +// ob_start(); +// wp_image_editor('33545'); +// return ob_get_clean(); +$test1 = "hello"; +$test2 = "you"; + $fipfcard_image_editor = new PLGNTLS_class(); + return $fipfcard_image_editor->add_to_front( + array( + "js/image_editor.js", + "html/image_editor.html", + ), + compact( + "test1", + "test2", + ) + ); +/* +*/ +} +add_shortcode('fipfcard_image_editor', 'fipfcard_image_editor'); + + + /* add_action('init', 'custom_action_handler'); function custom_action_handler() { @@ -279,6 +304,7 @@ function PLGNTLS_my_custom_df_form_handler($form_id, $post_array, $form_type) } + // Hook into the 'acf/save_post' action /* add_action('acf/save_post', 'handle_acf_form_submission', 5); // 20 is the priority, you can adjust it as needed @@ -358,12 +384,10 @@ ajax */ function fipfcard_ajax_handler() { - wp_send_json_success - ( - array + wp_send_json_success( array ( 'It works', - "data_received" => $_POST['data'], + "data_received" => $_POST['postid'], ), 200 ); diff --git a/plugins/fipfcard_plugin/html/image_editor.html b/plugins/fipfcard_plugin/html/image_editor.html new file mode 100644 index 0000000..accfa51 --- /dev/null +++ b/plugins/fipfcard_plugin/html/image_editor.html @@ -0,0 +1,2 @@ + + diff --git a/plugins/fipfcard_plugin/js/image_editor.js b/plugins/fipfcard_plugin/js/image_editor.js new file mode 100644 index 0000000..8816fee --- /dev/null +++ b/plugins/fipfcard_plugin/js/image_editor.js @@ -0,0 +1,19 @@ + +console.log("---------------inside image_editor.js--------------"); +const edit_image_button = document.getElementById('edit_image'); +const image_id_field = document.getElementById('image_id'); + +edit_image_button.addEventListener('click', () => { + const image_id = image_id_field.value; + + PLGNTLS_ajax("postid", image_id, 'image_editor') + .then((response) => response.json()) + .then((data) => { + console.log("data: "); + console.log(data); + }) + .catch((error) => { + console.log("error: "); + console.log(error); + }); +}); diff --git a/plugins/fipfcard_plugin/js/menu/example_menu.js b/plugins/fipfcard_plugin/js/menu/example_menu.js index 6264194..d02b6dc 100644 --- a/plugins/fipfcard_plugin/js/menu/example_menu.js +++ b/plugins/fipfcard_plugin/js/menu/example_menu.js @@ -5,8 +5,7 @@ sendButton.addEventListener('click', () => { const inputValue = inputElement.value; console.log("inputValue:"); console.log(inputValue); - console.log(PLGNTLS_data); - PLGNTLS_data.ajax(inputValue, 'get_data') + PLGNTLS_ajax(inputValue, 'get_data') .then((response) => response.json()) .then((data) => { console.log("dataaa: "); diff --git a/plugins/fipfcard_plugin/js/utils/ajax.js b/plugins/fipfcard_plugin/js/utils/ajax.js deleted file mode 100644 index 30d4ecd..0000000 --- a/plugins/fipfcard_plugin/js/utils/ajax.js +++ /dev/null @@ -1,34 +0,0 @@ -/* - * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -function that create an ajax post action -it can be "overloaded" with a callback_response and _error -*/ -function ajax_post(ajax_data, action, callback_response, callback_error) { - const data = new FormData(); - data.append('action', action); - data.append('_ajax_nonce', fipfcard_ajax._nonce); - data.append('data', ajax_data); - - fetch(fipfcard_ajax._url, { - method: 'POST', - credentials: 'same-origin', - body: data - }) - .then((response) => response.json()) - .then((data) => { - if (callback_response) - callback_response(data); - else { - console.log("data: "); - console.log(data); - } - }) - .catch((error) => { - if (callback_error) - callback_error(error); - else { - console.log("error: "); - console.log(error); - } - }); -}; diff --git a/plugins/fipfcard_plugin/utils/plugin_ajax.js b/plugins/fipfcard_plugin/utils/plugin_ajax.js new file mode 100644 index 0000000..a2ea328 --- /dev/null +++ b/plugins/fipfcard_plugin/utils/plugin_ajax.js @@ -0,0 +1,19 @@ +/** + * function that create an ajax post action + * - PLGNTLS_data.ajax_nonce and PLGNTLS_data.ajax_url + * are passed from the class PLGNTLS_class + */ +console.log("PLGNTLS_data"); +console.log(PLGNTLS_data); +function PLGNTLS_ajax(data_key, data_value, action) { + const data = new FormData(); + data.append("action", action); + data.append("_ajax_nonce", PLGNTLS_data.ajax_nonce); + data.append(data_key, data_value); + + return fetch(PLGNTLS_data.ajax_url, { + method: "POST", + credentials: "same-origin", + body: data + }); +} diff --git a/plugins/fipfcard_plugin/php/utils/plugin_tools.php b/plugins/fipfcard_plugin/utils/plugin_tools.php similarity index 79% rename from plugins/fipfcard_plugin/php/utils/plugin_tools.php rename to plugins/fipfcard_plugin/utils/plugin_tools.php index 2b0de1a..e3a8ad8 100644 --- a/plugins/fipfcard_plugin/php/utils/plugin_tools.php +++ b/plugins/fipfcard_plugin/utils/plugin_tools.php @@ -43,23 +43,33 @@ class PLGNTLS_class self::$_root_path = $path; self::$_root_url = $url; } - public function get_path() { + public static function get_path() { return(self::$_root_path); } - public function get_url() { + public static function get_url() { return(self::$_root_url); } public function add_to_front($files_arr = null, $vars = null) { + if (!is_null($files_arr)) + { + // add ajax file at beginning of files list + array_unshift($files_arr, "utils/plugin_ajax.js"); + $nonce = array("ajax_nonce" => wp_create_nonce('wp-pageviews-nonce')); + $url = array("ajax_url" => admin_url('admin-ajax.php')); + $vars = array_merge($vars, $nonce); + $vars = array_merge($vars, $url); + } + $files = array(); foreach($files_arr as $key => $file_name) { $files[] = $this->init_file($key, $file_name); } if (!is_null($files_arr)) $this->add_files_to_front($files); - $ajax = $this->get_ajax_script(); - $this->add_vars_to_front($vars, $ajax); + if (!is_null($vars)) + $this->add_vars_to_front($vars); return $this->create_html($files, $vars); } @@ -137,23 +147,17 @@ class PLGNTLS_class * this name is the filename + "_" + extension : * init.js -> init_js */ - private function add_vars_to_front($vars_arr, $ajax = null) + private function add_vars_to_front($vars_arr) { if (is_null($this->_first_script)) return ; - if (is_null($vars_arr) && is_null($ajax)) + if (is_null($vars_arr)) return ; $handle = $this->_first_script; $object_name = $this->_prefix . "_data"; - $front = ""; - if (!is_null($vars_arr)) - { - $vars_json = json_encode($vars_arr); - $front .= "let $object_name = $vars_json;"; - } - if (! is_null($ajax)) - $front .= "$ajax"; + $vars_json = json_encode($vars_arr); + $front = "let $object_name = $vars_json;"; wp_add_inline_script($handle, $front, 'before'); } @@ -251,47 +255,6 @@ class PLGNTLS_class } - /** - * function that add the ajax script to front - * no real needs to check if already included : - * - $handle is uniq so it will not be re-enqueued - * the first enqueued version would be kept - * - if we used add_var_to_front() (which use wp_add_inline_script()) - * the vars would be added twice - * leading to js syntaxe error (redeclaraiton of 'let' or 'const') - * - but we use wp_localize_script() so the object will be overwritten - * it's not a real pbm - * (what is more efficient, check for double or overwritte object ?) - */ - /** - * js function that creates an ajax post action - */ - private function get_ajax_script() { - if (is_null($this->_first_script)) - return ; - if (self::$_ajax_already_there) - return ; - self::$_ajax_already_there = true; - - ob_start(); - ?> - function _prefix ?>_ajax(ajax_data, action) { - const _ajax_nonce = ""; - const _ajax_url = ""; - const data = new FormData(); - data.append("action", action); - data.append("_ajax_nonce", _ajax_nonce); - data.append("data", ajax_data); - - return fetch(_ajax_url, { - method: "POST", - credentials: "same-origin", - body: data - }); - } -