Re: [tw5] Re: TW5 plugin: escapecss[] filter
Btc, Thanks so much for that eloquent description. I got it now. Regards Tony -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/2c9f7ff1-a125-40c1-ac42-406dbb426d01%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
Hi SImon, That is a good news. Thank you for detail explanations on escapecss[] filter. --Mohammad -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/13675bf8-3520-4c1f-a698-e37795a98f47%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
@Tony ,
finally, using the escapecss filter I could fix the problem with sticky
titles and popups:
https://burningtreec.github.io/TW5-stickytitlesfix/
> Btc,
>>
>> This seems like a cunning solution, perhaps only a few could invent.
>> Unfortunatly, pehaps I am one of the few who does not understand why you
>> would want to do it.
>>
>> Could you explain what use there is for a superuser and its use case or
>> possibilities?
>>
>> Regsrfs
>> Tony
>>
>
> Hi Tony, I discovered some problems styling tiddlers using the
> data-tiddler-title attribute:
>
> [data-tiddler-title="$(myTiddlerTitle)$"].tc-tiddler-frame {
> styling
> }
>
> where myTiddlerTitle can be any tiddler a filter gives me
> a tiddler that contains certain characters like quotes, html entities,
> other special characters, ... , would not be styled because it would need
> correct escaping in the "myTiddlerTitle" variable to address the
> css-selector correctly. TiddlyWiki doesn't ship a way to do correct css
> escaping but this filter does
>
> so I'm filtering the tiddler title through escapecss[] which escapes all
> characters that need to be escaped in order for this to work
>
> I'm using this styling in my navigator plugin (
> burningtreec.github.io/TW5-navigator) to visualize the "selected tiddler"
>
>
> You can try this in a stylesheet tiddler on tiddlywiki.com to see the
> effect:
>
> \define style-tiddler()
> [data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
> background-color: black;
> }
> \end
>
> <$list filter="[all[tiddlers]tag[Articles]]">
> <>
>
>
> there are many tiddlers tagged "Articles" that contain quotes. the problem
> is not just quotes, but tiddlywiki.com avoids such problems
> try opening those tiddlers, their background should be black
>
> then you can try escaping quotes through the jsonstringify filter:
>
> \define style-tiddler()
> [data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
> background-color: black;
> }
> \end
>
> <$list filter="[all[tiddlers]tag[Articles]jsonstringify[]]">
> <>
>
>
> this makes them black. but the jsonstringify filter escapes only some
> characters that should be escaped for css selectors
> escapecss escapes them all, by using CSSescape, which is a browser method
> for doing just that
>
--
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 post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/13b32234-ef39-4fa4-829a-52aa3d376d6f%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
> Btc,
>
> This seems like a cunning solution, perhaps only a few could invent.
> Unfortunatly, pehaps I am one of the few who does not understand why you
> would want to do it.
>
> Could you explain what use there is for a superuser and its use case or
> possibilities?
>
> Regsrfs
> Tony
>
Hi Tony, I discovered some problems styling tiddlers using the
data-tiddler-title attribute:
[data-tiddler-title="$(myTiddlerTitle)$"].tc-tiddler-frame {
styling
}
where myTiddlerTitle can be any tiddler a filter gives me
a tiddler that contains certain characters like quotes, html entities,
other special characters, ... , would not be styled because it would need
correct escaping in the "myTiddlerTitle" variable to address the
css-selector correctly. TiddlyWiki doesn't ship a way to do correct css
escaping but this filter does
so I'm filtering the tiddler title through escapecss[] which escapes all
characters that need to be escaped in order for this to work
I'm using this styling in my navigator plugin
(burningtreec.github.io/TW5-navigator) to visualize the "selected tiddler"
You can try this in a stylesheet tiddler on tiddlywiki.com to see the
effect:
\define style-tiddler()
[data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
background-color: black;
}
\end
<$list filter="[all[tiddlers]tag[Articles]]">
<>
there are many tiddlers tagged "Articles" that contain quotes. the problem
is not just quotes, but tiddlywiki.com avoids such problems
try opening those tiddlers, their background should be black
then you can try escaping quotes through the jsonstringify filter:
\define style-tiddler()
[data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
background-color: black;
}
\end
<$list filter="[all[tiddlers]tag[Articles]jsonstringify[]]">
<>
this makes them black. but the jsonstringify filter escapes only some
characters that should be escaped for css selectors
escapecss escapes them all, by using CSSescape, which is a browser method
for doing just that
--
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 post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/17960b6c-8f7e-4fb5-9538-39f8ee85cb21%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
Btc, This seems like a cunning solution, perhaps only a few could invent. Unfortunatly, pehaps I am one of the few who does not understand why you would want to do it. Could you explain what use there is for a superuser and its use case or possibilities? Regsrfs Tony -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/d6fadf63-1023-4f86-b1d4-b936086ccdf2%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
> Simon, > This is amazing feature and should be documented! > > It gives a lot of flexibility in applying customize css dynamically. > > --Mohammad > Thanks Mohammad, yes I think using escapeCSS as a filter with a polyfill for browsers that don't support it is the best way to address css selectors flawlessly within tiddlywiki the reason is that sometimes we want to address something named by tiddler titles through a css selector and tiddler titles can contain all kinds of characters I'm trying to get this filter into the core, see this pull request: https://github.com/Jermolene/TiddlyWiki5/pull/3546 -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/b0fc5061-6425-4335-8d00-b4dfb6406fd3%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
Simon, This is amazing feature and should be documented! It gives a lot of flexibility in applying customize css dynamically. --Mohammad -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/ff513dd1-8bf5-43b3-b15b-f687495aeada%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw5] Re: TW5 plugin: escapecss[] filter
> Added to the TiddlyWiki toolmap! > Great, thank you David! -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/e6b3f82e-931b-4bdb-9eb5-3e4130bbdcac%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw5] Re: TW5 plugin: escapecss[] filter
Added to the TiddlyWiki toolmap! On Monday, December 3, 2018 at 8:00:18 AM UTC-6, BurningTreeC wrote: > > Hi all, I've made this little plugin, it's pretty lightweight adding just > a filter and a polyfill (a file that adds functionality if the browser > doesn't support it) > > It's all about the escapecss[] filter that creates valid css selectors > from whatever you give it to eat > > > Take a look at the plugin Demo: > https://burningtreec.github.io/TW5-escapecss/ > > Take a look at the github Page: > https://github.com/BurningTreeC/TW5-escapecss > > > I hope everything works well, > > BTC > -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/202901a2-aac4-4e5d-bfe2-18c5b90615b4%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
[tw5] Re: TW5 plugin: escapecss[] filter
Jan, in the stickytitlesfix I use this macro that allows assigning any css
property to a data attribute of your choice:
\rules only
$(classesBefore)$[$(tagName)$$(tagSelector)$"$(escapedTagValue)$"]$(
classesAfter)$ {
$(tagStyles)$
}
\end
\define assign-css-to-data-tag(tagName:"data-tiddler-title",tagSelector:"=",
tagValue:"",tagStyles:"",classesBefore:"",classesAfter:"")
\whitespace trim
<$vars escapedTagValue={{{ [<__tagValue__>escapecss[]] }}} tagStyles=<<
__tagStyles__>> tagName=<<__tagName__>> tagSelector=<<__tagSelector__>>
classesBefore=<<__classesBefore__>> classesAfter=<<__classesAfter__>>>
<>
\end
\define create-data-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 post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/bdf4b56b-6982-485c-b6cf-407e02f7e0b1%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
> Thank you Simon,
> that is something i have been looking for for some time.
>
> Can I do:
>
>
> [data-tiddler-type="text/vnd.tiddlywiki;flexibility=replace"].tc-tiddler-frame
> {
> border-radius: 50%;
> }
>
>
Hi Jan, I believe it was TiddlyWiki v5.1.16 or v5.1.17 that introduced the
data attributes "data-tiddler-title" and "data-tags". That doesn't mean
that data attributes within tiddlywiki are limited to those two, they are
just the only two data attributes already applied to tiddlers. So it's
convenient to re-use them, instead of adding your own
You can add any data attribute to any html tag you want:
creates a div with the data attribute
data-hello-bla and its value is the type of the tiddler...
> Or do I have to do
>
> \define assign-css()
> [data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
> border-radius: 50%;
> }
> \end
> <$list filter="[all[tiddlers]type[text/vnd.tiddlywiki;flexibility=replace]]">
> <>
>
>
> As direct CSS-Trick for Types would be great.
>
This is the way I use it, because the data-tiddler-title is already applied
to every tiddler (look at $:/core/ui/ViewTemplate) and this allows
flexibility
Note that I always put a rules pragma on top of assign-css (I've updated
the plugin readme):
\define assign-css()
\rules only
[data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
border-radius: 50%;
}
\end
<$list filter="[all[tiddlers]type[text/vnd.tiddlywiki;flexibility=replace]]">
<>
This \rules only pragma causes the tiddlywiki parser to skip the assign-css
macro, so that wikitext within the title doesn't get rendered and the
resulting css selector gets created correctly
--
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 post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/eca64f6d-cab3-4e32-be9e-64b47e133291%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
Re: [tw5] Re: TW5 plugin: escapecss[] filter
Thank you Simon,
that is something i have been looking for for some time.
Can I do:
|
[data-tiddler-type="text/vnd.tiddlywiki;flexibility=replace"].tc-tiddler-frame {
border-radius: 50%;
}
|Or do I have to do
|\define assign-css()
[data-tiddler-title="$(currentTiddler)$"].tc-tiddler-frame {
border-radius: 50%;
}
\end
<$list
filter="[all[tiddlers]type[||text/vnd.tiddlywiki;flexibility=replace]]">
<>
|
As direct CSS-Trick for Types would be great.
Ahoi Jan
Am 03.12.2018 um 15:58 schrieb Mohammad:
Wonderful BTC!
Great tool!
By the way many thanks for all your efforts specially during preparing
TW 5.1.18, specially the KeeBoord in new release.
-Mohammad
--
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 post to this group, send email to tiddlywiki@googlegroups.com
.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/34408b6e-667e-4833-a0eb-7a6cbe9db8ef%40googlegroups.com
.
For more options, visit https://groups.google.com/d/optout.
--
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 post to this group, send email to tiddlywiki@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/5C05849E.2040209%40googlemail.com.
For more options, visit https://groups.google.com/d/optout.
[tw5] Re: TW5 plugin: escapecss[] filter
Wonderful BTC! Great tool! By the way many thanks for all your efforts specially during preparing TW 5.1.18, specially the KeeBoord in new release. -Mohammad -- 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 post to this group, send email to tiddlywiki@googlegroups.com. Visit this group at https://groups.google.com/group/tiddlywiki. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/34408b6e-667e-4833-a0eb-7a6cbe9db8ef%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
