From 881fce50236986738e92f8fb77e5a6df2ca8adec Mon Sep 17 00:00:00 2001 From: Firehose Bot Date: Fri, 26 Jun 2026 20:49:37 +0200 Subject: [PATCH] load images - blog post --- ...-26-an-example-would-be-handy-right-now.md | 76 +++++++++++++++++++ 1 file changed, 76 insertions(+) create mode 100644 app/priv/blog/engineering/2026/06-26-an-example-would-be-handy-right-now.md diff --git a/app/priv/blog/engineering/2026/06-26-an-example-would-be-handy-right-now.md b/app/priv/blog/engineering/2026/06-26-an-example-would-be-handy-right-now.md new file mode 100644 index 0000000..d3bfac4 --- /dev/null +++ b/app/priv/blog/engineering/2026/06-26-an-example-would-be-handy-right-now.md @@ -0,0 +1,76 @@ +%{ + title: "An example would be handy right about now - how to shave yaks with great efficiency .", + author: "Willem van den Ende", + tags: ~w(Emacs Examples), + description: "Brian Marick once distributed stickers with 'An example would be handy right about now'. This is also handy in cases where writing a test is not directly obvious", + published: false +} +--- + +Would I recommend Emacs as a writing environment? I don't know. It works for me, mostly thanks to org-roam. And after 5 years of _thou shalt not lose weeks of configuring Emacs_, I am occasionally making small tweaks. + +Admittedly, these tweaks sometimes are things that _should just work out of the box (TM)_. For instance, I can drag and drop an image (on my mac, at least) in an org-mode file, and then I get to choose how the image should be linked to the document. And then I can see it. + +But _of course_ I mean _for some reason_ this does not work in markdown-mode. Luckily [someone else solved this problem before me.](https://oxal.org/blog/powerful-emacs-hacks-paste-images-markdown/). And found that markdown mode is extensible in how it looks for files. + +But what does this have to do with shaving yaks, you wonder? Well, I was annoyed that I could not drag and drop images, displaying images was something the author figured out first, and used as part of a solution in dropping images. + +I have been muddling through, and was reminded I have that problem too. But then I was stuck. I hate thinking about paths on my computer. And for some silly reason, I made this blog in the same way as Jekyll and other static site generators - the images are nowhere near the blog posts. I should fix that, but not on a hot friday when I'm recovering from successful, but intensive, new work. + +[This post helpfully explains how to find the right function, and what to do](https://oxal.org/blog/powerful-emacs-hacks-image-markdown/). And I have a link to an image [in my previous post](https://willemvandenende.com/blog/engineering/enabling-a-local-model-to-explain-images-in-pidev) that will of course not show in `markdown-mode`. Staring at the screen for a while, it hit me. + +## An example would be handy right about now + +So I copied the image link, had a look at my directory structure, enabled images (yes, that is disabled by default. I guess a distraction-free writing environment requires the purity of no man-made images). And then still saw nothing, because I forgot the `static` part of the path. But this was quick iteration, no code or tests were harmed in the making of this example: + +``` +![Hand drawn state diagram, transcribed below in 'Inline session transcript' as tables and part mermaid diagram.](/images/blog/2026/tdd-state-diagram-john-jagger.jpeg) + +![what inline image location should be](../../../static/images/blog/2026/tdd-state-diagram-john-jagger.jpeg) +``` + +Now I can go back to the joy of copy-paste-modifying the code from the blogpost with my very own path. + +## A test would be handy right about now + +I figured I could hack this path _only_ for my blog, and use a local configuration. After copy-pasting the code, it was time, for, _le sigh_ _modify_. I could let my animatronic rubber duck do it, but I have decided to better understand my emacs mods, so doing it by hand today. + +There is a `substring` call that I don't need - my example shows that blog post and images are both under `priv`. So I need a bunch of `..` or be clever and use the git project root. Since my example with `..` works, we'll make it work and then maybe make it right. + +But I don't often write tests. And there was an error in it, so going straight to an emacs lisp file was too big a step. + +## Taking a step back, literate programming to the rescue + +In org mode I can have my function and a call for an example in a code block, and see the error right there. I had a 'wrong number of arguments' somewhere. But I can't understand the `ert-deftest` error message. + +Another step back +--- + +Running the function in an org-mode code block worked. the function doesn't. I needed my rubber duck. Thank you dear reader. + +I don't know why emacs' `ert-deftest` test framework needs so many keystrokes. I need to evaluate the buffer (the place where you edit files) and then run the test runner separately. Org-mode worked but also this is not where the code should end up. + +The example code in the blogpost used `message`, so I added that to my emacs lisp file. Now I can evaluate the buffer with a changed function, and see the output (in the 'messages' buffer, and in the status line below) + + +![Hand drawn state diagram, transcribed below in 'Inline session transcript' as tables and part mermaid diagram.](/images/blog/2026/tdd-state-diagram-john-jagger.jpeg) + +original + +![what inline image location should be](../../../static/images/blog/2026/tdd-state-diagram-john-jagger.jpeg) + +# And then it does not integrate + +The last part is monkey patching the long function that markdown-mode uses to generate the image. +the monkey patched functoin enables the 'hook' in another place, but the hook does not get called. + +I am now at the point where I am putting print statements in to see what happens. Print is known as `message` in emacs. And the rubber duck of writing does its thing - after taking a break. + +I put the hook definition inside a callback that gets run when the mode loads. Which of course it does not. More `modify` needed after `copy-paste`. + +# It works. Will it load with my blog repository? + +If I do this by hand, yes. When I add a file named [dir-locals.el](https://wiki.migueldeoleiros.com/notes/20250117203949-local_emacs_configuration_per_directory) I can redefine global variables per mode. The file itself is a list of modes, and settings for each mode. It does not allow for defining new functions. + +That is annoying. With [Pi.dev](Pi.dev) it is nice that I can start moldable development right in my codebase, and only extract to my machine or a published repository once I am a bit further and ready to generalise. I have an ugly hack in a file. I could move this ugly hack to my personal emacs repository, put the image prefix in a `.dir-locals.el` and at least it would automatically load. On my machine. I would like this to go with the blog source, so I can see images wherever I edit. +