added inline code to plugin tools

This commit is contained in:
asus
2024-03-01 17:21:03 +01:00
parent bd30c97194
commit 8aeef1dca8
5 changed files with 269 additions and 46 deletions

View File

@@ -8,6 +8,9 @@
*
* PLGNTLS means PLUGIN TOOLS
*
* .add_to_front() : this method is made to add files and codes all at once
* otherwise use the wp functions (wp_enqueue_*, wp_add_inline_*, etc)
*
*
* ex:
*
@@ -16,34 +19,31 @@
* $var_2 = 'value_2';
* $var_3 = 'value_3';
* return $my_plugin_class->add_to_front(
* array(
* 'path/to/style.css' // those files are added to front
* 'path/to/script.js' // in the order you put them
* 'http://my_url.com' // it can be urls
* 'path/to/file.html' // html are just rendered then returned
* array( // files added in order by types
* 'path/to/style1.css', //
* 'path/to/script1.js', //
* 'path/to/style2.css', // -> depends on style1.css
* 'http://my_url1.com', //
* 'path/to/script2.js', // -> depends on script1.js
* 'path/to/file1.html', // | will be returned
* 'path/to/file2.html', // -> | as expanded html
* 'path/to/file3.html', // | in the order included
* 'handle_name' => 'path/to/script3.js', // -> depends on the script with handle 'handle_name'
* array( //
* 'path/to/script4.js', // | add a script with attributes
* 'attribute_1' => 'value_1', // -> | first element of array must be
* 'attribute_2' => 'value_2', // | the script, without explicit key
* ), //
* array( 'js' => 'var_js' ), // -> add inline js, only first element will be used
* array( 'css' => 'var_css' ), // -> add inline css, only first element will be used
* ),
* compact( // these variables are added to html and js files
* 'var_1', // in html files you can access them directly
* 'var_2', // in js files they are properties of object PLGNTLS_data
* 'var_3', // like PLGNTLS_data.var_1;
* 'var_1', // - in html files you can access them directly
* 'var_2', // - in js files they are properties of object PLGNTLS_data
* 'var_3', // like PLGNTLS_data.var_1;
* )
* );
*
* complete syntax to include js scripts :
*
* key => value
* 1: 'src'
* 2: 'dependence' => 'src'
* 3: array( 'src', 'attr_1' => 'value_1', ... )
* 4: 'dependence' => array( 'src', 'attr_1' => 'value_1', ... )
*
* -> 'src' is required
* -> 'dependence' is optional
* explicit key is always a dependence
* -> value can be a string 'src', or an array('srcs', ...)
* if value is array, first element is 'src' and following
* are attributes for <script> html elements
*
*/
class PLGNTLS_class
@@ -52,10 +52,10 @@ class PLGNTLS_class
private static $_root_url;
private $_first_script;
private $_first_style;
private $_prefix;
private $_js_dependencies;
private $_css_dependencies;
private $_scripts_modules;
private $_scripts_attributes;
/**
@@ -63,9 +63,9 @@ class PLGNTLS_class
public function __construct() {
$this->_prefix = "PLGNTLS";
$this->_first_script = null;
$this->_first_style = null;
$this->_js_dependencies = array();
$this->_css_dependencies = array();
$this->_scripts_modules = array();
$this->_scripts_attributes = array();
}
@@ -95,8 +95,6 @@ class PLGNTLS_class
if (!is_null($srcs_arr))
$this->add_fetch($srcs_arr, $vars);
array_push($this->_scripts_modules, 'PLGNTLS_example_menu_js', 'PLGNTLS_plgntls_fetch_js');
$srcs = array();
foreach($srcs_arr as $src_key => $src_value) {
$init = $this->init_src($src_key, $src_value);
@@ -234,7 +232,13 @@ class PLGNTLS_class
$previous_css_basename = '';
$previous_js_basename = '';
foreach ($srcs_arr as $src) {
if (in_array($src->ext, array("js", "url"))) {
if ($src->inline !== null) {
if ($src->inline === "js")
$this->add_inline_script($src);
else if ($src->inline === "css")
$this->add_inline_style($src);
}
else if (in_array($src->ext, array("js", "url"))) {
$this->add_script($src, $previous_js_basename);
$previous_js_basename = $src->handle;
}
@@ -246,13 +250,16 @@ class PLGNTLS_class
// https://developer.wordpress.org/reference/hooks/wp_script_attributes/
// https://wordpress.stackexchange.com/questions/66843/attach-a-private-function-at-a-hook
add_filter( 'wp_script_attributes', fn($attr)=>$this->add_type_module($attr), 10, 1 );
add_filter( 'wp_script_attributes', fn($attr)=>$this->add_attributes_to_script($attr), 10, 1 );
/*
* uncomment to print all enqueued scripts, can be usefull
* uncomment to print all enqueued files, can be usefull
global $wp_scripts;
error_log("wp_scripts->queue:");
error_log(json_encode($wp_scripts->queue));
global $wp_styles;
error_log("wp_styles->queue:");
error_log(json_encode($wp_styles->queue));
*/
}
private function add_script($script, $previous_js_basename) {
@@ -263,14 +270,28 @@ class PLGNTLS_class
wp_enqueue_script( $script->handle, $script->url, $depends_on, $script->version, true);
}
private function add_style($style, $previous_css_basename) {
if (is_null($this->_first_style))
$this->_first_style = $style->handle;
$depends_on = $this->check_dependencies($style, $previous_css_basename);
if ($depends_on !== null)
wp_enqueue_style( $style->handle, $style->url, $depends_on, $style->version, '');
}
private function add_inline_script($src) {
$handle = $src->depends;
if ($handle === null)
$handle = $this->_first_script;
wp_add_inline_script($src->depends, $src->src, 'before');
}
private function add_inline_style($src) {
error_log("inside add_inline_style");
$handle = $src->depends;
if ($handle === null)
$handle = $this->_first_style;
wp_add_inline_style($src->depends, $src->src);
}
private function add_type_module($attr) {
private function add_attributes_to_script($attr) {
if (empty($attr['id']))
return $attr;
$handle = $attr['id'];
@@ -330,20 +351,52 @@ class PLGNTLS_class
* 6. version : used to avoid browser caching
* 7. depends : string if depends on a handle, or ''
* 8. attr : associative array of html attribute like 'type'=>'module'
* 9. inline : array("js" => "name.js") -> js
* array("css" => "name.css") -> css
*/
private function init_src($key, $value) {
if (empty($value))
return null;
$src = (object)[];
$src = (object)[
'src' => null,
'ext' => null,
'basename' => null,
'handle' => null,
'url' => null,
'path' => null,
'version' => null,
'depends' => null,
'attr' => null,
'inline' => null,
];
// 7. depends
$src->depends = '';
if (is_string($key))
$src->depends = $key;
// 0. src
// 8. attr
// 9. inline
// first element of array is used, so must not be empty
// value => ['path/to/file', 'key1'=>'value1', 'key2'=>'value2']
// src => 'path/to/file'
// attr => ['key1'=>'value1', 'key2'=>'value2']
if (is_array($value)){
$src->src = array_shift($value);
$src->attr = $value;
$first_key = array_keys($value)[0];
if (empty($value[$first_key]))
return null;
if ($first_key === 0) { // is a script file or url with attributes
$src->src = array_shift($value);
$src->attr = $value;
}
else if ($first_key === "js" || $first_key === "css") { // is an inline code
$src->src = $value[$first_key];
$src->inline = $first_key;
return $src; // inline only needs 'depends', 'src' and 'inline'
}
}
else
{
else {
$src->src = $value;
$src->attr = null;
}
@@ -384,14 +437,12 @@ class PLGNTLS_class
$src->version = date("ymd-Gis", filemtime($src->path));
}
// 7. depends
$src->depends = '';
if (is_string($key))
$src->depends = $key;
// if ext is 'js' or 'url' and attr is not empty
// also add to global variable to access in 'wp_script_attributes' filter
if ($src->attr !== null) {
$this->_scripts_attributes[$src->handle.'-js'] = $src->attr;
if ($src->ext === 'js' || $src->ext === 'url') {
if ($src->attr !== null) {
$this->_scripts_attributes[$src->handle.'-js'] = $src->attr;
}
}
return $src;