FileLibrary and pragma challenge

0 views
Skip to first unread message

Ernest M

unread,
Oct 10, 2009, 4:33:31 AM10/10/09
to WebVelocity
For my application, I created a new FileLibrary as described in
"Working with File Libraries" in the documentation.

Looking at the created class, you see a few methods: dynamicCss,
dynamicJs and selectorsToInclude.
Since their usage was not documented, I spend some time to figure out
how to use them.

It turns out that his allows for dynamic composition of CSS and
Javascript files which is very nice because then you can organize the
FileLibrary with per-component css definitions without worrying about
serving many little files to the browser. After exporting this
library, there will be one file (dynamicCss) containing all css
definitions and likewise one Javascript file.

So I planned to create methods with css definitions such as
studentViewCss, questionViewCss etc.
But to make all this work, clearly I must include a pragma in each
method.
Unfortunately, there was no example in the image or documentation so I
had to debug the aggregation handling to find out that it could not
work at all without an extra class method in which the pragmas were
defined.

To use the dynamic merging of css and javascript files in a
FileLibrary:

1. Add a pragmas definition method to the class side:

MyFileLibrary class>>pragmas

<pragmas: #instance>
^#( css javascript )

2. For each css or javascript snippet, create a method such as:

MyFileLibrary>>studentViewCss

<css>
^'.student { color: #00FF00; }'

I think the pragmas method could have been inherited from
WAFileLibrary so I guess this might be a enhancement/fix to
WebVelocity 1.0. Furthermore, the documentation should include a
section about how to write css and javascript methods using this
scheme.

Final suggestion is to change the aggregatePragmas: implementation
such that it writes out a comment line for each snippet that states
where it came from: /* MyFileLibrary>>studentView */

^ Ernest

Michael Lucas-Smith

unread,
Oct 10, 2009, 12:28:41 PM10/10/09
to webve...@googlegroups.com

Those are good ideas.

You can also write javascript and CSS directly, as if they were
smalltalk code, eg:

.student {
color: #00FF00;
}

This will be installed as a method called '.student' that gets
aggregated in to dynamicCss. The same goes for the Javascript. The
method will have a pragma on it called 'css'.

Cheers,
Michael

Ernest Micklei

unread,
Oct 10, 2009, 3:15:33 PM10/10/09
to WebVelocity
I had seen this kind of compilation in the Mootools package but did
not realize it could be applied to FileLibraries too.


One other addition to my FileLibrary that I needed for exporting is:

isFileSelector: aSymbol
"Override from super because only the dynamic versions need to be
exported to files"

^#( dynamicJs dynamicCss) includes: aSymbol

^ Ernest
Reply all
Reply to author
Forward
0 new messages