nanhaoluo/argon-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 从 settings.php 和 functions.php 中移除所有 Mermaid 支持

Browse Source 
- 从 settings.php 移除完整的 Mermaid 设置部分（约 370 行）
- 从 settings.php 移除 Mermaid 选项保存代码
- 从 functions.php 移除所有 Mermaid 相关函数（约 500 行）
- 从 header.php 移除 Mermaid 相关注释
- 保留 assets/vendor/mermaid/ 库文件供未来可能的插件使用
This commit is contained in:
nanhaoluo
2026-01-27 10:45:21 +08:00
parent 0a8bb3a453
commit 734822883e
3 changed files with 3 additions and 1085 deletions
Download Patch File Download Diff File Expand all files Collapse all files

378
settings.php
View File

@@ -3583,374 +3583,8 @@ function themeoptions_page(){
</tr>
<!-- ========== 15. Mermaid 图表 ========== -->
<tr><th class="subtitle"><h2 id="section-mermaid"><?php _e('Mermaid 图表', 'argon');?></h2></th></tr>
<tr><th class="subtitle"><h3 id="subsection-mermaid-basic"><?php _e('基本设置', 'argon');?></h3></th></tr>
<tr>
<th><label><?php _e('启用 Mermaid 支持', 'argon');?></label></th>
<td>
<?php $argon_enable_mermaid = get_option('argon_enable_mermaid', 'false');?>
<label>
<input type="checkbox" name="argon_enable_mermaid" value="true" <?php if ($argon_enable_mermaid=='true'){echo 'checked';}?>/>
<?php _e('启用 Mermaid 图表渲染功能', 'argon');?>
</label>
<p class="description"><?php _e('启用后，主题将支持在文章中渲染 Mermaid 图表（流程图、时序图、类图等）', 'argon');?></p>
</td>
</tr>
<tr>
<th><label><?php _e('CDN 来源', 'argon');?></label></th>
<td>
<select name="argon_mermaid_cdn_source">
<?php $argon_mermaid_cdn_source = get_option('argon_mermaid_cdn_source', 'jsdelivr'); ?>
<option value="jsdelivr" <?php if ($argon_mermaid_cdn_source=='jsdelivr'){echo 'selected';} ?>><?php _e('jsDelivr CDN', 'argon');?></option>
<option value="unpkg" <?php if ($argon_mermaid_cdn_source=='unpkg'){echo 'selected';} ?>><?php _e('unpkg CDN', 'argon');?></option>
<option value="custom" <?php if ($argon_mermaid_cdn_source=='custom'){echo 'selected';} ?>><?php _e('自定义 CDN 地址', 'argon');?></option>
<option value="local" <?php if ($argon_mermaid_cdn_source=='local'){echo 'selected';} ?>><?php _e('本地文件', 'argon');?></option>
</select>
<p class="description"><?php _e('选择 Mermaid 库的加载来源。jsDelivr 和 unpkg 为公共 CDN，本地文件需要手动下载到主题目录', 'argon');?></p>
</td>
</tr>
<tr>
<th><label><?php _e('自定义 CDN 地址', 'argon');?></label></th>
<td>
<input type="text" class="regular-text" name="argon_mermaid_cdn_custom_url" value="<?php echo get_option('argon_mermaid_cdn_custom_url', ''); ?>" placeholder="https://example.com/mermaid.min.js"/>
<p class="description"><?php _e('当 CDN 来源选择"自定义 CDN 地址"时生效。请输入完整的 Mermaid 库 URL（必须以 .js 结尾）。推荐使用 Mermaid v11 或更高版本', 'argon');?></p>
</td>
</tr>
<tr><th class="subtitle"><h3 id="subsection-mermaid-appearance"><?php _e('外观设置', 'argon');?></h3></th></tr>
<tr>
<th><label><?php _e('图表主题', 'argon');?></label></th>
<td>
<select name="argon_mermaid_theme">
<?php $argon_mermaid_theme = get_option('argon_mermaid_theme', 'auto'); ?>
<option value="auto" <?php if ($argon_mermaid_theme=='auto'){echo 'selected';} ?>><?php _e('自动切换（跟随页面主题）', 'argon');?></option>
<option value="default" <?php if ($argon_mermaid_theme=='default'){echo 'selected';} ?>><?php _e('默认主题（浅色）', 'argon');?></option>
<option value="dark" <?php if ($argon_mermaid_theme=='dark'){echo 'selected';} ?>><?php _e('深色主题', 'argon');?></option>
<option value="forest" <?php if ($argon_mermaid_theme=='forest'){echo 'selected';} ?>><?php _e('森林主题（绿色）', 'argon');?></option>
<option value="neutral" <?php if ($argon_mermaid_theme=='neutral'){echo 'selected';} ?>><?php _e('中性主题（灰色）', 'argon');?></option>
</select>
<p class="description"><?php _e('选择 Mermaid 图表的配色主题。"自动切换"会根据页面的日间/夜间模式自动选择浅色或深色主题', 'argon');?></p>
</td>
</tr>
<tr><th class="subtitle"><h3 id="subsection-mermaid-advanced"><?php _e('高级选项', 'argon');?></h3></th></tr>
<tr>
<th><label><?php _e('使用本地镜像', 'argon');?></label></th>
<td>
<?php $argon_mermaid_use_local = get_option('argon_mermaid_use_local', 'false');?>
<label>
<input type="checkbox" name="argon_mermaid_use_local" value="true" <?php if ($argon_mermaid_use_local=='true'){echo 'checked';}?>/>
<?php _e('优先使用本地镜像文件', 'argon');?>
</label>
<p class="description"><?php _e('启用后，如果检测到主题目录中存在 Mermaid 库文件，将优先使用本地文件而不是 CDN', 'argon');?></p>
</td>
</tr>
<tr>
<th><label><?php _e('调试模式', 'argon');?></label></th>
<td>
<?php $argon_mermaid_debug_mode = get_option('argon_mermaid_debug_mode', 'false');?>
<label>
<input type="checkbox" name="argon_mermaid_debug_mode" value="true" <?php if ($argon_mermaid_debug_mode=='true'){echo 'checked';}?>/>
<?php _e('启用调试模式', 'argon');?>
</label>
<p class="description"><?php _e('启用后，将在浏览器控制台输出详细的 Mermaid 渲染日志，便于排查问题', 'argon');?></p>
</td>
</tr>
<tr>
<th><label><?php _e('插件兼容性', 'argon');?></label></th>
<td>
<?php
// 获取插件兼容性状态
$compat_status = argon_get_mermaid_compatibility_status();
$plugins = $compat_status['plugins'];
$plugin_count = $compat_status['plugin_count'];
$has_conflict = $compat_status['has_conflict'];
?>
<div style="padding: 10px; background: <?php echo $has_conflict ? '#fff3cd' : '#d1ecf1'; ?>; border: 1px solid <?php echo $has_conflict ? '#ffc107' : '#bee5eb'; ?>; border-radius: 4px; margin-bottom: 10px;">
<p style="margin: 0 0 10px 0; font-weight: bold;">
<?php echo esc_html($compat_status['message']); ?>
</p>
<div style="margin-bottom: 10px;">
<strong><?php _e('检测到的插件：', 'argon'); ?></strong>
<ul style="margin: 5px 0; padding-left: 20px;">
<?php if ($plugins['wp-githuber-md']): ?>
<li>✓ WP Githuber MD</li>
<?php endif; ?>
<?php if ($plugins['markdown-block']): ?>
<li>✓ Markdown Block</li>
<?php endif; ?>
<?php if ($plugins['code-syntax-block']): ?>
<li>✓ Code Syntax Block</li>
<?php endif; ?>
<?php if ($plugin_count === 0): ?>
<li><?php _e('未检测到 Mermaid 插件', 'argon'); ?></li>
<?php endif; ?>
</ul>
</div>
<?php if ($compat_status['library_enqueued']): ?>
<p style="margin: 5px 0; color: #0c5460;">
<strong><?php _e('状态：', 'argon'); ?></strong>
<?php _e('检测到 Mermaid 库已由其他来源加载', 'argon'); ?>
</p>
<?php endif; ?>
<p style="margin: 5px 0 0 0; color: #004085;">
<strong><?php _e('建议：', 'argon'); ?></strong>
<?php echo esc_html($compat_status['recommendation']); ?>
</p>
</div>
<p class="description">
<?php _e('主题会自动检测已安装的 Mermaid 插件，避免重复加载库文件。如果检测到插件，主题将只提供样式增强功能。', 'argon'); ?>
</p>
</td>
</tr>
<tr><th class="subtitle"><h3 id="subsection-mermaid-preview"><?php _e('预览与示例', 'argon');?></h3></th></tr>
<tr>
<th><label><?php _e('实时预览', 'argon');?></label></th>
<td>
<div id="mermaid-preview-container" style="margin-bottom: 20px;">
<div style="margin-bottom: 10px;">
<label style="display: block; margin-bottom: 5px; font-weight: bold;">
<?php _e('选择示例图表：', 'argon'); ?>
</label>
<select id="mermaid-example-selector" style="width: 100%; max-width: 400px; padding: 5px;">
<option value="flowchart"><?php _e('流程图 (Flowchart)', 'argon'); ?></option>
<option value="sequence"><?php _e('时序图 (Sequence Diagram)', 'argon'); ?></option>
<option value="class"><?php _e('类图 (Class Diagram)', 'argon'); ?></option>
<option value="state"><?php _e('状态图 (State Diagram)', 'argon'); ?></option>
<option value="gantt"><?php _e('甘特图 (Gantt Chart)', 'argon'); ?></option>
<option value="pie"><?php _e('饼图 (Pie Chart)', 'argon'); ?></option>
<option value="git"><?php _e('Git 图 (Git Graph)', 'argon'); ?></option>
</select>
</div>
<div style="margin-bottom: 10px;">
<label style="display: block; margin-bottom: 5px; font-weight: bold;">
<?php _e('Mermaid 代码：', 'argon'); ?>
</label>
<textarea id="mermaid-code-input" rows="10" style="width: 100%; font-family: monospace; padding: 10px; border: 1px solid #ddd; border-radius: 4px;"></textarea>
</div>
<div style="margin-bottom: 10px;">
<button type="button" id="mermaid-render-btn" class="button button-primary">
<?php _e('渲染预览', 'argon'); ?>
</button>
<button type="button" id="mermaid-reset-btn" class="button">
<?php _e('重置', 'argon'); ?>
</button>
</div>
<div style="margin-bottom: 10px;">
<label style="display: block; margin-bottom: 5px; font-weight: bold;">
<?php _e('预览效果：', 'argon'); ?>
</label>
<div id="mermaid-preview-output" style="padding: 20px; background: #f9f9f9; border: 1px solid #ddd; border-radius: 4px; min-height: 200px; overflow-x: auto;">
<p style="color: #666; text-align: center; margin: 80px 0;">
<?php _e('请选择示例或输入 Mermaid 代码，然后点击"渲染预览"按钮', 'argon'); ?>
</p>
</div>
</div>
<div id="mermaid-preview-error" style="display: none; padding: 10px; background: #fff3cd; border: 1px solid #ffc107; border-radius: 4px; margin-top: 10px;">
<p style="margin: 0; color: #856404;">
<strong><?php _e('渲染错误：', 'argon'); ?></strong>
<span id="mermaid-error-message"></span>
</p>
</div>
</div>
<p class="description">
<?php _e('在此预览区域可以实时测试 Mermaid 图表的渲染效果。选择示例图表或输入自定义代码，点击"渲染预览"查看效果。', 'argon'); ?>
</p>
<script>
// Mermaid 示例代码
const mermaidExamples = {
flowchart: `flowchart TD
A[开始] --> B{是否登录?}
B -->|是| C[显示主页]
B -->|否| D[跳转登录页]
C --> E[结束]
D --> E`,
sequence: `sequenceDiagram
participant 用户
participant 浏览器
participant 服务器
用户->>浏览器: 输入网址
浏览器->>服务器: 发送请求
服务器-->>浏览器: 返回页面
浏览器-->>用户: 显示内容`,
class: `classDiagram
class Animal {
+String name
+int age
+makeSound()
}
class Dog {
+String breed
+bark()
}
class Cat {
+String color
+meow()
}
Animal <|-- Dog
Animal <|-- Cat`,
state: `stateDiagram-v2
[*] --> 待机
待机 --> 运行: 启动
运行 --> 暂停: 暂停
暂停 --> 运行: 继续
运行 --> 停止: 停止
停止 --> [*]`,
gantt: `gantt
title 项目开发计划
dateFormat YYYY-MM-DD
section 设计阶段
需求分析 :a1, 2024-01-01, 7d
UI设计 :a2, after a1, 5d
section 开发阶段
前端开发 :b1, after a2, 10d
后端开发 :b2, after a2, 12d
section 测试阶段
功能测试 :c1, after b1, 5d
性能测试 :c2, after b2, 3d`,
pie: `pie title 编程语言使用占比
"JavaScript" : 35
"Python" : 25
"Java" : 20
"C++" : 12
"其他" : 8`,
git: `gitGraph
commit
commit
branch develop
checkout develop
commit
commit
checkout main
merge develop
commit
commit`
};
// 初始化
jQuery(document).ready(function($) {
const $selector = $('#mermaid-example-selector');
const $codeInput = $('#mermaid-code-input');
const $renderBtn = $('#mermaid-render-btn');
const $resetBtn = $('#mermaid-reset-btn');
const $output = $('#mermaid-preview-output');
const $error = $('#mermaid-preview-error');
const $errorMsg = $('#mermaid-error-message');
// 加载默认示例
$codeInput.val(mermaidExamples.flowchart);
// 切换示例
$selector.on('change', function() {
const example = $(this).val();
$codeInput.val(mermaidExamples[example]);
});
// 渲染预览
$renderBtn.on('click', function() {
const code = $codeInput.val().trim();
if (!code) {
alert('<?php _e('请输入 Mermaid 代码', 'argon'); ?>');
return;
}
// 隐藏错误信息
$error.hide();
// 显示加载状态
$output.html('<p style="color: #666; text-align: center; margin: 80px 0;"><?php _e('正在渲染...', 'argon'); ?></p>');
// 动态加载 Mermaid 库
if (typeof mermaid === 'undefined') {
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js';
script.onload = function() {
renderMermaid(code);
};
script.onerror = function() {
showError('<?php _e('Mermaid 库加载失败，请检查网络连接', 'argon'); ?>');
};
document.head.appendChild(script);
} else {
renderMermaid(code);
}
});
// 重置
$resetBtn.on('click', function() {
$selector.val('flowchart').trigger('change');
$output.html('<p style="color: #666; text-align: center; margin: 80px 0;"><?php _e('请选择示例或输入 Mermaid 代码，然后点击"渲染预览"按钮', 'argon'); ?></p>');
$error.hide();
});
// 渲染函数
function renderMermaid(code) {
try {
// 获取当前主题设置
const themeSelect = $('select[name="argon_mermaid_theme"]');
let theme = themeSelect.length ? themeSelect.val() : 'default';
// 如果是自动切换，根据当前页面模式选择主题
if (theme === 'auto') {
theme = $('html').hasClass('darkmode') ? 'dark' : 'default';
}
// 初始化 Mermaid
mermaid.initialize({
startOnLoad: false,
theme: theme,
securityLevel: 'loose',
logLevel: 'error'
});
// 生成唯一 ID
const id = 'mermaid-preview-' + Date.now();
// 渲染
mermaid.render(id, code).then(function(result) {
$output.html(result.svg);
$error.hide();
}).catch(function(error) {
showError(error.message || error.toString());
});
} catch (error) {
showError(error.message || error.toString());
}
}
// 显示错误
function showError(message) {
$output.html('<p style="color: #666; text-align: center; margin: 80px 0;"><?php _e('渲染失败', 'argon'); ?></p>');
$errorMsg.text(message);
$error.show();
}
});
</script>
</td>
</tr>
<!-- ========== 16. 高级设置 ========== -->
<tr><th class="subtitle"><h2 id="section-advanced"><?php _e('高级设置', 'argon');?></h2></th></tr>
<!-- ========== 16. 高级设置 ========== -->
<tr><th class="subtitle"><h2 id="section-advanced"><?php _e('高级设置', 'argon');?></h2></th></tr>
@@ -7096,14 +6730,6 @@ function argon_update_themeoptions(){
argon_update_option('argon_enable_pangu');
// Mermaid 图表配置
argon_update_option_checkbox('argon_enable_mermaid');
argon_update_option('argon_mermaid_cdn_source');
argon_update_option('argon_mermaid_cdn_custom_url');
argon_update_option('argon_mermaid_theme');
argon_update_option_checkbox('argon_mermaid_use_local');
argon_update_option_checkbox('argon_mermaid_debug_mode');
argon_update_option('argon_assets_path');
argon_update_option('argon_custom_assets_path');