Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

切换 IR 模式后依然展示工具栏 #230

Merged
merged 4 commits into from
Mar 23, 2020
Merged

切换 IR 模式后依然展示工具栏 #230

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
aabde9d
fix: toolbar hidden after switched to ir mode
NateScarlet Mar 23, 2020
95293d0
fix: lutejs load
NateScarlet Mar 23, 2020
ff9e1a8
feat: disable unsupported toolbar item for ir mode
NateScarlet Mar 23, 2020
aafb6f8
refactor: simplify code
NateScarlet Mar 23, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions src/ts/markdown/md2html.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,15 +2,15 @@ import {VDITOR_VERSION} from "../constants";
import {addScript} from "../util/addScript";

export const loadLuteJs = (vditor: IVditor | string) => {
// let cdn = `https://cdn.jsdelivr.net/npm/vditor@${VDITOR_VERSION}`;
// if (typeof vditor === "string" && vditor) {
// cdn = vditor;
// } else if (typeof vditor === "object" && vditor.options.cdn) {
// cdn = vditor.options.cdn;
// }
// addScript(`${cdn}/dist/js/lute/lute.min.js`, "vditorLuteScript");
let cdn = `https://cdn.jsdelivr.net/npm/vditor@${VDITOR_VERSION}`;
if (typeof vditor === "string" && vditor) {
cdn = vditor;
} else if (typeof vditor === "object" && vditor.options.cdn) {
cdn = vditor.options.cdn;
}
addScript(`${cdn}/dist/js/lute/lute.min.js`, "vditorLuteScript");
// addScript(`/src/js/lute/lute.min.js`, "vditorLuteScript");
addScript(`http://192.168.2.248:9090/lute.min.js?${new Date().getTime()}`, "vditorLuteScript");
// addScript(`http://192.168.2.248:9090/lute.min.js?${new Date().getTime()}`, "vditorLuteScript");

if (vditor && typeof vditor === "object" && !vditor.lute) {
vditor.lute = Lute.New();
Expand Down
8 changes: 6 additions & 2 deletions src/ts/toolbar/EditMode.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {getEventName, updateHotkeyTip} from "../util/compatibility";
import {getMarkdown} from "../util/getMarkdown";
import {renderDomByMd} from "../wysiwyg/renderDomByMd";
import {MenuItem} from "./MenuItem";
import {enableToolbar, hidePanel, hideToolbar, removeCurrentToolbar, showToolbar} from "./setToolbar";
import {enableToolbar, hidePanel, hideToolbar, removeCurrentToolbar, showToolbar, setToolbarEnabled} from "./setToolbar";

export const setEditMode = (vditor: IVditor, type: string, event?: Event) => {
if (event) {
Expand All @@ -25,7 +25,9 @@ export const setEditMode = (vditor: IVditor, type: string, event?: Event) => {
"line", "quote", "code", "inline-code", "upload", "record", "table"];

if (type === "ir") {
vditor.toolbar.element.style.display = "none";
hideToolbar(vditor.toolbar.elements, ["format", "both", "preview"]);
setToolbarEnabled(vditor.toolbar.elements, false);
setToolbarEnabled(vditor.toolbar.elements, true, ["edit-mode"]);
vditor.sv.element.style.display = "none";
vditor.preview.element.style.display = "none";
vditor.wysiwyg.element.parentElement.style.display = "none";
Expand All @@ -47,6 +49,7 @@ export const setEditMode = (vditor: IVditor, type: string, event?: Event) => {
setPadding(vditor);
} else if (type === "wysiwyg") {
hideToolbar(vditor.toolbar.elements, ["format", "both", "preview"]);
setToolbarEnabled(vditor.toolbar.elements)
vditor.toolbar.element.style.display = "block";
vditor.sv.element.style.display = "none";
vditor.preview.element.style.display = "none";
Expand All @@ -64,6 +67,7 @@ export const setEditMode = (vditor: IVditor, type: string, event?: Event) => {
setPadding(vditor);
} else if (type === "sv") {
showToolbar(vditor.toolbar.elements, ["format", "both", "preview"]);
setToolbarEnabled(vditor.toolbar.elements)
vditor.toolbar.element.style.display = "block";
removeCurrentToolbar(vditor.toolbar.elements, allToolbar);
enableToolbar(vditor.toolbar.elements, allToolbar);
Expand Down
19 changes: 19 additions & 0 deletions src/ts/toolbar/setToolbar.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,25 @@ export const disableToolbar = (toolbar: { [key: string]: HTMLElement }, names: s
});
};

const CLASS_DISABLED = 'vditor-menu--disabled'

/**
* 设置工具栏内容启用/禁用状态。
* @param enabled 启用或者禁用
* @param names 指定要操作的元素名称。默认为全部元素。
*/
export function setToolbarEnabled(
toolbar: { [key: string]: HTMLElement },
enabled: boolean = true,
names?: string[]
): void {
for (const [k, v] of Object.entries(toolbar)) {
if (!names || names.includes(k)) {
v.classList.toggle(CLASS_DISABLED, !enabled);
}
}
}

export const hideToolbar = (toolbar: { [key: string]: HTMLElement }, names: string[]) => {
names.forEach((name) => {
if (!toolbar[name]) {
Expand Down