now using wp_localize instead of wp_add_inline

plugins/wp_model_plugin/js/init.js

@@ -0,0 +1,4 @@
+
+const title = document.querySelector(".first_el_to_change");
+title.innerHTML = "--- coucou ;) " + php_data.myvar_1;
+console.log(php_data.myvar_1);

plugins/wp_model_plugin/js/myscript.js

@@ -1,5 +0,0 @@
-
-const title = document.querySelector(".first_el_to_change");
-title.innerHTML = "--- coucou ;)";
-
-console.log("myvar_1: " + myvar_1);

plugins/wp_model_plugin/js/myscript2.js

@@ -1,4 +1,3 @@
 
 const title2 = document.querySelector(".second_el_to_change");
 title2.innerHTML = "--- ho boy !";
-

plugins/wp_model_plugin/js/myscript3.js

@@ -1,5 +1,4 @@
 
 const title3 = document.querySelector(".third_el_to_change");
-title3.innerHTML = "--- bye bye";
-console.log("myvar_2: " + myvar_2);
-
+title3.innerHTML = "--- bye bye, " + php_data.myvar_2;
+console.log(php_data.myvar_2);

plugins/wp_model_plugin/php/utils/add_to_front.php

@@ -35,24 +35,41 @@ function add_files_to_front($files_arr) {
 	}
 }
 
+
+
 /*
  * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
-@param expect an array of key => value
-with the key being name of the variable, like this :
-  'my_var' => 'value',
-simpler way to do it is to use compact when calling the function :
-  add_var_to_front(compact("var1", "var2", "var3"));
+pass variables to front as global variables, accessible in js as an object
+@param two params :
+1. an array of key => value
+   with the key being name of the variable, like this :
+    'my_var' => 'value',
+   simpler way to do it is to use compact when calling the function :
+    add_var_to_front(compact("var1", "var2", "var3"));
+2. name of first embended script (if we want to have the variables
+   availables to all js : it will be available to the script and all following)
+	 - default value is "init", assuming the first script is called "init.js"
+old version :
+- was using wp_add_inline_script() which is rather for scripts than variables
+- it had to write explicitly the variable declaration as "const myvar = 'value'"
 */
-function add_var_to_front($var_array) {
-	extract($var_array);
+function add_var_to_front($vars, $handle = "init") {
+	$handle = pathinfo($handle, PATHINFO_FILENAME);
+	$object_name = "php_data";
 
-	foreach ($var_array as $key => $var)
-	{
-		$js_var  = 'const ' . $key . ' = ';
-		$js_var .= json_encode($var);
-		$js_var .= ';';
-		wp_add_inline_script('myscript', $js_var, 'before');
-	}
+	wp_localize_script($handle, $object_name, $vars);
 }
+// function add_var_to_front($vars, $handle = "init") {
+// 	extract($vars);
+// 	$handle = pathinfo($handle, PATHINFO_FILENAME);
+// 
+// 	foreach ($vars as $key => $var)
+// 	{
+// 		$js_var  = 'const ' . $key . ' = ';
+// 		$js_var .= json_encode($var);
+// 		$js_var .= ';';
+// 		wp_add_inline_script($handle, $js_var, 'before');
+// 	}
+// }
 
 ?>

plugins/wp_model_plugin/plugin_hooks.php

@@ -30,6 +30,8 @@ include_once(PLUGIN_DIR . '/php/utils/console_log.php');
 include_once(PLUGIN_DIR . '/php/utils/add_to_front.php');
 include_once(PLUGIN_DIR . '/php/utils/create_html.php');
 
+include_once(PLUGIN_DIR . '/php/menu/menu.php');
+
 
 
 
@@ -41,16 +43,14 @@ function main_shortcode() {
 
 	add_files_to_front( array(
 		"mystyle.css",
-		"myscript.js",
+		"init.js",
 		"myscript2.js",
 		"myscript3.js",
 	));
 
+
 	$myvar_1 = "I am one";
 	$myvar_2 = "I am two";
-	# compact creates an array containing the variables and their value
-	# as key => value
-	# from an array of variables names as strings
 	add_var_to_front( compact(
 		"myvar_1",
 		"myvar_2",