commit
This commit is contained in:
@@ -1,3 +1,5 @@
|
||||
# wp-gray-dates
|
||||
|
||||
在设定的特定日期(月-日)自动将网站变为灰色,每年的这些日期都会自动变灰。
|
||||
在设定的特定日期(月-日)自动将网站变为灰色,每年的这些日期都会自动变灰。
|
||||
|
||||
插件卸载后会自动清除数据。
|
77
css/admin.css
Normal file
77
css/admin.css
Normal file
@@ -0,0 +1,77 @@
|
||||
.gray-dates-container {
|
||||
margin: 20px 0;
|
||||
padding: 15px;
|
||||
background: #fff;
|
||||
border: 1px solid #ccd0d4;
|
||||
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
|
||||
.gray-date-item {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.gray-date-item input {
|
||||
margin-right: 10px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.add-date {
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
|
||||
/* 日期选择器样式优化 */
|
||||
.ui-datepicker {
|
||||
padding: 10px;
|
||||
border: 1px solid #ddd;
|
||||
background: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.ui-datepicker-header {
|
||||
background: #f7f7f7;
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.ui-datepicker-title {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.ui-datepicker-prev,
|
||||
.ui-datepicker-next {
|
||||
cursor: pointer;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.ui-datepicker-prev {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.ui-datepicker-next {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.ui-datepicker-calendar th {
|
||||
padding: 3px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ui-datepicker-calendar td {
|
||||
padding: 3px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ui-datepicker-calendar a {
|
||||
display: block;
|
||||
padding: 3px;
|
||||
text-decoration: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.ui-datepicker-calendar a:hover {
|
||||
background: #f0f0f0;
|
||||
}
|
45
js/admin.js
Normal file
45
js/admin.js
Normal file
@@ -0,0 +1,45 @@
|
||||
jQuery(document).ready(function($) {
|
||||
// 初始化日期选择器
|
||||
function initDatepicker() {
|
||||
$('.datepicker').datepicker({
|
||||
dateFormat: 'mm-dd',
|
||||
changeMonth: true,
|
||||
changeYear: false
|
||||
});
|
||||
}
|
||||
|
||||
// 初始化已有的日期选择器
|
||||
initDatepicker();
|
||||
|
||||
// 添加新日期
|
||||
$('.add-date').on('click', function() {
|
||||
var dateItem = $('<div class="gray-date-item"></div>');
|
||||
var dateInput = $('<input type="text" name="gray_dates[]" class="datepicker" readonly />');
|
||||
var removeButton = $('<button type="button" class="button remove-date">删除</button>');
|
||||
|
||||
dateItem.append(dateInput).append(removeButton);
|
||||
$('#gray-dates-list').append(dateItem);
|
||||
|
||||
// 初始化新添加的日期选择器
|
||||
dateInput.datepicker({
|
||||
dateFormat: 'mm-dd',
|
||||
changeMonth: true,
|
||||
changeYear: false
|
||||
});
|
||||
|
||||
// 自动打开日期选择器
|
||||
dateInput.datepicker('show');
|
||||
});
|
||||
|
||||
// 删除日期(使用事件委托)
|
||||
$('#gray-dates-list').on('click', '.remove-date', function() {
|
||||
var dateItem = $(this).parent('.gray-date-item');
|
||||
|
||||
// 如果只有一个日期项,则清空而不是删除
|
||||
if ($('.gray-date-item').length === 1) {
|
||||
dateItem.find('input').val('');
|
||||
} else {
|
||||
dateItem.remove();
|
||||
}
|
||||
});
|
||||
});
|
36
templates/admin-page.php
Normal file
36
templates/admin-page.php
Normal file
@@ -0,0 +1,36 @@
|
||||
<div class="wrap">
|
||||
<h1><?php echo esc_html(get_admin_page_title()); ?></h1>
|
||||
|
||||
<?php settings_errors('wp_gray_dates_messages'); ?>
|
||||
|
||||
<form method="post" action="">
|
||||
<?php wp_nonce_field('wp_gray_dates_nonce'); ?>
|
||||
|
||||
<div class="gray-dates-container">
|
||||
<h2>设置灰色日期</h2>
|
||||
<p class="description">在以下日期,网站将自动变为灰色。格式:MM-DD(每年的这一天都会变灰)</p>
|
||||
|
||||
<div id="gray-dates-list">
|
||||
<?php if (!empty($gray_dates)): ?>
|
||||
<?php foreach ($gray_dates as $date): ?>
|
||||
<div class="gray-date-item">
|
||||
<input type="text" name="gray_dates[]" value="<?php echo esc_attr($date); ?>" class="datepicker" readonly />
|
||||
<button type="button" class="button remove-date">删除</button>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<?php else: ?>
|
||||
<div class="gray-date-item">
|
||||
<input type="text" name="gray_dates[]" value="" class="datepicker" readonly />
|
||||
<button type="button" class="button remove-date">删除</button>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<button type="button" class="button add-date">添加日期</button>
|
||||
</div>
|
||||
|
||||
<p class="submit">
|
||||
<input type="submit" name="wp_gray_dates_save" class="button-primary" value="保存设置" />
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
225
wp-gray-dates.php
Normal file
225
wp-gray-dates.php
Normal file
@@ -0,0 +1,225 @@
|
||||
<?php
|
||||
/**
|
||||
* Plugin Name: WP Gray Dates
|
||||
* Plugin URI:
|
||||
* Description: 在设定的特定日期(月-日)自动将网站变为灰色,每年的这些日期都会自动变灰。
|
||||
* Version: 1.0.0
|
||||
* Author: 林海草原
|
||||
* Author URI: https://lhcy.org
|
||||
* License: GPL-2.0+
|
||||
* License URI: http://www.gnu.org/licenses/gpl-2.0.txt
|
||||
* Text Domain: wp-gray-dates
|
||||
*/
|
||||
|
||||
// 如果直接访问此文件,则中止执行
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
class WP_Gray_Dates {
|
||||
|
||||
/**
|
||||
* 插件实例
|
||||
*/
|
||||
private static $instance = null;
|
||||
|
||||
/**
|
||||
* 获取插件实例
|
||||
*/
|
||||
public static function get_instance() {
|
||||
if (null === self::$instance) {
|
||||
self::$instance = new self();
|
||||
}
|
||||
return self::$instance;
|
||||
}
|
||||
|
||||
/**
|
||||
* 构造函数
|
||||
*/
|
||||
private function __construct() {
|
||||
// 添加激活和卸载钩子
|
||||
register_activation_hook(__FILE__, array($this, 'activate'));
|
||||
register_deactivation_hook(__FILE__, array($this, 'deactivate'));
|
||||
register_uninstall_hook(__FILE__, array('WP_Gray_Dates', 'uninstall'));
|
||||
|
||||
// 添加管理菜单
|
||||
add_action('admin_menu', array($this, 'add_admin_menu'));
|
||||
|
||||
// 添加设置链接
|
||||
add_filter('plugin_action_links_' . plugin_basename(__FILE__), array($this, 'add_settings_link'));
|
||||
|
||||
// 添加前端样式
|
||||
add_action('wp_head', array($this, 'maybe_add_gray_style'));
|
||||
|
||||
// 添加管理页面的样式和脚本
|
||||
add_action('admin_enqueue_scripts', array($this, 'enqueue_admin_assets'));
|
||||
}
|
||||
|
||||
/**
|
||||
* 插件激活时执行
|
||||
*/
|
||||
public function activate() {
|
||||
// 创建默认选项
|
||||
$default_options = array(
|
||||
'gray_dates' => array()
|
||||
);
|
||||
|
||||
add_option('wp_gray_dates_options', $default_options);
|
||||
}
|
||||
|
||||
/**
|
||||
* 插件停用时执行
|
||||
*/
|
||||
public function deactivate() {
|
||||
// 停用时不删除数据
|
||||
}
|
||||
|
||||
/**
|
||||
* 插件卸载时执行
|
||||
*/
|
||||
public static function uninstall() {
|
||||
// 删除所有插件数据
|
||||
delete_option('wp_gray_dates_options');
|
||||
}
|
||||
|
||||
/**
|
||||
* 添加管理菜单
|
||||
*/
|
||||
public function add_admin_menu() {
|
||||
add_options_page(
|
||||
'灰色日期设置',
|
||||
'灰色日期',
|
||||
'manage_options',
|
||||
'wp-gray-dates',
|
||||
array($this, 'render_admin_page')
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 添加设置链接
|
||||
*/
|
||||
public function add_settings_link($links) {
|
||||
$settings_link = '<a href="options-general.php?page=wp-gray-dates">' . __('设置', 'wp-gray-dates') . '</a>';
|
||||
array_unshift($links, $settings_link);
|
||||
return $links;
|
||||
}
|
||||
|
||||
/**
|
||||
* 加载管理页面的样式和脚本
|
||||
*/
|
||||
public function enqueue_admin_assets($hook) {
|
||||
if ('settings_page_wp-gray-dates' !== $hook) {
|
||||
return;
|
||||
}
|
||||
|
||||
wp_enqueue_style('jquery-ui-datepicker');
|
||||
wp_enqueue_script('jquery-ui-datepicker');
|
||||
|
||||
// 添加自定义脚本
|
||||
wp_enqueue_script(
|
||||
'wp-gray-dates-admin',
|
||||
plugins_url('js/admin.js', __FILE__),
|
||||
array('jquery', 'jquery-ui-datepicker'),
|
||||
'1.0.0',
|
||||
true
|
||||
);
|
||||
|
||||
// 添加自定义样式
|
||||
wp_enqueue_style(
|
||||
'wp-gray-dates-admin',
|
||||
plugins_url('css/admin.css', __FILE__),
|
||||
array(),
|
||||
'1.0.0'
|
||||
);
|
||||
|
||||
// 本地化脚本
|
||||
wp_localize_script('wp-gray-dates-admin', 'wpGrayDates', array(
|
||||
'ajaxUrl' => admin_url('admin-ajax.php'),
|
||||
'nonce' => wp_create_nonce('wp-gray-dates-nonce'),
|
||||
));
|
||||
}
|
||||
|
||||
/**
|
||||
* 渲染管理页面
|
||||
*/
|
||||
public function render_admin_page() {
|
||||
// 检查用户权限
|
||||
if (!current_user_can('manage_options')) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 保存设置
|
||||
if (isset($_POST['wp_gray_dates_save']) && check_admin_referer('wp_gray_dates_nonce')) {
|
||||
$this->save_settings();
|
||||
}
|
||||
|
||||
// 获取当前设置
|
||||
$options = get_option('wp_gray_dates_options', array('gray_dates' => array()));
|
||||
$gray_dates = $options['gray_dates'];
|
||||
|
||||
// 包含管理页面模板
|
||||
include plugin_dir_path(__FILE__) . 'templates/admin-page.php';
|
||||
}
|
||||
|
||||
/**
|
||||
* 保存设置
|
||||
*/
|
||||
private function save_settings() {
|
||||
$options = array();
|
||||
|
||||
// 处理日期数据
|
||||
$options['gray_dates'] = array();
|
||||
|
||||
if (isset($_POST['gray_dates']) && is_array($_POST['gray_dates'])) {
|
||||
foreach ($_POST['gray_dates'] as $date) {
|
||||
if (!empty($date)) {
|
||||
// 确保日期格式为 MM-DD
|
||||
$date = sanitize_text_field($date);
|
||||
// 验证日期格式
|
||||
if (preg_match('/^\d{2}-\d{2}$/', $date)) {
|
||||
$options['gray_dates'][] = $date;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 更新选项
|
||||
update_option('wp_gray_dates_options', $options);
|
||||
|
||||
// 添加成功消息
|
||||
add_settings_error(
|
||||
'wp_gray_dates_messages',
|
||||
'wp_gray_dates_message',
|
||||
__('设置已保存。', 'wp-gray-dates'),
|
||||
'updated'
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查当前日期是否应该应用灰色样式
|
||||
*/
|
||||
public function maybe_add_gray_style() {
|
||||
$options = get_option('wp_gray_dates_options', array('gray_dates' => array()));
|
||||
$gray_dates = $options['gray_dates'];
|
||||
|
||||
$today = date('m-d');
|
||||
|
||||
if (in_array($today, $gray_dates)) {
|
||||
echo '<style>
|
||||
html {
|
||||
filter: grayscale(100%);
|
||||
-webkit-filter: grayscale(100%);
|
||||
-moz-filter: grayscale(100%);
|
||||
-ms-filter: grayscale(100%);
|
||||
-o-filter: grayscale(100%);
|
||||
}
|
||||
</style>';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化插件
|
||||
function wp_gray_dates_init() {
|
||||
WP_Gray_Dates::get_instance();
|
||||
}
|
||||
add_action('plugins_loaded', 'wp_gray_dates_init');
|
Reference in New Issue
Block a user