When entering an image, optionally allow a link attribute to be set too.

[danhaywood]

My image links almost (in Antora sites) always look like:

image::foo/bar.png[width=400px, link="{imagesdir}/foo/bar.png"]

This allows me to have a relatively small image but which has a hypelink to zoom into.

It would be nice (perhaps under a global option) for the autocomplete function to automatically populate the link=... attribute at the same time.

Perhaps there could be another global option that, if set, specifies the value of the width= attribute.

[danhaywood]

Or, as a different implementation of the same idea, perhaps provide autocomplete options for the attributes within the "[ ... ]", with intelligent autocomplete (ctrl+shift+enter) defaults for these two attributes in particular.

eg, if I type:

image:foo/bar.png[ (ctrl+space)

then I have intellisense offering "width" and "link",

and if I (say) choose "link" (ctrl+shift+enter)

then the plugin will autocomplete so that I have:

image:foo/bar.png[link="{imagesdir}/foo/bar.png",

at which point I can either (ctrl+space) for further attribute choices, ("width"), or just close.

[ahus1]

Hello @danhaywood - adding a fixed width for some images sounds project specific to me. The combination you describe here will only work for module-local images, therefore I hesitate to include support for it by default.

I'd recommend for this to use IntelliJ's live templates. It could look like this:

The benefit: You can type in the file name once, and have it in two places at the same time:

Looking at the fixed width in your example, I'd recommend using a class that can style the image using CSS:

.preview img { width: 400px }

[.preview]
image::file.png[link="{imagesdir}/file.png"]

Using JavaScript you could go one step further to skip the link attribute and add a click handler for all images with a preview class using a snippet of JavaScript. This would the user to require JavaScript, but would eliminate the boilerplate code when writing the document.

Please let me know how the existing options suit your needs.

[danhaywood]

Excellent points.

I do use live templates and I have actually used variables appearing in multiple locations, so I'm not sure why the solution you propose didn't occur to me - at any rate, I concur, that's a much better way to tackle it.

And your other two points based on using a CSS class either for styling or (via JS) to eliminate the link= all together are also very valid.

So, I think best to close this ticket as [not a problem]. But maybe somewhere in your plugins documentation these ideas could appear, eg in a hints-n-tips section ... be a shame for them to not surface beyond this ticket?

On Tue, 14 Jan 2020 at 23:24, Alexander Schwartz notifications@github.com wrote:

Hello @danhaywood https://github.com/danhaywood - adding a fixed width for some images sounds project specific to me. The combination you describe here will only work for module-local images, therefore I hesitate to include support for it by default.

I'd recommend for this to use IntelliJ's live templates. It could look like this:

[image: image] https://user-images.githubusercontent.com/3957921/72390474-1e517e00-372b-11ea-9c7b-7337fbdd1c82.png

The benefit: You can type in the file name once, and have it in two places at the same time:

[image: file-to-click-on] https://user-images.githubusercontent.com/3957921/72390631-7ab49d80-372b-11ea-9579-b35fa694ef76.gif

Looking at the fixed width in your example, I'd recommend using a class that can style the image using CSS:

.preview img { width: 400px }

[.preview]image::file.png[link="{imagesdir}/file.png"]

Using JavaScript you could go one step further to skip the link attribute and add a click handler for all images with a preview class using a snippet of JavaScript. This would the user to require JavaScript, but would eliminate the boilerplate code when writing the document.

Please let me know how the existing options suit your needs.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/asciidoctor/asciidoctor-intellij-plugin/issues/382?email_source=notifications&email_token=AAH33SIF573NCQTMHR4MTXTQ5ZCUTA5CNFSM4KGZPAJKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEI6PT6I#issuecomment-574421497, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAH33SKZIFVDKAYSQEMIY33Q5ZCUTANCNFSM4KGZPAJA .

[danhaywood]

by the way (off topic) ... what tool do you use to create your animated gif's as in https://github.com/asciidoctor/asciidoctor-intellij-plugin/issues/382#issuecomment-574421497 ?

[ahus1]

@danhaywood - that's https://www.screentogif.com/ (open source, windows only)

[danhaywood]

Nice, think I'll be using it for some of my own docs. Cheers

On Tue, 14 Jan 2020, 23:46 Alexander Schwartz, notifications@github.com wrote:

@danhaywood https://github.com/danhaywood - that's https://www.screentogif.com/ (open source, windows only)

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/asciidoctor/asciidoctor-intellij-plugin/issues/382?email_source=notifications&email_token=AAH33SKYZLCBFKAR4LKJQIDQ5ZFFBA5CNFSM4KGZPAJKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEI6REKY#issuecomment-574427691, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAH33SNSWYQG3UYFOFNUYNTQ5ZFFBANCNFSM4KGZPAJA .

[ahus1]

I've added another sentence about live templates to the FEATURES guide and relabeled this as a question.