VS Code Extension

[hediet]

I'm probably not going to create commutative diagrams any time soon. However, I think a VS Code extension that wraps this editor might be a good thing if you are already using vscode to write latex.

It could offer a custom editor for *.commutative.latex files that reads and writes diagrams from/into such files. You could directly import this file from latex without needing to export anything.

I'm willing to help!

[varkor]

Thanks for the suggestion. I only have experience writing textual VS Code extensions, so I'm not sure how this would work, but if it's possible, I think it would be really cool to support! I won't have the time to work on this myself any time soon, but I'd be interested in discussing/helping out if you were interested in investigating this.

[hediet]

Are you up for a call in the next week?
I can implement the VS Code extension, but I would probably need some modifications on your side.

Most important thing would be a function to load a file like this:

% https://q.uiver.app/?q=WzAsMTMsWzMsMywiXFxidWxsZXQiXSxbMSwxLCJBIl0sWzQsMSwiXFxidWxsZXQiXSxbNiwzLCJcXGJ1bGxldCJdLFszLDIsIlxcYnVsbGV0Il0sWzQsMywiXFxidWxsZXQiXSxbMCwyLCJcXGJ1bGxldCJdLFsxLDMsIlxcYnVsbGV0Il0sWzIsMCwiXFxidWxsZXQiXSxbMywxLCJcXGJ1bGxldCJdLFsyLDQsIlxcYnVsbGV0Il0sWzIsMl0sWzMsNCwiXFxidWxsZXQiXSxbMCwxLCIiLDAseyJzdHlsZSI6eyJib2R5Ijp7Im5hbWUiOiJzcXVpZ2dseSJ9fX1dLFsyLDNdLFs0LDBdLFs0LDVdLFsxLDZdLFs2LDddLFs4LDldLFsxMyw3LCIiLDIseyJsZW5ndGgiOjcwfV1d
\[\begin{tikzcd}
	&& {\bullet} \\
	& {A} && {\bullet} & {\bullet} \\
	{\bullet} && {} & {\bullet} \\
	& {\bullet} && {\bullet} & {\bullet} && {\bullet} \\
	&& {\bullet} & {\bullet}
	\arrow[""{name=0, inner sep=0}, from=4-4, to=2-2, squiggly]
	\arrow[from=2-5, to=4-7]
	\arrow[from=3-4, to=4-4]
	\arrow[from=3-4, to=4-5]
	\arrow[from=2-2, to=3-1]
	\arrow[from=3-1, to=4-2]
	\arrow[from=1-3, to=2-4]
	\arrow[Rightarrow, from=0, to=4-2, shorten <=4pt, shorten >=4pt]
\end{tikzcd}\]

Also, a changed event would be required that emits an event everytime the document is changed.

[varkor]

If I understand correctly, there's already a function to load files like that (ignoring everything but the URL query string in the comment), QuiverImportExport.base64.import, e.g.

quiver/src/ui.js

Lines 5487 to 5488 in b1e9145

	// Decode the diagram.
	QuiverImportExport.base64.import(ui, query_data.get("q"));

(To load a diagram based just on the tikz-cd code would require #40 or similar.)

Also, a changed event would be required that emits an event everytime the document is changed.

This should be very straightforward.

Are you up for a call in the next week?

I might be at some point, but I would need to figure out when; I'll get back to you.

---

One thing I wonder is whether an more appropriate approach would be to create a desktop version using Electron: thinking about it a little more, I don't see that a VS Code plugin specifically would offer many advantages over simply being able to save commutative diagrams as files that can be included directly in LaTeX (as you mention in the original post), and this would be editor-independent. What are your thoughts?

[hediet]

I think a vscode plugin would provide a lot of value. Such a plugin is very easy to discover and to install - Electron apps aren't. Also, Electron apps are a huge bloat - they usually have a size of up to 100 mb due to the Electron runtime. If you already use vscode to author latex, a vscode plugin would be very convenient.

While #40 might be useful, it is not required for this. I imagine that the extension would save to latex files that include the base64 data as a comment as well as a notice that users are not meant to edit the file directly. The extension could load such a file by just parsing the base64 data. It's the same approach as drawio is using for svg files and it works really well in vscode.

[sleepymalc]

Another incentive might be the following: I use VSCode with HyperSnips for managing all my snippets. And in particular, this only works in VSCode, so whenever I draw a commutative diagram with quiver, I need to typeset every character of the math formula. I'm not sure whether this is the intended feature, but if this editor can be run inside of VSCode, I guess some cool thing can be done, such as supporting snippets directly.

[noPounch]

I found a simple workaround using live preview. Just DL quiver source, make it in your workspace, and then preview index.html. Works fine for me.