Transclusion Extension #41

Closed
opened 8 months ago by Alamantus · 13 comments
Owner

I don't think this fits particularly well with Feather Wiki's core concept, but I do think it's a pretty cool idea. Transclusion makes content more modular, and it should be possible to add to the Display view of a page after render.

I don't think this fits particularly well with Feather Wiki's core concept, but I do think it's a pretty cool idea. [Transclusion](https://en.wikipedia.org/wiki/Transclusion) makes content more modular, and it should be possible to add to the Display view of a page after render.
Alamantus added the request help wanted extension labels 8 months ago

Say the way to do transclusion would be via an iframe, something like:

<iframe srcdoc=GetPage("thisPage")></iframe>

The "GetPage" function would return the HTML for the specified page.

The iframe could have a page-title link, maybe a border, all in a style that says "hey, this is a transclusion here", something subtle, not distracting.

Setup default css to make iframe's 100% width, some reasonable height, with height resizeable.

Something like that. Throwing it out there without really having much of a clue about any of it.

Say the way to do transclusion would be via an iframe, something like: `<iframe srcdoc=GetPage("thisPage")></iframe>` The "GetPage" function would return the HTML for the specified page. The iframe could have a page-title link, maybe a border, all in a style that says "hey, this is a transclusion here", something subtle, not distracting. Setup default css to make iframe's 100% width, some reasonable height, with height resizeable. Something like that. Throwing it out there without really having much of a clue about any of it.
Poster
Owner

That's a good thought! I was thinking something even simpler than that, specifically {{page_slug}} would just insert the entire page content found at that slug, if it exists with the title as an H1 tag. It could be placed in an article element, maybe with a "transclusion" or "included" class so it could be easily targeted with CSS.

Similar to your idea, but just directly inserted into the page content instead of using an iframe

That's a good thought! I was thinking something even simpler than that, specifically `{{page_slug}}` would just insert the entire page content found at that slug, if it exists with the title as an H1 tag. It could be placed in an `article` element, maybe with a "transclusion" or "included" class so it could be easily targeted with CSS. Similar to your idea, but just directly inserted into the page content instead of using an `iframe`

Whatever implementation is simplest, quickest and stable for your development and maintenance sounds the best to me.

Immediate after-thought about iframes: whatever provided as srcdoc would also need to include CSS used in FeatherWiki. Sniffs like a pain in the rear to setup.

From end-user perspective, {{page name}} might be easier for me to remember if I'm typing it in, but if I'm selecting from a list (drop down list or search results), clicking on a page name and having {{page_slug}} generated for me is A-1 in my books.

Esthetics-wise and personally, I would like the transcluded content to have some kind of subtle border and something I can click on to take me to the page and/or an edit button right there so I can edit the page while viewing (in context) above and below the content of the page that has the transclusion.

All of this would add a little weight to Feather Wiki, but the ability to view one snippet of text (or whatever content) in various contextual views: that is some powerful juju. Transclusion and WYSIWYG (and the current features in Feather Wiki finch), I can't think of anything else I could want in "my" Feather Wiki.

Whatever implementation is simplest, quickest and stable for your development and maintenance sounds the best to me. Immediate after-thought about iframes: whatever provided as srcdoc would also need to include CSS used in FeatherWiki. Sniffs like a pain in the rear to setup. From end-user perspective, {{page name}} might be easier for me to remember if I'm typing it in, but if I'm selecting from a list (drop down list or search results), clicking on a page name and having {{page_slug}} generated for me is A-1 in my books. Esthetics-wise and personally, I would like the transcluded content to have some kind of subtle border and something I can click on to take me to the page and/or an edit button right there so I can edit the page while viewing (in context) above and below the content of the page that has the transclusion. All of this would add a little weight to Feather Wiki, but the ability to view one snippet of text (or whatever content) in various contextual views: that is some powerful juju. Transclusion and WYSIWYG (and the current features in Feather Wiki finch), I can't think of anything else I could want in "my" Feather Wiki.
Alamantus referenced this issue from a commit 8 months ago
Alamantus added this to the 1.3.1 Extension Update Update milestone 8 months ago
Poster
Owner

This has been added as an official Feather Wiki extension in version 1.3.1

This has been added as an official Feather Wiki extension in [version 1.3.1](https://codeberg.org/Alamantus/FeatherWiki/releases/tag/1.3.1)
Alamantus closed this issue 8 months ago

Although the instructions to setup the extension could not be clearer, I cannot get transclusion working with either Dove or Finch.

Testing on a Chromebook, files stored on external SD card.

Although the instructions to setup the extension could not be clearer, I cannot get transclusion working with either Dove or Finch. Testing on a Chromebook, files stored on external SD card.
Poster
Owner

@CharlieJV Would it be possible for you to upload the Feather Wiki in question and point me to the page where you're trying to use transclusion and the slug of the page you are trying to use? Or at least provide a screenshot of the settings page, the page you are using the plugin on, and the page you are trying to include on that page.

@CharlieJV Would it be possible for you to upload the Feather Wiki in question and point me to the page where you're trying to use transclusion and the slug of the page you are trying to use? Or at least provide a screenshot of the settings page, the page you are using the plugin on, and the page you are trying to include on that page.

G'day,

I've uploaded the files I'm using to Neocities:

https://cjveniot.neocities.org/featherwiki_testing/FeatherWiki_Dove1.html
https://cjveniot.neocities.org/featherwiki_testing/FeatherWiki_Finch1.html
https://cjveniot.neocities.org/featherwiki_testing/transclusion.js

I'll be kicking myself in the rear if it is something obvious that I'm totally missing...

G'day, I've uploaded the files I'm using to Neocities: https://cjveniot.neocities.org/featherwiki_testing/FeatherWiki_Dove1.html https://cjveniot.neocities.org/featherwiki_testing/FeatherWiki_Finch1.html https://cjveniot.neocities.org/featherwiki_testing/transclusion.js I'll be kicking myself in the rear if it is something obvious that I'm totally missing...
Poster
Owner

Thanks for that! So it appears that the instructions on the website are parsing incorrectly for some reason, so I need to fix that! The script tag needs to be wrapped in backticks (`) so that html is before the first backtick and the rest within the parentheses is wrapped with backticks like this:

document.body.appendChild(html`<script src="./transclusion.js"><\/script>`);
Thanks for that! So it appears that the instructions on the website are parsing incorrectly for some reason, so I need to fix that! The `script` tag needs to be wrapped in backticks (\`) so that `html` is before the first backtick and the rest within the parentheses is wrapped with backticks like this: ``` document.body.appendChild(html`<script src="./transclusion.js"><\/script>`); ```

Backticks. Quirky little critters ...

Updated entry in custom JS fixes all, and transclusion now working.

Nicely done !

Having transclusion is a huge deal. These little birds suddenly have eagle talons.

I'm a seriously happy camper.

Backticks. Quirky little critters ... Updated entry in custom JS fixes all, and transclusion now working. Nicely done ! Having transclusion is a **huge** deal. These little birds suddenly have eagle talons. I'm a seriously happy camper.

Well, maybe not Eagle talons just yet. Let's say falcon talons, which is still frigging awesome.

As per testing I've done with Dove, nested transclusion would be my next wish list.

https://cjveniot.neocities.org/featherwiki_testing/FeatherWiki_Dove1.html?page=test_transclusion_deux

Sniffs like a need for some recursive looping with a trigger of some kind to bail out of infinite looping (should any chain of transclusions form a loop).

Tricky, and fascinating, stuff.

Well, maybe not Eagle talons just yet. Let's say falcon talons, which is still frigging awesome. As per testing I've done with Dove, nested transclusion would be my next wish list. https://cjveniot.neocities.org/featherwiki_testing/FeatherWiki_Dove1.html?page=test_transclusion_deux Sniffs like a need for some recursive looping with a trigger of some kind to bail out of infinite looping (should any chain of transclusions form a loop). Tricky, and fascinating, stuff.
Poster
Owner

Ah yeah, nested transclusion would be ideal! I'll have to figure out the best way to do that, but my first instinct would be to just re-trigger the check on the page content after every transclusion. Not sure if there's a more efficient way to do that, but it should work! I'll add that in an update when I get a chance.

By the way, the website should be fixed with the backticks now! A few pages got mistakenly marked as markdown when they were actually HTML. I'll have to see if there's any repeatable way to cause that problem and fix it if I can find something.

Ah yeah, nested transclusion would be ideal! I'll have to figure out the best way to do that, but my first instinct would be to just re-trigger the check on the page content after every transclusion. Not sure if there's a more efficient way to do that, but it should work! I'll add that in an update when I get a chance. By the way, the website should be fixed with the backticks now! A few pages got mistakenly marked as markdown when they were actually HTML. I'll have to see if there's any repeatable way to cause that problem and fix it if I can find something.
Alamantus reopened this issue 7 months ago
Alamantus removed the help wanted label 7 months ago
Poster
Owner

Hi @CharlieJV, I have added recursion as requested so transclusions in transcluded pages will also be displayed up to a depth of 20 transclusions (to prevent accidental infinite recursion).

Hopefully 20 transclusions deep should be enough for most people. If not, it should be easy enough to change the FW.state.tDepthMax value manually in the custom JS field!

Hi @CharlieJV, I have added recursion as requested so transclusions in transcluded pages will also be displayed up to a depth of 20 transclusions (to prevent accidental infinite recursion). Hopefully 20 transclusions deep should be enough for most people. If not, it should be easy enough to change the `FW.state.tDepthMax` value manually in the custom JS field!
Alamantus closed this issue 7 months ago

Hi @CharlieJV, I have added recursion as requested so transclusions in transcluded pages will also be displayed up to a depth of 20 transclusions (to prevent accidental infinite recursion).

Hopefully 20 transclusions deep should be enough for most people. If not, it should be easy enough to change the FW.state.tDepthMax value manually in the custom JS field!

Finally just got around to giving that a spin. Smooth as silk.

That is pretty frigging fantastic, I think.

> Hi @CharlieJV, I have added recursion as requested so transclusions in transcluded pages will also be displayed up to a depth of 20 transclusions (to prevent accidental infinite recursion). > > Hopefully 20 transclusions deep should be enough for most people. If not, it should be easy enough to change the `FW.state.tDepthMax` value manually in the custom JS field! Finally just got around to giving that a spin. Smooth as silk. That is pretty frigging fantastic, I think.
Sign in to join this conversation.
No Assignees
2 Participants
Notifications
Due Date

No due date set.

Reference: Alamantus/FeatherWiki#41
Loading…
There is no content yet.