[aida] Twitter Bootstrap

Janko Mivšek janko.mivsek at eranova.si
Tue Oct 23 14:18:35 CEST 2012

Dne 19. 10. 2012 14:57, piše Geert Claes:

> I noticed that there are a number of libraries in WebMethodLibrary and was
> wondering if someone could explain in simple terms how the WebMethodLibrary
> and WebMethodLibImporter works?  

Let we look at class side of BootstrapLibrary for instance:

- every original resource is saved in separate method in 'resources'
category. Directory path and file extension is 'encoded' in method name,
like method #cssBootstrapMinCss for css/bootstrap.min.css

- mapping between urls/file paths and methods is in method
#urlToMethodMap, which looks like:

 ^MapCache := Dictionary new
   at: '/css/bootstrap.min.css'
   put: #(cssBootstrapMinCss 'text/css');

MIME content type is also added in that map. Text resources are saved in
methods as text (UTF8 also supported!), while binarires like images are
saved as literal byte array.

Note also method #baseUrl, where base or root part of library's URL is
saved, like '/bootstrap' for Twitter Bootstrap library. This one is
important to know and set up correctly to separate different libraries
among them. Together we get a complete URL for above resource:


> Like, how do you upgrade Bootstrap, how do
> you add a Foundation library, how do you add another library like HighCharts
> etc and of course how do you use them for a simple web app?

To upgrade some existing library you go to its class comment when you'll
find a script of last upgrade. For Bootstrap:

WebMethodLibImporter default
 baseUrl: '/bootstrap';
 library: 'BootstrapLibrary';
 package: 'Aida-Libraries';
                                   "v2.1.0, imported aug12"

As you can see you can import/upgrade directly from the internet and
from .zip files.

Class WebMethodLibImporter is there to care about all importing and
upgrading tasks. So far finished only on Visualworks, help here to make
it workable on Squeak/Pharo is welcomed!

So, to prepare and import HighCharts, create HighChartsLibrary as
subclass of WebMethodLibrary and prepare proper import/upgrade script in
class comment. Then just evaluate it and library will be filled with
proper resource methods and a map.

To ensure proper link in page header you also need to provide an #ensure
method, which is then called from your app code before using the library:

      BootstrapLibrary ensure.
      e class: #'table-such-and-such' "Bootstrap CSS class"

This is how Bootstrap #ensure method currently looks like:

   BootstrapLibrary class>>ensure

     "ensure Bootstrap resources in page header"
     "Just CSS for now!"
     | page |
     page := self context page.
     self ensure: '/bootstrap/css/bootstrap.css' onPage: page.

All this is explained also on:


Hope this helps a bit!

Janko Mivšek
Svetovalec za informatiko
Eranova d.o.o.
Ljubljana, Slovenija
tel:  01 514 22 55
faks: 01 514 22 56
gsm: 031 674 565

More information about the Aida mailing list