[ZPT] Stylesheet Language

[Casey Duncan]

On Friday 10 May 2002 01:39 pm, Evan Simpson allegedly wrote:
> Thanks to Casey Duncan, I'm now thinking hard about an extension to ZPT=
=20
> that I'm tentatively calling Template Style Sheet Language (pronounced=20
> "Tassle").  Much like CSS, this would allow you to write the equivalent=
=20
> of TAL statements out-of-line, and apply them based on tag selectors.

8^) I like the name. I'm glad this piqued your interest, I doubt I will h=
ave=20
much time to spend on it for a while.
=20
> Stylesheet sytax is much more forgiving than attribute syntax, so some=20
> of the more awkward aspects of TAL could be abandoned.  For instance, w=
e=20
> can use "=3D" instead of "define", and we can have multiple instances o=
f=20
> the same kind of statement applied in whatever order we specify.  Strin=
g=20
> expressions could simply be quoted strings, and explicit expression=20
> types could become pseudo-functions such as "python(<expr>)". A major=20
> advantage would be the ability to attach generic code to tags based on=20
> pattern matching.  This also eliminates the need to add new tags in=20
> order to control scope and order of operations.

A nice capability this lends you is the ability to affect structure by ta=
g or=20
tag structure alone. For instance, you could strip all font tags (or chan=
ge=20
them to spans), replace all image tags based on their src values, etc.
=20
> Here's a complex example with made-up syntax:
>=20
> <style type=3D"text/tssl">
>    @begin { base =3D template/portal_url; }
>    .item-list {
>      items =3D path-string(attrs/items);
>      @if not(items) replace: structure "<b>No items</b>";
>    }
>    .item-list > * {
>        repeat: item items;
>        i =3D repeat/item/number;
>        [name] =3D "item-$1";

So, [name] means: set the tag attribute "name" right? What is $1? did you=
 mean=20
$i?

>    }
>    img.portal { [src] =3D "$base/${attrs/src}"; }
>    form.auto {
>      recname =3D attrs/name;
>      recpath =3D "$recname | options/$recname | nothing";
>      rec =3D path_string(recpath);
>    }
>    form.auto input, select, textarea {
>      name =3D attrs/name;
>      [name] =3D "$recname.$name:record";
>      value =3D path_string("rec/$name | nothing");
>    }
>    form.auto input[type=3Dtext] {
>      [value] =3D value;
>    }
>    form.auto textarea {
>      content: value;
>    }
>    form.auto option {
>      optvalue =3D attrs/value;
>      [selected] =3D python(value =3D=3D optvalue);
>    }
> </style>

I really like your ideas above. After a couple of reads it was pretty eas=
y to=20
grok based on exisitng TAL idioms.
=20
[snip html]

> The interaction between TAL and TSSL could be controlled by having all=20
> TSSL statements for a tag execute before TAL on the tag, but providing =
a=20
>   "@tal;" statement, so that the following:
>=20
> <style type=3D"text/tssl">
> * { x =3D "1"; @tal; y =3D "$z 3"; [z] =3D z; }
> * { y =3D "2"; @tal; content: y; }
> </style>

interesting.

> For documents, such as XML with a DTD, in which an inline <style> would=
=20
> not work, we could (ab)use the standard:
>=20
> <?xml-stylesheet path=3D"here/autoform" type=3D"text/tssl"?>

I was thinking along these lines. It should be possilbe to use linked sty=
le=20
sheets with html templates as well. I can see having a global style sheet=
=20
containing things useful site-wide, a more local style sheet, useful for =
a=20
given functional area. And then an inline style sheet used only by a sing=
le=20
template.

They would cascade just like CSS does, so that local rules could augment =
or=20
replace more global ones.

I'm pretty excited about this as a general concept. I think it really cou=
ld=20
transcend traditional notions about templating. Thanks for running with i=
t.

-Casey