|
@@ -33,8 +33,8 @@ export const genCardHTML = (options: {
|
|
|
<svg><use xlink:href="#iconCloseRound"></use></svg>
|
|
|
</div>` : `<div data-type="fullscreen" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show" aria-label="${window.siyuan.languages.fullscreen}">
|
|
|
<svg><use xlink:href="#iconFullscreen"></use></svg>
|
|
|
-</div><div class="fn__space"></div>
|
|
|
-<div data-type="sticktab" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show" aria-label="${window.siyuan.languages.openInNewTab}">
|
|
|
+</div><div class="fn__space${options.isTab ? " fn__none" : ""}"></div>
|
|
|
+<div data-type="sticktab" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show${options.isTab ? " fn__none" : ""}" aria-label="${window.siyuan.languages.openInNewTab}">
|
|
|
<svg><use xlink:href="#iconLayoutRight"></use></svg>
|
|
|
</div>`}
|
|
|
</div>
|
|
@@ -54,35 +54,35 @@ export const genCardHTML = (options: {
|
|
|
<div class="fn__flex card__action fn__none">
|
|
|
<div>
|
|
|
<span>${window.siyuan.languages.nextRound}</span>
|
|
|
- <button data-type="-3" aria-label="0" class="b3-button b3-button--cancel b3-tooltips__s b3-tooltips">
|
|
|
+ <button data-type="-3" aria-label="0" class="b3-button b3-button--cancel b3-tooltips__n b3-tooltips">
|
|
|
<div>💤</div>
|
|
|
${window.siyuan.languages.skip} (0)
|
|
|
</button>
|
|
|
</div>
|
|
|
<div>
|
|
|
<span></span>
|
|
|
- <button data-type="0" aria-label="1 / j" class="b3-button b3-button--error b3-tooltips__s b3-tooltips">
|
|
|
+ <button data-type="0" aria-label="1 / j" class="b3-button b3-button--error b3-tooltips__n b3-tooltips">
|
|
|
<div>🙈</div>
|
|
|
${window.siyuan.languages.cardRatingAgain} (1)
|
|
|
</button>
|
|
|
</div>
|
|
|
<div>
|
|
|
<span></span>
|
|
|
- <button data-type="1" aria-label="2 / k" class="b3-button b3-button--warning b3-tooltips__s b3-tooltips">
|
|
|
+ <button data-type="1" aria-label="2 / k" class="b3-button b3-button--warning b3-tooltips__n b3-tooltips">
|
|
|
<div>😬</div>
|
|
|
${window.siyuan.languages.cardRatingHard} (2)
|
|
|
</button>
|
|
|
</div>
|
|
|
<div>
|
|
|
<span></span>
|
|
|
- <button data-type="2" aria-label="3 / l" class="b3-button b3-button--info b3-tooltips__s b3-tooltips">
|
|
|
+ <button data-type="2" aria-label="3 / l" class="b3-button b3-button--info b3-tooltips__n b3-tooltips">
|
|
|
<div>😊</div>
|
|
|
${window.siyuan.languages.cardRatingGood} (3)
|
|
|
</button>
|
|
|
</div>
|
|
|
<div>
|
|
|
<span></span>
|
|
|
- <button data-type="3" aria-label="4 / ;" class="b3-button b3-button--success b3-tooltips__s b3-tooltips">
|
|
|
+ <button data-type="3" aria-label="4 / ;" class="b3-button b3-button--success b3-tooltips__n b3-tooltips">
|
|
|
<div>🌈</div>
|
|
|
${window.siyuan.languages.cardRatingEasy} (4)
|
|
|
</button>
|
|
@@ -91,44 +91,16 @@ export const genCardHTML = (options: {
|
|
|
</div>`;
|
|
|
};
|
|
|
|
|
|
-export const openCard = () => {
|
|
|
- fetchPost("/api/riff/getRiffDueCards", {deckID: ""}, (cardsResponse) => {
|
|
|
- openCardByData(cardsResponse.data, "all");
|
|
|
- });
|
|
|
-};
|
|
|
-
|
|
|
-export const openCardByData = (cardsData: {
|
|
|
- cards: ICard[],
|
|
|
- unreviewedCount: number
|
|
|
-}, cardType: TCardType, id?: string, title?: string) => {
|
|
|
- const exit = window.siyuan.dialogs.find(item => {
|
|
|
- if (item.element.getAttribute("data-key") === window.siyuan.config.keymap.general.riffCard.custom) {
|
|
|
- item.destroy();
|
|
|
- return true;
|
|
|
- }
|
|
|
- });
|
|
|
- if (exit) {
|
|
|
- return;
|
|
|
- }
|
|
|
-
|
|
|
- let blocks = cardsData.cards;
|
|
|
+export const bindCardEvent = (options: {
|
|
|
+ element: Element,
|
|
|
+ title?: string,
|
|
|
+ blocks: ICard[],
|
|
|
+ cardType: TCardType,
|
|
|
+ id?: string,
|
|
|
+ dialog: Dialog,
|
|
|
+}) => {
|
|
|
let index = 0;
|
|
|
- const dialog = new Dialog({
|
|
|
- content: genCardHTML({id, cardType, blocks, isTab: false}),
|
|
|
- width: isMobile() ? "100vw" : "80vw",
|
|
|
- height: isMobile() ? "100vh" : "70vh",
|
|
|
- destroyCallback() {
|
|
|
- if (editor) {
|
|
|
- editor.destroy();
|
|
|
- if (window.siyuan.mobile) {
|
|
|
- window.siyuan.mobile.popEditor = null;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- (dialog.element.querySelector(".b3-dialog__scrim") as HTMLElement).style.backgroundColor = "var(--b3-theme-background)";
|
|
|
- (dialog.element.querySelector(".b3-dialog__container") as HTMLElement).style.maxWidth = "1024px";
|
|
|
- const editor = new Protyle(dialog.element.querySelector("[data-type='render']") as HTMLElement, {
|
|
|
+ const editor = new Protyle(options.element.querySelector("[data-type='render']") as HTMLElement, {
|
|
|
blockId: "",
|
|
|
action: [Constants.CB_GET_ALL],
|
|
|
render: {
|
|
@@ -145,20 +117,20 @@ export const openCardByData = (cardsData: {
|
|
|
if (window.siyuan.config.editor.readOnly) {
|
|
|
disabledProtyle(editor.protyle);
|
|
|
}
|
|
|
- if (blocks.length > 0) {
|
|
|
+ if (options.blocks.length > 0) {
|
|
|
fetchPost("/api/filetree/getDoc", {
|
|
|
- id: blocks[index].blockID,
|
|
|
+ id: options.blocks[index].blockID,
|
|
|
mode: 0,
|
|
|
size: Constants.SIZE_GET_MAX
|
|
|
}, (response) => {
|
|
|
onGet(response, editor.protyle, [Constants.CB_GET_ALL, Constants.CB_GET_HTML]);
|
|
|
});
|
|
|
}
|
|
|
- (dialog.element.firstElementChild as HTMLElement).style.zIndex = "200";
|
|
|
- dialog.element.setAttribute("data-key", window.siyuan.config.keymap.general.riffCard.custom);
|
|
|
- const countElement = dialog.element.querySelector('[data-type="count"]');
|
|
|
- const actionElements = dialog.element.querySelectorAll(".card__action");
|
|
|
- const filterElement = dialog.element.querySelector('[data-type="filter"]');
|
|
|
+ (options.element.firstElementChild as HTMLElement).style.zIndex = "200";
|
|
|
+ options.element.setAttribute("data-key", window.siyuan.config.keymap.general.riffCard.custom);
|
|
|
+ const countElement = options.element.querySelector('[data-type="count"]');
|
|
|
+ const actionElements = options.element.querySelectorAll(".card__action");
|
|
|
+ const filterElement = options.element.querySelector('[data-type="filter"]');
|
|
|
const fetchNewRound = () => {
|
|
|
const currentCardType = filterElement.getAttribute("data-cardtype");
|
|
|
fetchPost(currentCardType === "all" ? "/api/riff/getRiffDueCards" :
|
|
@@ -168,14 +140,14 @@ export const openCardByData = (cardsData: {
|
|
|
notebook: filterElement.getAttribute("data-id"),
|
|
|
}, (treeCards) => {
|
|
|
index = 0;
|
|
|
- blocks = treeCards.data.cards;
|
|
|
- if (blocks.length > 0) {
|
|
|
+ options.blocks = treeCards.data.cards;
|
|
|
+ if (options.blocks.length > 0) {
|
|
|
nextCard({
|
|
|
countElement,
|
|
|
editor,
|
|
|
actionElements,
|
|
|
index,
|
|
|
- blocks
|
|
|
+ blocks: options.blocks
|
|
|
});
|
|
|
} else {
|
|
|
allDone(countElement, editor, actionElements);
|
|
@@ -183,7 +155,7 @@ export const openCardByData = (cardsData: {
|
|
|
});
|
|
|
};
|
|
|
|
|
|
- dialog.element.addEventListener("click", (event) => {
|
|
|
+ options.element.addEventListener("click", (event: MouseEvent) => {
|
|
|
const target = event.target as HTMLElement;
|
|
|
let type = "";
|
|
|
if (typeof event.detail === "string") {
|
|
@@ -205,8 +177,8 @@ export const openCardByData = (cardsData: {
|
|
|
} else {
|
|
|
const fullscreenElement = hasClosestByAttribute(target, "data-type", "fullscreen");
|
|
|
if (fullscreenElement) {
|
|
|
- fullscreen(dialog.element.querySelector(".card__main"),
|
|
|
- dialog.element.querySelector('[data-type="fullscreen"]'));
|
|
|
+ fullscreen(options.element.querySelector(".card__main"),
|
|
|
+ options.element.querySelector('[data-type="fullscreen"]'));
|
|
|
event.stopPropagation();
|
|
|
event.preventDefault();
|
|
|
return;
|
|
@@ -214,9 +186,10 @@ export const openCardByData = (cardsData: {
|
|
|
const sticktabElement = hasClosestByAttribute(target, "data-type", "sticktab");
|
|
|
if (sticktabElement) {
|
|
|
newCardTab({
|
|
|
- type: filterElement.getAttribute("data-cardtype") as TCardType,
|
|
|
+ cardType: filterElement.getAttribute("data-cardtype") as TCardType,
|
|
|
id: filterElement.getAttribute("data-id"),
|
|
|
- dialog,
|
|
|
+ dialog: options.dialog,
|
|
|
+ title: options.title
|
|
|
});
|
|
|
event.stopPropagation();
|
|
|
event.preventDefault();
|
|
@@ -224,7 +197,7 @@ export const openCardByData = (cardsData: {
|
|
|
}
|
|
|
const closeElement = hasClosestByAttribute(target, "data-type", "close");
|
|
|
if (closeElement) {
|
|
|
- dialog.destroy();
|
|
|
+ options.dialog.destroy();
|
|
|
event.stopPropagation();
|
|
|
event.preventDefault();
|
|
|
return;
|
|
@@ -253,16 +226,16 @@ export const openCardByData = (cardsData: {
|
|
|
}, [], undefined, window.siyuan.languages.specifyPath, true);
|
|
|
}
|
|
|
}).element);
|
|
|
- if (title || response.data.length > 0) {
|
|
|
+ if (options.title || response.data.length > 0) {
|
|
|
window.siyuan.menus.menu.append(new MenuItem({type: "separator"}).element);
|
|
|
}
|
|
|
- if (title) {
|
|
|
+ if (options.title) {
|
|
|
window.siyuan.menus.menu.append(new MenuItem({
|
|
|
iconHTML: Constants.ZWSP,
|
|
|
- label: escapeHtml(title),
|
|
|
+ label: escapeHtml(options.title),
|
|
|
click() {
|
|
|
- filterElement.setAttribute("data-id", id);
|
|
|
- filterElement.setAttribute("data-cardtype", cardType);
|
|
|
+ filterElement.setAttribute("data-id", options.id);
|
|
|
+ filterElement.setAttribute("data-cardtype", options.cardType);
|
|
|
fetchNewRound();
|
|
|
},
|
|
|
}).element);
|
|
@@ -301,7 +274,7 @@ export const openCardByData = (cardsData: {
|
|
|
type = buttonElement.getAttribute("data-type");
|
|
|
}
|
|
|
}
|
|
|
- if (!type || !blocks[index]) {
|
|
|
+ if (!type || !options.blocks[index]) {
|
|
|
return;
|
|
|
}
|
|
|
event.preventDefault();
|
|
@@ -315,7 +288,7 @@ export const openCardByData = (cardsData: {
|
|
|
actionElements[0].classList.add("fn__none");
|
|
|
actionElements[1].querySelectorAll(".b3-button").forEach((element, btnIndex) => {
|
|
|
if (btnIndex !== 0) {
|
|
|
- element.previousElementSibling.textContent = blocks[index].nextDues[btnIndex - 1];
|
|
|
+ element.previousElementSibling.textContent = options.blocks[index].nextDues[btnIndex - 1];
|
|
|
}
|
|
|
});
|
|
|
actionElements[1].classList.remove("fn__none");
|
|
@@ -332,17 +305,17 @@ export const openCardByData = (cardsData: {
|
|
|
editor,
|
|
|
actionElements,
|
|
|
index,
|
|
|
- blocks
|
|
|
+ blocks: options.blocks
|
|
|
});
|
|
|
}
|
|
|
return;
|
|
|
}
|
|
|
if (["0", "1", "2", "3", "-3"].includes(type) && actionElements[0].classList.contains("fn__none")) {
|
|
|
fetchPost(type === "-3" ? "/api/riff/skipReviewRiffCard" : "/api/riff/reviewRiffCard", {
|
|
|
- deckID: blocks[index].deckID,
|
|
|
- cardID: blocks[index].cardID,
|
|
|
+ deckID: options.blocks[index].deckID,
|
|
|
+ cardID: options.blocks[index].cardID,
|
|
|
rating: parseInt(type),
|
|
|
- reviewedCards: blocks
|
|
|
+ reviewedCards: options.blocks
|
|
|
}, () => {
|
|
|
/// #if MOBILE
|
|
|
if (type !== "-3" &&
|
|
@@ -352,18 +325,18 @@ export const openCardByData = (cardsData: {
|
|
|
}
|
|
|
/// #endif
|
|
|
index++;
|
|
|
- if (index > blocks.length - 1) {
|
|
|
+ if (index > options.blocks.length - 1) {
|
|
|
const currentCardType = filterElement.getAttribute("data-cardtype");
|
|
|
fetchPost(currentCardType === "all" ? "/api/riff/getRiffDueCards" :
|
|
|
(currentCardType === "doc" ? "/api/riff/getTreeRiffDueCards" : "/api/riff/getNotebookRiffDueCards"), {
|
|
|
rootID: filterElement.getAttribute("data-id"),
|
|
|
deckID: filterElement.getAttribute("data-id"),
|
|
|
notebook: filterElement.getAttribute("data-id"),
|
|
|
- reviewedCards: blocks
|
|
|
+ reviewedCards: options.blocks
|
|
|
}, (result) => {
|
|
|
index = 0;
|
|
|
- blocks = result.data.cards;
|
|
|
- if (blocks.length === 0) {
|
|
|
+ options.blocks = result.data.cards;
|
|
|
+ if (options.blocks.length === 0) {
|
|
|
if (result.data.unreviewedCount > 0) {
|
|
|
newRound(countElement, editor, actionElements, result.data.unreviewedCount);
|
|
|
} else {
|
|
@@ -375,7 +348,7 @@ export const openCardByData = (cardsData: {
|
|
|
editor,
|
|
|
actionElements,
|
|
|
index,
|
|
|
- blocks
|
|
|
+ blocks: options.blocks
|
|
|
});
|
|
|
}
|
|
|
});
|
|
@@ -386,11 +359,57 @@ export const openCardByData = (cardsData: {
|
|
|
editor,
|
|
|
actionElements,
|
|
|
index,
|
|
|
- blocks
|
|
|
+ blocks: options.blocks
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
+ return editor;
|
|
|
+};
|
|
|
+
|
|
|
+export const openCard = () => {
|
|
|
+ fetchPost("/api/riff/getRiffDueCards", {deckID: ""}, (cardsResponse) => {
|
|
|
+ openCardByData(cardsResponse.data, "all");
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+export const openCardByData = (cardsData: {
|
|
|
+ cards: ICard[],
|
|
|
+ unreviewedCount: number
|
|
|
+}, cardType: TCardType, id?: string, title?: string) => {
|
|
|
+ const exit = window.siyuan.dialogs.find(item => {
|
|
|
+ if (item.element.getAttribute("data-key") === window.siyuan.config.keymap.general.riffCard.custom) {
|
|
|
+ item.destroy();
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (exit) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ const dialog = new Dialog({
|
|
|
+ content: genCardHTML({id, cardType, blocks: cardsData.cards, isTab: false}),
|
|
|
+ width: isMobile() ? "100vw" : "80vw",
|
|
|
+ height: isMobile() ? "100vh" : "70vh",
|
|
|
+ destroyCallback() {
|
|
|
+ if (editor) {
|
|
|
+ editor.destroy();
|
|
|
+ if (window.siyuan.mobile) {
|
|
|
+ window.siyuan.mobile.popEditor = null;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ (dialog.element.querySelector(".b3-dialog__scrim") as HTMLElement).style.backgroundColor = "var(--b3-theme-background)";
|
|
|
+ (dialog.element.querySelector(".b3-dialog__container") as HTMLElement).style.maxWidth = "1024px";
|
|
|
+ const editor = bindCardEvent({
|
|
|
+ element: dialog.element,
|
|
|
+ blocks: cardsData.cards,
|
|
|
+ title,
|
|
|
+ id,
|
|
|
+ cardType,
|
|
|
+ dialog
|
|
|
+ });
|
|
|
};
|
|
|
|
|
|
const nextCard = (options: {
|