From af2d8431d1eaeaf4fc05e249ca1d582f40ee2579 Mon Sep 17 00:00:00 2001
From: Armando Liccardo <li.armando82@gmail.com>
Date: Mon, 18 Nov 2024 12:11:30 +0000
Subject: [PATCH] moved inline styles to file and load it
---
components/linkPrefetch/index.js | 4 +--
includes/LinkPrefetch.php | 12 +--------
includes/Performance.php | 11 +++++++++
includes/functions.php | 42 +++++++++++++++++++++++++-------
styles/styles.css | 4 +++
5 files changed, 51 insertions(+), 22 deletions(-)
create mode 100644 styles/styles.css
diff --git a/components/linkPrefetch/index.js b/components/linkPrefetch/index.js
index 370eba0..060cd2b 100644
--- a/components/linkPrefetch/index.js
+++ b/components/linkPrefetch/index.js
@@ -44,7 +44,7 @@ const LinkPrefetch = ({methods, constants}) => {
description={constants.text.linkPrefetchDescription}
>
{/* Desktop Settings */}
- <div className="nfd-toggle-field nfd-mb-6" style={{display: 'flex', flexDirection:'row'}}>
+ <div className="nfd-toggle-field nfd-mb-6">
<div >
<label className="nfd-label" htmlFor="link-prefetch-active-desktop">{constants.text.linkPrefetchActivateOnDesktopLabel}</label>
<div className="nfd-select-field__description">
@@ -80,7 +80,7 @@ const LinkPrefetch = ({methods, constants}) => {
)
}
{/* Mobile Settings */}
- <div className="nfd-toggle-field nfd-mb-6" style={{display: 'flex', flexDirection:'row'}}>
+ <div className="nfd-toggle-field nfd-mb-6">
<div >
<label className="nfd-label" htmlFor="link-prefetch-active-mobile">{constants.text.linkPrefetchActivateOnMobileLabel}</label>
<div className="nfd-select-field__description">
diff --git a/includes/LinkPrefetch.php b/includes/LinkPrefetch.php
index cd686e1..2046d86 100644
--- a/includes/LinkPrefetch.php
+++ b/includes/LinkPrefetch.php
@@ -47,7 +47,7 @@ public function add_to_runtime( $sdk ) {
* return void
*/
public function enqueueScripts() {
- $plugin_url = $this->container->plugin()->url . $this->getScriptPath();
+ $plugin_url = $this->container->plugin()->url . get_scripts_path( 'linkPrefetch' );
$settings = get_option( 'nfd_link_prefetch_settings', static::getDefaultSettings() );
if ( ! $settings['activeOnDesktop'] && ! $settings['activeOnMobile'] ) {
@@ -60,16 +60,6 @@ public function enqueueScripts() {
wp_add_inline_script( 'linkprefetcher', 'window.LP_CONFIG = ' . wp_json_encode( $settings ), 'before' );
}
- /**
- * Get js script path.
- *
- * return string
- */
- public function getScriptPath() {
- $suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
- return 'vendor/newfold-labs/wp-module-performance/scripts/linkPrefetch' . $suffix . '.js';
- }
-
/**
* Get link prefetch default settings.
*
diff --git a/includes/Performance.php b/includes/Performance.php
index 0d201ad..5756be5 100644
--- a/includes/Performance.php
+++ b/includes/Performance.php
@@ -81,6 +81,8 @@ public function __construct( Container $container ) {
$container->set( 'cachePurger', $cachePurger );
$container->set( 'hasMustUsePlugin', file_exists( WPMU_PLUGIN_DIR . '/endurance-page-cache.php' ) );
+
+ add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
}
/**
@@ -293,4 +295,13 @@ public function adminBarMenu( \WP_Admin_Bar $wp_admin_bar ) {
);
}
}
+
+ /**
+ * Enqueue scripts and styles in admin
+ */
+ public function enqueue_scripts() {
+ $plugin_url = $this->container->plugin()->url . get_styles_path();
+ wp_register_style( 'wp-module-performance-styles', $plugin_url );
+ wp_enqueue_style( 'wp-module-performance-styles' );
+ }
}
diff --git a/includes/functions.php b/includes/functions.php
index 4133e84..447cdb4 100644
--- a/includes/functions.php
+++ b/includes/functions.php
@@ -17,12 +17,12 @@ function getCacheLevel() {
* @return string[]
*/
function getCacheLevels() {
- return [
+ return array(
0 => 'Off', // Disable caching
1 => 'Assets Only', // Cache assets only
2 => 'Normal', // Cache pages and assets for a shorter time range
3 => 'Advanced', // Cache pages and assets for a longer time range
- ];
+ );
}
/**
@@ -36,10 +36,10 @@ function getCacheLevelDropdown() {
$name = Performance::OPTION_CACHE_LEVEL;
$label = __( 'Cache Level', 'newfold-performance-module' );
?>
- <select name="<?= esc_attr( $name ) ?>" aria-label="<?= esc_attr( $label ) ?>">
- <?php foreach ( $cacheLevels as $cacheLevel => $optionLabel ): ?>
- <option value="<?= absint( $cacheLevel ) ?>"<?php selected( $cacheLevel, $currentCacheLevel ) ?>>
- <?= esc_html( $optionLabel ); ?>
+ <select name="<?php echo esc_attr( $name ); ?>" aria-label="<?php echo esc_attr( $label ); ?>">
+ <?php foreach ( $cacheLevels as $cacheLevel => $optionLabel ) : ?>
+ <option value="<?php echo absint( $cacheLevel ); ?>"<?php selected( $cacheLevel, $currentCacheLevel ); ?>>
+ <?php echo esc_html( $optionLabel ); ?>
</option>
<?php endforeach; ?>
</select>
@@ -65,10 +65,10 @@ function getSkip404InputField() {
?>
<input
type="checkbox"
- name="<?= esc_attr( $name ) ?>"
+ name="<?php echo esc_attr( $name ); ?>"
value="1"
- aria-label="<?= esc_attr( $label ) ?>"
- <?php checked( $value, true ) ?>
+ aria-label="<?php echo esc_attr( $label ); ?>"
+ <?php checked( $value, true ); ?>
/>
<?php
}
@@ -134,3 +134,27 @@ function toSnakeCase( string $value, string $delimiter = '_' ) {
function toStudlyCase( $value ) {
return str_replace( ' ', '', ucwords( str_replace( array( '-', '_' ), ' ', $value ) ) );
}
+
+/**
+ * Get styles path.
+ *
+ * return string
+ */
+function get_styles_path() {
+ return 'vendor/newfold-labs/wp-module-performance/styles/styles.css';
+}
+
+/**
+ * Get js script path.
+ *
+ * @param $string script name.
+ * return string
+ */
+function get_scripts_path( $script_name = '' ) {
+ $basePath = 'vendor/newfold-labs/wp-module-performance/scripts/';
+ if ( empty( $script_name ) ) {
+ return $basePath;
+ }
+ $suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
+ return "vendor/newfold-labs/wp-module-performance/scripts/$script_name$suffix.js";
+}
\ No newline at end of file
diff --git a/styles/styles.css b/styles/styles.css
new file mode 100644
index 0000000..05c9496
--- /dev/null
+++ b/styles/styles.css
@@ -0,0 +1,4 @@
+.nfd-container__block.newfold-link-prefetch .nfd-toggle-field.nfd-mb-6 {
+ display: flex;
+ flex-direction: row;
+ }
\ No newline at end of file