Paul Duguid, adjunct professor in the School of Information at the University of California, Berkeley, has a look at the problematic nature of Google Books‘ presentation of books, using the example of Lawrence Sterne’s Trstram Shandy.

Interestingly, I notice that there is now a New Zealand variant of Google Books.

Although TinyMCE allows you to specify custom styles (using the “theme_advanced_styles”parameter), it doesn’t exppose any easy way of specifying custom block-level formats.

This is most probably because the assumption is that people shouldn’t muck around with creating block-level tags beyond those normally present in HTML: “p,div,h1,h2,h3,h4,h5,h6,pre,address,blockquote,dt,dl,dd,samp”

However, in my case, I wanted to use an existing block-level element (“p”) div, but with the ability to simultaneously apply a css class to the element.

After a bit of poking around I discovered the way to do this:

  •  In the theme, define the menu names as desirable for the user to see (in “tinymce\jscripts\tiny_mce\themes\advanced\langs\en.js” in my case):
theme_author : 'Authors',
theme_ref : 'Ref',
theme_genre : 'Genre',
theme_citatio : 'Citatio',
theme_anot : 'Anot',
  • In the theme template, add some extra entries to the lookup table in getControlHTML (in “tiny_mce\themes\advanced\editor_template_src.js” in my case) with two parts: a prefix indicating the block-level element; and a suffix indicating the css style desired:
['p.author', '{$lang_theme_author}'],
['p.ref', '{$lang_theme_ref}'],
['p.genre', '{$lang_theme_genre}'],
['p.citatio', '{$lang_theme_citatio}'],
['p.anot', '{$lang_theme_anot}']
  • Now the biggy – amend the execCommand function to cope with these dotted names (in “tinymce\jscripts\tiny_mce\tiny_mce_src.js”).

    I chose to edit the source javascript as  it’s much easy to follow what’s going on. This means of course amending your HTML to refer to this tiny_mce_src.js, rather than to tiny_mce.js.

    After all this is finished I guess for completeness sake (and to save a bit of download time) I should apply the changes to the non-source (tiny_mce.js and editor_template.js).

    This means that the case block for FormatBlock should appear as follows (I’ve highlighted the new bits):

            case "FormatBlock":
                if (value == null || value == '') {
                    var elm = tinyMCE.getParentElement(this.getFocusElement(), "p,div,h1,h2,h3,h4,h5,h6,pre,address,blockquote,dt,dl,dd,samp");
                    if (elm)
                        this.execCommand("mceRemoveNode", false, elm);
                } else {
                    var classValue;

                    if (value.indexOf("p.") != -1 || value.indexOf("span.") != -1) {
                        value = value.replace(/[^a-z\.]/gi, '');
                        classValue = value.substring(value.indexOf(".") + 1);
                        value = value.substring(0,value.indexOf("."));

                        if (!this.cleanup.isValid(value))
                            return true;

                    } else {
                        if (!this.cleanup.isValid(value))
                            return true;
                    }
                    if (tinyMCE.isGecko && new RegExp('<(div|blockquote|code|dt|dd|dl|samp)>', 'gi').test(value)) {
                        value = value.replace(/[^a-z]/gi, '');
                    }
                    if (tinyMCE.isIE && new RegExp('blockquote|code|samp', 'gi').test(value)) {
                        var b = this.selection.getBookmark();
                        this.getDoc().execCommand("FormatBlock", false, '<p>');
                        tinyMCE.renameElement(tinyMCE.getParentBlockElement(this.getFocusElement()), value);
                        this.selection.moveToBookmark(b);
                    } else {
                        this.getDoc().execCommand("FormatBlock", false, value);
                        if (classValue)
                            this.execCommand("mceSetCSSClass", false, classValue);

                    }
                }
                tinyMCE.triggerNodeChange();
                break;
  • This allows the class prefixes to be stripped off, and employed. “classValue is a new variable that I’ve introduced for this purpose. Once the above has been done, these new formats should appear in the format menu, and (once you’ve added some CSS in the css for the application like that below, (example_bibliography_editor.css in my case) they should appear nicely in the editor:
p.author {
    font-size: large;
    background-color: #005555;
}

			

Googling with Gears

August 18, 2007

Just been having a quick look at Google Gears, a very nice piece of software that will let you use web-based applications when not connected to the Internet.

My initial enthusiasm was fired by wondering if they were getting around to Gears-enabling Gmail and Google Docs, two applications that would be very nice to have access to when I’m up at Koitiata without an Internet connection.

After having a bit of a scout around, I’ve discovered a few interesting things about Google Gears:

  • It makes use of Sqlite databases to store information locally
  • It makes use of JSON for communicating datatypes

After installing Gears and installing a couple of sample apps on my local Apache webserver, I discovered that in Firefox Google Gears is stored at:

C:\\Documents and Settings\\Owner\\Local Settings\\Application Data\\Mozilla\\Firefox\\
Profiles\\t6djva97.default\\Google Gears for Firefox

The details of each URI are stored relative to this path; for example, installing the Google Gears Database Demo (by dropping it into the Apache htdocs/gears/hello_world_database folder) and running it (http://localhost/gears/hello_world_database/), a sqlite database database-demo#database is created at localhost\http_80.

This database can be interrogated as any other Sqlite database:

> sqlite3 database-demo#database
SQLite version 3.4.1
Enter ".help" for instructions
sqlite> select * from sqlite_master;
table|Demo|Demo|3|CREATE TABLE Demo (Phrase varchar(255), Timestamp int) 
sqlite> select * from Demo;
Jason|1187427561593
Charles|1187427567562
Monkey|1187427570765

There’s a very nice flash-based Google Gears sql admin application which provides a nice way of administering the Google Gears databases (which I’ve downloaded and installed locally at http://localhost/gears/gearsadmin/sqladmin.html).

I’ve just spent a good chunk of the last two days getting up to speed with the Javascript Prototype Library and JSON.

Javascript’s a great language and essential in these web 2.0 times, and mercifully someone’s put together a library which extends (and rationalises) javascript in a number of directions, including:

  • AJAX
  • enumeration
  • object-orientation
  • page geometry
  • DOM addressibility

There’s also some very handy tutorials and guides:

The downside of the Javascript Prototype Library? Not much, apart from an investment of time to get to know it (though much of it seems quite intuitive, and will save time in future) and the size of the library (a 91KB file which’ll get downloaded with any web page that references it).

The reason I put the time into to learn these tools? To be able to complete a programming task which involved creating and populating a widget from an XML feed using a supplied search string:

Feijoas and newspapers

August 6, 2007

Having a bit of a lazy day today, stopping at some plant nurseries to pick up some feijoa trees on the way up to Koitiata, and then reading the Dom-Post and the Listener in front of the fire.

I thought I had trawled through all the nurseries and garden centres a couple of weekends back when I was on the great fruit tree buy-up (and subsequent plant-out), but I had missed Kapiti Plants, who are a reasonably-sized and reasonably new plant nursery in Te Horo.

They originally had intentions to be a feijoa orchard, but after buying up a whole heap of feijoa trees, decided instead to become a plant nursery. As a result, they’ve still got a few feijoa seedlings, of which I grabbed a couple of varieties: Triumph (apparently produces late season fruit, which store well) and Apollo (mid-season, and large but delicate fruit).

I also managed to pick up a couple of Wiki Tu feijoa trees from another nursery, so between the three (both Apollo and Wiki Tu are self-fertile, but apparently fruit better when cross-pollinated), I should hopefully stand a chance of developing a fruit-bearing hedge in two or three years time.

One thing I did learn during my feijoa investigations is that there is a readily available variety, feijoa sellowiana, (which I think is actually the original variety) that is good for hedging and is reasonably-priced (I saw them available for $6 per tree, as opposed to $16 per tree as I paid this afternoon), but doesn’t produce significant fruit.

One apparent use for the fruit is as an exfoliant — if I even get sick of eating them, I could always whip up a batch of beauty products!

Here’s a picture taken of the bach taken from the backyard, really just to check that this offline blogging software I’m using (Windows Live Writer) is able to handle uploading images to WordPress (and because it’s also nice to look at pictures of summer).

Well, I’ve spent a fair chunk of the evening trying to find some suitable solution for doing offline editing of blog posts, which can then be uploaded when I get back to an Internet connection.

In the end it came down to these:

  • BlogDesk
  • Windows Live Writer

BlogDesk can’t publish to Blogger (though apparently will be able to in future), while Windows Live Writer is still in beta and appears to be a bit buggy from the look of the comments that have been posted on various forums.

I’m not quite sure which blog I’m going to continue with, as there’s a choice of two:

  1. www.twoducks.blogspot.com
  2. www.twoducks.wordpress.com

… for what appears to be a wet weekend. Intentions:

* Plant some feijoa trees

* Make a start on a 2000 word assignment for my English class

* Do a bit of reading