kate522andClaude Opus 5
1970db0b56
顶栏改为知乎式两行结构：第一行左侧站点 LOGO、右侧当前用户头像， 第二行只保留正文工具条并居中，同时移除「Jio / 写文章」字样。 - bootstrap payload 新增 site/viewer 身份字段（复用 jio_get_site_logo_url 与 jio_get_avatar_url，前端不拼 URL、不做权限判断） - 拆分 draft 类型、TinyMCE 块运行时、顶栏组件，index.tsx 1065 → 735 行 - 清理死代码：未调用的 keepCaretInsideCode、永远无法打开的代码语言弹窗 （setCodeLanguage 只会收到 null，codeTargetRef 从未赋值）及其样式， 以及顶栏移除后失效的 bar-left/brand/mode/save-draft/ghost/primary 规则 - 契约测试、本地预览与截图脚本同步到新 DOM Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
132 lines
4.2 KiB
JavaScript
132 lines
4.2 KiB
JavaScript
/**
|
|
* 本地视觉预览页：加载 WordPress 官方 dist 脚本 + Creator Studio 构建产物，
|
|
* 用一份模拟的 bootstrap 数据渲染工作台，便于在不登录的情况下截图核对视觉。
|
|
* 仅用于本机视觉验收，不进入主题运行时。
|
|
*/
|
|
const fs = require('fs');
|
|
const path = require('path');
|
|
|
|
const [srcArg, outArg] = process.argv.slice(2);
|
|
const src = srcArg || '/tmp/studio-preview.html';
|
|
const out = outArg || 'C:/Users/Xing/Desktop/WP-Date/data/wordpress/jio-preview.html';
|
|
|
|
let html = fs.readFileSync(src, 'utf8');
|
|
|
|
const mockBootstrap = {
|
|
sourceId: 0,
|
|
versionId: 0,
|
|
versionRev: 0,
|
|
status: '',
|
|
reviewNote: '',
|
|
title: '',
|
|
excerpt: '',
|
|
content:
|
|
'<p>这是正文的第一段。微信公众号式的编辑体验强调沉浸感：留白克制，固定工具栏始终可用，发布设置只在需要时打开。</p>',
|
|
permalink: '',
|
|
isPublished: false,
|
|
categories: {
|
|
items: [
|
|
{ id: 1, name: '未分类' },
|
|
{ id: 4, name: '分类一' },
|
|
{ id: 5, name: '分类二' },
|
|
],
|
|
selected: [1],
|
|
},
|
|
tags: { items: ['写作', '产品'], enabled: true },
|
|
custom: {},
|
|
customDefs: [],
|
|
featured: { type: '', data: {}, canImage: true, canSlide: false, canVideo: false },
|
|
pay: {
|
|
enabled: false,
|
|
canPay: true,
|
|
canDownload: true,
|
|
payModo: 'cash',
|
|
price: '0.00',
|
|
points: 0,
|
|
vip1Price: '0.00',
|
|
vip2Price: '0.00',
|
|
payLimit: 0,
|
|
downloads: [],
|
|
freeAllowed: true,
|
|
priceMin: 0,
|
|
priceMax: 0,
|
|
pointsMin: 0,
|
|
pointsMax: 0,
|
|
privateStorage: false,
|
|
},
|
|
capabilities: {
|
|
canUploadImage: true,
|
|
canUploadVideo: true,
|
|
canUploadFile: true,
|
|
canEmbed: true,
|
|
canHide: true,
|
|
canPay: true,
|
|
canPayDownload: true,
|
|
canPublishNow: true,
|
|
canSchedule: true,
|
|
canEdit: true,
|
|
isLoggedIn: true,
|
|
},
|
|
limits: { titleMin: 5, titleMax: 100, titlePlaceholder: '请输入标题', contentPlaceholder: '请输入正文' },
|
|
privateUploads: [],
|
|
privateStorage: false,
|
|
media: { maxBytes: 5242880, batch: 6 },
|
|
rest: { root: 'https://localhost/wp-json/', nonce: 'preview' },
|
|
urls: { submit: '#', newPost: '#', center: '#' },
|
|
// 预览用内联 SVG，避免本地截图时依赖真实站点资源。
|
|
site: {
|
|
home: '#',
|
|
name: 'Jio',
|
|
logo:
|
|
'data:image/svg+xml;charset=utf-8,' +
|
|
encodeURIComponent(
|
|
'<svg xmlns="http://www.w3.org/2000/svg" width="132" height="30" viewBox="0 0 132 30">' +
|
|
'<text x="0" y="23" font-family="Songti SC, Noto Serif SC, serif" font-size="24" font-weight="700" fill="#1d5f52">Jio</text>' +
|
|
'<text x="42" y="23" font-family="system-ui, sans-serif" font-size="13" fill="#7d8683">写作中心</text>' +
|
|
'</svg>'
|
|
),
|
|
},
|
|
viewer: {
|
|
avatar:
|
|
'data:image/svg+xml;charset=utf-8,' +
|
|
encodeURIComponent(
|
|
'<svg xmlns="http://www.w3.org/2000/svg" width="72" height="72" viewBox="0 0 72 72">' +
|
|
'<rect width="72" height="72" fill="#dbe7e2"/>' +
|
|
'<circle cx="36" cy="28" r="12" fill="#8fb3a8"/>' +
|
|
'<path d="M12 72c0-13.3 10.7-24 24-24s24 10.7 24 24z" fill="#8fb3a8"/>' +
|
|
'</svg>'
|
|
),
|
|
},
|
|
captcha: { enabled: false },
|
|
creator: {
|
|
saveUrl: '#',
|
|
submitUrl: '#',
|
|
previewUrl: '#',
|
|
privateUrl: '#',
|
|
bootstrapUrl: '#',
|
|
},
|
|
nonce: 'preview',
|
|
timezone: 'Asia/Shanghai',
|
|
};
|
|
|
|
// 换成模拟数据。WP 的 wp_add_inline_script 会在结尾追加 sourceURL 注释，
|
|
// 所以只匹配到 JSON 的结束分号，保留其后的注释。
|
|
const before = html.length;
|
|
html = html.replace(
|
|
/window\.jioCreatorStudio = \{[\s\S]*?\};\n/,
|
|
`window.jioCreatorStudio = ${JSON.stringify(mockBootstrap)};\n`
|
|
);
|
|
if (html.length === before) {
|
|
console.error('WARN: bootstrap 替换未生效');
|
|
}
|
|
|
|
// 追加一个 banner 说明这是预览
|
|
html = html.replace(
|
|
'</body>',
|
|
`<div style="position:fixed;left:0;right:0;bottom:0;z-index:99999;padding:6px 12px;background:#1d5f52;color:#fff;font:12px/1.6 system-ui;text-align:center">视觉预览（模拟数据）· 非真实登录会话</div></body>`
|
|
);
|
|
|
|
fs.writeFileSync(out, html, 'utf8');
|
|
console.log('written ' + out + ' bytes=' + html.length);
|
|
console.log('has studio script: ' + /jio-creator-studio-js/.test(html));
|