Skip to content

Commit

Permalink
🎨 fix #149
Browse files Browse the repository at this point in the history
  • Loading branch information
@Vanessa219
Vanessa219 committed Feb 26, 2020
1 parent 9655fd8 commit a19b997
Show file tree
Hide file tree
Showing 8 changed files with 126 additions and 29 deletions.
5 changes: 5 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,11 @@

### v2.2.11 / 未发布

* [182](https://github.com/Vanessa219/vditor/issues/182) 支持 Setext 标题 `改进功能`
* [181](https://github.com/Vanessa219/vditor/issues/181) GFM Example52,54 - Setext 支持 `改进功能`
* [180](https://github.com/Vanessa219/vditor/issues/180) GFM Example 31 `修复缺陷`
* [149](https://github.com/Vanessa219/vditor/issues/149) [suggestion] UI Consistency `改进功能`

### v2.2.10 / 2020-02-26

* [178](https://github.com/Vanessa219/vditor/issues/178) 链接文本修改方式改进 `改进功能`
Expand Down
1 change: 1 addition & 0 deletions src/ts/util/Options.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -134,6 +134,7 @@ export class Options {
}, {
name: "|",
}, {
hotkey: "⌘-⇧-U",
name: "upload",
tipPosition: "n",
}, {
Expand Down
12 changes: 10 additions & 2 deletions src/ts/util/compatibility.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,10 +36,18 @@ export const isCtrl = (event: KeyboardEvent) => {
export const updateHotkeyTip = (hotkey: string) => {
if (/Mac/.test(navigator.platform)) {
hotkey = hotkey.replace("ctrl", "⌘").replace("shift", "⇧")
.replace("alt", "⌥").replace(":", ";");
.replace("alt", "⌥");
if (hotkey.indexOf("⇧") > -1) {
hotkey = hotkey.replace(":", ";").replace("+", "=")
.replace("_", "-");
}

} else {
hotkey = hotkey.replace("⌘", "ctrl").replace("⇧", "shift")
.replace("⌥", "alt").replace(";", ":");
.replace("⌥", "alt");
if (hotkey.indexOf("shift") > -1) {
hotkey = hotkey.replace(";", ":").replace("=", "+");
}
}
return hotkey;
};
6 changes: 5 additions & 1 deletion src/ts/util/editorCommenEvent.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,11 @@ export const hotkeyEvent = (vditor: IVditor, editorElement: HTMLElement) => {
return false;
}
if (matchHotKey(menuItem.hotkey, event)) {
(vditor.toolbar.elements[menuItem.name].children[0] as HTMLElement).click();
if (menuItem.name === "upload") {
(vditor.toolbar.elements[menuItem.name].querySelector("input") as HTMLElement).click();
} else {
(vditor.toolbar.elements[menuItem.name].children[0] as HTMLElement).click();
}
event.preventDefault();
return true;
}
Expand Down
7 changes: 5 additions & 2 deletions src/ts/util/hotKey.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,11 @@ import {isCtrl, updateHotkeyTip} from "./compatibility";
// 是否匹配 ⌘-⇧-[] / ⌘-[]
export const matchHotKey = (hotKey: string, event: KeyboardEvent) => {
const hotKeys = updateHotkeyTip(hotKey).split("-");
const hasShift = hotKeys.length === 3 && (hotKeys[1] === "shift" || hotKeys[1] === "⇧");
const key = (hasShift ? hotKeys[2] : hotKeys[1]) || "-";
const hasShift = hotKeys.length > 2 && (hotKeys[1] === "shift" || hotKeys[1] === "⇧");
let key = (hasShift ? hotKeys[2] : hotKeys[1]) || "-";
if (hasShift && key === "-" && !/Mac/.test(navigator.platform)) {
key = "_";
}
if (isCtrl(event) && event.key.toLowerCase() === key.toLowerCase() && !event.altKey
&& ((!hasShift && !event.shiftKey) || (hasShift && event.shiftKey))) {
return true;
Expand Down
24 changes: 24 additions & 0 deletions src/ts/wysiwyg/highlightToolbar.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -167,6 +167,8 @@ export const highlightToolbar = (vditor: IVditor) => {
const insertBefore = genInsertBefore(range, topListElement, vditor);
const insertAfter = genInsertAfter(range, topListElement, vditor);

const close = genClose(vditor.wysiwyg.popover, topListElement, vditor);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", close);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", insertBefore);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", insertAfter);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", outdent);
Expand Down Expand Up @@ -296,6 +298,7 @@ export const highlightToolbar = (vditor: IVditor) => {

const left = document.createElement("button");
left.setAttribute("aria-label", i18n[vditor.options.lang].alignLeft);
left.setAttribute("data-type", "left");
left.innerHTML = outdentSVG;
left.className = "vditor-icon vditor-tooltipped vditor-tooltipped__n" +
(alignType === "left" ? " vditor-icon--current" : "");
Expand All @@ -305,6 +308,7 @@ export const highlightToolbar = (vditor: IVditor) => {

const center = document.createElement("button");
center.setAttribute("aria-label", i18n[vditor.options.lang].alignCenter);
center.setAttribute("data-type", "center");
center.innerHTML = alignCenterSVG;
center.className = "vditor-icon vditor-tooltipped vditor-tooltipped__n" +
(alignType === "center" ? " vditor-icon--current" : "");
Expand All @@ -314,6 +318,7 @@ export const highlightToolbar = (vditor: IVditor) => {

const right = document.createElement("button");
right.setAttribute("aria-label", i18n[vditor.options.lang].alignRight);
right.setAttribute("data-type", "right");
right.innerHTML = indentSVG;
right.className = "vditor-icon vditor-tooltipped vditor-tooltipped__n" +
(alignType === "right" ? " vditor-icon--current" : "");
Expand All @@ -337,6 +342,15 @@ export const highlightToolbar = (vditor: IVditor) => {
input.oninput = () => {
updateTable();
};
input.onkeydown = (event) => {
if (event.key === "Tab") {
input2.focus();
input2.select();
event.preventDefault();
return;
}
};

const input2Wrap = document.createElement("span");
input2Wrap.setAttribute("aria-label", i18n[vditor.options.lang].column);
input2Wrap.className = "vditor-tooltipped vditor-tooltipped__n";
Expand All @@ -353,6 +367,14 @@ export const highlightToolbar = (vditor: IVditor) => {
input2.oninput = () => {
updateTable();
};
input2.onkeydown = (event) => {
if (event.key === "Tab") {
input.focus();
input.select();
event.preventDefault();
return;
}
};

const insertBefore = genInsertBefore(range, tableElement, vditor);
const insertAfter = genInsertAfter(range, tableElement, vditor);
Expand Down Expand Up @@ -653,6 +675,8 @@ export const genAPopover = (vditor: IVditor, aElement: HTMLElement) => {
hotkey(event, input);
};

const close = genClose(vditor.wysiwyg.popover, aElement, vditor);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", close);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", inputWrap);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", input1Wrap);
vditor.wysiwyg.popover.insertAdjacentElement("beforeend", input2Wrap);
Expand Down
95 changes: 71 additions & 24 deletions src/ts/wysiwyg/processKeydown.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,9 +163,8 @@ export const processKeydown = (vditor: IVditor, event: KeyboardEvent) => {
return true;
}

// alt+Backspace：删除行
if (!isCtrl(event) && !event.shiftKey && event.altKey && cellElement.tagName === "TD"
&& event.key === "Backspace") {
// 删除当前行
if (cellElement.tagName === "TD" && matchHotKey("⌘--", event)) {
const tbodyElement = cellElement.parentElement.parentElement;
if (cellElement.parentElement.previousElementSibling) {
range.selectNodeContents(cellElement.parentElement.previousElementSibling.lastElementChild);
Expand All @@ -185,8 +184,8 @@ export const processKeydown = (vditor: IVditor, event: KeyboardEvent) => {
return true;
}

// alt+enter: 下方新添加一行 https://github.com/Vanessa219/vditor/issues/46
if (!isCtrl(event) && !event.shiftKey && event.altKey && event.key === "Enter") {
// 下方新添加一行 https://github.com/Vanessa219/vditor/issues/46
if (matchHotKey("⌘-=", event)) {
let rowHTML = "";
for (let m = 0; m < cellElement.parentElement.childElementCount; m++) {
rowHTML += `<td>${m === 0 ? "<wbr>" : ""}</td>`;
Expand All @@ -204,9 +203,10 @@ export const processKeydown = (vditor: IVditor, event: KeyboardEvent) => {
return true;
}

// alt+shift+enter: 后方新添加一列
// 后方新添加一列
const tableElement = cellElement.parentElement.parentElement.parentElement as HTMLTableElement;
if (!isCtrl(event) && event.shiftKey && event.altKey && event.key === "Enter") {

if (matchHotKey("⌘-⇧-=", event)) {
let index = 0;
let previousElement = cellElement.previousElementSibling;
while (previousElement) {
Expand All @@ -226,8 +226,8 @@ export const processKeydown = (vditor: IVditor, event: KeyboardEvent) => {
return true;
}

// alt+shift+Backspace: 删除当前列
if (!isCtrl(event) && event.shiftKey && event.altKey && event.key === "Backspace") {
// 删除当前列
if (matchHotKey("⌘-⇧--", event)) {
let index = 0;
let previousElement = cellElement.previousElementSibling;
while (previousElement) {
Expand All @@ -249,6 +249,44 @@ export const processKeydown = (vditor: IVditor, event: KeyboardEvent) => {
event.preventDefault();
return true;
}

// focus row input
if (!isCtrl(event) && event.key === "Enter" && !event.shiftKey && event.altKey) {
const inputElemment = (vditor.wysiwyg.popover.querySelector(".vditor-input") as HTMLInputElement);
inputElemment.focus();
inputElemment.select();
event.preventDefault();
return true;
}

// 剧左
if (matchHotKey("⌘-⇧-L", event)) {
const itemElement: HTMLElement = vditor.wysiwyg.popover.querySelector('[data-type="left"]');
if (itemElement) {
itemElement.click();
event.preventDefault();
return true;
}
}

// 剧中
if (matchHotKey("⌘-⇧-C", event)) {
const itemElement: HTMLElement = vditor.wysiwyg.popover.querySelector('[data-type="center"]');
if (itemElement) {
itemElement.click();
event.preventDefault();
return true;
}
}
// 剧右
if (matchHotKey("⌘-⇧-R", event)) {
const itemElement: HTMLElement = vditor.wysiwyg.popover.querySelector('[data-type="right"]');
if (itemElement) {
itemElement.click();
event.preventDefault();
return true;
}
}
}

// code render
Expand All @@ -265,7 +303,9 @@ export const processKeydown = (vditor: IVditor, event: KeyboardEvent) => {
// alt+enter: 代码块切换到语言 https://github.com/Vanessa219/vditor/issues/54
if (!isCtrl(event) && !event.shiftKey && event.altKey && event.key === "Enter" &&
codeRenderElement.getAttribute("data-type") === "code-block") {
(vditor.wysiwyg.popover.querySelector(".vditor-input") as HTMLElement).focus();
const inputElemment = (vditor.wysiwyg.popover.querySelector(".vditor-input") as HTMLInputElement);
inputElemment.focus();
inputElemment.select();
event.preventDefault();
return true;
}
Expand Down Expand Up @@ -326,20 +366,27 @@ export const processKeydown = (vditor: IVditor, event: KeyboardEvent) => {

// 顶层 blockquote
const topBQElement = hasTopClosestByTag(startContainer, "BLOCKQUOTE");
if (topBQElement && !isCtrl(event) && !event.shiftKey && event.altKey && event.key === "Enter") {
// alt+enter: 跳出多层 blockquote 嵌套 https://github.com/Vanessa219/vditor/issues/51
range.setStartAfter(topBQElement);
setSelectionFocus(range);
const node = document.createElement("p");
node.setAttribute("data-block", "0");
node.innerHTML = "\n";
range.insertNode(node);
range.collapse(true);
setSelectionFocus(range);
afterRenderEvent(vditor);
scrollCenter(vditor.wysiwyg.element);
event.preventDefault();
return true;
if (topBQElement) {
if (!event.shiftKey && event.altKey && event.key === "Enter") {
if (!isCtrl(event)) {
// alt+enter: 跳出多层 blockquote 嵌套之后 https://github.com/Vanessa219/vditor/issues/51
range.setStartAfter(topBQElement);
} else {
// ctrl+alt+enter: 跳出多层 blockquote 嵌套之前
range.setStartBefore(topBQElement);
}
setSelectionFocus(range);
const node = document.createElement("p");
node.setAttribute("data-block", "0");
node.innerHTML = "\n";
range.insertNode(node);
range.collapse(true);
setSelectionFocus(range);
afterRenderEvent(vditor);
scrollCenter(vditor.wysiwyg.element);
event.preventDefault();
return true;
}
}

// blockquote
Expand Down
5 changes: 5 additions & 0 deletions src/ts/wysiwyg/processMD.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,11 @@ export const isHeadingMD = (text: string) => {
// - =
const textArray = text.trimRight().split("\n");
text = textArray.pop();

if (text.indexOf(" ") === 0 || text.indexOf("\t") === 0) {
return false;
}

text = text.trimLeft();
if (text === "" || textArray.length === 0) {
return false;
Expand Down

0 comments on commit a19b997

Please sign in to comment.