[tw5] Re: [question] plugin that turn a transclusion into a clickable link in edit mode ?

[Télumire]

Hello Saq,

This is exactly what I wanted, thank you so much !

Since TW 5.2.0 is around the corner (?) I will wait a bit to upgrade my 
wiki, but your demo is perfect for my needs :) 

In my opinion, from a UX POV it's best to use a popup, or even better no 
popup at all (just click on the link to open the tiddler, maybe with an 
underline and a cursor:pointer when hovering the link to keep consistency) 
to avoid cluttering in the editor.
This is because if the user want to use emojis, the icons could get 
confusing.

Great work !
Le dimanche 13 juin 2021 à 19:58:21 UTC+2, saq.i...@gmail.com a écrit :

> @si @Telumire
>
> Here is a very simplistic, quick and rough proof of concept for adding 
> some helpful popups in codemirror:
> https://saqimtiaz.github.io/sq-tw/temp/cm-plus-tweaks.html
> (Needs current pre-release of TW)
>
> Try ctrl+click on different parts of tiddler links and transclusions.
> The popup itself is entirely wikitext based so can be easily customized.
>
> [image: Screenshot 2021-06-13 195609.png]
>
> [image: Screenshot 2021-06-13 195705.png]
>
> Note that cmplus does not distinguish between simple transclusions, 
> transclusions with templates and filtered templates. While you can work 
> around this in wikitext, adding support in cmplus would make life a lot 
> easier.
>
> Another approach would be to embed clickable elements in the editor next 
> to links and transclusions. Rapid tiddler uses this approach so if someone 
> wants to take that route, the code pattern there is probably helpful for 
> follow:
> https://github.com/MeneDev/RapidTiddler
>
> Cheers,
> Saq
>
> On Saturday, June 12, 2021 at 8:22:24 PM UTC+2 si wrote:
>
>> >>> CodeMirror is able to parse links, so maybe someone made an addon 
>> build upon it allowing this functionnality ? I searched but ultimately 
>> found nothing .. 
>>
>> I'm not aware of any currently existing plugin, but CodeMirrorPlus has an 
>> open ticket for adding clickable links in edit mode: 
>> https://github.com/adithya-badidey/TW5-codemirror-plus/issues/6
>>
>> On Friday, 11 June 2021 at 00:33:53 UTC+1 Télumire wrote:
>>
>>> Hello everyone!
>>>
>>> Does anyone know if there is a plugin that turn a transclusion into a 
>>> clickable link to the tiddler transcluded, in edit mode?
>>>
>>> The process would be as follows: 
>>>
>>> I want to edit a tiddler (A). When the editor opens, I see that I have 
>>> transcluded another tiddler (e.g. {{B}}) inside the tiddler A. 
>>>
>>> I want to edit what is in B, so rather than copy/paste the title of 
>>> tiddler B into the search bar, click on the relevant tiddler in the search 
>>> result, then edit the tiddler B, this plugin would allow me to simply click 
>>> on {{B}}, which open the tiddler B, ideally already in edit mode. This 
>>> would save a lot of time !
>>>
>>> CodeMirror is able to parse links, so maybe someone made an addon build 
>>> upon it allowing this functionnality ? I searched but ultimately found 
>>> nothing ..
>>>
>>> PS : I know that it's possible to use a macro instead of a standard 
>>> transclusion (like discussed here 
>>> https://tiddlywiki.narkive.com/dxOiR2Vn/tw-tw5-including-a-link-when-transcluding)
>>>  
>>> but I dont want to change the way the tiddler is displayed in view mode.
>>>
>>>
>>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/baa81aa6-88c2-4827-a8c4-39d5febdb30bn%40googlegroups.com.

[tw5] Re: empty.html should start with a "Centered story, fixed sidebar" setting.

[Télumire]

Hello Mario,

In your preview the main story is off-centered when the side menu panel is 
open. Personally I think it would maybe be better if it stayed perfectly 
centered as long as there is space for it, to reduce distraction (the text 
moving around) :)
Otherwise, I love the centered story view, it's much more comfortable for 
reading long tiddlers !
Le mardi 15 juin 2021 à 21:28:21 UTC+2, PMario a écrit :

>
> Hi folks, 
> According to the feedback from empty.html should start with "fluid-fixed" 
> layout 
>  I 
> did create a new setting in the ControlPanel : Appearance : Theeme Tweaks
>
>  - Centered story, fixed sidebar
>
> If the option is set, the metrics elements, that can't be used are "grayd 
> out". 
>
> The PR is at: https://github.com/Jermolene/TiddlyWiki5/pull/5800
>
> [image: centered-fixed-01.gif]
>
> Feedback is welcome.
> -mario
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/854bb67d-37f5-45cc-8134-0737213fe15cn%40googlegroups.com.

[tw5] Re: A Show'nTell: an evolving approach for TiddlyWiki "reader view(?)"

[Télumire]

Just a head up, I've spotted a typo : " Acc*eu*il" --> "Accueil"
Great work on the UI btw !

Le samedi 12 juin 2021 à 03:51:15 UTC+2, cj.v...@gmail.com a écrit :

> G'day,
>
> Just an FYI about my ever-evolving approach to presenting TiddlyWiki's, by 
> default, in "reader view(?)", with alternative "normal TiddlyWiki view" 
> available via toggling.
>
>- by "reader view" (internal debate on-going about that label), I mean 
>hiding much of what looks like TiddlyWiki interface features, without 
>getting into anything too fancy
>- for toggling, I went with no-fuss-no-muss open/close of the sidebar 
>as the toggle for showing/hiding TiddlyWiki interface features
>
> To get the Full Monty experience of what I mean check out the before and 
> after (still very much a work in progress) of my Le P'tit Aurèle:
>
>- my now deprecated version without "reader view" 
>
>- the new going-forward version with "reader view" at startup 
>
>
> I guess the mission is: how do I setup the kind of structure that makes 
> for easy/simple navigation to a lot of content without getting lost, while 
> still making it easy to access the full-features of TiddlyWiki for custom 
> digging into the content?
>
> Something like that.
>
> Cheers !
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/ec2d9bee-07bf-4711-a78a-b7f2dd8aba7fn%40googlegroups.com.

[tw5] Re: [question] plugin that turn a transclusion into a clickable link in edit mode ?

[Télumire]

Hello everyone, 

First of all thank you very much for taking the time to answer me, second 
of all my apologies for answering so late.

*Fred*,  for now instead of a macro I proceed as follow (online demo here 
<https://frontenddevweb.github.io/#:[tag[edit-transclusion]]>) :

In the tiddler transcluded I want to make editable,  I put {{||edit}} at 
the end of the tiddler.
The tiddler edit contains the following code : 

 {{||$:/core/ui/Buttons/edit}} 

And with a bit of CSS magic I got what I want, except it's not automatic of 
course and it doesnt work in edit mode. 
I think I will follow your advice and repurpose the paragraph macro, this 
seems like the easiest workaround.

*Ste*, I think you are refering to this : 
https://tobibeer.github.io/tw5-plugins/#inc-Examples , this is a great 
macro however it only work in view mode. My workaround is worse tho, so 
until I find something better I think I'll use his plugin.

*Tones*, this is a great suggestion and IMO is better than a macro, while 
being also limited to the view mode. I tried to follow your explanation and 
got this : https://frontenddevweb.github.io/#:[tag[TW%20Tones]]
Is that what you had in mind ?

*si*, I stumbled upon it as well yesterday, this is great ! That would be 
perfect. This ticket was made a year ago however so I really hope the 
author will eventually add it.

Once again, thanks you all for your help.
Le samedi 12 juin 2021 à 20:22:24 UTC+2, si a écrit :

> >>> CodeMirror is able to parse links, so maybe someone made an addon 
> build upon it allowing this functionnality ? I searched but ultimately 
> found nothing .. 
>
> I'm not aware of any currently existing plugin, but CodeMirrorPlus has an 
> open ticket for adding clickable links in edit mode: 
> https://github.com/adithya-badidey/TW5-codemirror-plus/issues/6
>
> On Friday, 11 June 2021 at 00:33:53 UTC+1 Télumire wrote:
>
>> Hello everyone!
>>
>> Does anyone know if there is a plugin that turn a transclusion into a 
>> clickable link to the tiddler transcluded, in edit mode?
>>
>> The process would be as follows: 
>>
>> I want to edit a tiddler (A). When the editor opens, I see that I have 
>> transcluded another tiddler (e.g. {{B}}) inside the tiddler A. 
>>
>> I want to edit what is in B, so rather than copy/paste the title of 
>> tiddler B into the search bar, click on the relevant tiddler in the search 
>> result, then edit the tiddler B, this plugin would allow me to simply click 
>> on {{B}}, which open the tiddler B, ideally already in edit mode. This 
>> would save a lot of time !
>>
>> CodeMirror is able to parse links, so maybe someone made an addon build 
>> upon it allowing this functionnality ? I searched but ultimately found 
>> nothing ..
>>
>> PS : I know that it's possible to use a macro instead of a standard 
>> transclusion (like discussed here 
>> https://tiddlywiki.narkive.com/dxOiR2Vn/tw-tw5-including-a-link-when-transcluding)
>>  
>> but I dont want to change the way the tiddler is displayed in view mode.
>>
>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/adbfb4b1-fb45-4eaa-a20b-895743f349f0n%40googlegroups.com.

[tw5] [question] plugin that turn a transclusion into a clickable link in edit mode ?

[Télumire]

Hello everyone!

Does anyone know if there is a plugin that turn a transclusion into a 
clickable link to the tiddler transcluded, in edit mode?

The process would be as follows: 

I want to edit a tiddler (A). When the editor opens, I see that I have 
transcluded another tiddler (e.g. {{B}}) inside the tiddler A. 

I want to edit what is in B, so rather than copy/paste the title of tiddler 
B into the search bar, click on the relevant tiddler in the search result, 
then edit the tiddler B, this plugin would allow me to simply click on 
{{B}}, which open the tiddler B, ideally already in edit mode. This would 
save a lot of time !

CodeMirror is able to parse links, so maybe someone made an addon build 
upon it allowing this functionnality ? I searched but ultimately found 
nothing ..

PS : I know that it's possible to use a macro instead of a standard 
transclusion (like discussed here 
https://tiddlywiki.narkive.com/dxOiR2Vn/tw-tw5-including-a-link-when-transcluding)
 
but I dont want to change the way the tiddler is displayed in view mode.


-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/2ca38f14-5bb7-4b95-8f74-cf249bf4ab5en%40googlegroups.com.

[tw5] Re: Building a book/blog webpage -- is TW5 right for it?

[Télumire]

 I'm not a dev by any means so I probably can't help you much, but I think 
these links may help you :

In this thread, people have successfully managed to use tiddlywiki for book 
publishing, with great results : 
https://groups.google.com/g/tiddlywiki/c/_VLufc4Svp8/m/jALzYZ09BAAJ
You can see a sample here : 
https://tw5.immateriel.fr/wiki/7switch/book/aHR0cHM6Ly9jYXRhbG9ndWUuaW1tYXRlcmllbC5mci9yZXNvdXJjZXMvYTYvMTIvMDcyMDhkOTdhZjdmYWZkMjkyNzRhN2MwNDU1YS5lcHVi
or make your own book from an epub : https://tw5.immateriel.fr/wiki

It's possible to use TW as a blog platform : 
https://tiddlywiki.com/static/Blog%2520Edition.html

So it seems that it's possible. I'm guessing it will not be simple tho.. 
maybe wordpress would be easier.
Le jeudi 10 juin 2021 à 22:28:54 UTC+2, Kosmaton a écrit :

> Hello Tiddly people,
>  
> I'm meaning to create a new website, and I'd like to ask your opinion 
> whether TiddlyWiki is the right tool (or one of the tools) for it.
>  
> I used to have a pre-TW5 site on TiddlySpace back in the day. I'm 
> semi-programming-and-webdesign-literate, in an ad hoc and rusty way. No 
> experience with databases unfortunately, which may be relevant.
>  
> The website I have in mind would be a combination of a non-fiction book 
> (already written, but expandable/changeable), and an associated blog. The 
> book is organized as a big tree of numbered paragraphs/sections: 1, 1.1, 
> 1.1.1, 1.2, 2, 2.1 etc. These sections frequently refer to one another; 
> it's a hypertext in itself.
>  
> * The site would mainly need to have:
>  
> 1) a page that displays the book, with a Table of Contents.
>   - The TOC should be hideable as a whole.
>   - The branches of the TOC should be collapsible, i.e. click on 1 to show 
> 1.1 and 1.2, click again to hide them, etc.
>   - It may be excessive to load all the text of the book (all the 
> sections) into the viewport (some 70,000 words). But it would be nice if 
> the reader saw a bit more than just the section they're currently reading. 
> Basically a pdf-reader-like experience would be good.
>   - optional: Sections of the book may get revisions, and the visitor 
> should be able to see the revisions. (This would probably get a lot more 
> complicated if I want to allow for reordering, deletion and creation of 
> sections...)
>   - The book currently exists as a LibreOffice Writer .odt file, with 
> sections actually organized as headings. Ideally I'd like to automate the 
> process of getting them into the TiddlyWiki.
>  
> 2) a blog/news page
>   - Blog posts are expected to regularly contain links to book sections, 
> or entire transcluded sections.
>   - Posts must be able to acommodate audio files; a regular HTML  controls> seems sufficient.
>  
> 3) a Home page that could e.g. display
>   - the most recent blog post (truncated if necessary)
>   - a sort of carousel widget with single sections from the book, with 
> arrows left and right to flip through them. These sections could be either 
> randomly taken from the whole book, or from a hand-picked subset of 
> sections (which I should be able to adjust).
>  
> * The thing really ought to be 'responsive', i.e. look fine on small 
> screens too. This might not be obvious for something like the TOC.
>  
> * Towards the visitor it should not present a very TiddlyWikish face. I'm 
> keen to acknowledge/praise/recommend TW in the About page; but the casual 
> visitor should not focus on the underlying tech.
>  
> * I don't intend to have a server of my own. The free webhost I've happily 
> used before allows for up to 2 databases, with a choice between "5.7-MySQL 
> . 10.5-MariaDB . 13.2-PgSQL".
>  
> So:
>  
> Does this sound feasible with TW5 as a base? (Or would you suggest some 
> other framework? If it's /challenging/ with TW, but /easy/ with XYZ, 
> I'd like to hear about XYZ too! :)
>  
> How would I set this up as far as server / databases etc. go?
>  
> If I go ahead with this, there's bound to be more detailed questions 
> regarding the functionalities mentioned above; but if you already see any 
> immediate solutions (plugins, say) please shout.
>  
> Apologies for the length of this post. I don't expect anyone to figure all 
> this out for me, but any thoughts are very welcome. Many thanks in advance!
>  
> K.
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/ed03e0d3-e167-4217-9f30-518d571ffb88n%40googlegroups.com.

[tw5] Re: A Show'nTell: an evolving approach for TiddlyWiki "reader view(?)"

[Télumire]

Yes don't worry too much about it,  this is a very common mistakes even for 
french speakers, it's so much common in fact that my teachers (I'm an 
infographist) strongly recommend us to use "index" instead of "accueil" in 
our websites because they have seen this error countless times in their 
student's works, if this can help make you feel a bit better :)
Le dimanche 13 juin 2021 à 04:44:02 UTC+2, cj.v...@gmail.com a écrit :

> I am in "d*euil*" (mourning) over my misspelled "ac*c**ueil*".
>
> One of the beauties of the French language:  the "euil" of deuil and the 
> "cueil" of "accueil" have the same sound.
>
> If I could time-travel to a certain period long ago, I'd be giving 
> somebody at the Académie française a slap from the future.
>
>
> On Saturday, June 12, 2021 at 7:56:39 PM UTC-3 Télumire wrote:
>
>> Just a head up, I've spotted a typo : " Acc*eu*il" --> "Accueil"
>> Great work on the UI btw !
>>
>> Le samedi 12 juin 2021 à 03:51:15 UTC+2, cj.v...@gmail.com a écrit :
>>
>>> G'day,
>>>
>>> Just an FYI about my ever-evolving approach to presenting TiddlyWiki's, 
>>> by default, in "reader view(?)", with alternative "normal TiddlyWiki view" 
>>> available via toggling.
>>>
>>>- by "reader view" (internal debate on-going about that label), I 
>>>mean hiding much of what looks like TiddlyWiki interface features, 
>>> without 
>>>getting into anything too fancy
>>>- for toggling, I went with no-fuss-no-muss open/close of the 
>>>sidebar as the toggle for showing/hiding TiddlyWiki interface features
>>>
>>> To get the Full Monty experience of what I mean check out the before and 
>>> after (still very much a work in progress) of my Le P'tit Aurèle:
>>>
>>>- my now deprecated version without "reader view" 
>>><https://leptitaurele.neocities.org/LePtitAurele_PreviousVersion.html>
>>>- the new going-forward version with "reader view" at startup 
>>><https://leptitaurele.neocities.org/>
>>>
>>> I guess the mission is: how do I setup the kind of structure that makes 
>>> for easy/simple navigation to a lot of content without getting lost, while 
>>> still making it easy to access the full-features of TiddlyWiki for custom 
>>> digging into the content?
>>>
>>> Something like that.
>>>
>>> Cheers !
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/64eb7771-fa0b-487f-a062-b63ab103814dn%40googlegroups.com.

[tw5] Re: A Show'nTell: an evolving approach for TiddlyWiki "reader view(?)"

[Télumire]

A tool I use a lot (sorry for the double post, I forgot to include this in 
my previous post and I feel like it's important) to avoid that is 
bonpatron.com, which is the best free grammatical french corrector I've 
found online. 

They also have a tool for English, spellcheckplus.com .

I find Grammarly a bit better but spellcheckplus is made by university 
language teachers so I'm kind of biased to trust their tool more. 

The best overall for french is antidote by druid but the pricing is 
outrageous.

Back to tiddlywiki: if you want to use the codemirror plugin to write your 
tiddlers, you may have seen that it prevents the browser to display syntax 
and orthographic errors. I've found several (suboptimal, admittedly) 
solutions :

* Create a custom preview mode, as explained here by Jeremy: 
https://groups.google.com/g/tiddlywiki/c/c3y-PycRP4M/m/V0IyOvR0AAAJ
* Use an addon. The best I've found for french on firefox yet is 
Grammalecte (open source & free): https://grammalecte.net/
* Add your own dictionary to TiddlyWiki by following this proof of concept: 
http://codemirror-spellcheck.tiddlyspot.com/ - I did not succeed but YMMV

If you know a better solution please let me know, I'm prone to errors 
myself and could use a little bit of help (I'm currently writing a french 
version of the angular doc so it's quite important to me)
Le jeudi 17 juin 2021 à 15:17:51 UTC+2, Télumire a écrit :

> Yes don't worry too much about it,  this is a very common mistakes even 
> for french speakers, it's so much common in fact that my teachers (I'm an 
> infographist) strongly recommend us to use "index" instead of "accueil" in 
> our websites because they have seen this error countless times in their 
> student's works, if this can help make you feel a bit better :)
> Le dimanche 13 juin 2021 à 04:44:02 UTC+2, cj.v...@gmail.com a écrit :
>
>> I am in "d*euil*" (mourning) over my misspelled "ac*c**ueil*".
>>
>> One of the beauties of the French language:  the "euil" of deuil and the 
>> "cueil" of "accueil" have the same sound.
>>
>> If I could time-travel to a certain period long ago, I'd be giving 
>> somebody at the Académie française a slap from the future.
>>
>>
>> On Saturday, June 12, 2021 at 7:56:39 PM UTC-3 Télumire wrote:
>>
>>> Just a head up, I've spotted a typo : " Acc*eu*il" --> "Accueil"
>>> Great work on the UI btw !
>>>
>>> Le samedi 12 juin 2021 à 03:51:15 UTC+2, cj.v...@gmail.com a écrit :
>>>
>>>> G'day,
>>>>
>>>> Just an FYI about my ever-evolving approach to presenting TiddlyWiki's, 
>>>> by default, in "reader view(?)", with alternative "normal TiddlyWiki view" 
>>>> available via toggling.
>>>>
>>>>- by "reader view" (internal debate on-going about that label), I 
>>>>mean hiding much of what looks like TiddlyWiki interface features, 
>>>> without 
>>>>getting into anything too fancy
>>>>- for toggling, I went with no-fuss-no-muss open/close of the 
>>>>sidebar as the toggle for showing/hiding TiddlyWiki interface features
>>>>
>>>> To get the Full Monty experience of what I mean check out the before 
>>>> and after (still very much a work in progress) of my Le P'tit Aurèle:
>>>>
>>>>- my now deprecated version without "reader view" 
>>>><https://leptitaurele.neocities.org/LePtitAurele_PreviousVersion.html>
>>>>- the new going-forward version with "reader view" at startup 
>>>><https://leptitaurele.neocities.org/>
>>>>
>>>> I guess the mission is: how do I setup the kind of structure that makes 
>>>> for easy/simple navigation to a lot of content without getting lost, while 
>>>> still making it easy to access the full-features of TiddlyWiki for custom 
>>>> digging into the content?
>>>>
>>>> Something like that.
>>>>
>>>> Cheers !
>>>>
>>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/0c14834e-5a67-46a3-a624-536acdfda983n%40googlegroups.com.

[tw5] Re: List filter using the checkbox widget

[Télumire]

Hello,

This should help : 
https://groups.google.com/g/tiddlywiki/c/5e3ta-q-qIA/m/uIKL1C9PAgAJ

Le jeudi 26 août 2021 à 20:24:50 UTC+2, PMario a écrit :

> Hi, 
> I didn't test it, but the checkbox [1] widget has "check" and "uncheck" 
> actions. You may use the listops [2] operators there. 
>
> [1] https://tiddlywiki.com/prerelease/#CheckboxWidget
> [2] https://tiddlywiki.com/prerelease/#Filter%20Operators
>
> -mario
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/28bdfcc3-2bdb-47d3-9102-514b994132f2n%40googlegroups.com.

Re: [tw5] tw5-primer v1.0.1 is here!

[Télumire]

This is much more readable, nice !

By the way, I've found a great example of accessible design by the team of 
firefox : https://design.firefox.com/photon/visuals/color.html
They link to these guidelines/tools - in case you'll want to tweak your 
theme even further  :)

   - https://www.w3.org/TR/WCAG/#visual-audio-contrast - WCAG 2.0 
    Level AA guidelines 
   to ensure proper color contrast 
   - https://www.tpgi.com/color-contrast-checker/ - contrast and color 
   blindness analyzer (Windows and macOS) by The Paciello Group. 
   - https://contrast-ratio.com/ - contrast ratio calculator (Web) by Lea 
   Verou. 
   - https://michelf.ca/projects/sim-daltonism/ - color blindness simulator 
   (iOS and macOS) by Michel Fortin. 
   - https://msdn.microsoft.com/library/windows/desktop/hh404233(v=vs.85).aspx 
   - Supporting High Contrast Themes on Windows, guidelines by Windows Dev 
   Center.
   
   
Le jeudi 26 août 2021 à 09:34:37 UTC+2, Mohammad a écrit :

> Finn
> I would recommend separating the color palette from layout (theme)!
> Right now, I cannot change the color palette!
>
>
>
> Best wishes
> Mohammad
>
>
> On Thu, Aug 26, 2021 at 1:21 AM Finn Lancaster  wrote:
>
>> Earlier today, I released my newest plugin/theme: tw5-primer, using the 
>> primer.css library. Now, I'm happy to announce v1.0.1 is here, where I have 
>> built upon the old code to conform with TW standards, as recommended by 
>> @PMario. 
>>
>> For those of you who haven't already seen it, a demo/install can be found 
>> at tw5-primer.finnsoftware.net , and its github page is at 
>> https://github.com/flancast90/tw5-primer.
>>
>> *What's new?*
>> - There is no longer any js portion involved in the theme
>> - instead, everything is now CSS as a styles.tid file. This keeps your 
>> wiki lightning fast, as well as usable in no-internet situations! 
>> - Theming colors updated: edit area, tags, etc all are different looking 
>> using a mix of primer classes and my own CSS!
>>
>> *And one Last Thing:*
>> I'm looking to get some others opinions on this; I would like to rename 
>> the plugin the Charcoal, or perhaps Ebony to reflect its modern feel, but 
>> would also like to keep the fact that it uses some (not much anymore) code 
>> from Primer.css, and is based upon it. 
>>
>> What do you guys think? Any different ideas for names?
>>
>> As usual, if you appreciate my work on this, drop a star at the github: 
>> https://github.com/flancast90/tw5-primer
>>
>> -- 
>> You received this message because you are subscribed to the Google Groups 
>> "TiddlyWiki" group.
>> To unsubscribe from this group and stop receiving emails from it, send an 
>> email to tiddlywiki+...@googlegroups.com.
>> To view this discussion on the web visit 
>> https://groups.google.com/d/msgid/tiddlywiki/923e1c96-1eba-42e7-a11e-16c352c6n%40googlegroups.com
>>  
>> 
>> .
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/2ffad347-45ba-48c9-a461-709a938b50f0n%40googlegroups.com.

[tw5] Re: Font problems --- while editing, while displaying devanagari text

[Télumire]

Hi all,

Here's an easy way to get the css path to an element :

Open the inspect element tool : ctrl+shift+c (firefox/chrome) , then select 
the element you want to inspect
You can also do a right-click>inspect 

The element will be highlighted in the dev tool pannel that shows up. Make 
sure this is the correct element (sometimes it can be nested inside the 
element inspected), then right click on the highlighted element > copy > 
copy selector or copy css path. This will give a selector css for the 
element.

This doesnt always give you the selector you need, for example if you do 
that with chrome on the text area of a tiddler, in edit mode , you will get 
:

body > textarea

This is because the textarea is in an iframe, which is treated like a 
separate document by the browser. In this case, just select the iframe that 
contains the element and you' ll get this :

body > div.tc-page-container-wrapper > div > div > div > section > 
div.tc-tiddler-frame.tc-tiddler-edit-frame.tc-tiddler-exists> span > span > 
div:nth-child(5) > div > iframe

This rule is very specific and can be generalized with  a bit of clean up :

.tc-tiddler-edit-frame  iframe 

Now if you look closely at the html, you'll see that the iframe actuall has 
several class(tc-edit-texteditor and tc-edit-texteditor-body), but for some 
reason chrome doesnt copy those. So if we correct this, we get :

.tc-tiddler-edit-frame  .tc-edit-texteditor.tc-edit-texteditor-body {.. 
your rules css here ..} 

See https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector and 
https://developer.chrome.com/docs/devtools/css/ for more info on the dev 
tools, and https://developer.mozilla.org/en-US/docs/Web/CSS to learn more 
about CSS
Le vendredi 27 août 2021 à 15:49:21 UTC+2, Stobot a écrit :

> Sorry to highjack the thread a bit - hoping we solved your problem Sandip!
>
> @Birthe / strikke... - can I ask how you learned to navigate the class 
> hierarchy? I'm trying very hard how to learn this and am really struggling. 
> I recently started using the Inspect / F12 stuff, but It's not pointing me 
> to the right place. Is there a guide for this stuff somewhere? For example 
> when I "inspect" the edit area while in edit view I get this (below 
> screenshot) - how would I get that to your `tc-tiddler-frame 
> textarea.tc-edit-texteditor` answer?
>
> [image: Capture.PNG]
>
>
> On Friday, August 27, 2021 at 9:35:10 AM UTC-4 strikke...@gmail.com wrote:
>
>> I do not know about the two column view. But for editing I am using 
>> following at the moment.
>>
>> Create a tiddler, give it a title and tag $:/tags/Stylesheet and the 
>> following content:
>>
>> tc-tiddler-frame textarea.tc-edit-texteditor {font-size: 125%; 
>> background: #485052; color: #48E16A;}
>>
>> This will certainly not be what you want, but you can insert your own 
>> color and size.
>>
>> On Friday, August 27, 2021 at 12:50:18 PM UTC+2 Sandip Deshmukh wrote:
>>
>>> I feel that as I switch from a single column view to a two column view, 
>>> the display font size reduces. I do not want that to happen. Any way to 
>>> achieve that?
>>>
>>> Secondly, the font that is used when I am editing a tiddler is 
>>> definitely smaller than the one used for displaying the tiddler. How do I 
>>> increase the font size when I am editing a tiddler?
>>>
>>> Lastly, is there a way to specify the font to use when displaying and 
>>> editing, say Devanagari text?
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/06323c7c-9bf9-444d-a449-303909f6ab43n%40googlegroups.com.

[tw5] Re: Some coding fun: A Word Occurrence Highlighter

[Télumire]

Hi, thanks for sharing this, I struggle a bit with the filter operator so 
this help a lot !
As a side note, the  element 
 would be a 
more semantic solution :)

Le dimanche 29 août 2021 à 06:39:42 UTC+2, cj.v...@gmail.com a écrit :

> Drag the attached to https://tiddlywiki.com/ to import the single tiddler.
>
> This bit of coding fun inspired by the Highlighting duplicates in lists 
>  discussion thread.
>
> My kind of "BrainAge" game.
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/7510558e-c315-4c60-940e-95a36151d375n%40googlegroups.com.

[tw5] Re: tw5-primer v1.0.1 is here!

[Télumire]

Hi, nice work !

IMO text-shadows make text harder to read when it's already on a dark 
background, maybe consider removing it ?
The color you use for the text editor should have more contrast, ideally 
the same color than on the view. Light grey on dark blue is really hard to 
read ..
The icons of the editor are too big : 3 rows instead of the usual 1 ?


Le mercredi 25 août 2021 à 22:51:55 UTC+2, flanc...@gmail.com a écrit :

> Earlier today, I released my newest plugin/theme: tw5-primer, using the 
> primer.css library. Now, I'm happy to announce v1.0.1 is here, where I have 
> built upon the old code to conform with TW standards, as recommended by 
> @PMario. 
>
> For those of you who haven't already seen it, a demo/install can be found 
> at tw5-primer.finnsoftware.net , and its github page is at 
> https://github.com/flancast90/tw5-primer.
>
> *What's new?*
> - There is no longer any js portion involved in the theme
> - instead, everything is now CSS as a styles.tid file. This keeps your 
> wiki lightning fast, as well as usable in no-internet situations! 
> - Theming colors updated: edit area, tags, etc all are different looking 
> using a mix of primer classes and my own CSS!
>
> *And one Last Thing:*
> I'm looking to get some others opinions on this; I would like to rename 
> the plugin the Charcoal, or perhaps Ebony to reflect its modern feel, but 
> would also like to keep the fact that it uses some (not much anymore) code 
> from Primer.css, and is based upon it. 
>
> What do you guys think? Any different ideas for names?
>
> As usual, if you appreciate my work on this, drop a star at the github: 
> https://github.com/flancast90/tw5-primer
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/4105e6e7-7af2-41cc-9c51-a9f3ead9bbe6n%40googlegroups.com.

[tw5] Re: how to add a button to the top right of the tiddler to copy the title ?

[Télumire]

Oups sorry theok was faster than me ahah

Le dimanche 19 septembre 2021 à 02:49:54 UTC+2, Télumire a écrit :

> You also need to add the tag $:/tags/ViewToolbar if you want your button 
> to be displayed in the view toolbar (which is at the right of the tiddler 
> title).
>
> If you want your button to be really in the title itself and not in the 
> toolbar, then you can use the field icon, which display the content of the 
> tiddler in the title, then with css move the icon to the right, e.g : 
> https://telumire.github.io/TW-tips/index.html#tasker%20button%20at%20the%20right%20of%20the%20title
>
> Le samedi 18 septembre 2021 à 16:55:49 UTC+2, cj.v...@gmail.com a écrit :
>
>> To study and copy for the creation of your own button:
>>
>> $:/core/ui/Buttons/edit *(you need to at least have a tiddler like this 
>> for your button)*
>> $:/core/images/edit-button *(nice to have one like this, even if your 
>> image is just an emoji or whatever)*
>> $:/language/Buttons/Edit/Caption  *(maybe nice to have one like this)*
>> $:/language/Buttons/Edit/Hint  *(maybe nice to have one like this)*
>>
>> On Saturday, September 18, 2021 at 10:42:35 AM UTC-3 imleg...@gmail.com 
>> wrote:
>>
>>> <$button message="tm-copy-to-clipboard" param=<>>
>>> Copy date to clipboard
>>> 
>>>
>>> I know the command is something like this, but I don't know how to add a 
>>> button to the top right beside the edit clone tiddler. 
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/d2ce87bc-4d8c-4614-a313-a73984c381afn%40googlegroups.com.

[tw5] Re: how to add a button to the top right of the tiddler to copy the title ?

[Télumire]

You also need to add the tag $:/tags/ViewToolbar if you want your button to 
be displayed in the view toolbar (which is at the right of the tiddler 
title).

If you want your button to be really in the title itself and not in the 
toolbar, then you can use the field icon, which display the content of the 
tiddler in the title, then with css move the icon to the right, e.g : 
https://telumire.github.io/TW-tips/index.html#tasker%20button%20at%20the%20right%20of%20the%20title

Le samedi 18 septembre 2021 à 16:55:49 UTC+2, cj.v...@gmail.com a écrit :

> To study and copy for the creation of your own button:
>
> $:/core/ui/Buttons/edit *(you need to at least have a tiddler like this 
> for your button)*
> $:/core/images/edit-button *(nice to have one like this, even if your 
> image is just an emoji or whatever)*
> $:/language/Buttons/Edit/Caption  *(maybe nice to have one like this)*
> $:/language/Buttons/Edit/Hint  *(maybe nice to have one like this)*
>
> On Saturday, September 18, 2021 at 10:42:35 AM UTC-3 imleg...@gmail.com 
> wrote:
>
>> <$button message="tm-copy-to-clipboard" param=<>>
>> Copy date to clipboard
>> 
>>
>> I know the command is something like this, but I don't know how to add a 
>> button to the top right beside the edit clone tiddler. 
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/a7b17b3e-8f2a-401b-9b67-011f4364422cn%40googlegroups.com.

[tw5] Re: [Seeking Ideas] Issues with a TW in four languages ...

[Télumire]

Hello TiddlyTweeter,

Expanding on cj.v elegant solution, you can also use a select widget if you 
dont want to download a language plugin :

<$select tiddler="$:/language">
 fr-FR
 en-GB



 <$text text={{{ 
[[$:/language]get[text]regexp[fr-FR]thenget[fr-fr]] 
[[$:/language]get[text]regexp[en-GB]thenget[en-gb]] }}} />

Online demo 
: 
https://telumire.github.io/TW-tips/#Conditional%20display%20based%20on%20language%20setting
Le mardi 13 juillet 2021 à 15:10:14 UTC+2, cj.v...@gmail.com a écrit :

> G'day TT,
>
> If adding language plugins and using TW's language button make for an 
> alright solution,  then checking the value of $:/language makes for an easy 
> way to set context based on currently selected language.
>
> It should be easy enough to show the language button anywhere you need it 
> for the sake of convenience.
>
> Then just a matter of showing image labels based on currently selected 
> language.  something like:
>  <$text text={{{ 
> [[$:/language]get[text]regexp[fr-FR]thenget[field-fr-fr]] 
> [[$:/language]get[text]regexp[en-GB]thenget[field-en-gb]] 
> }}} />
>
> [image: Screenshot 2021-07-13 9.55.44 AM.png]
>
> On Tuesday, July 13, 2021 at 7:06:15 AM UTC-3 TiddlyTweeter wrote:
>
>> Ciao cj.v
>>
>> It is not a silly question. It is helpful. Forces me to clarify.
>>
>> The situation is I have a gallery of 50+ images that each tiddler for has 
>> four language fields for (German, English, Slovenian, Italian).
>>
>> What I am trying to sort out is WHETHER I should use BROWSER detection of 
>> run context (which in TW ALSO means we can use [to a great extent?] the 
>> "Info" plugin to ease its use) OR simply provide end users with a button on 
>> startup to change what is shown.
>>
>> This is NOT really an issue about using the brilliant TW "lingo system" 
>> because that relates most to UI elements. In the gallery those are MINIMAL 
>> and it is not the issue.
>>
>> I am beginning to think I could use CSS to only show one language at a 
>> time?
>>
>> Thankyou for your question! It pushed me on.
>>
>> Best wishes
>> TT
>>
>> On Tuesday, 13 July 2021 at 02:19:05 UTC+2 cj.v...@gmail.com wrote:
>>
>>> G'day TT,
>>>
>>> Silly question: do you mean find out language setting chosen in TW, or 
>>> do you mean language setting for the browser?
>>>
>>> On Monday, July 12, 2021 at 2:45:22 PM UTC-3 TiddlyTweeter wrote:
>>>
 This is merely an early query. I need some ideas on an efficient 
 approach to the following problem ...

 *AIM:* Put on-line the 54 images of "LIberty" by Angela Weyersberg 
 
  in 
 a self contained gallery.

 *THE CASE: *Each image of a painting has FOUR language variations for 
 its legend (English. Italian, Slovenian, German) FYI, the variants are 
 held 
 in fields of each image tiddler.

 *THE PROBLEM: *HOW do I in TW (1) Establish the language to invoke on 
 startup? (2) enable language switching?

 I realised the specific issue is not gonna be solved by the "lingo 
 mechanism" as is,  as in this particular case, its not UI buttons in 
 contest but actual content.

 I HOPE this is clear!

 At the moment I'm simply need some ideas about how to move forward.
 ANY ideas are most welcome
 TT



-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/3ecdf261-8d04-493e-935d-597dbc058b08n%40googlegroups.com.

[tw5] Re: How to create a "save to github" button/trigger a save with a specific saver (single file wiki)?

[Télumire]

I tried your code but for some reason I get a 404 error, maybe it's because 
of the order by which tiddlywiki run the macros ?
In any case, it seems like the culprit was indeed the autosave, here's the 
fix :

<$button tooltip={{GithubSave/Hint}} aria-label={{GithubSave/Caption}}  
class=<>>
<$action-setfield $tiddler="$:/config/AutoSave" text="no"/>

<$action-listops $tiddler="github save button/private/username" 
$tags="[[private]] [[github save button]]"/>
<$action-listops $tiddler="github save button/private/state" 
$tags="[[private]] [[github save button]]"/>
<$action-setfield $tiddler="$:/GitHub/Username" text={{github save 
button/private/username}}/>
<$action-sendmessage $message="tm-save-wiki" $param="$:/core/save/all" 
publishFilter={{publishFilter}} />
<$action-setfield $tiddler="$:/GitHub/Username" text=""/>
<$action-setfield $tiddler="$:/config/AutoSave" text="yes"/>


<$list filter="[match[yes]]">
{{$:/core/images/github}}

<$list filter="[match[yes]]">
save to github




Le mardi 10 août 2021 à 21:31:09 UTC+2, saq.i...@gmail.com a écrit :

> OK I needed to be at a proper keyboard to write this out. Try the 
> following:
>
> \define myactions()
> <$action-sendmessage $message="tm-save-wiki" $param="$:/core/save/all" 
> publishFilter={{publishFilter}} />
> <$action-setfield $tiddler="$:/GitHub/Username" text=""/>
> \end
>
> <$button tooltip={{GithubSave/Hint}} aria-label={{GithubSave/Caption}}  
> class=<> actions=<>>
> <$action-listops $tiddler="github save button/private/username" 
> $tags="[[private]] [[github save button]]"/>
> <$action-listops $tiddler="github save button/private/state" 
> $tags="[[private]] [[github save button]]"/>
> <$action-setfield $tiddler="$:/GitHub/Username" text={{github save 
> button/private/username}}  />
> 
> <$list filter="[match[yes]]">
> {{$:/core/images/github}}
> 
> <$list filter="[match[yes]]">
> save to github
> 
> 
> 
>
> On Tuesday, August 10, 2021 at 8:32:33 PM UTC+2 Saq Imtiaz wrote:
>
>> Ah right, I believe there is a race condition which is leading to the 
>> double save. 
>>
>> On Tuesday, August 10, 2021 at 8:20:32 PM UTC+2 Saq Imtiaz wrote:
>>
>>> Regarding: " It would be best if I could save only to github thus never 
>>> overriding my local wiki. Is that possible ?"
>>>
>>> Have you tried removing the second instance of  $action-sendmessage 
>>> $message="tm-save-wiki" in your code?
>>>
>>> On Tuesday, August 10, 2021 at 8:00:43 PM UTC+2 Télumire wrote:
>>>
>>>> Hi Saq, 
>>>>
>>>> The code I shared at the end of my post already use these shadow 
>>>> tiddlers.
>>>> Thanks for the google thread, I'll try again and ask him for help if 
>>>> need be. 
>>>>
>>>> I just hopped there was a way to do that in wiki text only, since I'm 
>>>> not very good with JavaScript ^^
>>>>
>>>> Le mardi 10 août 2021 à 19:46:26 UTC+2, saq.i...@gmail.com a écrit :
>>>>
>>>>> I think bimlas' code has most of what you need and could easily be 
>>>>> adapted for your purposes.
>>>>> You may want to consider speaking with him, see 
>>>>> https://groups.google.com/g/tiddlywiki/c/ZU_s6FdUy8Q/m/KeXVnOciBAAJ
>>>>>
>>>>> Also helpful might be the ability to create a custom save button that 
>>>>> does not include the public content. See the following shadow tiddlers:
>>>>> $:/core/ui/Buttons/save-wiki
>>>>> $:/config/SaveWikiButton/Template
>>>>> $:/core/save/all
>>>>>
>>>>>
>>>>> On Tuesday, August 10, 2021 at 7:09:58 PM UTC+2 Télumire wrote:
>>>>>
>>>>>>
>>>>>> Hello everyone,
>>>>>>
>>>>>> I wish to use tiddlywiki as a semi-private blog using GitHub Pages 
>>>>>> (with some of its content never going online until it's ready) and 
>>>>>> thought 
>>>>>> it would be nice to have a button that allow to choose what saver to use.
>>>>>>
>>>>>> For example, when I'm finished working on my article, I would hit the 
>>>>>> regular save button and the changes would be s

[tw5] Re: How to create a "save to github" button/trigger a save with a specific saver (single file wiki)?

[Télumire]

 As I said : the issue is that when I save to github this way, it also save 
locally. So to prevent my private tiddlers from getting overridden by the 
save, I need to trigger a complete save to finish the process. 

Now that I think about it, it's probably because of the action-setfield 
widget : it must trigger an automatic save when the tiddler $:/GitHub/Username 
is edited .. maybe I could prevent this by temporarily setting 
$:/config/AutoSave 
<https://tiddlywiki.com/static/%2524%253A%252Fconfig%252FAutoSave.html> to 
"no" ! 

Yep, this works ! https://telumire.github.io/test-github-save.html



Le mardi 10 août 2021 à 20:32:33 UTC+2, saq.i...@gmail.com a écrit :

> Ah right, I believe there is a race condition which is leading to the 
> double save. 
>
> On Tuesday, August 10, 2021 at 8:20:32 PM UTC+2 Saq Imtiaz wrote:
>
>> Regarding: " It would be best if I could save only to github thus never 
>> overriding my local wiki. Is that possible ?"
>>
>> Have you tried removing the second instance of  $action-sendmessage 
>> $message="tm-save-wiki" in your code?
>>
>> On Tuesday, August 10, 2021 at 8:00:43 PM UTC+2 Télumire wrote:
>>
>>> Hi Saq, 
>>>
>>> The code I shared at the end of my post already use these shadow 
>>> tiddlers.
>>> Thanks for the google thread, I'll try again and ask him for help if 
>>> need be. 
>>>
>>> I just hopped there was a way to do that in wiki text only, since I'm 
>>> not very good with JavaScript ^^
>>>
>>> Le mardi 10 août 2021 à 19:46:26 UTC+2, saq.i...@gmail.com a écrit :
>>>
>>>> I think bimlas' code has most of what you need and could easily be 
>>>> adapted for your purposes.
>>>> You may want to consider speaking with him, see 
>>>> https://groups.google.com/g/tiddlywiki/c/ZU_s6FdUy8Q/m/KeXVnOciBAAJ
>>>>
>>>> Also helpful might be the ability to create a custom save button that 
>>>> does not include the public content. See the following shadow tiddlers:
>>>> $:/core/ui/Buttons/save-wiki
>>>> $:/config/SaveWikiButton/Template
>>>> $:/core/save/all
>>>>
>>>>
>>>> On Tuesday, August 10, 2021 at 7:09:58 PM UTC+2 Télumire wrote:
>>>>
>>>>>
>>>>> Hello everyone,
>>>>>
>>>>> I wish to use tiddlywiki as a semi-private blog using GitHub Pages 
>>>>> (with some of its content never going online until it's ready) and 
>>>>> thought 
>>>>> it would be nice to have a button that allow to choose what saver to use.
>>>>>
>>>>> For example, when I'm finished working on my article, I would hit the 
>>>>> regular save button and the changes would be saved locally. Then, when 
>>>>> I'm 
>>>>> satisfied, I would click a button to save to GitHub.
>>>>>
>>>>> The interesting thing is that we can set a filter to exclude some 
>>>>> tiddler from the save, so if I want to exclude an unfinished tiddler from 
>>>>> the save to GitHub, I would simply tag it with “private” or something 
>>>>> before saving the wiki.
>>>>>
>>>>> The issue is : tiddlywiki does not provide a mean to specify which 
>>>>> saver to use when triggering a save. 
>>>>>
>>>>> I found a workaround : I use a button which first fill in the GitHub 
>>>>> credential, increasing the priority of the GitHub saver, trigger the 
>>>>> filtered save, then remove the credential, allowing the next regular save 
>>>>> to be done with the local saver.
>>>>>
>>>>> The issue is that when I save to github this way, it also save 
>>>>> locally. So to prevent my private tiddlers from getting overridden by the 
>>>>> save, I need to trigger a complete save to finish the process. I think 
>>>>> this 
>>>>> is very risky because if the browser crash between the github save and 
>>>>> the 
>>>>> local save, all my private tiddlers will be lost. It would be best if I 
>>>>> could save only to github thus never overriding my local wiki. Is that 
>>>>> possible ?
>>>>>
>>>>> I've found this js code by bimlas showing how to select a saver : 
>>>>> https://bimlas.gitlab.io/demo/tw5/preferred-saver.html#%24%3A%2Fbimlas%2Fpreferred-saver.js
>>>>>  
>>>>> but I don't know how to adapt

[tw5] How to create a "save to github" button/trigger a save with a specific saver (single file wiki)?

[Télumire]

Hello everyone,

I wish to use tiddlywiki as a semi-private blog using GitHub Pages (with 
some of its content never going online until it's ready) and thought it 
would be nice to have a button that allow to choose what saver to use.

For example, when I'm finished working on my article, I would hit the 
regular save button and the changes would be saved locally. Then, when I'm 
satisfied, I would click a button to save to GitHub.

The interesting thing is that we can set a filter to exclude some tiddler 
from the save, so if I want to exclude an unfinished tiddler from the save 
to GitHub, I would simply tag it with “private” or something before saving 
the wiki.

The issue is : tiddlywiki does not provide a mean to specify which saver to 
use when triggering a save. 

I found a workaround : I use a button which first fill in the GitHub 
credential, increasing the priority of the GitHub saver, trigger the 
filtered save, then remove the credential, allowing the next regular save 
to be done with the local saver.

The issue is that when I save to github this way, it also save locally. So 
to prevent my private tiddlers from getting overridden by the save, I need 
to trigger a complete save to finish the process. I think this is very 
risky because if the browser crash between the github save and the local 
save, all my private tiddlers will be lost. It would be best if I could 
save only to github thus never overriding my local wiki. Is that possible ?

I've found this js code by bimlas showing how to select a saver : 
https://bimlas.gitlab.io/demo/tw5/preferred-saver.html#%24%3A%2Fbimlas%2Fpreferred-saver.js
 
but I don't know how to adapt it to my scenario.

Here's the code that I use for now :

<$button tooltip={{GithubSave/Hint}} aria-label={{GithubSave/Caption}}  
class=<>>
<$action-listops $tiddler="github save button/private/username" 
$tags="[[private]] [[github save button]]"/>
<$action-listops $tiddler="github save button/private/state" 
$tags="[[private]] [[github save button]]"/>
<$action-setfield $tiddler="$:/GitHub/Username" text={{github save 
button/private/username}}/>
<$action-sendmessage $message="tm-save-wiki" $param="$:/core/save/all" 
publishFilter={{publishFilter}} />
<$action-setfield $tiddler="$:/GitHub/Username" text=""/>
<$action-sendmessage $message="tm-save-wiki" $param="$:/core/save/all"/>


<$list filter="[match[yes]]">
{{$:/core/images/github}}

<$list filter="[match[yes]]">
save to github




Live demo : 

https://telumire.github.io/TW-tips/#Save%20a%20private%20copy%20to%20github%20(single%20file%20wiki)

You can import it in your wiki by drag & drop "'open all in the current 
tab" in tiddlywiki. Click once on the button, then fill in the username in 
the tiddler "github save button/private/username". 

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/a280b63c-0425-4cf7-b1b0-dd005b6534fbn%40googlegroups.com.

Re: [tw5] Re: Presenting... Speech-to-Text plugin for TW5!!!

[Télumire]

Hello @Flanc,

I just tested the demo and this works really well with french (with chrome, 
it didn't work with Firefox). Being able to see the live transcript would 
be even better (to see if the recording works properly), but this is 
already awesome. Great work! :) 

Le mardi 10 août 2021 à 15:21:18 UTC+2, TiddlyTweeter a écrit :

> flanc ...
>
> I'm NOT a dev. 
>
> The thing you done already is brilliant!!
> In practice PUNCTUATION matters to me to notch it up, After that, that I 
> can be recognized in the Italian LANGUAGE.
> Anything more is more icing on the cake. 
>
> NB: Having it in editor is low priority for me. 
> It is Good Enough Already transcribing the lingo per me (for me) to a 
> simple Tiddler.
>
> Just a comment.
>
> Best wishes
> TT
>
> On Tuesday, 10 August 2021 at 14:57:36 UTC+2 flanc...@gmail.com wrote:
>
>> Thanks everyone for the great advice! 
>>
>> My main takeaways for what I will start working on are commands: 
>> punctuation, language switch, etc. 
>>
>> As this is on the side of the things I develop for the plug-in, I will 
>> set to work immediately reading documentation and example code. 
>>
>> To get more technical,  I believe I can just attach a function to check 
>> the last word of the transcription, and if it matches a set array of word/s 
>> it will the execute a command. 
>>
>> BTC and I continue to talk on the Issues page of the repo, if any other 
>> devs would like to chime in with other ideas/implementation, feel free to 
>> chime in there. 
>>
>> Thanks again! 
>>
>> On Tue, Aug 10, 2021 at 6:32 AM R²  wrote:
>>
>>> Hi all and thanks Flank & BTC for this extremely promising plugin!
>>>
>>> Another few ideas and comments:
>>>
>>> (1) It would be nice to have a record button directly in the editor and 
>>> not only have to rely on creating new transcript tiddlers.
>>> (2) Automatic punctuation should be easy to switch on and off as per 
>>> https://cloud.google.com/speech-to-text/docs/automatic-punctuation.
>>> (3) There are quite a number of languages and accents available on the 
>>> Web Speech API demo. It would be nice to be able to set the languageCode 
>>> parameter manually (fully list at: 
>>> https://cloud.google.com/speech-to-text/docs/languages). When this 
>>> happens, could you make sure that custom record buttons can be added using 
>>> only wikitext to allow multilingual users to have several record buttons 
>>> based on their own needs?
>>> (5) It could be worth mentioning in the readme that Google's Web Speech 
>>> API demo at https://www.google.com/intl/en/chrome/demos/speech.html is 
>>> a great way of checking for browser compatibility. I haven't found anything 
>>> that works on my Linux system by the way. Any ideas as Firefox is 
>>> unsupported and even Chromium strangely doesn't seem to be able to run the 
>>> API on my system (V. 91.0.4472.114 on Linux Mint)? On my phone, Quinoid 
>>> V1.0 doesn't work either :(
>>> (6) Bouncing on TT's idea of using speech-driven commands while 
>>> recording, this would make terrific sense not only for punctuation, but 
>>> also to enunciate proper nouns for instance, or to switch languages on the 
>>> fly within a given recording or prior to a recording ("switchtoItalian"…).
>>> (7) I'm still running into problems regarding the short hearing span on 
>>> the plugin's TW demo despite the version being seemingly v. 1.0.3.
>>>
>>> Thanks :)
>>> R²
>>>
>>> -- 
>>>
>> You received this message because you are subscribed to the Google Groups 
>>> "TiddlyWiki" group.
>>> To unsubscribe from this group and stop receiving emails from it, send 
>>> an email to tiddlywiki+...@googlegroups.com.
>>>
>> To view this discussion on the web visit 
>>> https://groups.google.com/d/msgid/tiddlywiki/367d80b8-aa58-471a-8c89-155f20c2cfa2n%40googlegroups.com
>>>  
>>> 
>>> .
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/8fc09074-f6fa-49fb-8e0b-419b70770600n%40googlegroups.com.

[tw5] Re: How to create a "save to github" button/trigger a save with a specific saver (single file wiki)?

[Télumire]

Hi Saq, 

The code I shared at the end of my post already use these shadow tiddlers.
Thanks for the google thread, I'll try again and ask him for help if need 
be. 

I just hopped there was a way to do that in wiki text only, since I'm not 
very good with JavaScript ^^

Le mardi 10 août 2021 à 19:46:26 UTC+2, saq.i...@gmail.com a écrit :

> I think bimlas' code has most of what you need and could easily be adapted 
> for your purposes.
> You may want to consider speaking with him, see 
> https://groups.google.com/g/tiddlywiki/c/ZU_s6FdUy8Q/m/KeXVnOciBAAJ
>
> Also helpful might be the ability to create a custom save button that does 
> not include the public content. See the following shadow tiddlers:
> $:/core/ui/Buttons/save-wiki
> $:/config/SaveWikiButton/Template
> $:/core/save/all
>
>
> On Tuesday, August 10, 2021 at 7:09:58 PM UTC+2 Télumire wrote:
>
>>
>> Hello everyone,
>>
>> I wish to use tiddlywiki as a semi-private blog using GitHub Pages (with 
>> some of its content never going online until it's ready) and thought it 
>> would be nice to have a button that allow to choose what saver to use.
>>
>> For example, when I'm finished working on my article, I would hit the 
>> regular save button and the changes would be saved locally. Then, when I'm 
>> satisfied, I would click a button to save to GitHub.
>>
>> The interesting thing is that we can set a filter to exclude some tiddler 
>> from the save, so if I want to exclude an unfinished tiddler from the save 
>> to GitHub, I would simply tag it with “private” or something before saving 
>> the wiki.
>>
>> The issue is : tiddlywiki does not provide a mean to specify which saver 
>> to use when triggering a save. 
>>
>> I found a workaround : I use a button which first fill in the GitHub 
>> credential, increasing the priority of the GitHub saver, trigger the 
>> filtered save, then remove the credential, allowing the next regular save 
>> to be done with the local saver.
>>
>> The issue is that when I save to github this way, it also save locally. 
>> So to prevent my private tiddlers from getting overridden by the save, I 
>> need to trigger a complete save to finish the process. I think this is very 
>> risky because if the browser crash between the github save and the local 
>> save, all my private tiddlers will be lost. It would be best if I could 
>> save only to github thus never overriding my local wiki. Is that possible ?
>>
>> I've found this js code by bimlas showing how to select a saver : 
>> https://bimlas.gitlab.io/demo/tw5/preferred-saver.html#%24%3A%2Fbimlas%2Fpreferred-saver.js
>>  
>> but I don't know how to adapt it to my scenario.
>>
>> Here's the code that I use for now :
>>
>> <$button tooltip={{GithubSave/Hint}} aria-label={{GithubSave/Caption}}  
>> class=<>>
>> <$action-listops $tiddler="github save button/private/username" 
>> $tags="[[private]] [[github save button]]"/>
>> <$action-listops $tiddler="github save button/private/state" 
>> $tags="[[private]] [[github save button]]"/>
>> <$action-setfield $tiddler="$:/GitHub/Username" text={{github save 
>> button/private/username}}/>
>> <$action-sendmessage $message="tm-save-wiki" $param="$:/core/save/all" 
>> publishFilter={{publishFilter}} />
>> <$action-setfield $tiddler="$:/GitHub/Username" text=""/>
>> <$action-sendmessage $message="tm-save-wiki" $param="$:/core/save/all"/>
>>
>> 
>> <$list filter="[match[yes]]">
>> {{$:/core/images/github}}
>> 
>> <$list filter="[match[yes]]">
>> save to github
>> 
>> 
>> 
>>
>> Live demo : 
>>
>>
>> https://telumire.github.io/TW-tips/#Save%20a%20private%20copy%20to%20github%20(single%20file%20wiki)
>>
>> You can import it in your wiki by drag & drop "'open all in the current 
>> tab" in tiddlywiki. Click once on the button, then fill in the username in 
>> the tiddler "github save button/private/username". 
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/3754e25e-82eb-460f-9609-d5122038c44fn%40googlegroups.com.

[tw5] Re: Help please for indicators in SideBar

[Télumire]

Erratum : no need for the line-height:unset nor the inline-block for the 
button and its content :

.indicator-container {
display:block;
margin-top: -14px;
margin-bottom: -26px;
}

.indicator-item{
height:40px;
width:40px;
display:inline-block;
position:relative;
}

.indicator-item button, .indicator-item button * {
width:100%!important;
height:100%!important;
padding:unset;
margin:unset;
left:0;
top:0;
}

Le jeudi 12 août 2021 à 20:00:09 UTC+2, Télumire a écrit :

> Ok now I understand what you mean … This is because tiddly wiki wrap the 
> content in a  tag, which has a margin of 14px. So to fix that, since we 
> can't style an element based on it's content (at least not until the 
> pseudo-class :has is supported) nor give it a class (as far as I know), we 
> need to wrap the indicators in a container and use it to compensate with 
> negative margin.
>
> The code becomes :
>
> \whitespace trim
> 
> 
> {{$:/core/ui/Buttons/edit}}
>  
> ..etc..
> 
> {{$:/core/ui/Buttons/cancel}}
> 
>  
>
> And the css becomes 
>
> .indicator-container {
> display:block;
> margin-top: -14px;
> margin-bottom: -26px;
> line-height:unset;
> }
>
> .indicator-item{
> height:40px;
> width:40px;
> display:inline-block;
> position:relative;
> }
>
> .indicator-item button, .indicator-item button * {
> width:100%!important;
> height:100%!important;
> padding:unset;
> margin:unset;
> display:inline-block;
> left:0;
> top:0;
> }
> Le jeudi 12 août 2021 à 08:22:19 UTC+2, TW Tones a écrit :
>
>> Télumire
>>
>> I just tried this on tiddlywiki.com;
>>
>> Thanks, we are almost there.
>>
>> I set the width and height to 15px, look like I wanted then added 
>> list-before = $:/core/ui/SideBarSegments/tabs
>>
>> Once it moves above the tabs there is too much white space above and below
>>
>> [image: Snag_1f281978.png]
>>
>> Is there some way to remove or reduce this space top and bottom?
>>
>> Regards
>> Tones
>>
>>
>> On Thursday, 12 August 2021 at 12:07:40 UTC+10 Télumire wrote:
>>
>>> So if I understand correctly, you want to be able to give a custom size 
>>> to your icons/buttons and be able to have them next to each other ?
>>>
>>> Try this and tell me if that works :
>>>
>>> In the tiddler tagged with $:/tags/SideBarSegment : 
>>>
>>> \whitespace trim
>>> 
>>> {{button 1}}
>>> 
>>> ..etc..
>>> 
>>> {{button n}} 
>>>  
>>>
>>> In a stylesheet tiddler :
>>>
>>> .indicator{
>>> height:20px;
>>> width:20px;
>>> display:inline-block;
>>> position:relative;
>>> }
>>>
>>> .indicator button, .indicator button * {
>>> width:100%!important;
>>> height:100%!important;
>>> padding:unset;
>>> margin:unset;
>>> display:inline-block;
>>> position:absolute;
>>> left:0;
>>> top:0;
>>> }
>>> Le jeudi 12 août 2021 à 02:42:42 UTC+2, TW Tones a écrit :
>>>
>>>> Folks,
>>>>
>>>> I have a number of projects that could use icons placed in the sidebar, 
>>>> top menu and other places. They would indicate some status such as a green 
>>>> storage icon when the local storage is on and much more. I call these 
>>>> indicators, They may have tooltips or actions on click, with or without 
>>>> modifier keys. 
>>>>
>>>> I have attempted to build a new element tagged $:/tags/SideBarSegment 
>>>> and list-before $:/core/ui/SideBarSegments/tabs
>>>>
>>>> The problem I have for for which I seek help is I am finding it 
>>>> difficult to reduce icons and buttons to a half height and not have 
>>>> unnecessary white space above and below the indicators. Margins, padding 
>>>> tweeks etc... have not succeeded. We may use existing buttons and create 
>>>> new ones, the idea is it provides additional place(s) for which we can 
>>>> display content via a tag, so if I publish an indicator and you do the 
>>>> same 
>>>> they can coexist.
>>>>
>>>> I would hope to publish this to set a de facto standard, say using the 
>>>> tag $:/tags/indicator so we can all add additional and conditional 
>>>> iconised 
>>>> information in the sideBar and elsewhere as desired. 
>>>>
>>>> Can anyone help me build this with custom css to minimise its use of 
>>>> space? Ideally customisable.
>>>>
>>>> Regards
>>>> Tones
>>>>
>>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/89287f64-cc45-42f1-940d-ff3399e0d7e5n%40googlegroups.com.

[tw5] Re: Help please for indicators in SideBar

[Télumire]

Erratum bis (sorry..) :

.indicator-container {
display: flex;
flex-wrap:wrap;
margin-top: -14px;
margin-bottom: -26px;
--indicator-size:10px;
}

.indicator-item{
height:var(--indicator-size);
width:var(--indicator-size);
display:inline-block;
position:relative;
}

.indicator-item button, .indicator-item button * {
position:absolute;
width:100%!important;
height:100%!important;
padding:unset;
margin:unset;
left:0;
top:0;
}

Should I send further replies by private message to avoid spam ?


Le jeudi 12 août 2021 à 20:02:22 UTC+2, Télumire a écrit :

> Erratum : no need for the line-height:unset nor the inline-block for the 
> button and its content :
>
> .indicator-container {
> display:block;
> margin-top: -14px;
> margin-bottom: -26px;
> }
>
> .indicator-item{
> height:40px;
> width:40px;
> display:inline-block;
> position:relative;
> }
>
> .indicator-item button, .indicator-item button * {
> width:100%!important;
> height:100%!important;
> padding:unset;
> margin:unset;
> left:0;
> top:0;
> }
>
> Le jeudi 12 août 2021 à 20:00:09 UTC+2, Télumire a écrit :
>
>> Ok now I understand what you mean … This is because tiddly wiki wrap the 
>> content in a  tag, which has a margin of 14px. So to fix that, since we 
>> can't style an element based on it's content (at least not until the 
>> pseudo-class :has is supported) nor give it a class (as far as I know), we 
>> need to wrap the indicators in a container and use it to compensate with 
>> negative margin.
>>
>> The code becomes :
>>
>> \whitespace trim
>> 
>> 
>> {{$:/core/ui/Buttons/edit}}
>>  
>> ..etc..
>> 
>> {{$:/core/ui/Buttons/cancel}}
>> 
>>  
>>
>> And the css becomes 
>>
>> .indicator-container {
>> display:block;
>> margin-top: -14px;
>> margin-bottom: -26px;
>> line-height:unset;
>> }
>>
>> .indicator-item{
>> height:40px;
>> width:40px;
>> display:inline-block;
>> position:relative;
>> }
>>
>> .indicator-item button, .indicator-item button * {
>> width:100%!important;
>> height:100%!important;
>> padding:unset;
>> margin:unset;
>> display:inline-block;
>> left:0;
>> top:0;
>> }
>> Le jeudi 12 août 2021 à 08:22:19 UTC+2, TW Tones a écrit :
>>
>>> Télumire
>>>
>>> I just tried this on tiddlywiki.com;
>>>
>>> Thanks, we are almost there.
>>>
>>> I set the width and height to 15px, look like I wanted then added 
>>> list-before = $:/core/ui/SideBarSegments/tabs
>>>
>>> Once it moves above the tabs there is too much white space above and 
>>> below
>>>
>>> [image: Snag_1f281978.png]
>>>
>>> Is there some way to remove or reduce this space top and bottom?
>>>
>>> Regards
>>> Tones
>>>
>>>
>>> On Thursday, 12 August 2021 at 12:07:40 UTC+10 Télumire wrote:
>>>
>>>> So if I understand correctly, you want to be able to give a custom 
>>>> size to your icons/buttons and be able to have them next to each other ?
>>>>
>>>> Try this and tell me if that works :
>>>>
>>>> In the tiddler tagged with $:/tags/SideBarSegment : 
>>>>
>>>> \whitespace trim
>>>> 
>>>> {{button 1}}
>>>> 
>>>> ..etc..
>>>> 
>>>> {{button n}} 
>>>>  
>>>>
>>>> In a stylesheet tiddler :
>>>>
>>>> .indicator{
>>>> height:20px;
>>>> width:20px;
>>>> display:inline-block;
>>>> position:relative;
>>>> }
>>>>
>>>> .indicator button, .indicator button * {
>>>> width:100%!important;
>>>> height:100%!important;
>>>> padding:unset;
>>>> margin:unset;
>>>> display:inline-block;
>>>> position:absolute;
>>>> left:0;
>>>> top:0;
>>>> }
>>>> Le jeudi 12 août 2021 à 02:42:42 UTC+2, TW Tones a écrit :
>>>>
>>>>> Folks,
>>>>>
>>>>> I have a number of projects that could use icons placed in the 
>>>>> sidebar, top menu and other places. They would indicate some status such 
>>>>> as 
>>>>> a green storage icon when the local storage is on and much more. I call 
>>>>> these indicators, They may have tooltips or actions on click, with or 
>>>>> without modifier keys. 
>>>>>
>>

[tw5] Re: Help please for indicators in SideBar

[Télumire]

Ok now I understand what you mean … This is because tiddly wiki wrap the 
content in a  tag, which has a margin of 14px. So to fix that, since we 
can't style an element based on it's content (at least not until the 
pseudo-class :has is supported) nor give it a class (as far as I know), we 
need to wrap the indicators in a container and use it to compensate with 
negative margin.

The code becomes :

\whitespace trim


{{$:/core/ui/Buttons/edit}}
 
..etc..

{{$:/core/ui/Buttons/cancel}}

 

And the css becomes 

.indicator-container {
display:block;
margin-top: -14px;
margin-bottom: -26px;
line-height:unset;
}

.indicator-item{
height:40px;
width:40px;
display:inline-block;
position:relative;
}

.indicator-item button, .indicator-item button * {
width:100%!important;
height:100%!important;
padding:unset;
margin:unset;
display:inline-block;
left:0;
top:0;
}
Le jeudi 12 août 2021 à 08:22:19 UTC+2, TW Tones a écrit :

> Télumire
>
> I just tried this on tiddlywiki.com;
>
> Thanks, we are almost there.
>
> I set the width and height to 15px, look like I wanted then added 
> list-before = $:/core/ui/SideBarSegments/tabs
>
> Once it moves above the tabs there is too much white space above and below
>
> [image: Snag_1f281978.png]
>
> Is there some way to remove or reduce this space top and bottom?
>
> Regards
> Tones
>
>
> On Thursday, 12 August 2021 at 12:07:40 UTC+10 Télumire wrote:
>
>> So if I understand correctly, you want to be able to give a custom size 
>> to your icons/buttons and be able to have them next to each other ?
>>
>> Try this and tell me if that works :
>>
>> In the tiddler tagged with $:/tags/SideBarSegment : 
>>
>> \whitespace trim
>> 
>> {{button 1}}
>> 
>> ..etc..
>> 
>> {{button n}} 
>>  
>>
>> In a stylesheet tiddler :
>>
>> .indicator{
>> height:20px;
>> width:20px;
>> display:inline-block;
>> position:relative;
>> }
>>
>> .indicator button, .indicator button * {
>> width:100%!important;
>> height:100%!important;
>> padding:unset;
>> margin:unset;
>> display:inline-block;
>> position:absolute;
>> left:0;
>> top:0;
>> }
>> Le jeudi 12 août 2021 à 02:42:42 UTC+2, TW Tones a écrit :
>>
>>> Folks,
>>>
>>> I have a number of projects that could use icons placed in the sidebar, 
>>> top menu and other places. They would indicate some status such as a green 
>>> storage icon when the local storage is on and much more. I call these 
>>> indicators, They may have tooltips or actions on click, with or without 
>>> modifier keys. 
>>>
>>> I have attempted to build a new element tagged $:/tags/SideBarSegment 
>>> and list-before $:/core/ui/SideBarSegments/tabs
>>>
>>> The problem I have for for which I seek help is I am finding it 
>>> difficult to reduce icons and buttons to a half height and not have 
>>> unnecessary white space above and below the indicators. Margins, padding 
>>> tweeks etc... have not succeeded. We may use existing buttons and create 
>>> new ones, the idea is it provides additional place(s) for which we can 
>>> display content via a tag, so if I publish an indicator and you do the same 
>>> they can coexist.
>>>
>>> I would hope to publish this to set a de facto standard, say using the 
>>> tag $:/tags/indicator so we can all add additional and conditional iconised 
>>> information in the sideBar and elsewhere as desired. 
>>>
>>> Can anyone help me build this with custom css to minimise its use of 
>>> space? Ideally customisable.
>>>
>>> Regards
>>> Tones
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/7cffd46e-0ec6-41f3-9c27-8da7a3b8db48n%40googlegroups.com.

[tw5] Re: Help please for indicators in SideBar

[Télumire]

So if I understand correctly, you want to be able to give a custom size to 
your icons/buttons and be able to have them next to each other ?

Try this and tell me if that works :

In the tiddler tagged with $:/tags/SideBarSegment :

\whitespace trim

{{button 1}}

..etc..

{{button n}} 


In a stylesheet tiddler :

.indicator{ height:50px; width:50px; display:inline-block; } 
.indicator button, .indicator button * { width:100%!important; 
height:100%!important; } 



Le jeudi 12 août 2021 à 02:42:42 UTC+2, TW Tones a écrit :

> Folks,
>
> I have a number of projects that could use icons placed in the sidebar, 
> top menu and other places. They would indicate some status such as a green 
> storage icon when the local storage is on and much more. I call these 
> indicators, They may have tooltips or actions on click, with or without 
> modifier keys. 
>
> I have attempted to build a new element tagged $:/tags/SideBarSegment and 
> list-before $:/core/ui/SideBarSegments/tabs
>
> The problem I have for for which I seek help is I am finding it difficult 
> to reduce icons and buttons to a half height and not have unnecessary white 
> space above and below the indicators. Margins, padding tweeks etc... have 
> not succeeded. We may use existing buttons and create new ones, the idea is 
> it provides additional place(s) for which we can display content via a tag, 
> so if I publish an indicator and you do the same they can coexist.
>
> I would hope to publish this to set a de facto standard, say using the tag 
> $:/tags/indicator so we can all add additional and conditional iconised 
> information in the sideBar and elsewhere as desired. 
>
> Can anyone help me build this with custom css to minimise its use of 
> space? Ideally customisable.
>
> Regards
> Tones
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/ebee9970-24bc-4916-83a9-cf24630e72ean%40googlegroups.com.

[tw5] Re: Help please for indicators in SideBar

[Télumire]

 So if I understand correctly, you want to be able to give a custom size to 
your icons/buttons and be able to have them next to each other ?

Try this and tell me if that works :

In the tiddler tagged with $:/tags/SideBarSegment : 

\whitespace trim

{{button 1}}

..etc..

{{button n}} 
 

In a stylesheet tiddler :

.indicator{
height:20px;
width:20px;
display:inline-block;
position:relative;
}

.indicator button, .indicator button * {
width:100%!important;
height:100%!important;
padding:unset;
margin:unset;
display:inline-block;
position:absolute;
left:0;
top:0;
}
Le jeudi 12 août 2021 à 02:42:42 UTC+2, TW Tones a écrit :

> Folks,
>
> I have a number of projects that could use icons placed in the sidebar, 
> top menu and other places. They would indicate some status such as a green 
> storage icon when the local storage is on and much more. I call these 
> indicators, They may have tooltips or actions on click, with or without 
> modifier keys. 
>
> I have attempted to build a new element tagged $:/tags/SideBarSegment and 
> list-before $:/core/ui/SideBarSegments/tabs
>
> The problem I have for for which I seek help is I am finding it difficult 
> to reduce icons and buttons to a half height and not have unnecessary white 
> space above and below the indicators. Margins, padding tweeks etc... have 
> not succeeded. We may use existing buttons and create new ones, the idea is 
> it provides additional place(s) for which we can display content via a tag, 
> so if I publish an indicator and you do the same they can coexist.
>
> I would hope to publish this to set a de facto standard, say using the tag 
> $:/tags/indicator so we can all add additional and conditional iconised 
> information in the sideBar and elsewhere as desired. 
>
> Can anyone help me build this with custom css to minimise its use of 
> space? Ideally customisable.
>
> Regards
> Tones
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/37929c2b-0acb-456a-8dfb-5d926937ca3fn%40googlegroups.com.

[tw5] Re: Just a Filtering Code Pattern

[Télumire]

Hello all ! 
The filter syntax provided by @Álvaro  is very neat but doesnt match the 
requirements of cj.v : counting the tiddlers with 4 specifics tags and only 
those tiddlers.

See this screenshot  :

https://i.imgur.com/lVlsYZt.png

I think it's because the commas imply an OR condition, but here we want an 
AND :)

So with a a tiny bit of tweaking the correct filter is : 

{{{ [[Tag 1][Tag 2][Tag 3][Tag 4]tagging[]] 
:filter[tags[]count[]compare:eq[4]] }}}

Here's a live demo : 

https://Telumire.github.io/TW-tips/index.html#:%5B%5B4%20tags%20and%20only%20those%204%5D%5D%5B%5B3%20tags%20+%201%20other%5D%5D%5B%5B4%20tags%20and%20one%20more%5D%5D%5B%5BMultiple%20parameters%20separated%20by%20a%20%20,%20%20character%5D%5D
Le samedi 25 septembre 2021 à 18:00:37 UTC+2, Álvaro a écrit :

> - In the fields cases we have a workaround with `fields` operator. It has 
> suffixs (exclude, include)
> - I think that there in't any tiddler with those tags. The search is the 
> tiddler with all these tags (¿and any other?)
>
> In the case of titles, you find a issue, but I don't know its reason. I 
> was trying to find a workaround but i wasn't lucky. I also found that the 
> match operator doesn't support multiple parameters.
>
> El sábado, 25 de septiembre de 2021 a las 16:30:26 UTC+2, TW Tones 
> escribió:
>
>> Of even this {{{ [tag[Common Operators],[HelloThere],[TableOfContents]] 
>> }}}
>>
>> On Sunday, 26 September 2021 at 00:27:45 UTC+10 TW Tones wrote:
>>
>>> Very interesting. 
>>>
>>> I think he documentation should be expanded to detail this. Multiple 
>>> parameters to operators are only documented in a few operators, but if I 
>>> read this correctly they can work on operators in *general*?
>>>
>>> If general you may expect this to work ```{{{ 
>>> [title[tid1],[tid2],[tid3]] }}}``` it does not.
>>> or {{{ [all[current]get[caption],[description]] }}}``` it does not.
>>> On Sunday, 26 September 2021 at 00:18:58 UTC+10 Eric Shulman wrote:
>>>
 I just tested this on both 5.1.23 and 5.2.0pre. I created one tiddler 
 containing
 ```
 {{{ [tag[Tag 1],[Tag 2],[Tag 3],[Tag 4]] 
 :filter[tags[]count[]compare:eq[4]] }}}
 ```

 and another tiddler with the four tags (note capitalization and spaces 
 in the tag values).

 It *does* seem to work on both versions of TW
 -e
 On Saturday, September 25, 2021 at 7:02:19 AM UTC-7 TW Tones wrote:

> Alvaro;
>
> You suggested something like this
> {{{ [tag[Tag 1]**,**[Tag 2],[Tag 3],[Tag 4]] 
> :filter[tags[]count[]compare:eq[4]] }}}
>
> As far as I can see this does not work on the pre-release and the t6ag 
> format  [tag[Tag 1],[Tag 2],[Tag 3],[Tag 4]] (simplified)  is not 
> documented
>
> Does not work. So I asked if you tested this?
>
>
> On Saturday, 25 September 2021 at 22:11:48 UTC+10 Álvaro wrote:
>
>> I don't know if I understand you.
>>
>>
>> El sábado, 25 de septiembre de 2021 a las 5:31:18 UTC+2, TW Tones 
>> escribió:
>>
>>> Alvaro;
>>>
>>> Have you tested this?
>>>
>>> {{{  [tag[Tag 1]*,*[Tag 2],[Tag 3],[Tag 4]]  
>>> :filter[tags[]count[]compare:eq[4]]  }}}
>>>
>>> I cant see it working. Here 
>>>  is says 
>>>
>>> * NEW IN: 5.1.23 Filter operators support multiple parameters which 
>>> are separated by a  ,  character.*
>>>
>>> *For example: [param1],[param2] or ,{param2}*
>>> However as far as I can see only if such multiple parameters are 
>>> documented in the operator in question.
>>>
>>> Tones
>>> On Saturday, 25 September 2021 at 01:39:53 UTC+10 Álvaro wrote:
>>>
 It works fine. I tried to find a alternative, but I wasn't lucky.

 When I resee your filter, I remember about the multiple parameters 
 in filter operator with commas (from last version, 5.1.23). And we can 
 add 
 a second filter run that it applies your filter to result of first 
 run. 
 Then you can rewrite your filter something like this (in filtering 
 transclusion)
 {{{  [tag[Tag 1]*,*[Tag 2],[Tag 3],[Tag 4]]  
 :filter[tags[]count[]compare:eq[4]]  }}}

 Although maybe it be less understandble for you.


 El viernes, 24 de septiembre de 2021 a las 10:59:50 UTC+2, 
 jn.pierr...@gmail.com escribió:

> That's fine by me.
>
> And yes filters are fun even if sometimes a bit tricky.
>
> So for the fun of it, you could arrange your filter so that the 
> input would be the 4 tags you want.
>
> something like that:
>
> \define fun(tags)
> <$set variable=occ filter="[[$tags]put your filter code 
> here...count[]]">Seen <> tiddlers with tags $tags$
> \end
>
> Sometimes, 

[tw5] Re: How make TW appear alive?

[Télumire]

 http://atlas-disciplines.unige.ch/ is a beautiful example of what can be 
done with TW. 
I've learned about it thanks to Soren Bjornstad in his book GrokTiddlywiki 
: https://groktiddlywiki.com/read/#Public%20Wikis

@Charlie_Veniot while beauty is indeed subjective, it is possible to use 
things like psychology and color theory to create a good design. 
See https://www.nngroup.com/topic/psychology-and-ux/ for example - I can 
provide more links if you are interested ^^
Le samedi 23 octobre 2021 à 16:27:01 UTC+2, hww...@gmail.com a écrit :

> Cade: 
>
> I appreciate your interesting comments, perhaps because my age has 
> advanced to the stage that my medical data is of much greater importance to 
> me.  Also, I have become much more cynical about medical practitioners who 
> share data with the BigPharma oligopoly and the inevitable consequences of 
> well-intended attempts to make all of a patient's data available on-line so 
> that GPs and Specialist can share a holistic view of a patient.  
>
> For my part, I am much more inclined to build by own repository of all my 
> medical information and share it with just the practitioners I trust and 
> select as care-providers.  This is particularly true now that the 
> clinic-based GP I start with, suggests that I find my own specialists, that 
> he can then refer me to, since the Administrative wait times are on the 
> order of a year for a referral.
>
> In that context, I am inclined to ask you "What are the impediments to 
> sharing the ... cardiovascular Data ..." you have.  Particularly given that 
> you already understand fine-grained design concepts and that is should be 
> possible to use these to anonymize a selective view of the information.
>
> Regards,
> Hans
>
>
> On Tuesday, October 19, 2021 at 11:18:29 PM UTC-4 Cade Roux wrote:
>
>> I wish I could share the TWs we generate for our cardiovascular Data Mart 
>> product here.  We generate the data dictionary/manual in a TW and all our 
>> test outputs are in a few TWs organized by test groupings.  It definitely 
>> satisfies 2 and 3, as far as 1, I am still tweaking it to be more and more 
>> attractive and useful all the time.  We started off very simply because we 
>> didn't want to commit too deeply down a path which would limit us from 
>> retargeting our documentation to HTML or Word later.  However, as we 
>> progressed, it was more and more accepted to start using TW features more 
>> heavily as stakeholders started to get the hang of it, and there are some 
>> fundamental aspects of TW which we have taken advantage of to solve 
>> traditional problems in code/document generation:
>>
>> Transclusion means that we can have parts of the TW that are manually 
>> edited and parts that are generated and that work can go along 
>> independently with each feeding off the other, without requiring 
>> significant synchronization between engineering staff and informatics staff 
>> - changes to the code/rules can be done independent of editing the TW 
>> template file independent of the data that is going to be imported from 
>> JSON to fill out many lookup tables and generate necessary tiddlers and 
>> indexes.  Normally with code/document generation, you have to decide 
>> whether the template or the content is driving the design and what we've 
>> found with TW is both are on pretty equal footing compared to past 
>> techniques like in Excel or Word where areas have to be labeled and then 
>> only designated labeled areas can be filled in and there really isn't 
>> referencing back and forth.  And you have to decide where longer narratives 
>> are stored and how they get combined in the document. And you have to 
>> decide how to handle multiple passes so that you can embed generated 
>> content in user content inside the generated content.  That is simple for 
>> us, they are always in a tiddler, potentially itself transcluding generated 
>> data, and it's all seamlessly handled by transclusion.
>>
>> Macros/filters mean that the document in many cases is data driven on its 
>> own using TW features.  Typically in a Word or HTML document generation, 
>> you would have to generate the index, often our indexes are not even 
>> generated - they are tiddler list macros on tiddlers with dedicated 
>> transclusion points for including manual edited tiddlers in appropriate 
>> places.  Sure Word can generate a table of contents based on the heading 
>> structure in your document.  That is nothing compared to what TW does for 
>> us because of how we tag everything in custom fields and then can have all 
>> kinds of options for organizing and displaying indexes of the same data.
>>
>> Tiddler grain - do everything at a small meaningful grain and tag/label 
>> data fully in custom fields.  A lot of this could be done with an HTML site 
>> generator, but TW has really saved a lot of work for us by us buying into 
>> the TW philosophy of fine-grained tiddlers.  So we use custom fields and 
>> tags and 

[tw5] Re: TiddlyDesktop with occasional git/cloud save

[Télumire]

 https://tiddlywiki.com/dev/static/Saver.html : The syncer module uses the 
saver with the highest priority capable of the requested method to save the 
file.

Bimlas has created a poc for a saver selector, maybe this will help you : 
https://bimlas.gitlab.io/demo/tw5/preferred-saver.html#%24%3A%2Fbimlas%2Fpreferred-saver.js

I dont know much on the subject, maybe someone else could provide more 
infos .. 
Le jeudi 21 octobre 2021 à 23:30:21 UTC+2, carlosj...@gmail.com a écrit :

> Hi all,
>
> Here is one thing that confuses me: one can configure multiple savers but 
> there is no indication about which one is active. If I configure gitlab/hub 
> and TiddlyHost, will that save to all three at the same time? If not, to 
> which one? Is it configurable at all?
>
> Next related thing that confuses me: if I use TiddlyDesktop, can I still 
> somehow save (preferably non automatically) to TiddlyHost or gitlab/hub? I 
> think this has to be a fairly common use case: I keep a local copy but want 
> to access it from my phone, so it is periodically saved to TiddlyHost or 
> maybe gitlab/hub pages. Now, for the gitlab/hub cases I still can manage by 
> pushing changes from the local filesystem, but should I manually upload to 
> TiddlyHost as well? If this is so, why couldn't the savers be explicitly 
> triggered from inside the wiki (seems much more convenient to me)?
>
> Any help will be much appreciated.
>
> Best regards,
> Carlos
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/29c1f261-713b-48b5-a839-e8a18eb76f08n%40googlegroups.com.

[tw5] Re: Automatically generating grocery list by clicking on cooking recipes ?

[Télumire]

You could do it like this : 

Create a data tiddler for a recipe with a quantity associated to each 
ingredient. To make things easier the unit will be hardcoded in grams (or 
whatever you like, but always the same).

Then you can select your recipe for the week with a select widget for 
example (https://tiddlywiki.com/#SelectWidget), use the data of the widget 
in a list widget (https://tiddlywiki.com/#ListWidget) which will sum the 
values of each unique index accross the data-tiddlers you selected.

I think you will need the count Operator 
(https://tiddlywiki.com/#count%20Operator),  getindex Operator 
(https://tiddlywiki.com/#getindex%20Operator),  sum Operator  
(https://tiddlywiki.com/#sum%20Operator). Good luck and let me know if you 
need help to understand something :) 

Le samedi 4 décembre 2021 à 22:50:32 UTC+1, cassandr...@gmail.com a écrit :

> Hello everyone, 
>
> New here, using TW since a year ago but only for simple notekeeping which 
> didn't use a lot of in deep knowledge with it.
>
> I'm currently using the latest version available of TW (the v5.2.0 I think 
> ?).
>
> So here's my problem. As an effort to manage a bit more my money and my 
> time, I decided to invest in a batch cooking book which has proven great 
> overtime.
> My problem is that each week, I need to manually type the cooking list on 
> my phone/computer.
> I decided if I keep on doing it for a long time, I could as well simplify 
> the process. I thought about using TW but I am at loss as how to do it.
>
> *What I would want ideally* : 
> - To click on or in the tiddler "Week 1" for example and have an automatic 
> generated list of all the ingredients I need to buy for this week
> - At the same time, I wish I could check/uncheck which recipe I would want 
> to in this week or not and have the adapted grocery list
> - As an add-on, it would be great if I could check multiples ingredients 
> and see recipe which contain them
>
> The first thing (in my mind) doesn't seem complicated as I can simply 
> write the grocery list in "hard".
> But I can't even begin to imagine how to "uncheck" a recipe of this week 
> and "decrease" the grocery list accordingly. 
> As a very very very basic knowledge (minimal), it would be like for 
> exemple creating a variable for "egg" which would contain "4" if all recipe 
> are checked but if I uncheck recipe for the tuesday which contain an egg, 
> the variable egg will be "3".
> And to do it for all ingredients / recipe.
>
> Is someone here has an idea how to begin or to do something similar, I'm 
> all ear !
>
> Thank for your answers
>
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/0243eabb-fb1f-4835-b209-eef7e749ee53n%40googlegroups.com.

[tw5] Re: [TW5] How do I change the background color of a toddler?

[Télumire]

You need to transclude the tiddler image as an URI in your css (or even 
better if it's a png, place your image in the same folder and use the url 
of your file). You can use the datauri macro if you want to use an image 
encoded in your wiki, see 
https://tiddlywiki.com/#datauri%20Macro%20(Examples).

If you use an external, local image dont forget to add quotes to avoid 
escaping issues : https://developer.mozilla.org/en-US/docs/Web/CSS/url()
Le mercredi 22 décembre 2021 à 17:12:36 UTC+1, eirich...@gmail.com a écrit :

> I've been able to follow the instructions from the 2nd link pretty 
> easily.  I've been able to create tiddlers with single colors, change their 
> opacity, and add background images from an external URL.  One thing that is 
> eluding me though, is how to add a background image from an an image that 
> already exists in the wiki.  For instance, I have a tiddler named image.png 
> that is of type "image/png".  When I use "background-image: 
> url(./image.png);" in my stylesheet, it doesn't show up in the background 
> of the test tiddler I want to apply it to.  If I change the source to the 
> URL of an image I see on the internet, it shows up just fine.
> On Tuesday, July 18, 2017 at 12:30:28 PM UTC-7 Stef S wrote:
>
>> Update: This version of my link might be less confusing: 
>> http://tiddlywiki.com/#How%20to%20apply%20custom%20styles%20by%20tag
>>
>>
>> On Tuesday, July 18, 2017 at 9:28:46 PM UTC+2, ste...@gmail.com wrote:
>>>
>>>
>>> You can apply custom styles (including background color) by tag: 
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/2e87f3df-4572-4bbd-b140-5ea272f7dc04n%40googlegroups.com.

[tw5] Re: Ranked list of tiddlers according to number of backlinks

[Télumire]

Thanks a lot for sharing this ! sortsub is a difficult filter for me to 
understand, examples like yours are great.

On Monday, 3 January 2022 at 21:45:59 UTC+1 jonligh...@gmail.com wrote:

> I found a useful lead from Eric Shulman using subsort
> https://groups.google.com/g/tiddlywiki/c/hZBWTSo8eCw
>
> Using this I can order in the filter directly.
>
> My filter looks like this
> <$list filter='[!is[system]!tag[Journal]sortsub:integerlimit]'>
>
> And the macro sub looks like this
> \define sub() [backlinks[]count[]]
>
> Thought I would leave this for the next person.
> Jon
>
>
>
>
> On Friday, 31 December 2021 at 12:08:21 UTC Jon Light wrote:
>
>> Hi,
>>
>> I am interested in being able to get an overview of my wiki to identify 
>> tiddlers which seems to function as important "hubs" in my knowledge base - 
>> for instance if a tiddler has ten backlinks then it might be more important 
>> than one with say 2 backlinks - or perhaps I have neglected a tiddler 
>> because I have missed places which should ideally link to it. 
>>
>> I use the "giffmex" bi-directional back link plugin so the required data 
>> is already in place.  
>>
>> It's all speculative, I am just interested in seeing if tools can show 
>> relationships in my knowledge base which is 20MB which perhaps I cannot 
>> always appreciate.  
>>
>> I do not regularly code in Tiddlywiki so I started off with existing code 
>> to hack..
>>
>> https://groups.google.com/g/tiddlywiki/c/j5oVXLCErE8/m/okRgDg9GCgAJ
>>
>> My experimental tiddler code now looks like this
>>
>> <$list filter="[all[]]" variable="tiddler">
>> <$list filter="[backlinks[]count[]]" variable="count">
>> <$reveal type="lteq" state="$:/temp/Testing!!minimum" text=<> > 
>> <$reveal type="gteq" state="$:/temp/Testing!!maximum" text=<> > 
>> <> <$link to=<> />
>> 
>> 
>> 
>> 
>>
>> It's a good start -  it displays a list of all my tiddlers with the 
>> number of backlinks for each tiddler displayed - the next step would be to 
>> order the list so that tiddlers with the most backlinks appear higher in 
>> the list.
>>
>> I looked at the idea of adding a new field to each tiddler to hold the 
>> number of backlinks - if so then so far have not found out how to add a new 
>> field (if it does not already exist) and write the value 'count'. 
>>
>> So far performance is not an issue. 
>>
>> I am interested in any existing plugins or attempts to extract this kind 
>> of information from large wikis - no point re-inventing the wheel!
>>
>> Thanks 
>> Jon
>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/cd894b6d-1066-48e5-88e6-042ff392f009n%40googlegroups.com.

[tw5] Re: Combobox idea

[Télumire]

 
Hi @Mat, the apostrophes are intended, they prevent the wikitext parsing to 
convert the -- into – (the wikitext cant be disabled with a pragma rule or 
a content type in thatcase because this would prevent the use of widgets).

Drag & drop this tiddler in your wiki and it should work fine (it does on 
my end in a fresh tiddlywiki) :)



Le dimanche 14 novembre 2021 à 00:09:51 UTC+1, Mat a écrit :

> @Télumire - I now tried to copy your code but it doesn't work properly. 
> I've tried both from your attached tid file and using the copy-to-clipboard 
> feature on your webpage but the code seems buggy e.g the -- prefix on css 
> variables are enclosed in apostrophes. 
>
> This is what I get 
> <https://combobox.tiddlyhost.com/#:Combobox%20%5B%5BA%20styled%20combobox%5D%5D%20%5B%5BA%20quick'n%20dirty%20combobox%5D%5D>,
>  
> i.e the "Combobox" tiddler is your downloaded attachment tid above, and in 
> the tiddler "A styled combobox" I've tweaked some stuff so it basically 
> works but the button arrow is not showing.
>
> What am I doing wrong or missing?
>
> Thanx
>
> <:-)
> On Friday, November 5, 2021 at 2:00:46 AM UTC+1 Télumire wrote:
>
>> Ok I think this time I got it. Here : 
>> https://Telumire.github.io/TiddlyTweaks/index.html#:%5B%5BCombobox%5D%5D
>>
>>
>>
>> Le jeudi 4 novembre 2021 à 23:17:51 UTC+1, Télumire a écrit :
>>
>>>
>>> @Eric Shulman my bad, I should have tested it a bit more. Thanks for 
>>> pointing this out ! @Mat, this is because the select element is OS 
>>> dependent according to this stack overflow answer : 
>>> https://stackoverflow.com/a/1895485/11549574
>>>
>>> This one can be used properly inline (with a text after and before) and 
>>> use a pseudo element as a select button (I left it as a red square but it's 
>>> easy to customize), but there is still an issue with vertical align.. I'm 
>>> still sharing it just in case, if I find something better I'll post it  :
>>>
>>> <$vars
>>>
>>> height="20px"
>>>
>>> >
>>> 
>>> .combobox{
>>> position: relative;
>>> display: inline-block;
>>> width: 150px;
>>> height:<<height>>;
>>> background:red;
>>> margin-right:20px;
>>> }
>>>
>>> .combobox .select-btn{
>>> width:100%;
>>> cursor:pointer;
>>> opacity:0;
>>> pointer-event:all;
>>> }
>>>
>>> .combobox input{
>>> top:0;
>>> position:absolute;
>>> width:100%;
>>> }
>>>
>>> .combobox .drodown-btn{
>>> width:calc(<<height>> + 100%);
>>> top:0;
>>> position:absolute;
>>> cursor:pointer;
>>> }
>>>
>>> .combobox .drodown-btn:after{
>>> display:block;
>>> content:"";
>>> width:calc(<<height>> + 4px);
>>> position:absolute;
>>> inset:0 0 0 auto;
>>> background:red;
>>> pointer-events: none;
>>> }
>>> 
>>>
>>>
>>> BEFORE<$edit-text field=selection placeholder="type or select"/>AFTER
>>>
>>> before
>>> 
>>> 
>>> <$select field=selection class="select-btn" >
>>> A Tale of Two Cities
>>> A New Kind of Science
>>> The Dice Man
>>> 
>>> 
>>> <$edit-text field=selection placeholder="type or select"/>
>>> 
>>> after
>>>
>>>
>>> Le jeudi 4 novembre 2021 à 22:48:23 UTC+1, Mat a écrit :
>>>
>>>> @Télumire, I appreciate your effort! @Eric, thank you for your shrewd 
>>>> analysis!
>>>>
>>>> Does anyone know why it is barely possible to manipulate this dropdown 
>>>> though? I do get the following to work, so the options *are* 
>>>> targettable:
>>>>
>>>> .select-btn option {background:red}
>>>>
>>>> ...but attempting to e.g position absolute, margin-left, or some such 
>>>> fails. It is as if they are immune to most styling.
>>>>
>>>> @anyone - is this because of the SelectWidget implementation, or is it 
>>>> the underlying html select / option tags? Surely people will want to style 
>>>> these? If it indeed is the underlying html tags, then is it at all 
>>>> possible 
>>>> to do something about it in the SelectWidget, hypothetically?
>>>>
>>>> Thanx!
>>>>

[tw5] Re: Combobox idea

[Télumire]

 With the content type text/css , tiddlywiki treats the content of the 
tiddler as plain text, and since I rely on wikitext parsing this breaks the 
stylesheet. You need to use the content type text/vnd.tiddlywiki  or leave 
the type field blank (since this is the default type for a tiddler).

I uploaded a demo on https://combobox-demo.tiddlyhost.com/, it works both 
on my laptop (tested with edge, chrome, firefox, brave) and smartphone 
(chrome and firefox android). If this still doesn't work for you maybe it 
is because of one of your browser add-ons ?

Another possible explanation is that you have a broken CSS stylesheet 
somewhere on your wiki, this can break subsequent stylesheets. 

I investigated and it doesn't seem to be the case in your demo. 

Le dimanche 14 novembre 2021 à 09:02:10 UTC+1, Mat a écrit :

> Thanks Télumire using your exact styling tiddler, but with an added 
> type:text/css  this is how it appears <https://combobox.tiddlyhost.com/>, 
> i.e om my Win 10 machine using Chrome, Brave and Firefox I see a 
> selectwidget but no visible button and you can't type into it. Same thing 
> on my android phone, Brave browser. Does my page not appear like that on 
> your machine? BTW, on your webpage, the combobox tiddler is folded and on 
> my phone I can't access the unfold button.
>
> <:-)
> On Sunday, November 14, 2021 at 3:27:46 AM UTC+1 Télumire wrote:
>
>>  
>> Hi @Mat, the apostrophes are intended, they prevent the wikitext parsing 
>> to convert the -- into – (the wikitext cant be disabled with a pragma rule 
>> or a content type in thatcase because this would prevent the use of 
>> widgets).
>>
>> Drag & drop this tiddler in your wiki and it should work fine (it does on 
>> my end in a fresh tiddlywiki) :)
>>
>>
>>
>> Le dimanche 14 novembre 2021 à 00:09:51 UTC+1, Mat a écrit :
>>
>>> @Télumire - I now tried to copy your code but it doesn't work properly. 
>>> I've tried both from your attached tid file and using the copy-to-clipboard 
>>> feature on your webpage but the code seems buggy e.g the -- prefix on css 
>>> variables are enclosed in apostrophes. 
>>>
>>> This is what I get 
>>> <https://combobox.tiddlyhost.com/#:Combobox%20%5B%5BA%20styled%20combobox%5D%5D%20%5B%5BA%20quick'n%20dirty%20combobox%5D%5D>,
>>>  
>>> i.e the "Combobox" tiddler is your downloaded attachment tid above, and in 
>>> the tiddler "A styled combobox" I've tweaked some stuff so it basically 
>>> works but the button arrow is not showing.
>>>
>>> What am I doing wrong or missing?
>>>
>>> Thanx
>>>
>>> <:-)
>>> On Friday, November 5, 2021 at 2:00:46 AM UTC+1 Télumire wrote:
>>>
>>>> Ok I think this time I got it. Here : 
>>>> https://Telumire.github.io/TiddlyTweaks/index.html#:%5B%5BCombobox%5D%5D
>>>>
>>>>
>>>>
>>>> Le jeudi 4 novembre 2021 à 23:17:51 UTC+1, Télumire a écrit :
>>>>
>>>>>
>>>>> @Eric Shulman my bad, I should have tested it a bit more. Thanks for 
>>>>> pointing this out ! @Mat, this is because the select element is OS 
>>>>> dependent according to this stack overflow answer : 
>>>>> https://stackoverflow.com/a/1895485/11549574
>>>>>
>>>>> This one can be used properly inline (with a text after and before) 
>>>>> and use a pseudo element as a select button (I left it as a red square 
>>>>> but 
>>>>> it's easy to customize), but there is still an issue with vertical 
>>>>> align.. 
>>>>> I'm still sharing it just in case, if I find something better I'll post 
>>>>> it  
>>>>> :
>>>>>
>>>>> <$vars
>>>>>
>>>>> height="20px"
>>>>>
>>>>> >
>>>>> 
>>>>> .combobox{
>>>>> position: relative;
>>>>> display: inline-block;
>>>>> width: 150px;
>>>>> height:<<height>>;
>>>>> background:red;
>>>>> margin-right:20px;
>>>>> }
>>>>>
>>>>> .combobox .select-btn{
>>>>> width:100%;
>>>>> cursor:pointer;
>>>>> opacity:0;
>>>>> pointer-event:all;
>>>>> }
>>>>>
>>>>> .combobox input{
>>>>> top:0;
>>>>> position:absolute;
>>>>> width:100%;
>>>>> }

[tw5] Re: Hiding the TiddlyWiki interface: sneaky sneaky simple ...

[Télumire]

If you want even less steps you can do

inset:0;
position:fixed;
z-index:1000;
background:white;

On any element (other than forms, these will require a width 100vw)
Le jeudi 25 novembre 2021 à 00:32:30 UTC+1, cj.v...@gmail.com a écrit :

> All kinds of cool possibilties.
>
> I tried with a div, gave up as soon as I realized it needed a few extra 
> steps compared to dialog.
>
> What I did find interesting with a div, is a div the full size of the 
> browser window and a high z-index, allowed to see the TiddlyWiki, but 
> prevented clicking on it (a div with nothing in it seems au natural 
> transparent, at least in TiddlyWiki).
>
> For what you've done, having a password dialog and then a div in the 
> z-index layer in between the dialog and TiddlyWiki, allowing you to see the 
> TiddlyWiki but not able to do anything with it until you enter your 
> password (at which point the div is hidden), would be pretty nice.
>
> On Wednesday, November 24, 2021 at 6:06:17 PM UTC-4 Mat wrote:
>
>> Interesting. I did not know about the dialog html tag but I'd assume it 
>> can as well be achieved with a div. Anyhow, your idea triggered an idea for 
>> a "wall", e.g a password wall or paywall type application so here's some 
>> direct copy-paste-code with size so people can manipulate it more easily:
>>
>> Copy paste it to tiddlywiki.com because it uses an image from there:
>>
>> title:wall
>> text:
>> 
>> 
>> 
>> <$edit-text field=foo placeholder="password"/>
>> <$button>
>> <$list filter="[get[foo]match[hey]]">
>> <$action-sendmessage $message="tm-close-tiddler" $param="wall"/>
>> 
>> OPEN
>> 
>> password=hey
>> 
>> 
>>
>> And here's a stylesheet. No tiddler type defined but it needs the tag, 
>> i.e:
>>
>> tag: $:/tags/Stylesheet
>> text:
>> .dialog {
>> width:300px;height:300px;
>> position: fixed; bottom: 0; right:0; z-index:1000; padding:0;
>> }
>> .background {
>> background-image: url(<>);
>> width:100%; height:100%;
>> }
>> .foreground {
>> position:absolute;
>> left:50%; transform: translateX(-50%);
>> top:50%;
>> }
>>
>>
>> <:-)
>> On Wednesday, November 24, 2021 at 7:30:18 PM UTC+1 cj.v...@gmail.com 
>> wrote:
>>
>>> Oops.  Open the imported tiddler and Poof.  TiddlyWiki interface gone.
>>>
>>> Setup such a tiddler as the default tiddler to open, or default tiddler 
>>> at startup.  Maybe check for something in the URL to not open this tiddler 
>>> at startup, or some mechanism (visible or hidden-keyboard-driven) to 
>>> show/hide this tiddler.
>>>
>>> Possibilities ...
>>>
>>> On Wednesday, November 24, 2021 at 2:20:58 PM UTC-4 Charlie Veniot wrote:
>>>
 Into a TiddlyWiki you don't care about or can't edit (I suggest 
 TiddlyWiki.com), download and drag the attached file.

 Poof.  TiddlyWiki interface gone.





-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/b598c694-edde-4baf-8813-3be7a100cd69n%40googlegroups.com.

[tw5] Re: Wrap tiddler body in HTML

[Télumire]

This is because tiddlywiki automatically close any html tag you open in a 
tiddler. If you want to wrap the text field in a tag, you will need to 
either edit $:/core/ui/ViewTemplate/body or hide it and show a custom 
ViewTemplate instead.

Can I ask why you need to do that ?
Le mardi 26 octobre 2021 à 20:34:19 UTC+2, Matt Savard a écrit :

> To be more clear, I've tried creating two new tiddlers (HTMLStart and 
> HTMLEnd), one for the HTML before the body and one for the HTML after the 
> body. I've tagged these with $:/tags/ViewTemplate, then I rearranged them 
> so the do surround the tiddly body. But it doesn't like that they are HTML. 
> If I open and close a DIV in the HTMLStart tiddler, then it will display 
> correctly on every tiddler. Same goes for the HTMLEnd tiddler. But if I 
> open a tag in the HTMLStart tiddler and try to close it in the HTMLEnd, it 
> doesn't work correctly.
>
> On Tuesday, October 26, 2021 at 11:24:43 AM UTC-7 Matt Savard wrote:
>
>> Is there any way to wrap each tiddly body in HTML? For example, wrap each 
>> tiddler body in a div with a certain class applied.
>>
>> Thanks.
>> Matt
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/f2a9c8e4-af2e-48fe-81e4-408f5522aefcn%40googlegroups.com.

[tw5] Re: Combobox idea

[Télumire]

Here's the code to push the dropdown in the proper place :


<$select field=selection class="select-btn" >
A Tale of Two Cities
A New Kind of Science
The Dice Man

<$edit-text field=selection placeholder="type or select"/>



.combobox{
position:relative;
display:inline-block;
width:150px;
}

.combobox input{
z-index:1;
position:absolute;
left:0;
width:100%;
opacity:1;
}

.combobox .select-btn{
position:absolute;
left:0;
width:calc(100% + 20px);
}



Le jeudi 4 novembre 2021 à 16:20:39 UTC+1, Mat a écrit :

> Thanks Eric. I also have other ways of achieving the end result, but with 
> the direct editing of currentTiddler fields in TW 5.2.0 I thought I had 
> come across a very simple solution for a simple combobox.
>
> However, some further experimenting shows that the lost focus was easily 
> solved by just removing the placeholder reference to edited field. Not even 
> sure what I was thinking (why should it refer to there?). Also unnecessary 
> with the selectwidget default stuff.
> Thus the remaining two problems are:
>
> 1) When the  tag has a value, this is what is shown in the editor.
> 2) The popup should be pushed to the left but I can't find the css 
> selector for it! A less elegant workaround is to simply put the (still 
> styled) SelectWidget before the EditTextWidget, so the button is to the 
> left of the editor.
>
>
>
> And here's the simplified code. When used you see the problems.
>
> <$edit-text field=selection placeholder="type or select"/>
> <$select field=selection class="select-btn" >
> A Tale of Two Cities
> A New Kind of Science
> The Dice Man
> 
>
> 
> .select-btn {width:19px; margin-left:-4px;}
> 
>
>
> On Thursday, November 4, 2021 at 3:30:09 PM UTC+1 Eric Shulman wrote:
>
>> On Thursday, November 4, 2021 at 4:38:55 AM UTC-7 Mat wrote:
>>
>>> I just came up with a simple idea for how to create comboboxes. 
>>> Basically it is an EditTextWidget just before the SelectWidget and the 
>>> select widget is styled to only show the arrow and both widgets refer to 
>>> the same field.
>>>
>>
>> My `<>` macro initially use a similar approach, but I found 
>> that it had too many problems with both interaction and appearance.  I also 
>> wanted to support use of inline lists (where the listbox is visible below 
>> the input fied), multiple selection (using standard shift-click/ctrl-click 
>> interaction), confirmation of input (ok/cancel), progressive filtering 
>> (reducing the list choices to only those that contain the current edit 
>> field input), and integration with my popup Calendar for selecting and 
>> formatting date input (see 
>> https://tiddlytools.com/timer.html#TiddlyTools%2FTime%2FCalendar) .
>>
>> The result still uses an underlying edit-text and select widget, but they 
>> are surrounded by a bunch of custom wikitext code to handle lots of options 
>> and use-cases.
>>
>> Check it out here: https://tiddlytools.com/edit-list.html
>> To see it in action, view 
>> https://tiddlytools.com/edit-list.html#TiddlyTools%2FMacros%2Fedit-list%2FExamples
>>
>> enjoy,
>> -e
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/29f1c9b5-f571-4f76-abf3-69eda4d9bc00n%40googlegroups.com.

[tw5] Re: Combobox idea

[Télumire]

@Eric Shulman my bad, I should have tested it a bit more. Thanks for 
pointing this out ! @Mat, this is because the select element is OS 
dependent according to this stack overflow answer : 
https://stackoverflow.com/a/1895485/11549574

This one can be used properly inline (with a text after and before) and use 
a pseudo element as a select button (I left it as a red square but it's 
easy to customize), but there is still an issue with vertical align.. I'm 
still sharing it just in case, if I find something better I'll post it  :

<$vars

height="20px"

>

.combobox{
position: relative;
display: inline-block;
width: 150px;
height:<<height>>;
background:red;
margin-right:20px;
}

.combobox .select-btn{
width:100%;
cursor:pointer;
opacity:0;
pointer-event:all;
}

.combobox input{
top:0;
position:absolute;
width:100%;
}

.combobox .drodown-btn{
width:calc(<<height>> + 100%);
top:0;
position:absolute;
cursor:pointer;
}

.combobox .drodown-btn:after{
display:block;
content:"";
width:calc(<<height>> + 4px);
position:absolute;
inset:0 0 0 auto;
background:red;
pointer-events: none;
}



BEFORE<$edit-text field=selection placeholder="type or select"/>AFTER

before


<$select field=selection class="select-btn" >
A Tale of Two Cities
A New Kind of Science
The Dice Man


<$edit-text field=selection placeholder="type or select"/>

after


Le jeudi 4 novembre 2021 à 22:48:23 UTC+1, Mat a écrit :

> @Télumire, I appreciate your effort! @Eric, thank you for your shrewd 
> analysis!
>
> Does anyone know why it is barely possible to manipulate this dropdown 
> though? I do get the following to work, so the options *are* targettable:
>
> .select-btn option {background:red}
>
> ...but attempting to e.g position absolute, margin-left, or some such 
> fails. It is as if they are immune to most styling.
>
> @anyone - is this because of the SelectWidget implementation, or is it the 
> underlying html select / option tags? Surely people will want to style 
> these? If it indeed is the underlying html tags, then is it at all possible 
> to do something about it in the SelectWidget, hypothetically?
>
> Thanx!
>
> <:-)
>
>
>
> On Thursday, November 4, 2021 at 9:42:29 PM UTC+1 Eric Shulman wrote:
>
>> On Thursday, November 4, 2021 at 12:31:14 PM UTC-7 Télumire wrote:
>>
>>> Here's the code to push the dropdown in the proper place :
>>>
>>
>> There are layout problems with this solution.  To see the issues,
>> try putting "before" and "after" text surrounding the "combobox" span:
>>  
>>
>>> *BEFORE*
>>
>>
>>> <$select field=selection class="select-btn" >
>>> A Tale of Two Cities
>>> A New Kind of Science
>>> The Dice Man
>>> 
>>> <$edit-text field=selection placeholder="type or select"/>
>>>
>> *AFTER*
>>
>>
>> and compare this with the result of showing only an $edit-text widget:
>>
>> *BEFORE*<$edit-text field=selection placeholder="type or select"/>*AFTER*
>>
>> For the simple inline $edit-text widget, the BEFORE/AFTER text appears as 
>> you would expect:
>> immediately preceding/following the input element and vertically aligned 
>> with the middle of the text
>>
>> However, note the placement and vertical alignment of the "combobox" 
>> elements:
>> The edit input/select elements appear vertically aligned *below the 
>> baseline *of the surrounding BEFORE/AFTER text,
>> and the AFTER text is immediately following the input element, rather 
>> than following the select element.
>>
>> The CSS you provided also assumes that the width of the select element's 
>> downarrow button will always
>> a fixed width of "20px", which may not be the case depending upon which 
>> browser you are using.
>>
>> Also, there is also a slight difference in the height of the select 
>> element vs the edit element (testing with Chrome),
>> so that the bottom border of the select element, which is behind the edit 
>> element, is visible, creating the appearance
>> of a double-thick bottom border on the edit element
>>
>> -e
>>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/6758f58e-51ab-4dc6-b679-7c6ea406fb76n%40googlegroups.com.

[tw5] Re: Combobox idea

[Télumire]

Ok I think this time I got it. Here : 
https://Telumire.github.io/TiddlyTweaks/index.html#:%5B%5BCombobox%5D%5D



Le jeudi 4 novembre 2021 à 23:17:51 UTC+1, Télumire a écrit :

>
> @Eric Shulman my bad, I should have tested it a bit more. Thanks for 
> pointing this out ! @Mat, this is because the select element is OS 
> dependent according to this stack overflow answer : 
> https://stackoverflow.com/a/1895485/11549574
>
> This one can be used properly inline (with a text after and before) and 
> use a pseudo element as a select button (I left it as a red square but it's 
> easy to customize), but there is still an issue with vertical align.. I'm 
> still sharing it just in case, if I find something better I'll post it  :
>
> <$vars
>
> height="20px"
>
> >
> 
> .combobox{
> position: relative;
> display: inline-block;
> width: 150px;
> height:<<height>>;
> background:red;
> margin-right:20px;
> }
>
> .combobox .select-btn{
> width:100%;
> cursor:pointer;
> opacity:0;
> pointer-event:all;
> }
>
> .combobox input{
> top:0;
> position:absolute;
> width:100%;
> }
>
> .combobox .drodown-btn{
> width:calc(<<height>> + 100%);
> top:0;
> position:absolute;
> cursor:pointer;
> }
>
> .combobox .drodown-btn:after{
> display:block;
> content:"";
> width:calc(<<height>> + 4px);
> position:absolute;
> inset:0 0 0 auto;
> background:red;
> pointer-events: none;
> }
> 
>
>
> BEFORE<$edit-text field=selection placeholder="type or select"/>AFTER
>
> before
> 
> 
> <$select field=selection class="select-btn" >
> A Tale of Two Cities
> A New Kind of Science
> The Dice Man
> 
> 
> <$edit-text field=selection placeholder="type or select"/>
> 
> after
>
>
> Le jeudi 4 novembre 2021 à 22:48:23 UTC+1, Mat a écrit :
>
>> @Télumire, I appreciate your effort! @Eric, thank you for your shrewd 
>> analysis!
>>
>> Does anyone know why it is barely possible to manipulate this dropdown 
>> though? I do get the following to work, so the options *are* targettable:
>>
>> .select-btn option {background:red}
>>
>> ...but attempting to e.g position absolute, margin-left, or some such 
>> fails. It is as if they are immune to most styling.
>>
>> @anyone - is this because of the SelectWidget implementation, or is it 
>> the underlying html select / option tags? Surely people will want to style 
>> these? If it indeed is the underlying html tags, then is it at all possible 
>> to do something about it in the SelectWidget, hypothetically?
>>
>> Thanx!
>>
>> <:-)
>>
>>
>>
>> On Thursday, November 4, 2021 at 9:42:29 PM UTC+1 Eric Shulman wrote:
>>
>>> On Thursday, November 4, 2021 at 12:31:14 PM UTC-7 Télumire wrote:
>>>
>>>> Here's the code to push the dropdown in the proper place :
>>>>
>>>
>>> There are layout problems with this solution.  To see the issues,
>>> try putting "before" and "after" text surrounding the "combobox" span:
>>>  
>>>
>>>> *BEFORE*
>>>
>>>
>>>> <$select field=selection class="select-btn" >
>>>> A Tale of Two Cities
>>>> A New Kind of Science
>>>> The Dice Man
>>>> 
>>>> <$edit-text field=selection placeholder="type or select"/>
>>>>
>>> *AFTER*
>>>
>>>
>>> and compare this with the result of showing only an $edit-text widget:
>>>
>>> *BEFORE*<$edit-text field=selection placeholder="type or select"/>
>>> *AFTER*
>>>
>>> For the simple inline $edit-text widget, the BEFORE/AFTER text appears 
>>> as you would expect:
>>> immediately preceding/following the input element and vertically aligned 
>>> with the middle of the text
>>>
>>> However, note the placement and vertical alignment of the "combobox" 
>>> elements:
>>> The edit input/select elements appear vertically aligned *below the 
>>> baseline *of the surrounding BEFORE/AFTER text,
>>> and the AFTER text is immediately following the input element, rather 
>>> than following the select element.
>>>
>>> The CSS you provided also assumes that the width of the select element's 
>>> downarrow button will always
>>> a fixed width of "20px", which may not be the case depending upon which 
>>> browser you are using.
>>>
>>> Also, there is also a slight difference in the height of the select 
>>> element vs the edit element (testing with Chrome),
>>> so that the bottom border of the select element, which is behind the 
>>> edit element, is visible, creating the appearance
>>> of a double-thick bottom border on the edit element
>>>
>>> -e
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/c3fe7c16-affd-428e-8ccb-f72d55f0bc50n%40googlegroups.com.


Combobox.tid
Description: Binary data

[tw5] Re: Help: Inline dice rolling

[Télumire]

This should help (I think) : 
https://mklauber.github.io/tw5-plugins/#%24%3A%2Fplugins%2FD%26DTools%2FCreatureManager%2FLog

Le dimanche 31 octobre 2021 à 12:07:32 UTC+1, Mat a écrit :

> This reminded me of some experimenting I did some time back. I found the 
> below notes on it (paste it in a tiddler). It it probably NOT a good 
> solution.
> <:-)
>
> --
>
> https://css-tricks.com/are-there-random-numbers-in-css/
> 
> Click here to roll the dice
> Click here to roll the dice
> Click here to roll the dice
> Click here to roll the dice
> Click here to roll the dice
> Click here to roll the dice
> 
> 
> 
>   
>   
>   
>   
>   
>   
>   You got a: 
> 
> 
> 
> @keyframes changeOrder {
>   from { z-index: 6;}
>   to { z-index: 1; }
> }
>
> label {
>   animation: changeOrder 3s infinite linear;
>   background: #ddd;
>   cursor: pointer;
>   display: block;
>   padding: 1rem;
>   position: absolute;
> x  top: 1rem;
>   user-select: none;
> }
>
> label:nth-of-type(1) { animation-delay: 0s; }
> label:nth-of-type(2) { animation-delay: -0.5s; }
> label:nth-of-type(3) { animation-delay: -1.0s; }
> label:nth-of-type(4) { animation-delay: -1.5s; }
> label:nth-of-type(5) { animation-delay: -2.0s; }
> label:nth-of-type(6) { animation-delay: -2.5s; }
>
> .randomradio {
>   position: absolute;
>  xwidth: 100%;
> outline:1px solid red;
> }
>
> #d1:checked ~ p span::before { content: "1"; }
> #d2:checked ~ p span::before { content: "2"; }
> #d3:checked ~ p span::before { content: "3"; }
> #d4:checked ~ p span::before { content: "4"; }
> #d5:checked ~ p span::before { content: "5"; }
> #d6:checked ~ p span::before { content: "6"; }
> 
>
>
>
>
>
>
> On Friday, October 29, 2021 at 5:46:45 AM UTC+2 baj...@gmail.com wrote:
>
>> Hi all,
>> I'm looking for a little help and feedback on a project. I feel like I'm 
>> pretty close to getting my current approach to work, but I'm also wondering 
>> if there is a better way.
>>
>> *Background:*
>> I have a TW I made as a reference for running Pathfinder/D games. 
>> Across a wide variety of fields and tiddlers I have text matching the 
>> `(^|\s)\d+(d(2|4|6|8|10|12|20))?(\+\d+)?($|\s)` regex ie.  1d4+2, 5d6, 6. 
>> Respectively,  the sum of a 4 sided die result and 2, the sum of the 
>> results of five, 6 sided dice, and the value 6. 
>>
>> Ultimately, I would like to make it so that for any such string matching 
>> the regex in my wiki, clicking on the text returns a new die/dice roll 
>> matching that string. As an example, given the text "1d4+2". Clicking on 
>> that text transforms it into something like "1d4+2 (5)". Clicking again 
>> might give you "1d4+2 (3)". 
>>
>> *Current Status:*
>> I have a javascript macro that accepts a string `<> roll_str:"1d4+2">>` and returns the appropriate random result, such as "2".
>>
>> I am using the button widget in a macro like this:
>> `\define roller(input) <$button class="tc-btn-invisible" set=!!DieResult 
>> setTo=<> >''$input$'' 
>> ({{!!DieResult}}) \end`
>>
>> The resulting invocation looks like this: <>
>>
>> The pros:
>>
>>- The invocation is short
>>- Once the invocation is substituted for the initial text, it works, 
>>kinda.
>>
>> The con:
>>
>>- As I've currently implemented, "DieResult" is a field, and 
>>therefore global with respect to the tiddler. All of the rollers return 
>> the 
>>exact same result at the same time (see image).
>>
>> *What I'm looking for:*
>>
>>- How can I make the rollers independent from each other? 
>>- It seems like having the button *set *a variable instead of a field 
>>   would solve the issue but I can't figure out how to do that.
>>   - I did try to use a set widget inside the button hoping that each 
>>   set would only be evaluated on the click of that actual button, but 
>>   apparently things don't work that way.
>>   - If all else fails I can add a single "Die Result" box at the top 
>>   of most of the pages, but that isn't my preferred result.
>>   - Is there an established way to do something like the built in 
>>camelCase linking globally with strings matching this regex? 
>>- The vast majority of my tiddlers are bulk imported in JSON format 
>>   from external sources. I could do a find replace on those files before 
>>   importing, but that will have it's own issues (potential corruption 
>> and not 
>>   all the fields are evaluated again before rendering). I use a small 
>> number 
>>   of 'templates' and transclusion to render the information.
>>   - Just in general, was there a smarter way to go about this? 
>>Professionally I do CLI scientific coding (C/C++/FORTRAN/Python/R), so 
>>while I can do some robust software engineering, but the 
>>Wikitext/HTML5/CSS/javascript interplay is pretty foreign. 
>>
>> All the best,
>> Baj
>>
>

-- 
You received this 

[tw5] Re: Need a little assistance with adjusting how tiddlers are laid out

[Télumire]

You can use this style : 

.tc-tiddler-preview{
display:flex;
flex-direction:column-reverse;
}

.tc-tiddler-preview>*
{
margin:0!important;
width:100%!important;
}

In a tiddler with the tag $:/tags/Stylesheet.
Enjoy ! :)
Le samedi 11 décembre 2021 à 11:31:04 UTC+1, justin.hu...@gmail.com a 
écrit :

> I'm currently using the very basic version of JD's Mobile plugin, as I aim 
> to use my TW from my phone, but I'm not sure what I need to do in order to 
> achieve what I've mocked up below.
>
> I'd like to just figure out  a way to make a separate stylesheet to apply 
> these changes without having to make any changes to JD's plugin if possible.
>
> any help with this would be greatly appreciated!
>
> [image: Before.PNG][image: After.PNG]
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/7cb398ea-323a-4787-bd7e-e669c0d7f5a1n%40googlegroups.com.

[tw5] Re: GitHub saving individual tiddlers?

[Télumire]

I personally use the file upload plugin 
 to send individual 
tiddlers to GitHub, I made a button for it on my wiki :
https://Telumire.github.io/TiddlyTweaks/index.html#:%5B%5BSend%20tiddler%20with%20file%20upload%5D%5D

\whitespace trim
\define tiddler-attr()[[$(currentTiddler)$]]
<$button class="tc-btn-invisible" tooltip="send this tiddler with file 
upload">
<$list 
filter="[match[yes]]+[!has[_canonical_uri]]"
 
variable=_>
{{$:/plugins/commons/file-uploads/images/upload}}

<$action-sendmessage $message="tm-upload-tiddlers" $param=<> 
/>


<$list 
filter="[match[yes]]+[has[_canonical_uri]]"
 
variable=_>
get[_canonical_uri]]}}}>{{$:/core/images/globe}}

<$list filter="[match[yes]]">

<$text text=" "/>
<$text text="Send with file upload"/>




However the plugin will delete the content of your tiddler and attempt to 
link to the hosted file trough the  _canonical_uri field, so I use it only 
for image tiddlers. 
I'm sure you can find a workaround ?
Le vendredi 10 décembre 2021 à 16:03:11 UTC+1, willw a écrit :

> Does anyone have a solution for this yet?
>
> I'm looking for a way to save tiddlywiki as individual tiddlers directly 
> to git and GitHub (where the built-in GitHub saver saves the single-file 
> tiddlywiki to a git service).
>
> The single-file tiddlywiki doesn't track well in git, with big diffs for 
> small core changes. It's also hard to trace back which tiddlers were 
> changed, and autosave seems to push empty commits.
>
> Locally, the node.js version could be made to save to a git repo, perhaps 
> using a library like https://isomorphic-git.org, with changes staged 
> locally until a 'save' commits them. Seems like it could work from 
> single-file too, via browser storage?
>
> I'm considering a hacky workaround for now; using the single file GitHub 
> saver to trigger a GitHub action which runs node.js tiddlywiki to explode 
> out the tiddlers and commit them. The single-file commit can be removed if 
> used solely for saving. Then it'd be handy to have the opposite action too 
> -> build a single-file from the tiddlers.
>
> This'd be less needed if the single-file tiddlywiki format was more 
> diff-able, so maybe that's an option too.
>
> Any thoughts?
>
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/f713c4fd-849a-4e1c-9033-f0f3463e0fcen%40googlegroups.com.

[tw5] Re: If your CSS isn't working ...

[Télumire]

(sorry for the double post)

@Mat : Things to look out for with inline style (that I know of) : 

   - Space after the opening 

[tw5] Re: Need a little assistance with adjusting how tiddlers are laid out

[Télumire]

I noticed that when the preview is closed, the toolbar come back to the 
top. This is because Tiddlywiki use two containers, one for the editor 
without the preview, and the second to display the editor with the preview.

If you want the layout to stay the same with and without preview, use this :

.tc-dropzone-editor>.tc-reveal,.tc-tiddler-preview{
display:flex;
flex-direction:column-reverse;
}

.tc-tiddler-preview>*
{
margin:0!important;
width:auto!important;
}

/*optional : prevent scroll bar in the text editor*/
.tc-edit-texteditor {
object-fit: contain;
overflow-y:hidden;
}


And if you want to support the code mirror addon too, use this :

.tc-dropzone-editor>.tc-reveal,.tc-tiddler-preview, 
.tc-edit-tags~.tc-reveal{
display:flex;
flex-direction:column-reverse;
}

.tc-tiddler-preview>p {
display:contents;
}

.tc-tiddler-preview>*,.tc-tiddler-preview>p>*{
margin:0!important;
width:100%!important;
}

/*optional : prevent scroll bar in the text editor*/
.tc-edit-texteditor {
object-fit: contain;
overflow-y:hidden;
}

Le mardi 14 décembre 2021 à 14:36:32 UTC+1, justin.hu...@gmail.com a écrit :

> perfect! thank you :D
>
> On Sunday, December 12, 2021 at 4:48:23 PM UTC-5 Télumire wrote:
>
>> You can use this style : 
>>
>> .tc-tiddler-preview{
>> display:flex;
>> flex-direction:column-reverse;
>> }
>>
>> .tc-tiddler-preview>*
>> {
>> margin:0!important;
>> width:100%!important;
>> }
>>
>> In a tiddler with the tag $:/tags/Stylesheet.
>> Enjoy ! :)
>> Le samedi 11 décembre 2021 à 11:31:04 UTC+1, justin.hu...@gmail.com a 
>> écrit :
>>
>>> I'm currently using the very basic version of JD's Mobile plugin, as I 
>>> aim to use my TW from my phone, but I'm not sure what I need to do in order 
>>> to achieve what I've mocked up below.
>>>
>>> I'd like to just figure out  a way to make a separate stylesheet to 
>>> apply these changes without having to make any changes to JD's plugin if 
>>> possible.
>>>
>>> any help with this would be greatly appreciated!
>>>
>>> [image: Before.PNG][image: After.PNG]
>>>
>>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/c5b0528e-3aea-42b1-a294-ac9ae7db0915n%40googlegroups.com.

[tw5] Re: If your CSS isn't working ...

[Télumire]

Relevant GitHub issue, for anyone willing to solve this : #6176 


*TL;DR*

This happens because tiddlywiki put all the css in one 

[tw5] Re: Create a style to show icon next to link title?

[Télumire]

To prevent tiddlywiki from wikifying the content of your tiddler, you can 
use a pragma rule at the beginning of the 
tiddler :

\rules only filteredtranscludeinline transcludeinline macrodef 
macrocallinline html

You can also use wikitext to "escape" css. For example, if you try to set a 
CSS variable inside a  tag, tiddlywiki will parse -- and make it 
into a -.
To prevent this you can turn it into a code snippet : `--`
This way you keep your formatting.

$(..)$ is for text substitution of a variable defined outside of a macro, 
see https://tiddlywiki.com/#Macro%20Definitions%20in%20WikiText 

I have made a post on tiddlytalk that explain how to display svg icon next 
to links inside tiddlers, check it out : 

https://talk.tiddlywiki.org/t/trick-to-convert-the-core-images-to-svg-image-for-css-background/802

Online demo : 
https://telumire.be/TiddlyTweaks/index.html#:%5B%5B%24:/ThemeTweaks/svg/style/external_link%5D%5D
 
Le samedi 11 décembre 2021 à 06:31:03 UTC+1, evan.s...@gmail.com a écrit :

> I'm trying to get a stylesheet working that will automatically insert the 
> SVG icon before the link text. Here's what I have so far:
>
> \define link-icon-style()
> <$set name="uri" value=<> >
>   <$set name="icon" tiddler=<> field="icon">
> <$set name="iconsrc" tiddler=<> >
>   <$list variable="urititle" 
> filter="""[removeprefix[data:text/plain,]]""">
>