From ee36079405160bcca6554f4e7fa1dc8b5f6d4ecb Mon Sep 17 00:00:00 2001
From: Sophia Atkinson <sophialul@protonmail.com>
Date: Sun, 29 Jun 2025 23:33:54 -0700
Subject: [PATCH] Added color picker to the settings page and and added that
 you can set the titles for the buttons to!

---
 assets/js/cw-color-picker.js     |   3 +
 assets/js/cw-color-picker.min.js |   1 +
 content-warning.php              | 157 ++++++++++++++++++-------------
 3 files changed, 95 insertions(+), 66 deletions(-)
 create mode 100644 assets/js/cw-color-picker.js
 create mode 100644 assets/js/cw-color-picker.min.js

diff --git a/assets/js/cw-color-picker.js b/assets/js/cw-color-picker.js
new file mode 100644
index 0000000..3d6bf88
--- /dev/null
+++ b/assets/js/cw-color-picker.js
@@ -0,0 +1,3 @@
+jQuery(document).ready(function ($) {
+    $('.wp-color-picker').wpColorPicker();
+});
\ No newline at end of file
diff --git a/assets/js/cw-color-picker.min.js b/assets/js/cw-color-picker.min.js
new file mode 100644
index 0000000..103443c
--- /dev/null
+++ b/assets/js/cw-color-picker.min.js
@@ -0,0 +1 @@
+jQuery(document).ready(function(o){o(".wp-color-picker").wpColorPicker()});
\ No newline at end of file
diff --git a/content-warning.php b/content-warning.php
index 11139bf..444b18d 100644
--- a/content-warning.php
+++ b/content-warning.php
@@ -2,7 +2,7 @@
 /**
  * Plugin Name: Better Content Warning
  * Description: Blocks access to content behind a content warning popup with optional trigger warnings.
- * Version: 1.0
+ * Version: 1.1
  * Author: Sophia Atkinson
  * Author URI: https://sophia.wtf
  * Text Domain: better-content-warning
@@ -16,7 +16,7 @@
 // Add metabox
 add_action(
     'add_meta_boxes', function () {
-        add_meta_box('cw_meta_box', 'Better Content Warning', 'cw_meta_box_callback', ['post', 'page'], 'side', 'high');
+    add_meta_box('cw_meta_box', 'Better Content Warning', 'cw_meta_box_callback', ['post', 'page'], 'side', 'high');
     }
 );
 
@@ -46,8 +46,8 @@ add_action(
         if (!current_user_can('edit_post', $post_id)) { return;
         }
 
-        update_post_meta($post_id, '_cw_enabled', isset($_POST['cw_enabled']) ? 'on' : '');
-        update_post_meta($post_id, '_cw_warnings', sanitize_text_field($_POST['cw_warnings']));
+    update_post_meta($post_id, '_cw_enabled', isset($_POST['cw_enabled']) ? 'on' : '');
+    update_post_meta($post_id, '_cw_warnings', sanitize_text_field($_POST['cw_warnings']));
     }
 );
 
@@ -62,30 +62,31 @@ add_filter(
             return $content;
         }
 
-        $enabled = get_post_meta(get_the_ID(), '_cw_enabled', true);
+    $enabled = get_post_meta(get_the_ID(), '_cw_enabled', true);
         if ($enabled !== 'on') { return $content;
         }
 
-        $post_id = get_the_ID();
-        $warnings = trim(get_post_meta($post_id, '_cw_warnings', true));
-        $prefix = get_option('cw_prefix', 'Content Warning');
-        $default = get_option('cw_default_message', 'This post contains content that may be triggering to some people, Continue forward at your discretion.');
-        $button = get_option('cw_button_text', 'Continue');
-        $cookie_duration = 180;
-        $exit_button = get_option('cw_exit_button_text', 'Exit');
+    $post_id = get_the_ID();
+    $warnings = trim(get_post_meta($post_id, '_cw_warnings', true));
+    $prefix = get_option('cw_prefix', 'Content Warning');
+    $default = get_option('cw_default_message', 'This post contains content that may be triggering to some people, Continue forward at your discretion.');
+    $continue_button = get_option('cw_button_text', 'Continue');
+    $exit_button = get_option('cw_exit_button_text', 'Exit');
+    $exit_button_title = esc_attr(get_option('cw_exit_button_title', 'No shame in exiting <3'));
+    $continue_button_title = esc_attr(get_option('cw_continue_button_title', 'Lets get this party started /s'));
+    $cookie_duration = 180;
+    $header = esc_html($prefix);
+    $warning = $warnings ? esc_html($warnings) : esc_html($default);
 
-        $header = esc_html($prefix);
-        $warning = $warnings ? esc_html($warnings) : esc_html($default);
-
-        ob_start();
-        ?>
+    ob_start();
+    ?>
     <div id="cw-popup" class="cw-overlay">
         <div class="cw-box">
             <p><strong><?php echo $header; ?></strong></p>
             <p><?php echo $warning; ?></p>
-            <button title="Lets get this party started /s" id="cw-continue"><?php echo esc_html($button); ?></button> 
+            <button title="<?php echo esc_html($continue_button_title); ?>" id="cw-continue"><?php echo esc_html($continue_button); ?></button> 
             <br>
-            <button title="No shame in exiting <3" id="cw-exit" aria-label="<?php echo esc_attr($exit_button); ?>"><?php echo esc_html($exit_button); ?></button>
+            <button title="<?php echo esc_html($exit_button_title); ?>" id="cw-exit" aria-label="<?php echo esc_attr($exit_button); ?>"><?php echo esc_html($exit_button); ?></button>
         </div>
     </div>
     <script>
@@ -114,20 +115,20 @@ add_filter(
             });
         })();
     </script>
-        <?php
-        return ob_get_clean() . '<div id="cw-content">' . $content . '</div>';
+    <?php
+    return ob_get_clean() . '<div id="cw-content">' . $content . '</div>';
     }
 );
 
 // Add styles
 add_action(
     'wp_head', function () {
-        $bg = esc_attr(get_option('cw_bg_color', '#1E1F22'));
-        $overlay_bg = esc_attr(get_option('cw_overlay_bg_color', '#2E3035'));
-        $font = esc_attr(get_option('cw_font_size', '1.1em'));
-        $btn = esc_attr(get_option('cw_button_color', '#9E93DC'));
-        $btn_hover = esc_attr(get_option('cw_button_hover_color', '#8179d5'));
-        echo "
+    $bg = esc_attr(get_option('cw_bg_color', '#1E1F22'));
+    $overlay_bg = esc_attr(get_option('cw_overlay_bg_color', '#2E3035'));
+    $font = esc_attr(get_option('cw_font_size', '1.1em'));
+    $btn = esc_attr(get_option('cw_button_color', '#9E93DC'));
+    $btn_hover = esc_attr(get_option('cw_button_hover_color', '#8179d5'));
+    echo "
     <style>
         .cw-overlay {
             position: fixed;
@@ -169,32 +170,39 @@ add_action(
 // Settings menu
 add_action(
     'admin_menu', function () {
-        add_options_page('Better Content Warning Settings', 'Better Content Warning', 'manage_options', 'cw-settings', 'cw_settings_page');
+    add_options_page('Better Content Warning Settings', 'Better Content Warning', 'manage_options', 'cw-settings', 'cw_settings_page');
     }
 );
 // Add settings link to plugin page
 add_filter(
     'plugin_action_links_' . plugin_basename(__FILE__), function ($links) {
-        $settings_link = '<a href="options-general.php?page=cw-settings">Settings</a>';
-        array_unshift($links, $settings_link);
-        return $links;
+    $settings_link = '<a href="options-general.php?page=cw-settings">Settings</a>';
+    array_unshift($links, $settings_link);
+    return $links;
     }
 );
 
 // Register settings
 add_action(
     'admin_init', function () {
-        register_setting('cw_settings_group', 'cw_prefix');
-        register_setting('cw_settings_group', 'cw_default_message');
-        register_setting('cw_settings_group', 'cw_button_text');
-        register_setting('cw_settings_group', 'cw_bg_color');
-        register_setting('cw_settings_group', 'cw_font_size');
-        register_setting('cw_settings_group', 'cw_button_color');
-        register_setting('cw_settings_group', 'cw_overlay_bg_color');
-        register_setting('cw_settings_group', 'cw_button_hover_color');
-        register_setting('cw_settings_group', 'cw_show_to_admins');
-        register_setting('cw_settings_group', 'cw_exit_button_text');
-    }
+    register_setting('cw_settings_group', 'cw_prefix');
+    register_setting('cw_settings_group', 'cw_default_message');
+    register_setting('cw_settings_group', 'cw_button_text');
+    register_setting('cw_settings_group', 'cw_exit_button_text');
+    register_setting('cw_settings_group', 'cw_font_size');
+    register_setting('cw_settings_group', 'cw_bg_color');
+    register_setting('cw_settings_group', 'cw_overlay_bg_color');
+    register_setting('cw_settings_group', 'cw_button_color');
+    register_setting('cw_settings_group', 'cw_button_hover_color');
+    register_setting('cw_settings_group', 'cw_show_to_admins');
+    register_setting('cw_settings_group', 'cw_continue_button_title');
+    register_setting('cw_settings_group', 'cw_exit_button_title');
+});
+add_action('admin_enqueue_scripts', function ($hook) {
+    if ($hook !== 'settings_page_cw-settings') return;
+    wp_enqueue_style('wp-color-picker');
+    wp_enqueue_script('cw-color-picker-init', plugin_dir_url(__FILE__) . 'assets/js/' . 'cw-color-picker.js', ['wp-color-picker'], null, true);
+}
 );
 
 // Settings page output
@@ -202,60 +210,77 @@ function cw_settings_page()
 {
     ?>
     <div class="wrap">
-        <h1>Content Warning Settings</h1>
+        <h1><?php esc_html_e('Content Warning Settings', 'better-content-warning'); ?></h1>
         <form method="post" action="options.php">
             <?php settings_fields('cw_settings_group'); do_settings_sections('cw_settings_group'); ?>
+            <br>
+            <legend><strong><?php esc_html_e('Main Options', 'better-content-warning'); ?></strong></legend>
             <table class="form-table">
                 <tr>
-                    <th><label for="cw_show_to_admins">Show Popup to Admins</label></th>
+                    <th scope="row"><label for="cw_show_to_admins"><?php esc_html_e('Show Popup to Admins', 'better-content-warning'); ?></label></th>
                     <td>
                         <input name="cw_show_to_admins" type="checkbox" id="cw_show_to_admins" value="1" <?php checked(get_option('cw_show_to_admins'), '1'); ?>>
-                        <label for="cw_show_to_admins">Enable content warnings for administrator accounts</label>
+                        <label for="cw_show_to_admins"><?php esc_html_e('Enable content warnings for administrator accounts', 'better-content-warning'); ?></label>
                     </td>
                 </tr>
                 <tr>
-                    <th><label for="cw_prefix">Warning Prefix</label></th>
+                    <th scope="row"><label for="cw_prefix"><?php esc_html_e('Warning Prefix', 'better-content-warning'); ?></label></th>
                     <td><input name="cw_prefix" type="text" id="cw_prefix" value="<?php echo esc_attr(get_option('cw_prefix', 'Content Warning:')); ?>" class="regular-text"></td>
                 </tr>
                 <tr>
-                    <th><label for="cw_default_message">Default Warning Message</label></th>
+                    <th scope="row"><label for="cw_default_message"><?php esc_html_e('Default Warning Message', 'better-content-warning'); ?></label></th>
                     <td><input name="cw_default_message" type="text" id="cw_default_message" value="<?php echo esc_attr(get_option('cw_default_message', 'This post contains content that may be triggering to some people, Continue forward at your discretion.')); ?>" class="regular-text"></td>
                 </tr>
                 <tr>
-                    <th><label for="cw_button_text">Continue Button Text</label></th>
+                    <th scope="row"><label for="cw_button_text"><?php esc_html_e('Continue Button Text', 'better-content-warning'); ?></label></th>
                     <td><input name="cw_button_text" type="text" id="cw_button_text" value="<?php echo esc_attr(get_option('cw_button_text', 'Continue')); ?>" class="regular-text"></td>
                 </tr>
                 <tr>
-                    <th><label for="cw_exit_button_text">Exit Button Text</label></th>
+                    <th scope="row"><label for="cw_exit_button_text"><?php esc_html_e('Exit Button Text', 'better-content-warning'); ?></label></th>
                     <td><input name="cw_exit_button_text" type="text" id="cw_exit_button_text" value="<?php echo esc_attr(get_option('cw_exit_button_text', 'Exit')); ?>" class="regular-text"></td>
                 </tr>
                 <tr>
-                    <th><label for="cw_bg_color">Popup Background Color</label></th>
-                    <td><input name="cw_bg_color" type="text" id="cw_bg_color" value="<?php echo esc_attr(get_option('cw_bg_color', '#1E1F22')); ?>" class="regular-text"></td>
-                </tr>
-                <tr>
-                    <th><label for="cw_overlay_bg_color">Overlay Background Color</label></th>
-                    <td><input name="cw_overlay_bg_color" type="text" id="cw_overlay_bg_color" value="<?php echo esc_attr(get_option('cw_overlay_bg_color', '#2E3035')); ?>" class="regular-text"></td>
-                </tr>
-                <tr>
-                    <th><label for="cw_font_size">Font Size</label></th>
+                    <th scope="row"><label for="cw_font_size"><?php esc_html_e('Font Size', 'better-content-warning'); ?></label></th>
                     <td><input name="cw_font_size" type="text" id="cw_font_size" value="<?php echo esc_attr(get_option('cw_font_size', '1.1em')); ?>" class="regular-text"></td>
                 </tr>
                 <tr>
-                    <th><label for="cw_button_color">Button Color</label></th>
-                    <td><input name="cw_button_color" type="text" id="cw_button_color" value="<?php echo esc_attr(get_option('cw_button_color', '#e67c73')); ?>" class="regular-text"></td>
+                    <th scope="row"><label for="cw_bg_color"><?php esc_html_e('Popup Background Color', 'better-content-warning'); ?></label></th>
+                    <td><input name="cw_bg_color" type="text" id="cw_bg_color" value="<?php echo esc_attr(get_option('cw_bg_color', '#1E1F22')); ?>" class="regular-text wp-color-picker"></td>
                 </tr>
                 <tr>
-                    <th><label for="cw_button_hover_color">Button Hover Color</label></th>
-                    <td><input name="cw_button_hover_color" type="text" id="cw_button_hover_color" value="<?php echo esc_attr(get_option('cw_button_hover_color', '#8179d5')); ?>" class="regular-text"></td>
+                    <th scope="row"><label for="cw_overlay_bg_color"><?php esc_html_e('Overlay Background Color', 'better-content-warning'); ?></label></th>
+                    <td><input name="cw_overlay_bg_color" type="text" id="cw_overlay_bg_color" value="<?php echo esc_attr(get_option('cw_overlay_bg_color', '#2E3035')); ?>" class="regular-text wp-color-picker"></td>
+                </tr>
+                <tr>
+                    <th scope="row"><label for="cw_button_color"><?php esc_html_e('Button Color', 'better-content-warning'); ?></label></th>
+                    <td><input name="cw_button_color" type="text" id="cw_button_color" value="<?php echo esc_attr(get_option('cw_button_color', '#9E93DC')); ?>" class="regular-text wp-color-picker"></td>
+                </tr>
+                <tr>
+                    <th scope="row"><label for="cw_button_hover_color"><?php esc_html_e('Button Hover Color', 'better-content-warning'); ?></label></th>
+                    <td><input name="cw_button_hover_color" type="text" id="cw_button_hover_color" value="<?php echo esc_attr(get_option('cw_button_hover_color', '#8179d5')); ?>" class="regular-text wp-color-picker"></td>
                 </tr>
             </table>
-            <?php submit_button(); ?>
+
+            <fieldset style="margin-top: 2em;">
+                <legend><strong><?php esc_html_e('Extra Options', 'better-content-warning'); ?></strong></legend>
+                <table class="form-table">
+                    <tr>
+                        <th scope="row"><label for="cw_continue_button_title"><?php esc_html_e('Continue Button Title', 'better-content-warning'); ?></label></th>
+                        <td><input name="cw_continue_button_title" type="text" id="cw_continue_button_title" value="<?php echo esc_attr(get_option('cw_continue_button_title', 'Lets get this party started /s')); ?>" class="regular-text"></td>
+                    </tr>
+
+                    <tr>
+                        <th scope="row"><label for="cw_exit_button_title"><?php esc_html_e('Exit Button Title', 'better-content-warning'); ?></label></th>
+                        <td><input name="cw_exit_button_title" type="text" id="cw_exit_button_title" value="<?php echo esc_attr(get_option('cw_exit_button_title', 'No shame in exiting <3')); ?>" class="regular-text"></td>
+                    </tr>
+                </table>
+            </fieldset>
+
+            <?php submit_button(__('Save Changes', 'better-content-warning')); ?>
         </form>
     </div>
-    </div>
-    <div style="margin-top:2em; color:#666;">
-        <p>If you like this plugin, please consider supporting my work on <a href="https://liberapay.com/sophiaxd" target="_blank">Liberapay</a> or <a href="https://ko-fi.com/sophiaatkinson" target="_blank">Ko-fi</a>.</p>
+    <div>
+        <p><?php echo wp_kses_post(__('If you like this plugin, please consider supporting my work on <a href="https://liberapay.com/sophiaxd" target="_blank">Liberapay</a> or <a href="https://ko-fi.com/sophiaatkinson" target="_blank">Ko-fi</a>.', 'better-content-warning')); ?></p>
     </div>
     <?php
 }