diff --git a/ea-scripts/directory-info.json b/ea-scripts/directory-info.json index af72e20..076ee5c 100644 --- a/ea-scripts/directory-info.json +++ b/ea-scripts/directory-info.json @@ -1 +1 @@ -[{"fname":"Mindmap connector.md","mtime":1658686599427},{"fname":"Mindmap connector.svg","mtime":1658686599427},{"fname":"Add Connector Point.md","mtime":1645305706000},{"fname":"Add Connector Point.svg","mtime":1645944722000},{"fname":"Add Link to Existing File and Open.md","mtime":1647807918345},{"fname":"Add Link to Existing File and Open.svg","mtime":1645964261000},{"fname":"Add Link to New Page and Open.md","mtime":1654168862138},{"fname":"Add Link to New Page and Open.svg","mtime":1645960639000},{"fname":"Add Next Step in Process.md","mtime":1687192028831},{"fname":"Add Next Step in Process.svg","mtime":1645960639000},{"fname":"Box Each Selected Groups.md","mtime":1645305706000},{"fname":"Box Each Selected Groups.svg","mtime":1645967510000},{"fname":"Box Selected Elements.md","mtime":1645305706000},{"fname":"Box Selected Elements.svg","mtime":1645960639000},{"fname":"Change shape of selected elements.md","mtime":1652701169236},{"fname":"Change shape of selected elements.svg","mtime":1645960775000},{"fname":"Connect elements.md","mtime":1645305706000},{"fname":"Connect elements.svg","mtime":1645960639000},{"fname":"Convert freedraw to line.md","mtime":1645305706000},{"fname":"Convert freedraw to line.svg","mtime":1645960639000},{"fname":"Convert selected text elements to sticky notes.md","mtime":1670169501383},{"fname":"Convert selected text elements to sticky notes.svg","mtime":1645960639000},{"fname":"Convert text to link with folder and alias.md","mtime":1641639819000},{"fname":"Convert text to link with folder and alias.svg","mtime":1645960639000},{"fname":"Copy Selected Element Styles to Global.md","mtime":1642232088000},{"fname":"Copy Selected Element Styles to Global.svg","mtime":1645960639000},{"fname":"Create new markdown file and embed into active drawing.md","mtime":1640866935000},{"fname":"Create new markdown file and embed into active drawing.svg","mtime":1645960639000},{"fname":"Darken background color.md","mtime":1663059051059},{"fname":"Darken background color.svg","mtime":1645960639000},{"fname":"Elbow connectors.md","mtime":1671126911490},{"fname":"Elbow connectors.svg","mtime":1645960639000},{"fname":"Expand rectangles horizontally keep text centered.md","mtime":1646563692000},{"fname":"Expand rectangles horizontally keep text centered.svg","mtime":1645967510000},{"fname":"Expand rectangles horizontally.md","mtime":1644950235000},{"fname":"Expand rectangles horizontally.svg","mtime":1645967510000},{"fname":"Expand rectangles vertically keep text centered.md","mtime":1646563692000},{"fname":"Expand rectangles vertically keep text centered.svg","mtime":1645967510000},{"fname":"Expand rectangles vertically.md","mtime":1658686599427},{"fname":"Expand rectangles vertically.svg","mtime":1645967510000},{"fname":"Fixed horizontal distance between centers.md","mtime":1646743234000},{"fname":"Fixed horizontal distance between centers.svg","mtime":1645960639000},{"fname":"Fixed inner distance.md","mtime":1646743234000},{"fname":"Fixed inner distance.svg","mtime":1645960639000},{"fname":"Fixed spacing.md","mtime":1646743234000},{"fname":"Fixed spacing.svg","mtime":1645967510000},{"fname":"Fixed vertical distance between centers.md","mtime":1646743234000},{"fname":"Fixed vertical distance between centers.svg","mtime":1645967510000},{"fname":"Fixed vertical distance.md","mtime":1646743234000},{"fname":"Fixed vertical distance.svg","mtime":1645967510000},{"fname":"Lighten background color.md","mtime":1663059051059},{"fname":"Lighten background color.svg","mtime":1645959546000},{"fname":"Modify background color opacity.md","mtime":1644924415000},{"fname":"Modify background color opacity.svg","mtime":1645944722000},{"fname":"Normalize Selected Arrows.md","mtime":1670403743278},{"fname":"Normalize Selected Arrows.svg","mtime":1645960639000},{"fname":"Organic Line.md","mtime":1672920172531},{"fname":"Organic Line.svg","mtime":1645964261000},{"fname":"README.md","mtime":1645175700000},{"fname":"Repeat Elements.md","mtime":1663059051059},{"fname":"Repeat Elements.svg","mtime":1645960639000},{"fname":"Reverse arrows.md","mtime":1645305706000},{"fname":"Reverse arrows.svg","mtime":1645960639000},{"fname":"Scribble Helper.md","mtime":1682228345043},{"fname":"Scribble Helper.svg","mtime":1645944722000},{"fname":"Select Elements of Type.md","mtime":1643464321000},{"fname":"Select Elements of Type.svg","mtime":1645960639000},{"fname":"Set Dimensions.md","mtime":1645305706000},{"fname":"Set Dimensions.svg","mtime":1645944722000},{"fname":"Set Font Family.md","mtime":1645305706000},{"fname":"Set Font Family.svg","mtime":1645944722000},{"fname":"Set Grid.md","mtime":1674326971324},{"fname":"Set Grid.svg","mtime":1645960639000},{"fname":"Set Link Alias.md","mtime":1645305706000},{"fname":"Set Link Alias.svg","mtime":1645960639000},{"fname":"Set Stroke Width of Selected Elements.md","mtime":1645305706000},{"fname":"Set Stroke Width of Selected Elements.svg","mtime":1645960639000},{"fname":"Set Text Alignment.md","mtime":1645305706000},{"fname":"Set Text Alignment.svg","mtime":1645960639000},{"fname":"Set background color of unclosed line object by adding a shadow clone.md","mtime":1681665030892},{"fname":"Set background color of unclosed line object by adding a shadow clone.svg","mtime":1645960639000},{"fname":"Split text by lines.md","mtime":1645305706000},{"fname":"Split text by lines.svg","mtime":1645944722000},{"fname":"Zoom to Fit Selected Elements.md","mtime":1640770602000},{"fname":"Zoom to Fit Selected Elements.svg","mtime":1645960639000},{"fname":"directory-info.json","mtime":1646583437000},{"fname":"index-new.md","mtime":1645986149000},{"fname":"index.md","mtime":1645175700000},{"fname":"Grid Selected Images.md","mtime":1649614401982},{"fname":"Grid Selected Images.svg","mtime":1649614401982},{"fname":"Palette loader.md","mtime":1686511890942},{"fname":"Palette loader.svg","mtime":1649614401982},{"fname":"Rename Image.md","mtime":1663678478785},{"fname":"Rename Image.svg","mtime":1663678478785},{"fname":"Text Arch.md","mtime":1664095143846},{"fname":"Text Arch.svg","mtime":1670403743278},{"fname":"Deconstruct selected elements into new drawing.md","mtime":1672672112439},{"fname":"Deconstruct selected elements into new drawing.svg","mtime":1668541145255},{"fname":"Slideshow.md","mtime":1685276730052},{"fname":"Slideshow.svg","mtime":1670017348333},{"fname":"Auto Layout.md","mtime":1670403743278},{"fname":"Auto Layout.svg","mtime":1670175947081},{"fname":"Uniform size.md","mtime":1670175947081},{"fname":"Uniform size.svg","mtime":1670175947081},{"fname":"Alternative Pens.md", "mtime":1672942234020},{"fname":"Alternative Pens.svg", "mtime":1672942234020},{"fname":"Mindmap format.md","mtime":1684484694228},{"fname":"Mindmap format.svg","mtime":1674944958059},{"fname":"Text to Sticky Notes.md","mtime":1678537561724},{"fname":"Text to Sticky Notes.svg","mtime":1678537561724},{"fname":"Folder Note Core - Make Current Drawing a Folder.md","mtime":1678973697470},{"fname":"Folder Note Core - Make Current Drawing a Folder.svg","mtime":1678973697470},{"fname":"Invert colors.md","mtime":1678973697470},{"fname":"Invert colors.svg","mtime":1678973697470},{"fname":"Auto Draw for Pen.md","mtime":1680418321236},{"fname":"Auto Draw for Pen.svg","mtime":1680418321236},{"fname":"Hardware Eraser Support.md","mtime":1680418321236},{"fname":"Hardware Eraser Support.svg","mtime":1680418321236},{"fname":"PDF Page Text to Clipboard.md","mtime":1683984041712},{"fname":"PDF Page Text to Clipboard.svg","mtime":1680418321236},{"fname":"Excalidraw Collaboration Frame.md","mtime":1687881495985},{"fname":"Excalidraw Collaboration Frame.svg","mtime":1687881495985},{"fname":"Create DrawIO file.md","mtime":1688243858267},{"fname":"Create DrawIO file.svg","mtime":1688243858267}] +[{"fname":"Mindmap connector.md","mtime":1658686599427},{"fname":"Mindmap connector.svg","mtime":1658686599427},{"fname":"Add Connector Point.md","mtime":1645305706000},{"fname":"Add Connector Point.svg","mtime":1645944722000},{"fname":"Add Link to Existing File and Open.md","mtime":1647807918345},{"fname":"Add Link to Existing File and Open.svg","mtime":1645964261000},{"fname":"Add Link to New Page and Open.md","mtime":1654168862138},{"fname":"Add Link to New Page and Open.svg","mtime":1645960639000},{"fname":"Add Next Step in Process.md","mtime":1688304760357},{"fname":"Add Next Step in Process.svg","mtime":1645960639000},{"fname":"Box Each Selected Groups.md","mtime":1645305706000},{"fname":"Box Each Selected Groups.svg","mtime":1645967510000},{"fname":"Box Selected Elements.md","mtime":1645305706000},{"fname":"Box Selected Elements.svg","mtime":1645960639000},{"fname":"Change shape of selected elements.md","mtime":1652701169236},{"fname":"Change shape of selected elements.svg","mtime":1645960775000},{"fname":"Connect elements.md","mtime":1645305706000},{"fname":"Connect elements.svg","mtime":1645960639000},{"fname":"Convert freedraw to line.md","mtime":1645305706000},{"fname":"Convert freedraw to line.svg","mtime":1645960639000},{"fname":"Convert selected text elements to sticky notes.md","mtime":1670169501383},{"fname":"Convert selected text elements to sticky notes.svg","mtime":1645960639000},{"fname":"Convert text to link with folder and alias.md","mtime":1641639819000},{"fname":"Convert text to link with folder and alias.svg","mtime":1645960639000},{"fname":"Copy Selected Element Styles to Global.md","mtime":1642232088000},{"fname":"Copy Selected Element Styles to Global.svg","mtime":1645960639000},{"fname":"Create new markdown file and embed into active drawing.md","mtime":1640866935000},{"fname":"Create new markdown file and embed into active drawing.svg","mtime":1645960639000},{"fname":"Darken background color.md","mtime":1663059051059},{"fname":"Darken background color.svg","mtime":1645960639000},{"fname":"Elbow connectors.md","mtime":1671126911490},{"fname":"Elbow connectors.svg","mtime":1645960639000},{"fname":"Expand rectangles horizontally keep text centered.md","mtime":1646563692000},{"fname":"Expand rectangles horizontally keep text centered.svg","mtime":1645967510000},{"fname":"Expand rectangles horizontally.md","mtime":1644950235000},{"fname":"Expand rectangles horizontally.svg","mtime":1645967510000},{"fname":"Expand rectangles vertically keep text centered.md","mtime":1646563692000},{"fname":"Expand rectangles vertically keep text centered.svg","mtime":1645967510000},{"fname":"Expand rectangles vertically.md","mtime":1658686599427},{"fname":"Expand rectangles vertically.svg","mtime":1645967510000},{"fname":"Fixed horizontal distance between centers.md","mtime":1646743234000},{"fname":"Fixed horizontal distance between centers.svg","mtime":1645960639000},{"fname":"Fixed inner distance.md","mtime":1646743234000},{"fname":"Fixed inner distance.svg","mtime":1645960639000},{"fname":"Fixed spacing.md","mtime":1646743234000},{"fname":"Fixed spacing.svg","mtime":1645967510000},{"fname":"Fixed vertical distance between centers.md","mtime":1646743234000},{"fname":"Fixed vertical distance between centers.svg","mtime":1645967510000},{"fname":"Fixed vertical distance.md","mtime":1646743234000},{"fname":"Fixed vertical distance.svg","mtime":1645967510000},{"fname":"Lighten background color.md","mtime":1663059051059},{"fname":"Lighten background color.svg","mtime":1645959546000},{"fname":"Modify background color opacity.md","mtime":1644924415000},{"fname":"Modify background color opacity.svg","mtime":1645944722000},{"fname":"Normalize Selected Arrows.md","mtime":1670403743278},{"fname":"Normalize Selected Arrows.svg","mtime":1645960639000},{"fname":"Organic Line.md","mtime":1672920172531},{"fname":"Organic Line.svg","mtime":1645964261000},{"fname":"README.md","mtime":1645175700000},{"fname":"Repeat Elements.md","mtime":1663059051059},{"fname":"Repeat Elements.svg","mtime":1645960639000},{"fname":"Reverse arrows.md","mtime":1645305706000},{"fname":"Reverse arrows.svg","mtime":1645960639000},{"fname":"Scribble Helper.md","mtime":1682228345043},{"fname":"Scribble Helper.svg","mtime":1645944722000},{"fname":"Select Elements of Type.md","mtime":1643464321000},{"fname":"Select Elements of Type.svg","mtime":1645960639000},{"fname":"Set Dimensions.md","mtime":1645305706000},{"fname":"Set Dimensions.svg","mtime":1645944722000},{"fname":"Set Font Family.md","mtime":1645305706000},{"fname":"Set Font Family.svg","mtime":1645944722000},{"fname":"Set Grid.md","mtime":1674326971324},{"fname":"Set Grid.svg","mtime":1645960639000},{"fname":"Set Link Alias.md","mtime":1645305706000},{"fname":"Set Link Alias.svg","mtime":1645960639000},{"fname":"Set Stroke Width of Selected Elements.md","mtime":1645305706000},{"fname":"Set Stroke Width of Selected Elements.svg","mtime":1645960639000},{"fname":"Set Text Alignment.md","mtime":1645305706000},{"fname":"Set Text Alignment.svg","mtime":1645960639000},{"fname":"Set background color of unclosed line object by adding a shadow clone.md","mtime":1681665030892},{"fname":"Set background color of unclosed line object by adding a shadow clone.svg","mtime":1645960639000},{"fname":"Split text by lines.md","mtime":1645305706000},{"fname":"Split text by lines.svg","mtime":1645944722000},{"fname":"Zoom to Fit Selected Elements.md","mtime":1640770602000},{"fname":"Zoom to Fit Selected Elements.svg","mtime":1645960639000},{"fname":"directory-info.json","mtime":1646583437000},{"fname":"index-new.md","mtime":1645986149000},{"fname":"index.md","mtime":1645175700000},{"fname":"Grid Selected Images.md","mtime":1649614401982},{"fname":"Grid Selected Images.svg","mtime":1649614401982},{"fname":"Palette loader.md","mtime":1686511890942},{"fname":"Palette loader.svg","mtime":1649614401982},{"fname":"Rename Image.md","mtime":1663678478785},{"fname":"Rename Image.svg","mtime":1663678478785},{"fname":"Text Arch.md","mtime":1664095143846},{"fname":"Text Arch.svg","mtime":1670403743278},{"fname":"Deconstruct selected elements into new drawing.md","mtime":1672672112439},{"fname":"Deconstruct selected elements into new drawing.svg","mtime":1668541145255},{"fname":"Slideshow.md","mtime":1685276730052},{"fname":"Slideshow.svg","mtime":1670017348333},{"fname":"Auto Layout.md","mtime":1670403743278},{"fname":"Auto Layout.svg","mtime":1670175947081},{"fname":"Uniform size.md","mtime":1670175947081},{"fname":"Uniform size.svg","mtime":1670175947081},{"fname":"Alternative Pens.md", "mtime":1672942234020},{"fname":"Alternative Pens.svg", "mtime":1672942234020},{"fname":"Mindmap format.md","mtime":1684484694228},{"fname":"Mindmap format.svg","mtime":1674944958059},{"fname":"Text to Sticky Notes.md","mtime":1678537561724},{"fname":"Text to Sticky Notes.svg","mtime":1678537561724},{"fname":"Folder Note Core - Make Current Drawing a Folder.md","mtime":1678973697470},{"fname":"Folder Note Core - Make Current Drawing a Folder.svg","mtime":1678973697470},{"fname":"Invert colors.md","mtime":1678973697470},{"fname":"Invert colors.svg","mtime":1678973697470},{"fname":"Auto Draw for Pen.md","mtime":1680418321236},{"fname":"Auto Draw for Pen.svg","mtime":1680418321236},{"fname":"Hardware Eraser Support.md","mtime":1680418321236},{"fname":"Hardware Eraser Support.svg","mtime":1680418321236},{"fname":"PDF Page Text to Clipboard.md","mtime":1683984041712},{"fname":"PDF Page Text to Clipboard.svg","mtime":1680418321236},{"fname":"Excalidraw Collaboration Frame.md","mtime":1687881495985},{"fname":"Excalidraw Collaboration Frame.svg","mtime":1687881495985},{"fname":"Create DrawIO file.md","mtime":1688243858267},{"fname":"Create DrawIO file.svg","mtime":1688243858267}] diff --git a/manifest.json b/manifest.json index 89e9414..326bf3d 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "id": "obsidian-excalidraw-plugin", "name": "Excalidraw", - "version": "1.9.6", + "version": "1.9.7", "minAppVersion": "1.1.6", "description": "An Obsidian plugin to edit and view Excalidraw drawings", "author": "Zsolt Viczian", diff --git a/src/ExcalidrawAutomate.ts b/src/ExcalidrawAutomate.ts index 4f02108..23b333b 100644 --- a/src/ExcalidrawAutomate.ts +++ b/src/ExcalidrawAutomate.ts @@ -1878,6 +1878,17 @@ export class ExcalidrawAutomate implements ExcalidrawAutomateInterface { return elements.filter(el=>el.groupIds.some(id=>element.groupIds.includes(id))); } + /** + * Gets all the elements from elements[] that are contained in the frame. + * @param element + * @param elements - typically all the non-deleted elements in the scene + * @returns + */ + getElementsInFrame(frameElement: ExcalidrawElement, elements: ExcalidrawElement[]): ExcalidrawElement[] { + if(!frameElement || !elements || frameElement.type !== "frame") return []; + return elements.filter(el=>el.frameId === frameElement.id); + } + /** * @param element * @param a @@ -2315,6 +2326,13 @@ async function getTemplate( groupElements = plugin.ea.getElementsInTheSameGroupWithElement(el[0],scene.elements) } } + if(filenameParts.hasFrameref) { + const el = scene.elements.filter((el: ExcalidrawElement)=>el.id===filenameParts.blockref) + if(el.length === 1) { + groupElements = plugin.ea.getElementsInFrame(el[0],scene.elements) + } + } + if(filenameParts.hasTaskbone) { groupElements = groupElements.filter( el => @@ -2446,7 +2464,7 @@ export async function createSVG( ); const filenameParts = getEmbeddedFilenameParts(templatePath); if( - !filenameParts.hasGroupref && + !(filenameParts.hasGroupref || filenameParts.hasFrameref) && (filenameParts.hasBlockref || filenameParts.hasSectionref) ) { let el = filenameParts.hasSectionref @@ -2568,7 +2586,7 @@ export const search = async (view: ExcalidrawView) => { const ea = view.plugin.ea; ea.reset(); ea.setView(view); - const elements = ea.getViewElements().filter((el) => el.type === "text"); + const elements = ea.getViewElements().filter((el) => el.type === "text" || el.type === "frame"); if (elements.length === 0) { return; } @@ -2627,6 +2645,38 @@ export const getTextElementsMatchingQuery = ( })); } +/** + * + * @param elements + * @param query + * @param exactMatch - when searching for section header exactMatch should be set to true + * @returns the elements matching the query + */ +export const getFrameElementsMatchingQuery = ( + elements: ExcalidrawElement[], + query: string[], + exactMatch: boolean = false, //https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/530 +): ExcalidrawElement[] => { + if (!elements || elements.length === 0 || !query || query.length === 0) { + return []; + } + + return elements.filter((el: any) => + el.type === "frame" && + query.some((q) => { + if (exactMatch) { + const text = el.name.toLowerCase().split("\n")[0].trim(); + const m = text.match(/^#*(# .*)/); + if (!m || m.length !== 2) { + return false; + } + return m[1] === q.toLowerCase(); + } + const text = el.name.toLowerCase().replaceAll("\n", " ").trim(); + return text.match(q.toLowerCase()); //to distinguish between "# frame" and "# frame 1" https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/530 + })); +} + export const cloneElement = (el: ExcalidrawElement):any => { return { ...el, diff --git a/src/ExcalidrawView.ts b/src/ExcalidrawView.ts index d514a7c..c718231 100644 --- a/src/ExcalidrawView.ts +++ b/src/ExcalidrawView.ts @@ -48,7 +48,13 @@ import { EXPORT_IMG_ICON_NAME, } from "./Constants"; import ExcalidrawPlugin from "./main"; -import { repositionElementsToCursor, ExcalidrawAutomate, getTextElementsMatchingQuery, cloneElement } from "./ExcalidrawAutomate"; +import { + repositionElementsToCursor, + ExcalidrawAutomate, + getTextElementsMatchingQuery, + cloneElement, + getFrameElementsMatchingQuery +} from "./ExcalidrawAutomate"; import { t } from "./lang/helpers"; import { ExcalidrawData, @@ -90,7 +96,7 @@ import { } from "./utils/Utils"; import { getLeaf, getParentOfClass } from "./utils/ObsidianUtils"; import { splitFolderAndFilename } from "./utils/FileUtils"; -import { NewFileActions, Prompt } from "./dialogs/Prompt"; +import { ConfirmationPrompt, NewFileActions, Prompt } from "./dialogs/Prompt"; import { ClipboardData } from "@zsviczian/excalidraw/types/clipboard"; import { updateEquation } from "./LaTeX"; import { @@ -105,16 +111,14 @@ import { ToolsPanel } from "./menu/ToolsPanel"; import { ScriptEngine } from "./Scripts"; import { getTextElementAtPointer, getImageElementAtPointer, getElementWithLinkAtPointer } from "./utils/GetElementAtPointer"; import { ICONS, saveIcon } from "./menu/ActionIcons"; -//import { MainMenu } from "@zsviczian/excalidraw"; -//import {WelcomeScreen} from "@zsviczian/excalidraw"; import { ExportDialog } from "./dialogs/ExportDialog"; import { getEA } from "src"; import { emulateCTRLClickForLinks, externalDragModifierType, internalDragModifierType, isALT, isCTRL, isMETA, isSHIFT, linkClickModifierType, mdPropModifier, ModifierKeys } from "./utils/ModifierkeyHelper"; import { setDynamicStyle } from "./utils/DynamicStyling"; -import { MenuLinks } from "./menu/MenuLinks"; import { InsertPDFModal } from "./dialogs/InsertPDFModal"; import { CustomIFrame, renderWebView, useDefaultExcalidrawFrame } from "./customIFrame"; import { insertIFrameToView, insertImageToView } from "./utils/ExcalidrawViewUtils"; +import { imageCache } from "./utils/ImageCache"; declare const PLUGIN_VERSION:string; @@ -231,6 +235,7 @@ export default class ExcalidrawView extends TextFileView { public linksAlwaysOpenInANewPane: boolean = false; //override the need for SHIFT+CTRL+click (used by ExcaliBrain) private hookServer: ExcalidrawAutomate; public lastSaveTimestamp: number = 0; //used to validate if incoming file should sync with open file + private lastLoadedFile: TFile = null; private onKeyUp: (e: KeyboardEvent) => void; private onKeyDown:(e: KeyboardEvent) => void; //store key state for view mode link resolution @@ -299,7 +304,6 @@ export default class ExcalidrawView extends TextFileView { private linkAction_Element: HTMLElement; public compatibilityMode: boolean = false; private obsidianMenu: ObsidianMenu; - private menuLinks: MenuLinks; //https://stackoverflow.com/questions/27132796/is-there-any-javascript-event-fired-when-the-on-screen-keyboard-on-mobile-safari private isEditingTextResetTimer: NodeJS.Timeout = null; @@ -618,6 +622,11 @@ export default class ExcalidrawView extends TextFileView { this.semaphores.preventReload = preventReload; await super.save(); + //saving to backup with a delay in case application closes in the meantime, I want to avoid both save and backup corrupted. + const path = this.file.path; + //@ts-ignore + const data = this.lastSavedData; + setTimeout(()=>imageCache.addBAKToCache(path,data),50); triggerReload = (this.lastSaveTimestamp === this.file.stat.mtime) && !preventReload && forcesave; this.lastSaveTimestamp = this.file.stat.mtime; @@ -671,18 +680,20 @@ export default class ExcalidrawView extends TextFileView { // get the new file content // if drawing is in Text Element Edit Lock, then everything should be parsed and in sync // if drawing is in Text Element Edit Unlock, then everything is raw and parse and so an async function is not required here + getViewData() { - //debug({where:"getViewData",semaphores:this.semaphores}); - if (!this.getScene) { + if (!this.getScene || !this.excalidrawData.loaded) { return this.data; } - if (!this.excalidrawData.loaded) { + + const scene = this.getScene(); + if(!scene) { return this.data; } + //include deleted elements in save in case saving in markdown mode //deleted elements are only used if sync modifies files while Excalidraw is open //otherwise deleted elements are discarded when loading the scene - const scene = this.getScene(); if (!this.compatibilityMode) { let trimLocation = this.data.search(/(^%%\n)?# Text Elements\n/m); if (trimLocation == -1) { @@ -703,7 +714,11 @@ export default class ExcalidrawView extends TextFileView { : [ [FRONTMATTER_KEY, this.textMode === TextMode.raw ? "raw" : "parsed"] ]; - if(this.exportDialog?.dirty) this.exportDialog.dirty = false; + + if(this.exportDialog?.dirty) { + this.exportDialog.dirty = false; + } + let header = updateFrontmatterInString(this.data.substring(0, trimLocation),keys); //this should be removed at a later time. Left it here to remediate 1.4.9 mistake const REG_IMG = /(^---[\w\W]*?---\n)(!\[\[.*?]]\n(%%\n)?)/m; //(%%\n)? because of 1.4.8-beta... to be backward compatible with anyone who installed that version @@ -715,15 +730,16 @@ export default class ExcalidrawView extends TextFileView { this.excalidrawData.disableCompression = this.isEditedAsMarkdownInOtherView(); } - const reuslt = header + this.excalidrawData.generateMD( + const result = header + this.excalidrawData.generateMD( this.excalidrawAPI.getSceneElementsIncludingDeleted().filter((el:ExcalidrawElement)=>el.isDeleted) //will be concatenated to scene.elements ); this.excalidrawData.disableCompression = false; - return reuslt; + return result; } if (this.compatibilityMode) { return JSON.stringify(scene, null, "\t"); } + return this.data; } @@ -1339,6 +1355,7 @@ export default class ExcalidrawView extends TextFileView { this.blockTextModeChange = false; } + public autosaveFunction: Function; public setupAutosaveTimer() { const timer = async () => { if(!this.isLoaded) { @@ -1390,6 +1407,8 @@ export default class ExcalidrawView extends TextFileView { ); } }; + + this.autosaveFunction = timer; if (this.autosaveTimer) { clearTimeout(this.autosaveTimer); this.autosaveTimer = null; @@ -1446,6 +1465,7 @@ export default class ExcalidrawView extends TextFileView { return; } if (this.semaphores.saving) return; + this.lastLoadedFile = null; this.diskIcon.querySelector("svg").removeClass("excalidraw-dirty"); if (this.compatibilityMode) { this.clearDirty(); @@ -1604,6 +1624,10 @@ export default class ExcalidrawView extends TextFileView { public isLoaded: boolean = false; async setViewData(data: string, clear: boolean = false) { + //I am using last loaded file to control when the view reloads. + //It seems text file view gets the modified file event after sync before the modifyEventHandler in main.ts + //reload can only be triggered via reload() + if(this.lastLoadedFile === this.file) return; this.isLoaded = false; if(!this.file) return; if(this.plugin.settings.showNewVersionNotification) checkExcalidrawVersion(app); @@ -1611,6 +1635,7 @@ export default class ExcalidrawView extends TextFileView { this.clear(); } this.lastSaveTimestamp = this.file.stat.mtime; + this.lastLoadedFile = this.file; data = this.data = data.replaceAll("\r\n", "\n").replaceAll("\r", "\n"); app.workspace.onLayoutReady(async () => { this.compatibilityMode = this.file.extension === "excalidraw"; @@ -1642,14 +1667,41 @@ export default class ExcalidrawView extends TextFileView { } } catch (e) { errorlog({ where: "ExcalidrawView.setViewData", error: e }); - new Notice( - `Error loading drawing:\n${e.message}${ - e.message === "Cannot read property 'index' of undefined" - ? "\n'# Drawing' section is likely missing" - : "" - }\n\nTry manually fixing the file or restoring an earlier version from sync history.`, - 10000, - ); + const file = this.file; + const plugin = this.plugin; + const leaf = this.leaf; + (async () => { + let confirmation:boolean = true; + while (!imageCache.isReady() && confirmation) { + imageCache.initializationNotice = true; + const confirmationPrompt = new ConfirmationPrompt(plugin,t("CACHE_NOT_READY")); + confirmation = await confirmationPrompt.waitForClose + } + + const drawingBAK = await imageCache.getBAKFromCache(file.path); + if (!drawingBAK) { + new Notice( + `Error loading drawing:\n${e.message}${ + e.message === "Cannot read property 'index' of undefined" + ? "\n'# Drawing' section is likely missing" + : "" + }\n\nTry manually fixing the file or restoring an earlier version from sync history.`, + 10000, + ); + return; + } + const confirmationPrompt = new ConfirmationPrompt(plugin,t("BACKUP_AVAILABLE")); + confirmationPrompt.waitForClose.then(async (confirmed) => { + if (confirmed) { + await app.vault.modify(file, drawingBAK); + //@ts-ignore + plugin.excalidrawFileModes[leaf.id || file.path] = VIEW_TYPE_EXCALIDRAW; + plugin.setExcalidrawView(leaf); + } + }); + + + })(); this.setMarkdownView(); return; } @@ -1758,7 +1810,7 @@ export default class ExcalidrawView extends TextFileView { try { const deletedIds = inData.deletedElements.map(el=>el.id); - const sceneElements = this.excalidrawAPI.getSceneElements() + const sceneElements = this.excalidrawAPI.getSceneElementsIncludingDeleted() //remove deleted elements .filter((el: ExcalidrawElement)=>!deletedIds.contains(el.id)); const sceneElementIds = sceneElements.map((el:ExcalidrawElement)=>el.id); @@ -2230,7 +2282,6 @@ export default class ExcalidrawView extends TextFileView { const reactElement = React.createElement(() => { const excalidrawWrapperRef = React.useRef(null); const toolsPanelRef = React.useRef(null); - const menuLinksRef = React.useRef(null); const [dimensions, setDimensions] = React.useState({ width: undefined, @@ -2246,7 +2297,6 @@ export default class ExcalidrawView extends TextFileView { this.toolsPanelRef = toolsPanelRef; this.obsidianMenu = new ObsidianMenu(this.plugin, toolsPanelRef, this); - this.menuLinks = new MenuLinks(this.plugin, menuLinksRef); //excalidrawRef readypromise based on //https://codesandbox.io/s/eexcalidraw-resolvable-promise-d0qg3?file=/src/App.js:167-760 @@ -4062,7 +4112,11 @@ export default class ExcalidrawView extends TextFileView { elements.filter((el: ExcalidrawElement) => el.type === "text"), query, exactMatch - ); + ).concat(getFrameElementsMatchingQuery( + elements.filter((el: ExcalidrawElement) => el.type === "frame"), + query, + exactMatch + )); if (match.length === 0) { new Notice("I could not find a matching text element"); @@ -4157,6 +4211,51 @@ export default class ExcalidrawView extends TextFileView { : this.plugin.ea.getLargestElement(elements).id; } + const isFrame = elements.some(el=>el.id === elementId && el.type==="frame"); + + let buttons = []; + if(isFrame) { + switch(prefix) { + case "area=": + case "group=": + case "frame=": + buttons = [ + {caption: "Frame", action:()=>{prefix="frame="; return;}}, + {caption: "Link", action:()=>{prefix="";return}}, + ]; + break; + default: + buttons = [ + {caption: "Link", action:()=>{prefix="";return}}, + {caption: "Frame", action:()=>{prefix="frame="; return;}}, + ] + } + + } else { + switch(prefix) { + case "area=": + buttons = [ + {caption: "Area", action:()=>{prefix="area="; return;}}, + {caption: "Link", action:()=>{prefix="";return}}, + {caption: "Group", action:()=>{prefix="group="; return;}}, + ]; + break; + case "group=": + buttons = [ + {caption: "Group", action:()=>{prefix="group="; return;}}, + {caption: "Link", action:()=>{prefix="";return}}, + {caption: "Area", action:()=>{prefix="area="; return;}}, + ]; + break; + default: + buttons = [ + {caption: "Link", action:()=>{prefix="";return}}, + {caption: "Area", action:()=>{prefix="area="; return;}}, + {caption: "Group", action:()=>{prefix="group="; return;}}, + ] + } + } + const alias = await ScriptEngine.inputPrompt( this, this.plugin, @@ -4164,11 +4263,7 @@ export default class ExcalidrawView extends TextFileView { "Set link alias", "Leave empty if you do not want to set an alias", "", - [ - {caption: "Link", action:()=>{prefix="";return}}, - {caption: "Area", action:()=>{prefix="area="; return;}}, - {caption: "Group", action:()=>{prefix="group="; return;}} - ] + buttons, ); navigator.clipboard.writeText( `${prefix.length>0?"!":""}[[${this.file.path}#^${prefix}${elementId}${alias ? `|${alias}` : ``}]]`, diff --git a/src/MarkdownPostProcessor.ts b/src/MarkdownPostProcessor.ts index 19c8ba5..8e220eb 100644 --- a/src/MarkdownPostProcessor.ts +++ b/src/MarkdownPostProcessor.ts @@ -134,7 +134,7 @@ const getIMG = async ( } } - const quickPNG = !filenameParts.hasGroupref + const quickPNG = !(filenameParts.hasGroupref || filenameParts.hasFrameref) ? await getQuickImagePreview(plugin, file.path, "png") : undefined; @@ -142,7 +142,7 @@ const getIMG = async ( const png = quickPNG ?? (await createPNG( - filenameParts.hasGroupref + (filenameParts.hasGroupref || filenameParts.hasFrameref) ? filenameParts.filepath + filenameParts.linkpartReference : file.path, scale, @@ -183,7 +183,7 @@ const getIMG = async ( } const svgSnapshot = ( await createSVG( - filenameParts.hasGroupref || filenameParts.hasBlockref || filenameParts.hasSectionref + filenameParts.hasGroupref || filenameParts.hasBlockref || filenameParts.hasSectionref || filenameParts.hasFrameref ? filenameParts.filepath + filenameParts.linkpartReference : file.path, true, @@ -394,7 +394,7 @@ const isTextOnlyEmbed = (internalEmbedEl: Element):boolean => { const src = internalEmbedEl.getAttribute("src"); if(!src) return true; //technically this does not mean this is a text only embed, but still should abort further processing const fnameParts = getEmbeddedFilenameParts(src); - return !(fnameParts.hasArearef || fnameParts.hasGroupref) && + return !(fnameParts.hasArearef || fnameParts.hasGroupref || fnameParts.hasFrameref) && (fnameParts.hasBlockref || fnameParts.hasSectionref) } diff --git a/src/dialogs/Messages.ts b/src/dialogs/Messages.ts index 79cf75b..2a6871a 100644 --- a/src/dialogs/Messages.ts +++ b/src/dialogs/Messages.ts @@ -17,6 +17,37 @@ I develop this plugin as a hobby, spending my free time doing this. If you find
`, +"1.9.7":` +## Fixed: + +- Fixed an issue where using the color picker shortcut would cause the UI to disappear in mobile view mode. +- You can now add YouTube playlists to iframes. +- Fixed a bug where the "Add any file" dropdown suggester opened in the main Obsidian workspace instead of the popout window when Excalidraw was running. ([#1179](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1191)) +- Made some improvements to the logic of opening in the adjacent pane, although it is still not perfect. +- Fixed an issue where Obsidian sync would result in the loss of the last approximately 20 seconds of work. Excalidraw's handling of sync is now fixed. ([#1189](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1189)) + +## New: + +- Introducing Image Cache: Excalidraw will now cache rendered images embedded in Markdown documents, which will enhance the markdown rendering experience. +- Backup Cache: Excalidraw now stores a backup on your device when saving, in case the application is terminated during a save operation. If you are using sync, you can find the latest backup on the device you last used to edit your drawing. +- Added ${String.fromCharCode(96)}frame=${String.fromCharCode(96)} parameter to image references. ([#1194](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1194)) For more details about this feature, check out this [YouTube video](https://youtu.be/yZQoJg2RCKI). +- When an SVG image from Draw.io is embedded in Excalidraw, clicking the image will open the file in the [Diagram plugin](https://github.com/zapthedingbat/drawio-obsidian) (if available). +- Added the [Create DrawIO file](https://github.com/zsviczian/obsidian-excalidraw-plugin/blob/master/ea-scripts/Create%20DrawIO%20file.md) Excalidraw Automate Script to the library, which allows you to create a new draw.io drawing and add it to the current Excalidraw canvas. + +## New in ExcalidrawAutomate + +${String.fromCharCode(96,96,96)}typescript +async getAttachmentFilepath(filename: string): Promise +${String.fromCharCode(96,96,96)} + +This asynchronous function retrieves the filepath to a new file, taking into account the attachments preference settings in Obsidian. It creates the attachment folder if it doesn't already exist. The function returns the complete path to the file. If the provided filename already exists, the function will append '_[number]' before the extension to generate a unique filename. + +${String.fromCharCode(96,96,96)}typescript +getElementsInFrame(frameElement: ExcalidrawElement, elements: ExcalidrawElement[]): ExcalidrawElement[]; +${String.fromCharCode(96,96,96)} + +This function returns the elements contained within a frame. +`, "1.9.6":` ## Fixed - help shortcuts are really hard to see [#1176](https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/1179) diff --git a/src/dialogs/Prompt.ts b/src/dialogs/Prompt.ts index 21ddfaa..e01de77 100644 --- a/src/dialogs/Prompt.ts +++ b/src/dialogs/Prompt.ts @@ -455,62 +455,6 @@ export class GenericSuggester extends FuzzySuggestModal { } } -class MigrationPrompt extends Modal { - private plugin: ExcalidrawPlugin; - - constructor(app: App, plugin: ExcalidrawPlugin) { - super(app); - this.plugin = plugin; - } - - onOpen(): void { - this.titleEl.setText("Welcome to Excalidraw 1.2"); - this.createForm(); - } - - onClose(): void { - this.contentEl.empty(); - } - - createForm(): void { - const div = this.contentEl.createDiv(); - // div.addClass("excalidraw-prompt-div"); - // div.style.maxWidth = "600px"; - div.createEl("p", { - text: "This version comes with tons of new features and possibilities. Please read the description in Community Plugins to find out more.", - }); - div.createEl("p", { text: "" }, (el) => { - el.innerHTML = - "Drawings you've created with version 1.1.x need to be converted to take advantage of the new features. You can also continue to use them in compatibility mode. " + - "During conversion your old *.excalidraw files will be replaced with new *.excalidraw.md files."; - }); - div.createEl("p", { text: "" }, (el) => { - //files manually follow one of two options: - el.innerHTML = - "To convert your drawings you have the following options:
"; - }); - div.createEl("p", { - text: "This message will only appear maximum 3 times in case you have *.excalidraw files in your Vault.", - }); - const bConvert = div.createEl("button", { text: "CONVERT FILES" }); - bConvert.onclick = () => { - this.plugin.convertExcalidrawToMD(); - this.close(); - }; - const bCancel = div.createEl("button", { text: "CANCEL" }); - bCancel.onclick = () => { - this.close(); - }; - } -} - export class NewFileActions extends Modal { constructor( private plugin: ExcalidrawPlugin, @@ -609,3 +553,74 @@ export class NewFileActions extends Modal { }); } } + +export class ConfirmationPrompt extends Modal { + public waitForClose: Promise; + private resolvePromise: (value: boolean) => void; + private rejectPromise: (reason?: any) => void; + private didConfirm: boolean = false; + private readonly message: string; + + constructor(private plugin: ExcalidrawPlugin, message: string) { + super(plugin.app); + this.message = message; + this.waitForClose = new Promise((resolve, reject) => { + this.resolvePromise = resolve; + this.rejectPromise = reject; + }); + + this.display(); + this.open(); + } + + private display() { + this.contentEl.empty(); + this.titleEl.textContent = "Confirmation"; + + const messageEl = this.contentEl.createDiv(); + messageEl.style.marginBottom = "1rem"; + messageEl.innerHTML = this.message; + + const buttonContainer = this.contentEl.createDiv(); + buttonContainer.style.display = "flex"; + buttonContainer.style.justifyContent = "flex-end"; + + const cancelButton = this.createButton(buttonContainer, "Cancel", this.cancelClickCallback); + cancelButton.buttonEl.style.marginRight = "0.5rem"; + + const confirmButton = this.createButton(buttonContainer, "OK", this.confirmClickCallback); + confirmButton.buttonEl.style.marginRight = "0"; + + cancelButton.buttonEl.focus(); + } + + private createButton(container: HTMLElement, text: string, callback: (evt: MouseEvent) => void) { + const button = new ButtonComponent(container); + button.setButtonText(text).onClick(callback); + return button; + } + + private cancelClickCallback = () => { + this.didConfirm = false; + this.close(); + }; + + private confirmClickCallback = () => { + this.didConfirm = true; + this.close(); + }; + + onOpen() { + super.onOpen(); + this.contentEl.querySelector("button")?.focus(); + } + + onClose() { + super.onClose(); + if (!this.didConfirm) { + this.resolvePromise(false); + } else { + this.resolvePromise(true); + } + } +} diff --git a/src/lang/locale/en.ts b/src/lang/locale/en.ts index 41e4055..f19fc0f 100644 --- a/src/lang/locale/en.ts +++ b/src/lang/locale/en.ts @@ -50,6 +50,8 @@ export default { "Copy 'group=' markdown link for selected element to clipboard.", INSERT_LINK_TO_ELEMENT_AREA: "Copy 'area=' markdown link for selected element to clipboard.", + INSERT_LINK_TO_ELEMENT_FRAME: + "Copy 'frame=' markdown link for selected element to clipboard.", INSERT_LINK_TO_ELEMENT_NORMAL: "Copy markdown link for selected element to clipboard.", INSERT_LINK_TO_ELEMENT_ERROR: "Select a single element in the scene", @@ -90,6 +92,14 @@ export default { COMPATIBILITY_MODE: "*.excalidraw file opened in compatibility mode. Convert to new format for full plugin functionality.", CONVERT_FILE: "Convert to new format", + BACKUP_AVAILABLE: "There was an error loading your drawing. This could be because Obsidian terminated unexpectedly during a save operation (e.g. you 'swiped' Obsidian away on your mobile device in an unlucky moment). " + + "

GOOD NEWS: There is a local backup available. Note however, if the last time you modified this drawing you were using Obsidian on different device (i.e. now you are on your desktop and you modified it on your tablet), that other device will likely have a more recent backup available. " + + "Try opening the drawing on your other device first, and restoring the backup from that local backup. " + + "

Would you like to load the backup?", + BACKUP_RESTORED: "Backup restored", + CACHE_NOT_READY: "I am sorry, but there was an error loading your file. The plugin has a backup cache, but it looks like as if you've just started Obsidian. Initialization of the Backup Cache " + + "can take up to a minute (or more depending on your device). You will be notified when the cache initialization is completed." + + "

Press OK to try again, or Cancel to manually correct your file or to come back later.", //settings.ts RELEASE_NOTES_NAME: "Display Release Notes after update", @@ -338,7 +348,9 @@ FILENAME_HEAD: "Filename", EMBED_IMAGE_CACHE_NAME: "Cache images for embedding in markdown", EMBED_IMAGE_CACHE_DESC: "Cache images for embedding in markdown. This will speed up the embedding process, but in case you compose images of several sub-component drawings, " + "the embedded image in Markdown won't update until you open the drawing and save it to trigger an update of the cache.", - EMBED_IMAGE_CACHE_CLEAR: "Clear image cache", + EMBED_IMAGE_CACHE_CLEAR: "Purge Cache", + BACKUP_CACHE_CLEAR: "Purge Backups", + BACKUP_CACHE_CLEAR_CONFIRMATION: "This action will delete all Excalidraw drawing backups. Backups are used as a safety measure in case your drawing file gets damaged. Each time you open Obsidian the plugin automatically deletes backups for files that no longer exist in your Vault. Are you sure you want to clear all backups?", EMBED_REUSE_EXPORTED_IMAGE_NAME: "If found, use the already exported image for preview", EMBED_REUSE_EXPORTED_IMAGE_DESC: diff --git a/src/main.ts b/src/main.ts index ce70aac..c80f805 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1172,6 +1172,22 @@ export default class ExcalidrawPlugin extends Plugin { }, }); + this.addCommand({ + id: "insert-link-to-element-frame", + name: t("INSERT_LINK_TO_ELEMENT_FRAME"), + checkCallback: (checking: boolean) => { + if (checking) { + return Boolean(this.app.workspace.getActiveViewOfType(ExcalidrawView)) + } + const view = this.app.workspace.getActiveViewOfType(ExcalidrawView); + if (view) { + view.copyLinkToSelectedElementToClipboard("frame="); + return true; + } + return false; + }, + }); + this.addCommand({ id: "insert-link-to-element-area", name: t("INSERT_LINK_TO_ELEMENT_AREA"), @@ -1699,6 +1715,14 @@ export default class ExcalidrawPlugin extends Plugin { const data = await app.vault.read(file); await inData.loadData(data,file,getTextMode(data)); excalidrawView.synchronizeWithData(inData); + if(excalidrawView.semaphores.dirty) { + if(excalidrawView.autosaveTimer && excalidrawView.autosaveFunction) { + clearTimeout(excalidrawView.autosaveTimer); + } + if(excalidrawView.autosaveFunction) { + excalidrawView.autosaveFunction(); + } + } } else { excalidrawView.reload(true, excalidrawView.file); } @@ -2344,7 +2368,7 @@ export default class ExcalidrawPlugin extends Plugin { ); } - private async setExcalidrawView(leaf: WorkspaceLeaf) { + public async setExcalidrawView(leaf: WorkspaceLeaf) { await leaf.setViewState({ type: VIEW_TYPE_EXCALIDRAW, state: leaf.view.getState(), diff --git a/src/menu/MenuLinks.tsx b/src/menu/MenuLinks.tsx deleted file mode 100644 index a22bde5..0000000 --- a/src/menu/MenuLinks.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import { AppState } from "@zsviczian/excalidraw/types/types"; -import clsx from "clsx"; -import * as React from "react"; -import ExcalidrawPlugin from "../main"; - - -export class MenuLinks { - plugin: ExcalidrawPlugin; - ref: React.MutableRefObject; - - constructor(plugin: ExcalidrawPlugin, ref: React.MutableRefObject) { - this.plugin = plugin; - this.ref = ref; - } - - render = (isMobile: boolean, appState: AppState) => { - return ( -
Hello
- ); - } -} diff --git a/src/settings.ts b/src/settings.ts index 7cca5b8..5a519dd 100644 --- a/src/settings.ts +++ b/src/settings.ts @@ -25,6 +25,7 @@ import { } from "./utils/Utils"; import { image } from "html2canvas/dist/types/css/types/image"; import { imageCache } from "./utils/ImageCache"; +import { ConfirmationPrompt } from "./dialogs/Prompt"; export interface ExcalidrawSettings { folder: string; @@ -1154,7 +1155,19 @@ export class ExcalidrawSettingTab extends PluginSettingTab { button .setButtonText(t("EMBED_IMAGE_CACHE_CLEAR")) .onClick(() => { - imageCache.clear(); + imageCache.clearImageCache(); + }) + ) + .addButton((button) => + button + .setButtonText(t("BACKUP_CACHE_CLEAR")) + .onClick(() => { + const confirmationPrompt = new ConfirmationPrompt(this.plugin,t("BACKUP_CACHE_CLEAR_CONFIRMATION")); + confirmationPrompt.waitForClose.then((confirmed) => { + if (confirmed) { + imageCache.clearBackupCache(); + } + }); }) ); diff --git a/src/utils/ImageCache.ts b/src/utils/ImageCache.ts index 144fec9..a0dffcd 100644 --- a/src/utils/ImageCache.ts +++ b/src/utils/ImageCache.ts @@ -19,22 +19,26 @@ type ImageKey = { scale: number; }; -const getKey = (key: ImageKey): string => `${key.filepath}#${key.blockref}#${key.sectionref}#${key.isDark?1:0}#${key.isSVG?1:0}#${key.scale}`; +const getKey = (key: ImageKey): string => + `${key.filepath}#${key.blockref}#${key.sectionref}#${key.isDark ? 1 : 0}#${key.isSVG ? 1 : 0}#${key.scale}`; class ImageCache { private dbName: string; private cacheStoreName: string; + private backupStoreName: string; private db: IDBDatabase | null; private isInitializing: boolean; public plugin: ExcalidrawPlugin; + public initializationNotice: boolean = false; - constructor(dbName: string, cacheStoreName: string) { + constructor(dbName: string, cacheStoreName: string, backupStoreName: string) { this.dbName = dbName; this.cacheStoreName = cacheStoreName; + this.backupStoreName = backupStoreName; this.db = null; this.isInitializing = false; this.plugin = null; - app.workspace.onLayoutReady(()=>this.initializeDB()); + app.workspace.onLayoutReady(() => this.initializeDB()); } private async initializeDB(): Promise { @@ -52,6 +56,9 @@ class ImageCache { if (!db.objectStoreNames.contains(this.cacheStoreName)) { db.createObjectStore(this.cacheStoreName); } + if (!db.objectStoreNames.contains(this.backupStoreName)) { + db.createObjectStore(this.backupStoreName); + } }; this.db = await new Promise((resolve, reject) => { @@ -64,21 +71,29 @@ class ImageCache { reject(new Error(`Failed to open or create IndexedDB database: ${this.dbName}`)); }; }); - - // Pre-create the object store to reduce delay when accessing it later - if (!this.db.objectStoreNames.contains(this.cacheStoreName)) { + + // Pre-create the object stores to reduce delay when accessing them later + if ( + !this.db.objectStoreNames.contains(this.cacheStoreName) || + !this.db.objectStoreNames.contains(this.backupStoreName) + ) { const version = this.db.version + 1; this.db.close(); const upgradeRequest = indexedDB.open(this.dbName, version); upgradeRequest.onupgradeneeded = (event: IDBVersionChangeEvent) => { const db = (event.target as IDBOpenDBRequest).result; - db.createObjectStore(this.cacheStoreName); + if (!db.objectStoreNames.contains(this.cacheStoreName)) { + db.createObjectStore(this.cacheStoreName); + } + if (!db.objectStoreNames.contains(this.backupStoreName)) { + db.createObjectStore(this.backupStoreName); + } }; await new Promise((resolve, reject) => { upgradeRequest.onsuccess = () => { - const db = (upgradeRequest.result as IDBDatabase); + const db = upgradeRequest.result as IDBDatabase; db.close(); resolve(); }; @@ -91,7 +106,7 @@ class ImageCache { this.db = await new Promise((resolve, reject) => { const openRequest = indexedDB.open(this.dbName); openRequest.onsuccess = () => { - const db = (openRequest.result as IDBDatabase); + const db = openRequest.result as IDBDatabase; resolve(db); }; openRequest.onerror = () => { @@ -99,12 +114,17 @@ class ImageCache { }; }); } - await this.purgeInvalidCacheFiles(); + await this.purgeInvalidCacheFiles(); + await this.purgeInvalidBackupFiles(); } finally { this.isInitializing = false; + if(this.initializationNotice) { + new Notice("Excalidraw Image Cache is Initialized - You may now retry opening your damaged drawing."); + this.initializationNotice = false; + } console.log("Initialized Excalidraw Image Cache"); - } + } } private async purgeInvalidCacheFiles(): Promise { @@ -147,13 +167,51 @@ class ImageCache { }); } - private async getObjectStore(mode: IDBTransactionMode): Promise { - const transaction = this.db!.transaction(this.cacheStoreName, mode); - return transaction.objectStore(this.cacheStoreName); + private async purgeInvalidBackupFiles(): Promise { + const transaction = this.db!.transaction(this.backupStoreName, "readwrite"); + const store = transaction.objectStore(this.backupStoreName); + const files = app.vault.getFiles(); + + const deletePromises: Promise[] = []; + + const request = store.openCursor(); + return new Promise((resolve, reject) => { + request.onsuccess = (event: Event) => { + const cursor = (event.target as IDBRequest).result; + if (cursor) { + const key = cursor.key as BackupKey; + const fileExists = files.some((f: TFile) => f.path === key); + if (!fileExists) { + deletePromises.push( + new Promise((resolve, reject) => { + const deleteRequest = store.delete(cursor.primaryKey); + deleteRequest.onsuccess = () => resolve(); + deleteRequest.onerror = () => + reject(new Error(`Failed to delete backup file with key: ${key}`)); + }) + ); + } + cursor.continue(); + } else { + Promise.all(deletePromises) + .then(() => resolve()) + .catch((error) => reject(error)); + } + }; + + request.onerror = () => { + reject(new Error("Failed to purge invalid backup files from IndexedDB.")); + }; + }); + } + + private async getObjectStore(mode: IDBTransactionMode, storeName: string): Promise { + const transaction = this.db!.transaction(storeName, mode); + return transaction.objectStore(storeName); } private async getCacheData(key: string): Promise { - const store = await this.getObjectStore("readonly"); + const store = await this.getObjectStore("readonly", this.cacheStoreName); const request = store.get(key); return new Promise((resolve, reject) => { @@ -168,9 +226,25 @@ class ImageCache { }); } + private async getBackupData(key: BackupKey): Promise { + const store = await this.getObjectStore("readonly", this.backupStoreName); + const request = store.get(key); + + return new Promise((resolve, reject) => { + request.onsuccess = () => { + const result = request.result as BackupData; + resolve(result || null); + }; + + request.onerror = () => { + reject(new Error("Failed to retrieve backup data from IndexedDB.")); + }; + }); + } + public isReady(): boolean { return !!this.db && !this.isInitializing && !!this.plugin && this.plugin.settings.allowImageCache; - } + } public async getImageFromCache(key_: ImageKey): Promise { if (!this.isReady()) { @@ -188,9 +262,17 @@ class ImageCache { }); } + public async getBAKFromCache(filepath: string): Promise { + if (!this.isReady()) { + return null; // Database not initialized yet + } + + return this.getBackupData(filepath); + } + public addImageToCache(key_: ImageKey, imageBase64: string): void { if (!this.isReady()) { - return; // Database not initialized yet + return; // Database not initialized yet } const file = app.vault.getAbstractFileByPath(key_.filepath.split("#")[0]); @@ -199,31 +281,54 @@ class ImageCache { const transaction = this.db.transaction(this.cacheStoreName, "readwrite"); const store = transaction.objectStore(this.cacheStoreName); - const key = getKey(key_) + const key = getKey(key_); store.put(data, key); } - public async clear(): Promise { - // deliberately not checking isReady() here - if (!this.db || this.isInitializing) { + public async addBAKToCache(filepath: string, data: BackupData): Promise { + if (!this.isReady()) { return; // Database not initialized yet } - const transaction = this.db.transaction(this.cacheStoreName, "readwrite"); - const store = transaction.objectStore(this.cacheStoreName); - const request = store.clear(); + const transaction = this.db.transaction(this.backupStoreName, "readwrite"); + const store = transaction.objectStore(this.backupStoreName); + store.put(data, filepath); + } + public async clearImageCache(): Promise { + if (!this.isReady()) { + return; // Database not initialized yet + } + + return this.clear(this.cacheStoreName, "Image cache was cleared"); + } + + public async clearBackupCache(): Promise { + if (!this.isReady()) { + return; // Database not initialized yet + } + + return this.clear(this.backupStoreName, "All backups were cleared"); + } + + private async clear(storeName: string, message: string): Promise { + if (!this.isReady()) { + return; // Database not initialized yet + } + + const transaction = this.db.transaction([storeName], "readwrite"); + const store = transaction.objectStore(storeName); + return new Promise((resolve, reject) => { + const request = store.clear(); request.onsuccess = () => { - new Notice("Image cache cleared."); + new Notice(message); resolve(); }; - - request.onerror = () => { - reject(new Error("Failed to clear data in IndexedDB.")); - }; + request.onerror = () => reject(new Error(`Failed to clear ${storeName}.`)); }); } + } -export const imageCache = new ImageCache(DB_NAME, CACHE_STORE); \ No newline at end of file +export const imageCache = new ImageCache(DB_NAME, CACHE_STORE, BACKUP_STORE); \ No newline at end of file diff --git a/src/utils/Utils.ts b/src/utils/Utils.ts index d74b2e2..42560d9 100644 --- a/src/utils/Utils.ts +++ b/src/utils/Utils.ts @@ -606,14 +606,15 @@ export const getEmbeddedFilenameParts = (fname:string):{ hasGroupref: boolean, hasTaskbone: boolean, hasArearef: boolean, + hasFrameref: boolean, blockref: string, hasSectionref: boolean, sectionref: string, linkpartReference: string, linkpartAlias: string } => { - // 0 1 23 4 5 6 7 8 9 - const parts = fname?.match(/([^#\^]*)((#\^)(group=|area=|taskbone)?([^\|]*)|(#)(group=|area=|taskbone)?([^\^\|]*))(.*)/); + // 0 1 23 4 5 6 7 8 9 + const parts = fname?.match(/([^#\^]*)((#\^)(group=|area=|frame=|taskbone)?([^\|]*)|(#)(group=|area=|frame=|taskbone)?([^\^\|]*))(.*)/); if(!parts) { return { filepath: fname, @@ -621,6 +622,7 @@ export const getEmbeddedFilenameParts = (fname:string):{ hasGroupref: false, hasTaskbone: false, hasArearef: false, + hasFrameref: false, blockref: "", hasSectionref: false, sectionref: "", @@ -634,6 +636,7 @@ export const getEmbeddedFilenameParts = (fname:string):{ hasGroupref: (parts[4]==="group=") || (parts[7]==="group="), hasTaskbone: (parts[4]==="taskbone") || (parts[7]==="taskbone"), hasArearef: (parts[4]==="area=") || (parts[7]==="area="), + hasFrameref: (parts[4]==="frame=") || (parts[7]==="frame="), blockref: parts[5], hasSectionref: Boolean(parts[6]), sectionref: parts[8],