Feb 05 2007

Goon 1.0 Released Today

Tag: GoonAndrea Ercolino @ 13:23:02

Goon is a JavaScript tool for DOM-based on-demand script loading

Features

  • Independent
    Goon is a selfcontained script, no external library needed
     
  • Short
    Goon is less than 2 KB (packed)
     
  • Rigorous
    Goon guarantees that required scripts are executed before the requiring script is executed
     
  • Clean
    Goon is tree oriented. Each gooned script is a node: if it’s not required by another node, then it’s a root, and if it’s not requiring any node, then it’s a leaf. Loading goes from root to leaves, while execution goes the other way around.
     
  • Easy
    Goon’s nodes are calls to the Goon() function, nodes’ results are available as entries of the goon repository, and the last tree’s result by means of the goony shortcut
     
  • Elegant
    Goon provides a simple environment, where a node can access imported results by means of this, and export its own results by means of return
     
  • Flexible
    Goon can load the same node many times in the same tree and its behavior can be tailored by specifying how each script is required: in link mode, in exec mode, or in redo mode
     
  • Flexible
    Goon’s nodes can be used as roots for their subtrees, without any modification, simply by loading them directly from a page
     
  • Flexible
    Gooned pages can load all the needed trees, each with its own root, and they can be completely independent or grafted
     
  • Flexible
    Goon’s loading trees can be transplanted between hosts, for example from localhost to a deployment host, by changing the query string used for loading Goon itself
     

Files


Feb 04 2007

HTML Recipe: Dashed Attributes

Tag: ChiliAndrea Ercolino @ 00:54:34

Another little improvement for the HTML recipe. This time is for properly highlighting attributes whose name contains a dash, like “http-equiv”. I also touched the tag rule, so that the DOCTYPE is recognized now:

/*
===============================================================================
Chili Recipe for the XHTML language
...............................................................................

Version: 1.5b - 2007/02 - http://noteslog.com/chili/

-------------------------------------------------------------------------------
Copyright (c) 2006 Andrea Ercolino
http://www.opensource.org/licenses/mit-license.php
===============================================================================
*/

{
	steps: {
		  mlcom : { exp: /\<!--(?:.|\n)*?--\>/ }
		, tag   : { exp: /(?:\<\!?\w+)|(?:\>)|(?:\<\/\w+\>)|(?:\/\>)/ }
		, aname : { exp: /\s+[\w-]+(?=\s*=)/ }
        , avalue: { exp: /([\"\'])(?:(?:[^\1\\]*?(?:\1\1|\\.))*[^\1\\]*?)\1/ }
		, entity: { exp: /&[\w#]+?;/ }
	}
}


Feb 02 2007

HTML Recipe: Multiline Attributes

Tag: ChiliAndrea Ercolino @ 23:19:33

Some days ago I discovered that an HTML tag can have attributes whose values span multiple lines. This is very useful when the value is a piece of javascript code, which in fact is immune to white space.

The HTML recipe I bundled to Chili 1.5 is a bit wrong, though, because it doesn’t consider that possibility. This is one that does:

/*  
===============================================================================
Chili Recipe for the HTML language
...............................................................................

Version: 1.5a - 2007/02 - http://noteslog.com/chili/

-------------------------------------------------------------------------------
Copyright (c) 2006 Andrea Ercolino
http://www.opensource.org/licenses/mit-license.php
===============================================================================
*/

{
	steps: {		
		  mlcom : { exp: /\<!--(?:.|\n)*?--\>/ }
		, tag   : { exp: /(?:\<\w+)|(?:\>)|(?:\<\/\w+\>)|(?:\/\>)/ }
		, aname : { exp: /\s+\w+(?=\s*=)/ }
        , avalue: { exp: /([\"\'])(?:(?:[^\1\\]*?(?:\1\1|\\.))*[^\1\\]*?)\1/ }
		, entity: { exp: /&[\w#]+?;/ }
	}
}


Feb 01 2007

How to add a PunchCard to each WordPress post

Tag: PunchCardAndrea Ercolino @ 19:25:26

What you find in the PunchCard Manual is valid in general for any html page and blog system, but if you need a 5 minutes guide for adding a properly formatted PunchCard to each WordPress post, here it is.

  1. download PunchCard 1.2, and extract it to a local folder
  2. locate the file jquery-1.1.1.pack.js and upload it to the remote folder / wp-content / jquery /
  3. upload all the other files to the remote folder / wp-content / jquery / punchcard /
  4. edit the remote file / wp-content / themes / default / header.php, 
    locate the </head> tag, add the following code right before it, and then close and save the file:
    <script type="text/javascript" 
    	src="<?php bloginfo('siteurl'); ?>/wp-content/jquery/jquery-1.1.1.pack.js">
    	</script>
    
    <script type="text/javascript" 
    	src="<?php bloginfo('siteurl'); ?>/wp-content/jquery/punchcard/punchcard-1.2.pack.js">
    	</script>
    
    <script type="text/javascript">
    PunchCard.icons = "/aercolino/punchcard/icons/";
    PunchCard.styles = "<?php bloginfo('siteurl'); ?>/wp-content/jquery/punchcard/";
    </script>
  5. edit the remote file / wp-content / themes / default / index.php, 
    locate the <p class="postmetadata"> tag, add the following code right before it, and then close and save the file:
    <?php 
    ob_start();
    the_title();
    $title = ob_get_contents();
    ob_clean();
    the_permalink();
    $permalink = ob_get_contents();
    ob_end_clean();
    ?>
    
    <div style="text-align:center;" class="pc_MINI"><div class="punchcard">
    	<object>
    	<param name="punchcard" value='{
    		title: "<?php echo $title; ?>"
    		, url: "<?php echo $permalink; ?>"
    		, id : "<?php $pieces = explode( "?", $permalink ); echo $pieces[1]; ?>"
    	}'/>
    	</object>
    </div></div>

That’s all.

  • you can repeat step 5. for the file / wp-content / themes / default / single.php
  • if you are not using the default theme, remember to appropriately change the path to the theme folder in the previous steps

Following this fast guide you’ll get a PunchCard at the bottom of each post, like mine. Each PunchCard will reference your post (title and URL).

Feel free to play with the PunchCard stylesheet and setup for customizing your punchcards.


Feb 01 2007

More recipes for Chili 1.5

Tag: ChiliAndrea Ercolino @ 17:48:32

I’ve found that dp.SyntaxHighlighter is similar to Chili, in that it uses language descriptions based on JavaScript regular expressions, so it’s quite easy to convert them to Chili recipes. Here are the first 5 conversions (more to come): Java, C++, C#, CSS, and Delphi.


« Previous Page