renun/obsidian-excalidraw-plugin
1
0
Fork 0
mirror of https://github.com/zsviczian/obsidian-excalidraw-plugin.git synced 2025-08-06 05:46:28 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

1.7.25

Browse Source
This commit is contained in:
Zsolt Viczian
2022-10-16 20:22:20 +02:00
parent 7d139462bf
commit 04367bd3cd
9 changed files with 110 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
manifest.json
View File

@@ -1,7 +1,7 @@
{
"id": "obsidian-excalidraw-plugin",
"name": "Excalidraw",
"version": "1.7.24",
"version": "1.7.25",
"minAppVersion": "0.15.6",
"description": "An Obsidian plugin to edit and view Excalidraw drawings",
"author": "Zsolt Viczian",

2
package.json
View File

@@ -1,6 +1,6 @@
{
"name": "obsidian-excalidraw-plugin",
"version": "1.7.23",
"version": "1.7.25",
"description": "This is an Obsidian.md plugin that lets you view and edit Excalidraw drawings",
"main": "lib/index.js",
"types": "lib/index.d.ts",

13
src/ExcalidrawAutomate.ts
View File

@@ -1491,6 +1491,15 @@ export class ExcalidrawAutomate implements ExcalidrawAutomateInterface {
pointerPosition: { x: number; y: number }; //the pointer position on canvas at the time of drop
}) => boolean = null;
/**
* If set, this callback is triggered whenever the active canvas color changes
*/
onCanvasColorChangeHook: (
ea: ExcalidrawAutomate,
view: ExcalidrawView, //the excalidraw view
color: string,
) => void = null;
/**
* utility function to generate EmbeddedFilesLoader object
* @param isDark
@@ -1858,6 +1867,10 @@ export class ExcalidrawAutomate implements ExcalidrawAutomateInterface {
log("Creates a CM object. Visit https://github.com/lbragile/ColorMaster for documentation.");
return;
}
if(typeof color === "string") {
color = this.colorNameToHex(color);
}
return CM(color);
}
};

13
src/ExcalidrawView.ts
View File

@@ -1441,7 +1441,7 @@ export default class ExcalidrawView extends TextFileView {
this.previousSceneVersion = 0;
}
private isLoaded: boolean = false;
public isLoaded: boolean = false;
async setViewData(data: string, clear: boolean = false) {
if(this.plugin.settings.showNewVersionNotification) checkExcalidrawVersion(app);
this.isLoaded = false;
@@ -2784,6 +2784,15 @@ export default class ExcalidrawView extends TextFileView {
libraryReturnUrl: "app://obsidian.md",
autoFocus: true,
onChange: (et: ExcalidrawElement[], st: AppState) => {
const canvasColorChangeHook = () => {
if(this.plugin.ea.onCanvasColorChangeHook) {
this.plugin.ea.onCanvasColorChangeHook(
this.plugin.ea,
this,
st.viewBackgroundColor
)
}
}
viewModeEnabled = st.viewModeEnabled;
if (this.semaphores.justLoaded) {
this.semaphores.justLoaded = false;
@@ -2792,6 +2801,7 @@ export default class ExcalidrawView extends TextFileView {
}
this.previousSceneVersion = this.getSceneVersion(et);
this.previousBackgroundColor = st.viewBackgroundColor;
canvasColorChangeHook();
return;
}
if (this.semaphores.dirty) {
@@ -2816,6 +2826,7 @@ export default class ExcalidrawView extends TextFileView {
this.previousSceneVersion = sceneVersion;
this.previousBackgroundColor = st.viewBackgroundColor;
this.setDirty(6);
canvasColorChangeHook();
}
}
},

25
src/dialogs/Messages.ts
View File

@@ -17,6 +17,31 @@ I develop this plugin as a hobby, spending most of my free time doing this. If y
<div class="ex-coffee-div"><a href="https://ko-fi.com/zsolt"><img src="https://cdn.ko-fi.com/cdn/kofi3.png?v=3" height=45></a></div>
`,
"1.7.25":`## Fixed
- Tool buttons did not "stick" the first time you clicked them.
- Tray (in tray mode) was higher when the help button was visible. The tray in tablet mode was too large and the help button was missing.
- ExcalidrawAutomate ${String.fromCharCode(96)}getCM(color:TInput): ColorMaster;${String.fromCharCode(96)} function will now properly convert valid [css color names](https://www.w3schools.com/colors/colors_names.asp) to ColorMaster objects.
- The downloaded script icons in the Excalidraw-Obsidian menu were not always correct
- The obsidian mobile navigation bar at the bottom overlapped with Excalidraw
## New
- Created ExcalidrawAutomate hook for styling script when the canvas color changes. See sample [onCanvasColorChangeHook](https://gist.github.com/zsviczian/c7223c5b4af30d5c88a0cae05300305c) implementation following the link.
<div class="excalidraw-videoWrapper"><div>
<iframe src="https://www.youtube.com/embed/LtR04fNTKTM" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</div></div>
${String.fromCharCode(96, 96, 96)}typescript
/**
* If set, this callback is triggered whenever the active canvas color changes
*/
onCanvasColorChangeHook: (
ea: ExcalidrawAutomate,
view: ExcalidrawView, //the Excalidraw view
color: string,
) => void = null;
${String.fromCharCode(96, 96, 96)}
`,
"1.7.24":`
# New and improved
- **Updated Chinese translation**. Thanks, @tswwe!

43
src/main.ts
View File

@@ -1634,7 +1634,7 @@ export default class ExcalidrawPlugin extends Plugin {
const activeLeafChangeEventHandler = async (leaf: WorkspaceLeaf) => {
//https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/723
if(self.leafChangeTimeout) {
clearTimeout(this.leafChangeTimeout);
clearTimeout(self.leafChangeTimeout);
}
self.leafChangeTimeout = setTimeout(()=>{self.leafChangeTimeout = null;},1000);
@@ -1647,6 +1647,25 @@ export default class ExcalidrawPlugin extends Plugin {
self.lastActiveExcalidrawFilePath = newActiveviewEV.file?.path;
}
//!Temporary hack
//https://discord.com/channels/686053708261228577/817515900349448202/1031101635784613968
if (app.isMobile && newActiveviewEV && !previouslyActiveEV) {
const navbar = document.querySelector("body>.app-container>.mobile-navbar");
if(navbar && navbar instanceof HTMLDivElement) {
navbar.style.position="relative";
}
}
if (app.isMobile && !newActiveviewEV && previouslyActiveEV) {
const navbar = document.querySelector("body>.app-container>.mobile-navbar");
if(navbar && navbar instanceof HTMLDivElement) {
navbar.style.position="";
}
}
//----------------------
//----------------------
if (previouslyActiveEV && previouslyActiveEV !== newActiveviewEV) {
if (previouslyActiveEV.leaf !== leaf) {
//if loading new view to same leaf then don't save. Excalidarw view will take care of saving anyway.
@@ -1684,20 +1703,32 @@ export default class ExcalidrawPlugin extends Plugin {
} //refresh embedded files
}
if ( //@ts-ignore
newActiveviewEV && newActiveviewEV._loaded &&
newActiveviewEV.isLoaded && newActiveviewEV.excalidrawAPI &&
self.ea.onCanvasColorChangeHook
) {
self.ea.onCanvasColorChangeHook(
self.ea,
newActiveviewEV,
newActiveviewEV.excalidrawAPI.getAppState().viewBackgroundColor
);
}
//https://github.com/zsviczian/obsidian-excalidraw-plugin/issues/300
if (self.popScope) {
self.popScope();
self.popScope = null;
}
if (newActiveviewEV) {
const scope = this.app.keymap.getRootScope();
const scope = self.app.keymap.getRootScope();
const handler = scope.register(["Mod"], "Enter", () => true);
const overridSaveShortcut = (
this.forceSaveCommand &&
this.forceSaveCommand.hotkeys[0].key === "s" &&
this.forceSaveCommand.hotkeys[0].modifiers.includes("Ctrl")
self.forceSaveCommand &&
self.forceSaveCommand.hotkeys[0].key === "s" &&
self.forceSaveCommand.hotkeys[0].modifiers.includes("Ctrl")
)
const self = this;
const saveHandler = overridSaveShortcut
? scope.register(["Ctrl"], "s", () => self.forceSaveActiveView(false))
: undefined;

12
src/menu/ActionIcons.tsx
View File

@@ -287,3 +287,15 @@ export const ICONS = {
</svg>
),
};
export const stringToSVG = (svg: string) => {
svg = svg
.replace(/stroke\s*=\s*['"][^"']*['"]/g,"")
.replace(/width\s*=\s*['"][^"']*['"]/g,"")
.replace(/height\s*=\s*['"][^"']*['"]/g,"")
.replace("<svg ",`<svg style="stroke:var(--icon-fill-color);color:var(--icon-fill-color);fill:var(--icon-fill-color)" `)
return (
<div dangerouslySetInnerHTML={{__html: svg}}></div>
)
}

21
src/menu/ToolsPanel.tsx
View File

@@ -2,7 +2,7 @@ import clsx from "clsx";
import { Notice, TFile } from "obsidian";
import * as React from "react";
import { ActionButton } from "./ActionButton";
import { ICONS } from "./ActionIcons";
import { ICONS, stringToSVG } from "./ActionIcons";
import { SCRIPT_INSTALL_FOLDER, CTRL_OR_CMD } from "../Constants";
import { insertLaTeXToView, search } from "../ExcalidrawAutomate";
import ExcalidrawView, { TextMode } from "../ExcalidrawView";
@@ -257,6 +257,7 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
className="Island App-menu__left scrollbar"
style={{
maxHeight: "350px",
backgroundColor: "transparent",
//@ts-ignore
"--padding": 2,
display: this.state.minimized ? "none" : "block",
@@ -532,21 +533,9 @@ export class ToolsPanel extends React.Component<PanelProps, PanelState> {
}
}}
icon={
this.state.scriptIconMap[key].svgString ? (
<img
src={`data:image/svg+xml,${encodeURIComponent(
this.state.theme === "dark"
? this.state.scriptIconMap[key].svgString.replace(
"<svg ",
dark,
)
: this.state.scriptIconMap[key].svgString.replace(
"<svg ",
light,
),
)}`}
/>
) : (
this.state.scriptIconMap[key].svgString
? stringToSVG(this.state.scriptIconMap[key].svgString)
: (
ICONS.cog
)
}

4
styles.css
View File

@@ -223,4 +223,8 @@ textarea.excalidraw-wysiwyg {
-moz-box-shadow: none;
box-shadow: none;
border-radius: 0;
}
.is-tablet .excalidraw button {
padding: initial;
}