mirror of
https://github.com/zsviczian/obsidian-excalidraw-plugin.git
synced 2025-08-06 05:46:28 +00:00
Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
0a2ef2d751 | ||
|
|
1d830526a7 |
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"id": "obsidian-excalidraw-plugin",
|
||||
"name": "Excalidraw",
|
||||
"version": "1.5.28",
|
||||
"version": "1.5.30",
|
||||
"minAppVersion": "0.12.16",
|
||||
"description": "An Obsidian plugin to edit and view Excalidraw drawings",
|
||||
"author": "Zsolt Viczian",
|
||||
|
||||
@@ -1637,6 +1637,7 @@ export async function createSVG(
|
||||
exportSettings?.withBackground ?? plugin.settings.exportWithBackground,
|
||||
withTheme: exportSettings?.withTheme ?? plugin.settings.exportWithTheme,
|
||||
},
|
||||
plugin.settings.exportPaddingSVG,
|
||||
);
|
||||
if (template?.hasSVGwithBitmap) {
|
||||
svg.setAttribute("hasbitmap", "true");
|
||||
|
||||
@@ -200,7 +200,11 @@ export default class ExcalidrawView extends TextFileView {
|
||||
withBackground: this.plugin.settings.exportWithBackground,
|
||||
withTheme: this.plugin.settings.exportWithTheme,
|
||||
};
|
||||
const svg = await getSVG(scene, exportSettings);
|
||||
const svg = await getSVG (
|
||||
scene,
|
||||
exportSettings,
|
||||
this.plugin.settings.exportPaddingSVG,
|
||||
);
|
||||
if (!svg) {
|
||||
return;
|
||||
}
|
||||
@@ -252,6 +256,9 @@ export default class ExcalidrawView extends TextFileView {
|
||||
if (!this.isLoaded) {
|
||||
return;
|
||||
}
|
||||
if(!this.app.vault.getAbstractFileByPath(this.file.path)) {
|
||||
return; //file was recently deleted
|
||||
}
|
||||
this.preventReload = preventReload;
|
||||
this.dirty = null;
|
||||
const scene = this.getScene();
|
||||
@@ -1014,7 +1021,11 @@ export default class ExcalidrawView extends TextFileView {
|
||||
withBackground: this.plugin.settings.exportWithBackground,
|
||||
withTheme: this.plugin.settings.exportWithTheme,
|
||||
};
|
||||
let svg = await getSVG(this.getScene(), exportSettings);
|
||||
let svg = await getSVG (
|
||||
this.getScene(),
|
||||
exportSettings,
|
||||
this.plugin.settings.exportPaddingSVG,
|
||||
);
|
||||
if (!svg) {
|
||||
return null;
|
||||
}
|
||||
|
||||
@@ -10,7 +10,7 @@ import {
|
||||
} from "obsidian";
|
||||
import ExcalidrawView from "./ExcalidrawView";
|
||||
import ExcalidrawPlugin from "./main";
|
||||
import { getNewOrAdjacentLeaf } from "./Utils";
|
||||
import { getNewOrAdjacentLeaf, sleep } from "./Utils";
|
||||
|
||||
export class Prompt extends Modal {
|
||||
private promptEl: HTMLInputElement;
|
||||
@@ -399,7 +399,7 @@ export class NewFileActions extends Modal {
|
||||
const f = await this.app.fileManager.createNewMarkdownFileFromLinktext(this.path,this.viewFile)
|
||||
if(!f) return;
|
||||
await this.app.vault.modify(f,await this.plugin.getBlankDrawing());
|
||||
await new Promise(r => setTimeout(r, 200)); //wait for metadata cache to update, so file opens as excalidraw
|
||||
await sleep(200); //wait for metadata cache to update, so file opens as excalidraw
|
||||
this.openFile(f);
|
||||
this.close();
|
||||
};
|
||||
|
||||
@@ -405,6 +405,7 @@ export const getAttachmentsFolderAndFilePath = async (
|
||||
export const getSVG = async (
|
||||
scene: any,
|
||||
exportSettings: ExportSettings,
|
||||
padding: number,
|
||||
): Promise<SVGSVGElement> => {
|
||||
try {
|
||||
return await exportToSvg({
|
||||
@@ -417,7 +418,7 @@ export const getSVG = async (
|
||||
...scene.appState,
|
||||
},
|
||||
files: scene.files,
|
||||
exportPadding: 10,
|
||||
exportPadding: padding,
|
||||
});
|
||||
} catch (error) {
|
||||
return null;
|
||||
|
||||
@@ -245,6 +245,8 @@ export default {
|
||||
EXPORT_BACKGROUND_NAME: "Export image with background",
|
||||
EXPORT_BACKGROUND_DESC:
|
||||
"If turned off, the exported image will be transparent.",
|
||||
EXPORT_SVG_PADDING_NAME: "SVG Padding",
|
||||
EXPORT_SVG_PADDING_DESC: "The padding (in pixels) around the exported SVG image. If you have curved lines close to the edge of the image they might get cropped during SVG export. You can increase this value to avoid cropping.",
|
||||
EXPORT_THEME_NAME: "Export image with theme",
|
||||
EXPORT_THEME_DESC:
|
||||
"Export the image matching the dark/light theme of your drawing. If turned off, " +
|
||||
|
||||
53
src/main.ts
53
src/main.ts
@@ -70,6 +70,7 @@ import {
|
||||
getNewUniqueFilepath,
|
||||
isObsidianThemeDark,
|
||||
log,
|
||||
sleep,
|
||||
} from "./Utils";
|
||||
import { OneOffs } from "./OneOffs";
|
||||
import { FileId } from "@zsviczian/excalidraw/types/element/types";
|
||||
@@ -661,7 +662,9 @@ export default class ExcalidrawPlugin extends Plugin {
|
||||
this.lastActiveExcalidrawFilePath != null
|
||||
);
|
||||
}
|
||||
this.embedDrawing(this.lastActiveExcalidrawFilePath);
|
||||
const file = this.app.vault.getAbstractFileByPath(this.lastActiveExcalidrawFilePath);
|
||||
if(!(file instanceof TFile)) return false;
|
||||
this.embedDrawing(file);
|
||||
return true;
|
||||
},
|
||||
});
|
||||
@@ -707,7 +710,7 @@ export default class ExcalidrawPlugin extends Plugin {
|
||||
)
|
||||
).folder;
|
||||
const file = await this.createDrawing(filename, folder);
|
||||
await this.embedDrawing(file.path);
|
||||
await this.embedDrawing(file);
|
||||
this.openDrawing(file, inNewPane);
|
||||
};
|
||||
|
||||
@@ -1249,16 +1252,19 @@ export default class ExcalidrawPlugin extends Plugin {
|
||||
|
||||
//delete PNG and SVG files as well
|
||||
if (self.settings.keepInSync) {
|
||||
[".svg", ".png", ".excalidraw"].forEach(async (ext: string) => {
|
||||
const imgPath = getIMGPathFromExcalidrawFile(file.path, ext);
|
||||
const imgFile = self.app.vault.getAbstractFileByPath(
|
||||
normalizePath(imgPath),
|
||||
);
|
||||
if (imgFile && imgFile instanceof TFile) {
|
||||
await self.app.vault.delete(imgFile);
|
||||
}
|
||||
});
|
||||
setTimeout(()=>{
|
||||
[".svg", ".png", ".excalidraw"].forEach(async (ext: string) => {
|
||||
const imgPath = getIMGPathFromExcalidrawFile(file.path, ext);
|
||||
const imgFile = self.app.vault.getAbstractFileByPath(
|
||||
normalizePath(imgPath),
|
||||
);
|
||||
if (imgFile && imgFile instanceof TFile) {
|
||||
await self.app.vault.delete(imgFile);
|
||||
}
|
||||
});
|
||||
},500);
|
||||
}
|
||||
|
||||
};
|
||||
self.registerEvent(self.app.vault.on("delete", deleteEventHandler));
|
||||
|
||||
@@ -1370,20 +1376,31 @@ export default class ExcalidrawPlugin extends Plugin {
|
||||
//this.saveSettings();
|
||||
}
|
||||
|
||||
public async embedDrawing(data: string) {
|
||||
public async embedDrawing(file: TFile) {
|
||||
const activeView = this.app.workspace.getActiveViewOfType(MarkdownView);
|
||||
if (activeView) {
|
||||
if (activeView && activeView.file) {
|
||||
const data = this.app.metadataCache.fileToLinktext(
|
||||
file,
|
||||
activeView.file.path,
|
||||
this.settings.embedType === "excalidraw"
|
||||
)
|
||||
const editor = activeView.editor;
|
||||
if (this.settings.embedType === "excalidraw") {
|
||||
editor.replaceSelection(`![[${data}]]`);
|
||||
editor.focus();
|
||||
return;
|
||||
}
|
||||
const filename = `${data.substring(
|
||||
0,
|
||||
data.lastIndexOf("."),
|
||||
)}.${this.settings.embedType.toLowerCase()}`;
|
||||
await this.app.vault.create(filename, "");
|
||||
|
||||
const filename = getIMGPathFromExcalidrawFile(
|
||||
data,"."+this.settings.embedType.toLowerCase()
|
||||
);
|
||||
const filepath = getIMGPathFromExcalidrawFile(
|
||||
file.path,"."+this.settings.embedType.toLowerCase()
|
||||
);
|
||||
|
||||
await this.app.vault.create(filepath, "");
|
||||
//await sleep(200);
|
||||
|
||||
editor.replaceSelection(
|
||||
`![[${filename}]]\n%%[[${data}|🖋 Edit in Excalidraw]]%%`,
|
||||
);
|
||||
|
||||
@@ -58,7 +58,7 @@ export class OpenFileDialog extends FuzzySuggestModal<TFile> {
|
||||
this.plugin.openDrawing(item, this.onNewPane);
|
||||
break;
|
||||
case openDialogAction.insertLinkToDrawing:
|
||||
this.plugin.embedDrawing(item.path);
|
||||
this.plugin.embedDrawing(item);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -39,6 +39,7 @@ export interface ExcalidrawSettings {
|
||||
pngExportScale: number;
|
||||
exportWithTheme: boolean;
|
||||
exportWithBackground: boolean;
|
||||
exportPaddingSVG: number;
|
||||
keepInSync: boolean;
|
||||
autoexportSVG: boolean;
|
||||
autoexportPNG: boolean;
|
||||
@@ -96,6 +97,7 @@ export const DEFAULT_SETTINGS: ExcalidrawSettings = {
|
||||
pngExportScale: 1,
|
||||
exportWithTheme: true,
|
||||
exportWithBackground: true,
|
||||
exportPaddingSVG: 10,
|
||||
keepInSync: false,
|
||||
autoexportSVG: false,
|
||||
autoexportPNG: false,
|
||||
@@ -731,6 +733,28 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
|
||||
}),
|
||||
);
|
||||
|
||||
let exportPadding: HTMLDivElement;
|
||||
|
||||
new Setting(containerEl)
|
||||
.setName(t("EXPORT_SVG_PADDING_NAME"))
|
||||
.setDesc(fragWithHTML(t("EXPORT_SVG_PADDING_DESC")))
|
||||
.addSlider((slider) =>
|
||||
slider
|
||||
.setLimits(0,50,5)
|
||||
.setValue(this.plugin.settings.exportPaddingSVG)
|
||||
.onChange(async (value) => {
|
||||
exportPadding.innerText = ` ${value.toString()}`;
|
||||
this.plugin.settings.exportPaddingSVG = value;
|
||||
this.applySettingsUpdate();
|
||||
}),
|
||||
)
|
||||
.settingEl.createDiv("", (el) => {
|
||||
exportPadding = el;
|
||||
el.style.minWidth = "2.3em";
|
||||
el.style.textAlign = "right";
|
||||
el.innerText = ` ${this.plugin.settings.exportPaddingSVG.toString()}`;
|
||||
});
|
||||
|
||||
new Setting(containerEl)
|
||||
.setName(t("EXPORT_THEME_NAME"))
|
||||
.setDesc(fragWithHTML(t("EXPORT_THEME_DESC")))
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
{
|
||||
"1.5.28": "0.12.16",
|
||||
"1.5.30": "0.12.16",
|
||||
"1.4.2": "0.11.13"
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user