start presentation for FOSDEM

examples/presentation/fosdem2012/lib/booklet/jquery.booklet.1.2.0.css

@@ -0,0 +1,100 @@
+/* @Booklet
+----------------------------------------*/
+	.booklet           {width:800px; height:600px; position:relative; /*background:#fff;*/ margin:0 auto 10px; overflow:visible !important;}
+	.booklet .b-page  {left:0; top:0; position:absolute; overflow:hidden; padding:0;}
+	
+	.booklet .b-pN  {}
+	.booklet .b-p0  {}
+	.booklet .b-p1  {}
+	.booklet .b-p2  {}    
+	.booklet .b-p3  {}
+	.booklet .b-p4  {}
+	
+	.booklet .b-load  {}
+   
+   	/* Page Wrappers */
+	.booklet .b-wrap       {top:0; position:absolute;}
+	.booklet .b-wrap-left  {background:#fff;}
+	.booklet .b-wrap-right {background:#efefef;}
+	
+	.booklet .b-pN .b-wrap,
+	.booklet .b-p1 .b-wrap,
+	.booklet .b-p2 .b-wrap,
+	.booklet .b-p3 .b-wrap,
+	.booklet .b-p4 .b-wrap  {left:0;}
+	.booklet .b-p0 .b-wrap  {right:0;}
+	
+   	/* Custom Page Types */
+	.booklet .b-page-blank  {padding:0; width:100%; height:100%;}
+	.booklet .b-page-cover  {padding:0; width:100%; height:100%; background:#925C0E;}
+	.booklet .b-page-cover h3  {color:#fff; text-shadow:0px 1px 3px #222;}
+   
+   	/* Page Numbers */
+	.booklet .b-counter {bottom:10px; position:absolute; display:block; width:25px; height:20px; background:#ccc; color:#444; text-align:center; font-family:Georgia, "Times New Roman", Times, serif; font-size:10px; padding:5px 0 0;}
+	.booklet .b-wrap-left  .b-counter  {left:10px;}
+	.booklet .b-wrap-right .b-counter {right:10px;}
+   
+   	/* Page Shadows */
+	.booklet .b-shadow-f  {right:0; top:0; position:absolute; opacity:0; background-image:url("images/shadow-top-forward.png"); background-repeat:repeat-y; background-position:100% 0;}
+	.booklet .b-shadow-b  {left:0;  top:0; position:absolute; opacity:0; background-image:url("images/shadow-top-back.png");    background-repeat:repeat-y; background-position:0 0;}
+	
+	.booklet .b-p0 {background-image:url("images/shadow.png"); background-repeat:repeat-y; background-position:100% 10px;}
+	.booklet .b-p3 {background-image:url("images/shadow.png"); background-repeat:repeat-y; background-position:0 10px;}
+	
+   	/* Overlay Controls */
+	.booklet .b-grab     {cursor: url(images/openhand.cur), default;}
+	.booklet .b-grabbing {cursor: url(images/closedhand.cur), default;}
+	
+   	/* Overlay Controls */
+	.booklet .b-overlay      {top:0; position:absolute; height:100%; width:50%;}
+	.booklet .b-overlay-prev {left:0;}
+	.booklet .b-overlay-next {right:0;}
+	
+   	/* Tab Controls */
+	.booklet .b-tab        {background:#000; height:40px; width:100%; padding:10px 0 0; text-align:center; color:#ccc; position:absolute; font-size:11px;}
+	.booklet .b-tab-prev   {left:0;}
+	.booklet .b-tab-next   {right:0;}
+	.booklet .b-tab:hover  {background:#aaa; color:#000;}	
+	
+   	/* Arrow Controls */
+	.booklet .b-arrow          {display:block; position:absolute; text-indent:-9999px; top:0; height:100%; width:74px;}
+	.booklet .b-arrow div      {display:none; text-indent:-9999px; height:170px; width:74px; position:absolute; left:0; top:25%;}
+	.booklet .b-arrow-next     {right:-80px;}
+	.booklet .b-arrow-prev     {left:-80px;}
+	.booklet .b-arrow-next div {background:url("images/arrow-next.png") no-repeat left top;}
+	.booklet .b-arrow-prev div {background:url("images/arrow-prev.png") no-repeat left top;}
+		
+/* @z-index fix (needed for older IE browsers)
+----------------------------------------*/
+	body              {z-index:0;}
+    .b-menu           {z-index:100;}
+    .b-selector       {z-index:100;}
+	.booklet          {z-index:10;}
+    .b-pN             {z-index:10;}
+    .b-p0             {z-index:10;}
+    .b-p1             {z-index:10;}
+    .b-p2             {z-index:10;}
+    .b-p3             {z-index:10;}
+    .b-p4             {z-index:10;}
+    .b-prev           {z-index:40;}
+    .b-next           {z-index:40;}
+    .b-counter        {z-index:40;}
+	
+/* @Menu Items
+----------------------------------------*/
+	.b-menu {height:40px; padding:0 0 10px;}
+	
+	.b-selector             {height:40px; position:relative; float:right; border:none; color:#cecece; cursor:pointer;}
+	.b-selector .b-current  {padding:8px 15px 12px; line-height:20px; min-width:18px; height:20px; display:block; background:#000; text-align:center;}
+	.b-selector-page        {width:auto; margin-left:15px;}
+	.b-selector-chapter     {width:auto;}
+	
+	.b-selector:hover            {color:#fff; background-position:left 0px;}
+	.b-selector:hover .b-current {background-position:right 0px;}
+	.b-selector ul               {overflow:hidden; margin:0; list-style:none !important; position:absolute; top:40px; right:0; padding:0 0 10px; background:#000; width:240px; font:normal 12px "Myriad Pro", Myriad, "DejaVu Sans Condensed","Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;}
+	.b-selector li               {border:none;}
+	.b-selector a                {color:#cecece; height:14px; text-decoration:none; display:block; padding:5px 10px;}
+	.b-selector a .b-text        {float:left; clear:none;}
+	.b-selector a .b-num         {float:right; clear:none;}
+	.b-selector a:hover          {color:#fff;}
+		

examples/presentation/fosdem2012/lib/booklet/jquery.booklet.1.2.0.js

@@ -0,0 +1,1232 @@
+/*
+ * jQuery Booklet Plugin
+ * Copyright (c) 2010 W. Grauvogel (http://builtbywill.com/)
+ *
+ * Dual licensed under the MIT (http://www.opensource.org/licenses/mit-license.php)
+ * and GPL (http://www.opensource.org/licenses/gpl-license.php) licenses.
+ *
+ * Version : 1.2.0
+ *
+ * Originally based on the work of:
+ *	1) Charles Mangin (http://clickheredammit.com/pageflip/)
+ */
+;(function($) {
+		   
+$.fn.booklet = function(options){
+	
+	var o = $.extend({}, $.fn.booklet.defaults, options);
+	
+	return $(this).each(function()
+	{
+		var command, config, obj, id, i, target;
+		
+		//option type string - api call
+		if(typeof options == 'string')
+		{
+			//check if booklet has been initialized
+			 if($(this).data('booklet')){
+				command = options.toLowerCase();
+				obj = $.fn.booklet.interfaces[$(this).data('id')];
+				
+				if(command == 'next'){ obj.next() }
+				else if(command == 'prev'){ obj.prev() }
+				
+			 }
+		}
+		//option type number - api call		
+		else if(typeof options == 'number')
+		{
+			//check if booklet has been initialized
+			 if($(this).data('booklet')){
+				target = options;
+				obj = $.fn.booklet.interfaces[$(this).data('id')];
+				
+				if(target % 2 != 0) {
+					target-= 1;
+				}
+				
+				obj.gotoPage(target);
+			 }
+			 
+		}
+		//else build new booklet
+		else
+		{
+			config = $.extend(true, {}, o);
+	
+			// Determine ID (Reuse array slots if possible)
+			id = $.fn.booklet.interfaces.length;
+			for(i = 0; i < id; i++)
+			{
+			   if(typeof $.fn.booklet.interfaces[i] == 'undefined'){ id = i; break; }
+			}
+	
+			// Instantiate the booklet
+			obj = new booklet($(this), config, id);
+	
+			// Add API references
+			$.fn.booklet.interfaces[id] = obj;
+		}
+	});
+}
+
+
+function booklet(target, options, id){
+
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+//VARS + STRUCTURE
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
+	var self, opts, b, src,
+		hash, i, j, p, diff, busy, init, rhover, lhover, h, a, playing,
+		titles = new Array(), chapters = new Array(),
+		pN, p0, p1, p2, p3, p4, pNwrap, p0wrap, p1wrap, p2wrap, p3wrap, p4wrap, wraps, sF, sB,
+		p3drag, p0drag, temp, relativeX,
+		overlaysB, overlayN, overlayP, tabs, tabN, tabP, arrows, arrowN, arrowP, next, prev, ctrlsN, ctrlsP,
+		menu, chapter, dd, ddUL, ddH, ddLI, ddA, ddT, ddC, ddCUL, ddCH, ddCLI, ddCA, ddCT,
+		empty = '<div class="b-page-empty" title="" rel=""></div>', blank = '<div class="b-page-blank" title="" rel=""></div>'
+	;
+		
+	busy         = false;
+	playing      = false;
+	init         = false;
+	rhover = lhover = false;
+	self         = this;
+	self.options = options;
+	self.id      = id;
+	self.hash    = '';	
+	opts         = self.options;
+	b            = target.addClass('booklet');
+	src          = b.children('.b-load');
+	
+	//save page titles and chapter names, add page numbers
+	initPages();
+	
+	//store data for api calls
+	b.data('booklet',true);
+	b.data('id', id);
+	b.data('total', src.children().length);
+	
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+// SETUP OPTIONS
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
+	//set width + height
+	if(!opts.width){
+		opts.width = b.width();
+	}else if(typeof opts.width == 'string' && opts.width.indexOf("%") != -1){
+		opts.wPercent = true;
+		opts.wOrig = opts.width;
+		opts.width  = (opts.width.replace('%','')/100) * parseFloat(b.parent().css('width'));
+	}
+	if(!opts.height){
+		opts.height = b.height();
+	}else if(typeof opts.height == 'string' && opts.height.indexOf("%") != -1){
+		opts.hPercent = true;
+		opts.hOrig = opts.height;
+		opts.height  = (opts.height.replace('%','')/100) * parseFloat(b.parent().css('height'));
+	}
+	b.width(opts.width);
+	b.height(opts.height);
+	
+	//save page sizes and other vars
+	opts.pWidth  = opts.width/2;
+	opts.pWidthN = '-'+(opts.pWidth)+'px';
+	opts.pWidthH = opts.pWidth/2;
+	opts.pHeight = opts.height;
+
+	opts.pTotal  = src.children().length;
+	opts.speedH  = opts.speed/2;
+	
+	//set startingPage
+	if(opts.direction == 'LTR'){
+		opts.curr = 0;
+	}else if(opts.direction == 'RTL'){
+		opts.curr = opts.pTotal-2;
+	}
+	if(!isNaN(opts.startingPage) && opts.startingPage <= opts.pTotal && opts.startingPage > 0){
+		if((opts.startingPage % 2) != 0){opts.startingPage--};
+		opts.curr = opts.startingPage;
+	}
+	
+	//set position
+	if(opts.closed && opts.autoCenter){
+		if(opts.curr == 0){
+			b.width(opts.pWidth);
+		}else if(opts.curr >= opts.pTotal-2){
+			b.width(opts.pWidth);
+		}
+	}
+	
+	//set booklet opts.name
+	if(opts.name){
+		document.title = opts.name;
+	}else{
+		opts.name = document.title;
+	}
+	
+	//save shadow widths for anim
+	if(opts.shadows){
+		opts.shadowTopFwdWidth  = '-'+opts.shadowTopFwdWidth+'px';
+		opts.shadowTopBackWidth = '-'+opts.shadowTopBackWidth+'px';
+	}
+	
+	//setup menu
+	if(opts.menu){
+		menu = $(opts.menu).addClass('b-menu');
+		p = opts.curr;		
+		//setup page selctor
+		if(opts.pageSelector){
+			//add selector
+			dd = $('<div class="b-selector b-selector-page"><span class="b-current">'+ (p+1) +' - '+ (p+2) +'</span></div>').appendTo(menu);
+			ddUL = $('<ul></ul>').appendTo(dd).empty().css('height','auto');
+
+			//loop through all pages
+			for(i=0; i < opts.pTotal; i+=2){
+				j = i;
+				//nums for normal view
+				nums = (j+1) +'-'+ (j+2);
+				if(opts.closed){
+					//nums for closed book
+					j--;
+					if(i==0){nums='1'}
+					else if(i==opts.pTotal-2){nums=opts.pTotal-2}
+					else {nums = (j+1) +'-'+ (j+2);}
+					//nums for closed book with covers
+					if(opts.covers){
+						j--;
+						if(i==0){nums=''}
+						else if(i==opts.pTotal-2){nums=''}
+						else {nums = (j+1) +'-'+ (j+2);}
+					}
+				}
+				//nums for RTL direction
+				if(opts.direction == 'RTL'){
+					nums = (Math.abs(j - opts.pTotal)-1) +' - '+ ((Math.abs(j - opts.pTotal)));
+					if(opts.closed){
+						if(i==opts.pTotal-2){nums='1'}
+						else if(i==0){nums=opts.pTotal-2}
+						else{nums = (Math.abs(j - opts.pTotal)-3) +' - '+ ((Math.abs(j - opts.pTotal)-2));}
+						
+						if(opts.covers){
+							if(i==opts.pTotal-2){nums=''}
+							else if(i==0){nums=''}
+							else{nums = (Math.abs(j - opts.pTotal)-5) +' - '+ ((Math.abs(j - opts.pTotal)-4));}
+						}
+					}
+					dd.find('.b-current').text(nums);
+					ddLI = $('<li><a href="#/page/'+ (i+1) +'" id="selector-page-'+i+'"><span class="b-text">'+ titles[i+1] +'</span><span class="b-num">'+ nums +'</span></a></li>').prependTo(ddUL);
+				}else{
+					if(i==0){dd.find('.b-current').text(nums);}
+					ddLI = $('<li><a href="#/page/'+ (i+1) +'" id="selector-page-'+i+'"><span class="b-text">'+ titles[i] +'</span><span class="b-num">'+ nums +'</span></a></li>').appendTo(ddUL);
+				}
+				
+				ddA = ddLI.find('a');
+				if(!opts.hash){
+					ddA.click(function(){
+						if(opts.direction == 'RTL'){dd.find('.b-current').text($(this).find('.b-num').text());}
+						ddT = parseInt($(this).attr('id').replace('selector-page-',''));
+						self.gotoPage(ddT);
+						return false;
+					});
+				}
+			}
+			
+			//set height
+			ddH = ddUL.height();
+			ddUL.css({'height':0, 'padding-bottom':0});
+			
+			//add hover effects
+			dd.unbind('hover').hover(function(){
+				ddUL.stop().animate({height:ddH, paddingBottom:10}, 500);
+			},function(){
+				ddUL.stop().animate({height:0, paddingBottom:0}, 500);
+			});
+		}
+		
+		//setup chapter selctor
+		if(opts.chapterSelector){
+			
+			chapter = chapters[opts.curr];
+			if(chapter == ""){ chapter = chapters[opts.curr+1]; }
+			
+			ddC = $('<div class="b-selector b-selector-chapter"><span class="b-current">'+chapter+'</span></div>').appendTo(menu);
+			ddCUL = $('<ul></ul>').appendTo(ddC).empty().css('height','auto');
+
+			for(i=0; i < opts.pTotal; i+=1){
+				if(chapters[i] != "" && typeof chapters[i] != "undefined"){
+					if(opts.direction == 'RTL'){
+						j = i;
+						if(j % 2 != 0){j--;}
+						ddC.find('.b-current').text(chapters[i]);
+						ddCLI = $('<li><a href="#/page/'+ (j+1) +'" id="selector-page-'+(j)+'"><span class="b-text">'+ chapters[i] +'</span></a></li>').prependTo(ddCUL);
+					}else{
+						ddCLI = $('<li><a href="#/page/'+ (i+1) +'" id="selector-page-'+i+'"><span class="b-text">'+ chapters[i] +'</span></a></li>').appendTo(ddCUL);
+					}
+					ddCA = ddCLI.find('a');
+					if(!opts.hash){
+						ddCA.click(function(){
+							if(opts.direction == 'RTL'){ddC.find('.b-current').text($(this).find('.b-text').text());}
+							ddCT = parseInt($(this).attr('id').replace('selector-page-',''));
+							self.gotoPage(ddCT);
+							return false;
+						});
+					}
+				}
+			}
+			
+			ddCH = ddCUL.height();
+			ddCUL.css({'height':0, 'padding-bottom':0});
+			
+			ddC.unbind('hover').hover(function(){
+				ddCUL.stop().animate({height:ddCH, paddingBottom:10}, 500);
+			},function(){
+				ddCUL.stop().animate({height:0, paddingBottom:0}, 500);
+			});
+		}
+	}	
+
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+// API METHODS
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
+	$.extend(self,
+	{
+		next : function(){
+			if(!busy){
+				self.gotoPage(opts.curr+2);
+			}
+		},
+		prev : function(){
+			if(!busy){
+				self.gotoPage(opts.curr-2);
+			}
+		},
+		gotoPage : function(num){
+			//moving forward (increasing number)
+			if(num > opts.curr && num < opts.pTotal && num >= 0 && !busy){
+				busy = true;
+				diff = num - opts.curr;
+				opts.curr = num;
+				opts.before.call(self, opts);
+				updatePager();
+				updateCtrls();
+				updateHash(opts.curr+1, opts);
+				initAnim(diff, true, sF);
+				
+				//hide p2 as p3 moves across it
+				if(opts.closed && opts.autoCenter && num-diff == 0){
+					p2.stop().animate({width:0, left:opts.pWidth}, opts.speed, opts.easing);
+					p4.stop().animate({left:opts.pWidth}, opts.speed, opts.easing);
+				}else{
+					p2.stop().animate({width:0}, opts.speedH, opts.easeIn);
+				}
+				
+				//animate p3 from right to left (left: movement, width: reveal slide, paddingLeft: shadow underneath)
+				//call setuppages at end of animation to reset pages
+				
+				//animation if dragging forward
+				if(p3drag){
+					p3.stop().animate({left:opts.pWidth/4, width:opts.pWidth*.75, paddingLeft: opts.shadowBtmWidth}, opts.speedH, opts.easeIn)
+					         .animate({left:0, width:opts.pWidth, paddingLeft:0}, opts.speedH);
+				}else{
+					p3.stop().animate({left:opts.pWidthH, width:opts.pWidthH, paddingLeft: opts.shadowBtmWidth}, opts.speedH, opts.easeIn)
+					         .animate({left:0, width:opts.pWidth, paddingLeft:0}, opts.speedH);			
+				}
+				p3wrap.animate({left:opts.shadowBtmWidth}, opts.speedH, opts.easeIn)
+					  .animate({left:0}, opts.speedH, opts.easeOut, function(){updateAfter()});				
+			
+			//moving backward (decreasing number)
+			}else if(num < opts.curr && num < opts.pTotal && num >= 0 && !busy){
+				busy = true;
+				diff = opts.curr - num;
+				opts.curr = num;
+				opts.before.call(self, opts);
+				updatePager();
+				updateCtrls();
+				updateHash(opts.curr+1, opts);
+				initAnim(diff, false, sB);
+				
+				//animation if dragging backwards
+				if(p0drag){
+					//hide p1 as p0 moves across it
+					p1.animate({left:opts.pWidth, width:0}, opts.speed, opts.easing);
+					p1wrap.animate({left:opts.pWidthN}, opts.speed, opts.easing);
+					
+					//animate p0 from left to right (right: movement, width: reveal slide, paddingLeft: shadow underneath)
+					if(opts.closed && opts.autoCenter && opts.curr == 0){
+						p0.animate({left:opts.pWidthH, width:opts.pWidthH}, opts.speedH, opts.easeIn)
+						  .animate({left:0, width:opts.pWidth}, opts.speedH, opts.easeOut);
+						p2.stop().animate({left:0}, opts.speed, opts.easing);
+					}else{
+						p0.animate({left:opts.pWidth, width:opts.pWidth}, opts.speed, opts.easing);
+					}
+					//animate .wrapper content with p0 to keep content right aligned throughout
+					//call setuppages at end of animation to reset pages
+					p0wrap.animate({right:0}, opts.speed, opts.easing, function(){updateAfter()});						
+				}else{
+					//hide p1 as p0 moves across it
+					p1.animate({left:opts.pWidth, width:0}, opts.speed, opts.easing);
+					p1wrap.animate({left:opts.pWidthN}, opts.speed, opts.easing);
+					
+					//animate p0 from left to right (right: movement, width: reveal slide, paddingLeft: shadow underneath)
+					if(opts.closed && opts.autoCenter && opts.curr == 0){
+						p0.animate({left:opts.pWidthH, width:opts.pWidthH}, opts.speedH, opts.easeIn)
+						  .animate({left:0, width:opts.pWidth}, opts.speedH, opts.easeOut);
+						p2.stop().animate({left:0}, opts.speed, opts.easing);
+					}else{
+						p0.animate({left:opts.pWidthH, width:opts.pWidthH}, opts.speedH, opts.easeIn)
+						  .animate({left:opts.pWidth, width:opts.pWidth}, opts.speedH, opts.easeOut);
+					}
+					//animate .wrapper content with p0 to keep content right aligned throughout
+					//call setuppages at end of animation to reset pages
+					p0wrap.animate({right:opts.shadowBtmWidth}, opts.speedH,opts. easeIn)
+						  .animate({right:0}, opts.speedH, opts.easeOut, function(){updateAfter()});					
+				}
+			}
+		}
+	});
+	
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////	
+// SETUP CONTROLS
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+	
+	if(opts.manual && $.ui){
+		opts.overlays = false;
+	}
+	
+	//add prev next user defined controls
+	if(opts.next){
+		next = $(opts.next);	
+		next.click(function(e){e.preventDefault(); self.next();});
+	}
+	if(opts.prev){
+		prev = $(opts.prev);	
+		prev.click(function(e){e.preventDefault(); self.prev();});
+	}
+	
+	//add overlays
+	if(opts.overlays){
+		overlayP = $('<div class="b-overlay b-overlay-prev b-prev" title="Previous Page"></div>').appendTo(b);
+		overlayN = $('<div class="b-overlay b-overlay-next b-next" title="Next Page"></div>').appendTo(b);
+		overlaysB = b.find('.b-overlay');
+	
+		if ($.browser.msie) {
+			overlaysB.css({'background':'#fff','filter':'progid:DXImageTransform.Microsoft.Alpha(opacity=0) !important'});
+		}
+	}
+	
+	//add tabs
+	if(opts.tabs){
+		tabP = $('<div class="b-tab b-tab-prev b-prev" title="Previous Page">Previous</div>').appendTo(b);
+		tabN = $('<div class="b-tab b-tab-next b-next" title="Next Page">Next</div>').appendTo(b);
+		tabs = b.find('.b-tab');
+		
+		if(opts.tabWidth){
+			tabs.width(opts.tabWidth);
+		}
+		if(opts.tabHeight){
+			tabs.height(opts.tabHeight);
+		}		
+		
+		tabs.css({'top': '-'+tabN.outerHeight()+'px'});
+		b.css({'marginTop': tabN.outerHeight()});
+		
+		//update ctrls for RTL direction
+		if(opts.direction == 'RTL'){
+			tabN.html('Previous').attr('title','Previous Page');
+			tabP.html('Next').attr('title','Next Page');
+		}
+	}else{
+		b.css({'marginTop': 0});
+	}
+	
+	//add arrows
+	if(opts.arrows){
+		arrowP = $('<div class="b-arrow b-arrow-prev b-prev" title="Previous Page"><div>Previous</div></div>').appendTo(b);
+		arrowN = $('<div class="b-arrow b-arrow-next b-next" title="Next Page"><div>Next</div></div>').appendTo(b);
+		arrows = b.find('.b-arrow');
+		
+		//update ctrls for RTL direction
+		if(opts.direction == 'RTL'){
+			arrowN.html('<div>Previous</div>').attr('title','Previous Page');
+			arrowP.html('<div>Next</div>').attr('title','Next Page');
+		}
+	}
+	
+	//save all "b-prev" and "b-next" controls
+	ctrlsN = b.find('.b-next');
+	ctrlsP = b.find('.b-prev');
+	
+	//add click actions
+	ctrlsN.click(function(e){e.preventDefault(); self.next();});
+	ctrlsP.click(function(e){e.preventDefault(); self.prev();});
+	
+	//add page hover animations
+	if(opts.overlays && opts.hovers){
+		//hovers to start draggable forward
+		ctrlsN.unbind("mouseover mouseout").bind("mouseover",function(){
+			hoverAnimStart(true);
+		})
+		.bind("mouseout",function(){
+			hoverAnimEnd(true);
+		});
+		
+		//hovers to start draggable backwards
+		ctrlsP.unbind("mouseover mouseout").bind("mouseover",function(){
+			hoverAnimStart(false);
+		})
+		.bind("mouseout",function(){
+			hoverAnimEnd(false);
+		});
+	}
+			
+	//arrow animations	
+	if(opts.arrows){
+		if(opts.arrowsHide){
+			if($.support.opacity){
+				ctrlsN.hover(
+					function(){arrowN.find('div').stop().fadeTo('fast', 1);},
+					function(){arrowN.find('div').stop().fadeTo('fast', 0);					
+				});
+				ctrlsP.hover(
+					function(){arrowP.find('div').stop().fadeTo('fast', 1);},
+					function(){arrowP.find('div').stop().fadeTo('fast', 0);					
+				});
+			}else{
+				ctrlsN.hover(
+					function(){arrowN.find('div').show();},
+					function(){arrowN.find('div').hide();					
+				});
+				ctrlsP.hover(
+					function(){arrowP.find('div').show();},
+					function(){arrowP.find('div').hide();					
+				});
+			}
+		}else{
+			arrowN.find('div').show();
+			arrowP.find('div').show();
+		}
+	}
+
+	//keyboard ctrls
+	if(opts.keyboard){
+		//keyboard ctrls
+		$(document).keyup(function(event){
+			if(event.keyCode == 37){self.prev();}
+			else if(event.keyCode == 39){self.next();}
+		});
+	}
+		
+	//hash ctrls
+	if(opts.hash){
+		setupHash();
+		clearInterval(h);
+		h = setInterval(function(){pollHash()}, 250);
+	}
+	
+	//percentage resizing
+	if(opts.wPercent || opts.hPercent){
+		$(window).resize(function() {
+			resetSize();
+		});
+	}
+	
+	//auto flip book controls
+	if(opts.auto && opts.delay){
+		clearTimeout(a);
+		a = setTimeout(function(){self.next();},opts.delay);
+		playing = true;
+		
+		if(opts.pause){
+			pause = $(opts.pause);	
+			pause.click(function(e){
+				e.preventDefault(); 
+				if(playing){
+					clearTimeout(a);
+					playing = false;
+				}
+			});
+		}
+		if(opts.play){
+			play = $(opts.play);	
+			play.click(function(e){
+				e.preventDefault(); 
+				if(!playing){
+					clearTimeout(a);
+					a = setTimeout(function(){self.next();},opts.delay);
+					playing = true;
+				}
+			});
+		}
+	}
+	
+	//first time setup
+	resetPages();
+	updateCtrls();
+	updatePager();
+
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////	
+//General Functions	
+///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
+
+	function initPages(){		
+		//fix for odd number of pages
+		if((src.children().length % 2) != 0){
+			//if book is closed and using covers, add page before back cover, else after last page
+			if(opts.closed && opts.covers){
+				src.children().last().before(blank);
+			}else{
+				src.children().last().after(blank);
+			}
+		}
+		
+		//if closed book, add empty pages to start and end
+		if(opts.closed){
+			$(empty).attr({'title':opts.closedFrontTitle || "Beginning", 'rel':opts.closedFrontChapter || "Beginning of Book"}).prependTo(src);
+			src.children().last().attr({'title':opts.closedBackTitle || "End", 'rel':opts.closedBackChapter || "End of Book"});		
+			src.append(empty);		
+		}
+
+		if(opts.direction == 'LTR'){
+			j = 0;
+		}else{
+			j = src.children().length;
+			if(opts.closed){j-=2;}
+			if(opts.covers){j-=2;}
+			$(src.children().get().reverse()).each(function(){			
+				$(this).appendTo(src);
+			});
+		}
+			
+		//save titles and chapters
+		src.children().each(function(i){
+			//save chapter title
+			if($(this).attr('rel')){
+				chapters[i] = $(this).attr('rel');
+			}else{
+				chapters[i] = "";
+			}
+			//save page title
+			titles[i] = $(this).attr('title');
+			
+			//give content the correct wrapper and page wrapper
+			if($(this).hasClass('b-page-empty')){
+				$(this).wrap('<div class="b-page"><div class="b-wrap"></div></div>');
+			}else if(opts.closed && opts.covers && (i == 1 || i == src.children().length-2)){
+				$(this).wrap('<div class="b-page"><div class="b-wrap b-page-cover"></div></div>');
+			}else if(i % 2 != 0){
+				$(this).wrap('<div class="b-page"><div class="b-wrap b-wrap-right"></div></div>');
+			}else{
+
+				$(this).wrap('<div class="b-page"><div class="b-wrap b-wrap-left"></div></div>');
+			}
+			
+			$(this).parents('.b-page').addClass('b-page-'+i).data('page',i);
+			
+			//add page numbers
+			if(opts.pageNumbers && !$(this).hasClass('b-page-empty') && (!opts.closed || (opts.closed && !opts.covers) || (opts.closed && opts.covers && i != 1 && i != src.children().length-2))){
+				if(opts.direction == 'LTR'){j++;}
+				$(this).parent().append('<div class="b-counter">'+(j)+'</div>');
+				if(opts.direction == 'RTL'){j--;}
+			}
+		});
+	}
+
+	function resetSize(){
+		//recalculate size for percentage values
+		if(opts.wPercent){
+			opts.width  = (opts.wOrig.replace('%','')/100) * parseFloat(b.parent().css('width'));
+			b.width(opts.width);
+			opts.pWidth  = opts.width/2;
+			opts.pWidthN = '-'+(opts.pWidth)+'px';
+			opts.pWidthH = opts.pWidth/2;
+		}
+		if(opts.hPercent){
+			opts.height  = (opts.hOrig.replace('%','')/100) * parseFloat(b.parent().css('height'));
+			b.height(opts.height);
+			opts.pHeight = opts.height;
+		}
+		resetCSS();
+	}
+	
+	function resetCSS(){
+		//update css
+		b.find('.b-shadow-f, .b-shadow-b, .b-p0, .b-p3').css({'filter':'','zoom':''});
+		if(opts.manual && $.ui){
+			b.find('.b-page').draggable('destroy').removeClass('b-grab b-grabbing');		
+		}
+		wraps.attr('style','');
+		wraps.css({'left':0,'width':opts.pWidth-(opts.pagePadding*2), 'height':opts.pHeight-(opts.pagePadding*2), 'padding': opts.pagePadding});
+		p0wrap.css({'right':0,'left':'auto'});
+		p1.css({'left':0,'width':opts.pWidth, 'height':opts.pHeight});			
+		p2.css({'left':opts.pWidth, 'width':opts.pWidth, 'opacity':1, 'height':opts.pHeight});
+		pN.css({'left':0, 'width':opts.pWidth, 'height':opts.pHeight});
+		p0.css({'left':0, 'width':0, 'height':opts.pHeight});
+		p3.stop().css({'left':opts.pWidth*2, 'width':0, 'height':opts.pHeight, paddingLeft:0});
+		p4.css({'left':opts.pWidth, 'width':opts.pWidth, 'height':opts.pHeight});
+		
+		if(opts.closed && opts.autoCenter && opts.curr == 0){
+			pN.css({'left':0});
+			p1.css({'left':opts.pWidthN});
+			p2.css({'left':0});
+			p3.css({'left':opts.pWidth});
+			p4.css({'left':0});
+		}
+		
+		if(opts.closed && opts.autoCenter && (opts.curr == 0 || opts.curr >= opts.pTotal-2)){
+			if(opts.overlays){overlaysB.width('100%');}
+			b.width(opts.pWidth);
+		}else{
+			if(opts.overlays){overlaysB.width('50%');}
+			b.width(opts.width);
+		}
+		
+	}
+	
+	function resetPages(){	
+		//reset page order
+		if(init){
+			if(p1.data('page')-1 < 0){
+				src.prepend(p2.detach());
+				src.prepend(p1.detach());
+			}else{
+				b.find('.b-page-'+(p1.data('page')-1)).after(p1.detach());
+				b.find('.b-page-'+(p2.data('page')-1)).after(p2.detach());
+			}
+			if(p3.data('page')-1 <= opts.pTotal){
+				b.find('.b-page-'+(p3.data('page')-1)).after(p3.detach());
+				b.find('.b-page-'+(p4.data('page')-1)).after(p4.detach());	
+			}
+			if(pN.data('page')-1 >= 0){
+				b.find('.b-page-'+(pN.data('page')-1)).after(pN.detach());
+				b.find('.b-page-'+(p0.data('page')-1)).after(p0.detach());
+			}else{
+				src.prepend(pN.detach());
+				pN.after(p0.detach());
+			}
+		}
+		//reset all content
+		b.find('.b-page').removeClass('b-pN b-p0 b-p1 b-p2 b-p3 b-p4').hide();
+		
+		//add page classes
+		if(opts.curr-2 >= 0){
+			b.find('.b-page-'+(opts.curr-2)).addClass('b-pN').show();
+			b.find('.b-page-'+(opts.curr-1)).addClass('b-p0').show();
+		}
+		b.find('.b-page-'+(opts.curr)).addClass('b-p1').show();
+		b.find('.b-page-'+(opts.curr+1)).addClass('b-p2').show();
+		if(opts.curr+3 <= opts.pTotal){
+			b.find('.b-page-'+(opts.curr+2)).addClass('b-p3').show();
+			b.find('.b-page-'+(opts.curr+3)).addClass('b-p4').show();
+		}
+	
+		//save structure elems to vars
+		pN     = b.find('.b-pN');
+		p0     = b.find('.b-p0');
+		p1     = b.find('.b-p1');
+		p2     = b.find('.b-p2');
+		p3     = b.find('.b-p3');
+		p4     = b.find('.b-p4');
+		pNwrap = b.find('.b-pN .b-wrap');
+		p0wrap = b.find('.b-p0 .b-wrap');
+		p1wrap = b.find('.b-p1 .b-wrap');
+		p2wrap = b.find('.b-p2 .b-wrap');
+		p3wrap = b.find('.b-p3 .b-wrap');
+		p4wrap = b.find('.b-p4 .b-wrap');
+		wraps  = b.find('.b-wrap');
+		
+		resetCSS();
+				
+		//update page order for animations
+		if(opts.curr+3 <= opts.pTotal){
+			p3.after(p0.detach());
+			p1.after(p4.detach());
+		}else{
+			p0.detach().appendTo(src);
+		}
+		init = true;
+		
+		if(opts.shadows){
+			b.find('.b-shadow-f, .b-shadow-b').remove();		
+			sF = $('<div class="b-shadow-f"></div>').css({'right':0,'width':opts.pWidth, 'height':opts.pHeight}).appendTo(p3);
+			sB = $('<div class="b-shadow-b"></div>').appendTo(p0).css({'left':0,'width':opts.pWidth, 'height':opts.pHeight});		
+		}
+		
+		//reset vars
+		rhover = lhover = p3drag = p0drag = false;
+		
+		//manual page turning, check if jQuery UI is loaded
+		if(opts.manual && $.ui){
+			
+			//implement draggable forward
+			p3.draggable({
+				axis: "x",
+				containment: [p2.offset().left-opts.pWidthH,0,p2.offset().left+opts.pWidth-50,opts.pHeight],
+				drag: function(event, ui) {
+					p3drag = true;
+					temp = ui.originalPosition.left - ui.position.left;
+					p3.removeClass('b-grab').addClass('b-grabbing');
+					p3.width(40+(temp/2));
+					p3wrap.css({'left':10+(temp/8)});
+					p2.width(opts.pWidth-p3.width()+10);
+					if(opts.shadows){
+						sF.css({'right':'-'+(20+temp/4)+'px'});
+						if($.support.opacity){
+							sF.css({'opacity':0.5*(temp/opts.pWidthH)});
+						}else{
+							sF.css({'right':'auto','left':0.1*p3.width()});
+						}
+					}
+				},
+				stop: function(event, ui) {
+					hoverAnimEnd(false);
+					var temp = ui.originalPosition.left - ui.position.left;
+					if(temp>opts.pWidthH/4){
+						if(opts.shadows && !$.support.opacity){
+							sF.css({'left':'auto'});
+						}
+						self.next();
+						p3.removeClass('b-grab b-grabbing');
+					}else{
+						p3drag = false;
+						p3.removeClass('b-grabbing').addClass('b-grab');
+					}
+				}
+			});
+			
+			//implement draggable backwards
+			p0.draggable({
+				axis: "x",
+				containment: [p1.offset().left+10,0,p1.offset().left+opts.pWidth*.75,opts.pHeight],				
+				drag: function(event, ui) {
+					p0drag = true;
+					temp = ui.position.left - ui.originalPosition.left;
+					p0.removeClass('b-grab').addClass('b-grabbing');
+					p0.css({left:40+(temp)/1.5, width:40+(temp)});
+					p0wrap.css({right:10+temp/4});	
+					p1.css({left:ui.position.left+20, width:opts.pWidth-ui.position.left-10});			
+					p1wrap.css({left:-1*(temp+30)});	
+					if(opts.shadows){
+						if($.support.opacity){
+							sB.css({'opacity':0.5*(temp/opts.pWidthH)});
+						}else{
+							sB.css({'left':-0.38*opts.pWidth});
+						}
+					}
+				},
+				stop: function(event, ui) {
+					hoverAnimEnd(true);
+					temp = ui.position.left - ui.originalPosition.left;
+					if(temp>opts.pWidthH/4){
+						self.prev();
+						p0.removeClass('b-grab b-grabbing');
+					}else{
+						p0drag = false;
+						p0.removeClass('b-grabbing').addClass('b-grab');
+					}
+				}
+			});
+			
+			//mousetracking for page movement
+			$(b).unbind('mousemove mouseout').bind('mousemove',function(e){
+				relativeX = e.pageX - b.offset().left;
+				if(relativeX < 50){
+					hoverAnimStart(false);
+				}else if(relativeX > opts.pWidth-50 && opts.curr == 0 && opts.autoCenter && opts.closed){
+					hoverAnimStart(true);
+				}else if(relativeX > 50 && relativeX < opts.width-50){
+					hoverAnimEnd(false);
+					hoverAnimEnd(true);
+				}else if(relativeX > opts.width-50){
+					hoverAnimStart(true);
+				}
+			}).bind('mouseout',function(){
+				hoverAnimEnd(false);
+				hoverAnimEnd(true);
+			});
+			
+		}
+	}
+	
+	function hoverAnimStart(inc){
+		if(inc){
+			if(!busy && !rhover &&!lhover && !p3drag && opts.curr+2 <= opts.pTotal-2){
+				//animate
+				p2.stop().animate({'width':opts.pWidth-40}, 500, opts.easing);
+				p3.addClass('b-grab');
+				if(opts.closed && opts.autoCenter && opts.curr == 0){
+					p3.stop().animate({'left':opts.pWidth-50, 'width':40}, 500, opts.easing);
+				}else{
+					p3.stop().animate({'left':opts.width-50, 'width':40}, 500, opts.easing);
+				}
+				p3wrap.stop().animate({'left':10}, 500, opts.easing);
+				if(opts.shadows && !$.support.opacity){
+					sF.css({'right':'auto','left':'-40%'});
+				}
+				rhover = true;
+			}
+		}else{
+			if(!busy && !lhover && !rhover && !p0drag && opts.curr-2 >= 0){
+				//animate
+				p1.stop().animate({left:10, width:opts.pWidth-10}, 400, opts.easing);
+				p0.addClass('b-grab');
+				p1wrap.stop().animate({left:"-10px"}, 400, opts.easing);
+				p0.stop().animate({left:10, width:40}, 400, opts.easing);
+				p0wrap.stop().animate({right:10}, 400, opts.easing);
+				if(opts.shadows && !$.support.opacity){
+					sB.css({'left':-0.38*opts.pWidth});
+				}
+				lhover = true;
+			}
+		}
+	}
+
+	function hoverAnimEnd(inc){
+		if(inc){
+			if(!busy && rhover && !p3drag && opts.curr+2 <= opts.pTotal-2){
+				p2.stop().animate({'width':opts.pWidth}, 500, opts.easing);
+				if(opts.closed && opts.autoCenter && opts.curr == 0){
+					p3.stop().animate({'left':opts.pWidth, 'width':0}, 500, opts.easing);				
+				}else{
+					p3.stop().animate({'left':opts.width, 'width':0}, 500, opts.easing);	
+				}
+				p3wrap.stop().animate({'left':0}, 500, opts.easing);
+				if(opts.shadows && !$.support.opacity){
+					sF.css({'left':'auto'});
+				}
+				rhover = false;
+			}
+		}else{
+			if(!busy && lhover && !p0drag && opts.curr-2 >= 0){
+				p1.stop().animate({left:0, width:opts.pWidth}, 400, opts.easing);
+				p1wrap.stop().animate({left:0}, 400, opts.easing);
+				p0.stop().animate({left:0, width:0}, 400, opts.easing);
+				p0wrap.stop().animate({right:0}, 400, opts.easing);
+				lhover = false;
+			}
+		}
+	}
+
+	function initAnim(diff, inc, shadow){			
+		
+		//setup content
+		if(inc && diff > 2){
+			b.find('.b-page-'+(p3.data('page')-1)).after(p3.detach());	
+			b.find('.b-page-'+(p4.data('page')-1)).after(p4.detach());	
+			
+			b.find('.b-p3, .b-p4').removeClass('b-p3 b-p4').hide();
+			b.find('.b-page-'+opts.curr).addClass('b-p3').show().stop().css({'left':opts.pWidth*2, 'width':0, 'height':opts.pHeight, paddingLeft:0});
+			b.find('.b-page-'+(opts.curr+1)).addClass('b-p4').show().css({'left':opts.pWidth, 'width':opts.pWidth, 'height':opts.pHeight});
+			b.find('.b-page-'+opts.curr+' .b-wrap').show().css({'width':opts.pWidth-(opts.pagePadding*2), 'height':opts.pHeight-(opts.pagePadding*2), 'padding': opts.pagePadding});
+			b.find('.b-page-'+(opts.curr+1)+' .b-wrap').show().css({'width':opts.pWidth-(opts.pagePadding*2), 'height':opts.pHeight-(opts.pagePadding*2), 'padding': opts.pagePadding});
+			
+			p3     = b.find('.b-p3');
+			p4     = b.find('.b-p4');
+			p3wrap = b.find('.b-p3 .b-wrap');
+			p4wrap = b.find('.b-p4 .b-wrap');
+			
+			if(rhover){
+				p3.css({'left':opts.width-40, 'width':20, 'padding-left': 10});
+			}
+			
+			p1.after(p4.detach());
+			p2.after(p3.detach());
+			
+			if (opts.shadows) {
+				b.find('.b-shadow-f').remove();
+				sF = $('<div class="b-shadow-f"></div>').css({
+					'right': 0,
+					'width': opts.pWidth,
+					'height': opts.pHeight
+				}).appendTo(p3);
+				shadow = sF;
+			}	
+			
+		}else if(!inc && diff > 2){
+			
+			b.find('.b-page-'+(pN.data('page')-1)).after(pN.detach());
+			b.find('.b-page-'+(p0.data('page')-1)).after(p0.detach());
+			
+			b.find('.b-pN, .b-p0').removeClass('b-pN b-p0').hide();
+			b.find('.b-page-'+opts.curr).addClass('b-pN').show().css({'left':0, 'width':opts.pWidth, 'height':opts.pHeight});
+			b.find('.b-page-'+(opts.curr+1)).addClass('b-p0').show().css({'left':0, 'width':0, 'height':opts.pHeight});
+			b.find('.b-page-'+opts.curr+' .b-wrap').show().css({'width':opts.pWidth-(opts.pagePadding*2), 'height':opts.pHeight-(opts.pagePadding*2), 'padding': opts.pagePadding});
+			b.find('.b-page-'+(opts.curr+1)+' .b-wrap').show().css({'width':opts.pWidth-(opts.pagePadding*2), 'height':opts.pHeight-(opts.pagePadding*2), 'padding': opts.pagePadding});
+			
+			pN     = b.find('.b-pN');
+			p0     = b.find('.b-p0');
+			pNwrap = b.find('.b-pN .b-wrap');
+			p0wrap = b.find('.b-p0 .b-wrap');
+						
+			if(lhover){
+				p0.css({left:10, width:40});
+				p0wrap.css({right:10});
+			}
+			
+			p0.detach().appendTo(src);
+			
+			if (opts.shadows) {
+				b.find('.b-shadow-b, .b-shadow-f').remove();
+				sB = $('<div class="b-shadow-b"></div>').appendTo(p0).css({
+					'left': 0,
+					'width': opts.pWidth,
+					'height': opts.pHeight
+				});
+				shadow = sB;
+			}
+		}
+		
+		//update page visibility
+		//if moving to start and end of book
+		if(opts.closed){
+			if(!inc && opts.curr == 0){
+				pN.hide();
+			}else if(!inc){
+				pN.show();
+			}
+			if(inc && opts.curr >= opts.pTotal-2){
+				p4.hide();
+			}else if(inc){
+				p4.show();
+			}
+		}
+		
+		//init shadows
+		if(opts.shadows){
+			//check for opacity support -> animate shadow overlay on moving slide
+			if($.support.opacity){
+				shadow.animate({opacity:1}, opts.speedH, opts.easeIn)
+					  .animate({opacity:0}, opts.speedH, opts.easeOut);
+			}else{
+				if(inc){
+					shadow.animate({right:opts.shadowTopFwdWidth}, opts.speed, opts.easeIn);
+				}else{
+					shadow.animate({left:opts.shadowTopBackWidth}, opts.speed, opts.easeIn);
+				}
+			}
+		}
+		
+		//init position anim
+		if(opts.closed && opts.autoCenter){
+			if(opts.curr == 0){
+				p3.hide();
+				p4.hide();
+				b.animate({width:opts.pWidth}, opts.speed, opts.easing);
+			}else if(opts.curr >= opts.pTotal-2){
+				p0.hide();
+				pN.hide();
+				b.animate({width:opts.pWidth}, opts.speed, opts.easing);
+			}else{
+				b.animate({width:opts.width}, opts.speed, opts.easing);
+			}
+		}
+	}
+	
+	function updateAfter(){
+		resetPages();
+		updatePager();
+		updateCtrls();
+		opts.after.call(self, opts);
+		busy = false;
+		
+		//update auto play timer
+		if(opts.auto && opts.delay){
+			if(playing && opts.curr < opts.pTotal-2){
+				clearTimeout(a);
+				a = setTimeout(function(){self.next();},opts.delay);
+				console.log("continue...");
+			}
+			if(opts.curr >= opts.pTotal-2){
+				playing = false;
+			}
+		}
+	}
+	
+	function updateCtrls(){
+		//update ctrls, cursors and visibility
+		if(opts.overlays || opts.tabs || opts.arrows){
+			if($.support.opacity){
+				if(opts.curr < opts.pTotal-2){
+					ctrlsN.fadeIn('fast').css('cursor',opts.cursor);
+				}else{
+					ctrlsN.fadeOut('fast').css('cursor','default'); 
+				}
+				if(opts.curr >= 2 && opts.curr != 0){           
+					ctrlsP.fadeIn('fast').css('cursor',opts.cursor);
+				}else{
+					ctrlsP.fadeOut('fast').css('cursor','default'); 
+				}
+			}else{
+				if(opts.curr < opts.pTotal-2){
+					ctrlsN.show().css('cursor',opts.cursor);
+				}else{
+					ctrlsN.hide().css('cursor','default'); 
+				}
+				if(opts.curr >= 2 && opts.curr != 0){           
+					ctrlsP.show().css('cursor',opts.cursor);
+				}else{
+					ctrlsP.hide().css('cursor','default'); 
+				}
+			}
+		}
+	}
+	
+	function updatePager(){
+		if(opts.pageSelector){
+			if(opts.direction == 'RTL'){
+				nums = (Math.abs(opts.curr - opts.pTotal)-1) +' - '+ ((Math.abs(opts.curr - opts.pTotal)));
+				if(opts.closed){
+					if(opts.curr==opts.pTotal-2){nums='1'}
+					else if(opts.curr==0){nums=opts.pTotal-2}
+					else{nums = (Math.abs(opts.curr - opts.pTotal)-2) +' - '+ ((Math.abs(opts.curr - opts.pTotal)-1));}
+					
+					if(opts.covers){
+						if(opts.curr==opts.pTotal-2){nums=''}
+						else if(opts.curr==0){nums=''}
+						else{nums = (Math.abs(opts.curr - opts.pTotal)-3) +' - '+ ((Math.abs(opts.curr - opts.pTotal)-2));}
+					}
+				}
+				$(opts.menu+' .b-selector-page .b-current').text(nums);
+			}else{
+				nums = (opts.curr+1) +' - '+ (opts.curr+2);
+				if(opts.closed){
+					if(opts.curr==0){nums='1'}
+					else if(opts.curr==opts.pTotal-2){nums=opts.pTotal-2}
+					else {nums = (opts.curr) +'-'+ (opts.curr+1);}
+					
+					if(opts.covers){
+						if(opts.curr==0){nums=''}
+						else if(opts.curr==opts.pTotal-2){nums=''}
+						else {nums = (opts.curr-1) +'-'+ (opts.curr);}
+					}
+				}
+				$(opts.menu+' .b-selector-page .b-current').text(nums);
+			}
+		}
+		if(opts.chapterSelector){
+			if(chapters[opts.curr]!=""){
+				$(opts.menu+' .b-selector-chapter .b-current').text(chapters[opts.curr]);
+			}else if(chapters[opts.curr+1]!=""){
+				$(opts.menu+' .b-selector-chapter .b-current').text(chapters[opts.curr+1]);
+			}
+			
+			if(opts.direction == 'RTL' && chapters[opts.curr+1]!=""){
+				$(opts.menu+' .b-selector-chapter .b-current').text(chapters[opts.curr+1]);
+			}else if(chapters[opts.curr]!=""){
+				$(opts.menu+' .b-selector-chapter .b-current').text(chapters[opts.curr]);
+			}
+		}
+	}
+		
+	function setupHash(){
+		hash = getHashNum();
+		
+		if(!isNaN(hash) && hash <= opts.pTotal-1 && hash >= 0 && hash != ''){
+			if((hash % 2) != 0){
+				hash--;
+			}
+			opts.curr = hash;
+		}else{
+			updateHash(opts.curr+1, opts);
+		}
+		
+		self.hash = hash;
+	}
+	
+	function pollHash(){
+		hash = getHashNum();
+		//check page num
+		if(!isNaN(hash) && hash <= opts.pTotal-1 && hash >= 0){
+			if(hash != opts.curr && hash.toString()!=self.hash){
+				if((hash % 2) != 0){hash--};
+				
+				document.title = opts.name + " - Page "+ (hash+1);
+				
+				if(!busy){
+					self.gotoPage(hash);
+					self.hash = hash;
+				}
+			}
+		}
+	}
+	
+	//get page number from hash tag, last element
+	function getHashNum(){
+		var hash = window.location.hash.split('/');
+		if(hash.length > 1){
+			return parseInt(hash[2])-1;
+		}else{
+			return '';
+		}
+	}
+	
+	//set the hash
+	function updateHash(hash, opts){
+		if(opts.hash){
+			window.location.hash = "/page/" + hash;
+		}
+	}
+	
+}
+
+//define empty array to hold API references
+$.fn.booklet.interfaces = [];
+
+//define default options
+$.fn.booklet.defaults = {
+	name:               null,                            // name of the booklet to display in the document title bar
+	width:              600,                             // container width
+	height:             400,                             // container height
+	speed:              1000,                            // speed of the transition between pages
+	direction:          'LTR',                           // direction of the overall content organization, default LTR, left to right, can be RTL for languages which read right to left
+	startingPage:       0,                               // index of the first page to be displayed
+	easing:             'easeInOutQuad',                 // easing method for complete transition
+	easeIn:             'easeInQuad',                    // easing method for first half of transition
+	easeOut:            'easeOutQuad',                   // easing method for second half of transition
+	
+	closed:             false,                           // start with the book "closed", will add empty pages to beginning and end of book
+	closedFrontTitle:   null,                            // used with "closed", "menu" and "pageSelector", determines title of blank starting page
+	closedFrontChapter: null,                            // used with "closed", "menu" and "chapterSelector", determines chapter name of blank starting page
+	closedBackTitle:    null,                            // used with "closed", "menu" and "pageSelector", determines chapter name of blank ending page
+	closedBackChapter:  null,                            // used with "closed", "menu" and "chapterSelector", determines chapter name of blank ending page
+	covers:             false,                           // used with "closed", makes first and last pages into covers, without page numbers (if enabled)
+	autoCenter:         false,                           // used with "closed", makes book position in center of container when closed
+
+	pagePadding:        10,                              // padding for each page wrapper
+	pageNumbers:        true,                            // display page numbers on each page
+	
+	manual:             true,                            // enables manual page turning, requires jQuery UI to function
+	
+	hovers:             true,                            // enables preview pageturn hover animation, shows a small preview of previous or next page on hover
+	overlays:           true,                            // enables navigation using a page sized overlay, when enabled links inside the content will not be clickable
+	tabs:               false,                           // adds tabs along the top of the pages
+	tabWidth:           60,                              // set the width of the tabs
+	tabHeight:          20,                              // set the height of the tabs
+	arrows:             false,                           // adds arrows overlayed over the book edges
+	arrowsHide:         false,                           // auto hides arrows when controls are not hovered
+	cursor:             'pointer',                       // cursor css setting for side bar areas
+	
+	hash:               false,                           // enables navigation using a hash string, ex: #/page/1 for page 1, will affect all booklets with 'hash' enabled
+	keyboard:           true,                            // enables navigation with arrow keys (left: previous, right: next)
+	next:               null,                            // selector for element to use as click trigger for next page
+	prev:               null,                            // selector for element to use as click trigger for previous page
+	auto:               false,                           // enables automatic navigation, requires "delay"
+	delay:              5000,                            // amount of time between automatic page flipping
+	pause:              null,                            // selector for element to use as click trigger for pausing auto page flipping
+	play:               null,                            // selector for element to use as click trigger for restarting auto page flipping
+
+	menu:               null,                            // selector for element to use as the menu area, required for 'pageSelector'
+	pageSelector:       false,                           // enables navigation with a dropdown menu of pages, requires 'menu'
+	chapterSelector:    false,                           // enables navigation with a dropdown menu of chapters, determined by the "rel" attribute, requires 'menu'
+
+	shadows:            true,                            // display shadows on page animations
+	shadowTopFwdWidth:  166,                             // shadow width for top forward anim
+	shadowTopBackWidth: 166,                             // shadow width for top back anim
+	shadowBtmWidth:     50,                              // shadow width for bottom shadow
+	
+	before:             function(){},                    // callback invoked before each page turn animation
+	after:              function(){}                     // callback invoked after each page turn animation
+}
+	
+})(jQuery);

examples/presentation/index.html

@@ -7,9 +7,9 @@
 
 <script type="text/javascript"> 
 	loadAmber({
-		files: ['Presentation.js', 'Presentation-IAE.js'],
+		files: ['Presentation.js'],
 		prefix: 'examples/presentation/js',
-		ready: function() {smalltalk.Browser._openOn_(smalltalk.ESUG2011Presentation)} 
+		ready: function() {smalltalk.Browser._openOn_(smalltalk.FOSDEM2012Presentation)} 
 	}); 
 </script>
 

examples/presentation/st/Presentation.st

@@ -1,69 +1,205 @@
-Widget subclass: #Slide
-	instanceVariableNames: 'presentation'
+Smalltalk current createPackage: 'Presentation' properties: #{}!
+Widget subclass: #PresentationNavigator
+	instanceVariableNames: 'presentationBrush currentPresentation slideSelect'
 	category: 'Presentation'!
 
-!Slide methodsFor: 'accessing'!
+!PresentationNavigator methodsFor: 'accessing'!
 
-presentation
-	^presentation
+currentPresentation: aPresentation
+	currentPresentation := aPresentation.
 !
 
-presentation: aPresentation
-	presentation := aPresentation
+currentPresentation
+	^  currentPresentation ifNil: [currentPresentation := Presentation concretePresentations first new].
 !
 
-id
-	self subclassResponsibility
+style
+	^ '
+#navigator {
+    z-index: 1;
+    position: fixed;
+    top: 0;
+    left: 50%;
+    margin-left: -150px;
+    padding: 5px;
+    border-radius: 5px;
+    -moz-border-radius: 5px;
+    -webkit-border-radius: 5px;
+    background: #333;
+    opacity: 0.3;
+    color: #eee;
+}
+
+#navigator a {
+    font-weight: bold;
+    color: #eee;
+    text-decoration: none;
+    cursor: pointer;
+    padding: 0 2px;
+    font-size: 14px;
+}
+
+#navigator:hover {
+    opacity: 0.8;
+}
+'
+! !
+
+!PresentationNavigator methodsFor: 'callbacks'!
+
+selectPresentation: aPresentationClass
+	self currentPresentation: aPresentationClass new.
+	self renderCurrentPresentation.
 !
 
-cssClass
-	^'slide'
+selectPresentationNamed: aString
+	|presentationClass|
+	presentationClass :=  (Smalltalk current at: aString).
+	presentationClass ifNotNil: [ self selectPresentation: presentationClass ].
 !
 
-backgroundColor
-	^'#555'
+previousSlide
+	self currentPresentation previousSlide.
+	self updateHash.
 !
 
-title
-	^ self id
+nextSlide
+	self currentPresentation nextSlide.
+	self updateHash.
+!
+
+reload
+	|slideIndex|
+	slideIndex := self currentPresentation currentSlideIndex.
+	self currentPresentation: self currentPresentation class new.
+	self renderCurrentPresentation.
+	self selectSlideAt: slideIndex.
+!
+
+selectSlideAt: anInteger
+	self currentPresentation moveAt: anInteger.
+	self updateHash.
+!
+
+updateHash
+	document location hash: self currentPresentation class name, '-', self currentPresentation currentSlideIndex.
 ! !
 
-!Slide methodsFor: 'actions'!
+!PresentationNavigator methodsFor: 'hash'!
 
-show
-	self backgroundColor ifNotNil: [
-		(window jQuery: '#slides') css: 'background' color: self backgroundColor].
-	(window jQuery: '.slide') hide: self presentation slideTransition options: #() duration: 300.
-	(window jQuery: '#', self id) show: self presentation slideTransition options: #() duration: 300.
+checkHash
+	| hash presentation |
+	hash := (document location hash  replace: '^#' with: '') tokenize: '-'. 
+	presentation := Presentation concretePresentations 
+				detect: [:aPresentationClass | aPresentationClass name == hash first]
+				ifNone: [^ self].
+	presentation == self currentPresentation class ifFalse: [
+          	self selectPresentationNamed: presentation.
+          	self selectSlideAt: hash last
+        ].
+!
+
+checkHashChange
+	(window jQuery: window) bind: 'hashchange' do: [self checkHash]
 ! !
 
-!Slide methodsFor: 'rendering'!
+!PresentationNavigator methodsFor: 'keybindings'!
+
+setKeybindings
+	(window jQuery: document) keyup: [:e || node |
+		node := e target nodeName asLowercase.
+		(node = 'textarea' or: [node = 'input']) ifFalse: [
+			e keyCode = 39 ifTrue: [self nextSlide].
+			e keyCode = 37 ifTrue: [self previousSlide]]]
+! !
+
+!PresentationNavigator methodsFor: 'rendering'!
+
+renderToolsOn: html
+	html a 
+		with: 'IDE';
+		onClick: [TabManager current open].
+	html a
+		with: 'Reload';
+		onClick: [self reload].
+	html a
+		with: '←';
+		onClick: [self previousSlide].
+	html a
+		with: '→';
+		onClick: [self nextSlide].
+!
+
+renderPresentationSelectOn: html
+	|presentationSelect|
+	presentationSelect := html select.
+	presentationSelect
+		onChange: [self  selectPresentationNamed:  presentationSelect asJQuery val];
+		with: [	Presentation concretePresentationsDo: [:aPresentationClass |   
+                                                              							html option
+                                                              								value: aPresentationClass name;
+                                                              								with: aPresentationClass title ] ].
+!
+
+open
+	(window jQuery: document)  ready: [
+          	self 
+          		appendToJQuery: 'body' asJQuery;
+          		setKeybindings;
+          		checkHashChange.
+        ].
+!
 
 renderOn: html
-	html div class: self cssClass; id: self id; with: [
-		self renderSlideOn: html.
-		self renderMetaOn: html]
+	html style
+		type: 'text/css';
+		with: self style.
+	html div
+		id: 'navigator';
+		with: [	self
+					renderToolsOn: html;
+					renderPresentationSelectOn: html;
+                      			renderSlideSelectOn: html].
+
+	presentationBrush := html div 
+							id: 'presentation';
+							yourself.
+
+	self checkHash.
+	self renderCurrentPresentation.
 !
 
-renderSlideOn: html
+renderCurrentPresentation
+	presentationBrush contents: [:html |
+        	self currentPresentation renderOn: html.
+        ].
+	self updateSlideSelect.
 !
 
-renderMetaOn: html
-	html div 
-		id: 'meta';
-		with: [
-			html p class: 'title'; with: self presentation title.
-			html p class: 'description'; with: self presentation description.
-			html a class: 'author'; with: self presentation author; href: 'mailto:', self presentation email.
-			html a class: 'url'; with: self presentation url; href: self presentation url]
+renderSlideSelectOn: html
+	slideSelect := html select.
+	slideSelect onChange: [ self  selectSlideAt:  slideSelect asJQuery val ].
+	self updateSlideSelect.
+!
+
+updateSlideSelect
+	slideSelect contents: [:html| |index|
+		                       		index := 0.
+                		       		self currentPresentation slidesDo: [ :aSlide|  
+                                		                                    				index := index + 1.
+                                                		                    				html option
+                                                                		    					value: index;
+                                                            								with: aSlide title ] ].
 ! !
 
-!Slide class methodsFor: 'instance creation'!
+!PresentationNavigator class methodsFor: 'initialize'!
 
-on: aPresentation
-	^self new
-		presentation: aPresentation;
-		yourself
+initialize
+	^ self open
+!
+
+open
+	^ self new open
 ! !
 
 Widget subclass: #Presentation
@@ -212,54 +348,122 @@ isConcrete
 	^false
 ! !
 
-Presentation subclass: #ESUG2011Presentation
-	instanceVariableNames: ''
+Widget subclass: #Slide
+	instanceVariableNames: 'presentation'
 	category: 'Presentation'!
 
-!ESUG2011Presentation methodsFor: 'accessing'!
+!Slide methodsFor: 'accessing'!
 
-description
-	^'ESUG 2011, Edinburgh'
+presentation
+	^presentation
 !
 
-author
-	^'Nicolas Petton'
+presentation: aPresentation
+	presentation := aPresentation
 !
 
-email
-	^'nico@objectfusion.fr'
+id
+	^ self class name
 !
 
-url
-	^'http://jtalk-project.org'
+cssClass
+	^'slide'
 !
 
-slideClasses
-	^Array new
-		add: IntroSlide;
-		add: AboutSlide;
-		add: WhatIsJtalkSlide;
-		add: JtalkFeaturesSlide;
-		add: WorkspaceSlide;
-		add: IDESlide;
-		add: CountersSlide;
-		add: JtalkAndJavascriptSlide;
-		add: JtalkAndJavascriptSlide2;
-		add: JtalkAndJavascriptSlide3;
-		add: JtalkAndJavascriptSlide4;
-		add: JtalkAndCLI;
-		add: JtalkAndNode;
-		add: JtalkAndNode2;
-		add: JtalkAndNode3;
-		add: JtalkAndWebOS;
-		add: JtalkAndEnyo;
-		add: ContributionsSlide;
-		yourself
+backgroundColor
+	^'#555'
 !
 
-style
-	^'
-body {
+title
+	^ self id
+! !
+
+!Slide methodsFor: 'actions'!
+
+show
+	self backgroundColor ifNotNil: [
+		(window jQuery: '#slides') css: 'background' color: self backgroundColor].
+	(window jQuery: '.slide') hide: self presentation slideTransition options: #() duration: 300.
+	(window jQuery: '#', self id) show: self presentation slideTransition options: #() duration: 300.
+! !
+
+!Slide methodsFor: 'rendering'!
+
+renderOn: html
+	html div class: self cssClass; id: self id; with: [
+		self renderSlideOn: html.
+		self renderMetaOn: html]
+!
+
+renderSlideOn: html
+!
+
+renderMetaOn: html
+	html div 
+		id: 'meta';
+		with: [
+			html p class: 'title'; with: self presentation title.
+			html p class: 'description'; with: self presentation description.
+			html a class: 'author'; with: self presentation author; href: 'mailto:', self presentation email.
+			html a class: 'url'; with: self presentation url; href: self presentation url]
+! !
+
+!Slide class methodsFor: 'instance creation'!
+
+on: aPresentation
+	^self new
+		presentation: aPresentation;
+		yourself
+! !
+
+Presentation subclass: #ESUG2011Presentation
+	instanceVariableNames: ''
+	category: 'Presentation'!
+
+!ESUG2011Presentation methodsFor: 'accessing'!
+
+description
+	^'ESUG 2011, Edinburgh'
+!
+
+author
+	^'Nicolas Petton'
+!
+
+email
+	^'nico@objectfusion.fr'
+!
+
+url
+	^'http://jtalk-project.org'
+!
+
+slideClasses
+	^Array new
+		add: IntroSlide;
+		add: AboutSlide;
+		add: WhatIsJtalkSlide;
+		add: JtalkFeaturesSlide;
+		add: WorkspaceSlide;
+		add: IDESlide;
+		add: CountersSlide;
+		add: JtalkAndJavascriptSlide;
+		add: JtalkAndJavascriptSlide2;
+		add: JtalkAndJavascriptSlide3;
+		add: JtalkAndJavascriptSlide4;
+		add: JtalkAndCLI;
+		add: JtalkAndNode;
+		add: JtalkAndNode2;
+		add: JtalkAndNode3;
+		add: JtalkAndWebOS;
+		add: JtalkAndEnyo;
+		add: ContributionsSlide;
+		yourself
+!
+
+style
+	^'
+body {
     font-family: Helvetica,Arial,sans;
 }
 
@@ -1090,203 +1294,396 @@ renderSlideOn: html
 		html span class: 'blue'; with: 'Enyo'].
 ! !
 
-Widget subclass: #PresentationNavigator
-	instanceVariableNames: 'presentationBrush currentPresentation slideSelect'
+Presentation subclass: #FOSDEM2012Presentation
+	instanceVariableNames: ''
 	category: 'Presentation'!
 
-!PresentationNavigator methodsFor: 'accessing'!
+!FOSDEM2012Presentation methodsFor: 'accessing'!
 
-currentPresentation: aPresentation
-	currentPresentation := aPresentation.
+description
+	^'FOSDEM 2012, Brussels'
 !
 
-currentPresentation
-	^  currentPresentation ifNil: [currentPresentation := Presentation concretePresentations first new].
+author
+	^'Laurent Laffont, Johnny Thornton'
+!
+
+email
+	^'laurent.laffont@gmail.com,  johnnyt@xan.do'
+!
+
+url
+	^'http://amber-lang.net'
 !
 
 style
-	^ '
-#navigator {
-    z-index: 1;
-    position: fixed;
+	^'
+body {
+    font-family: Helvetica,Arial,sans;
+}
+
+#slides {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+    position: absolute;
     top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background: #555;
+}
+
+.slide {
+    background: #fff;
+    color: #444;
+    text-align: left;
+    font-size: 20px;
+    line-height: 1.8em;
+    height: 500px;
+    width: 700px;
+    padding: 60px;
+    position: absolute;
     left: 50%;
-    margin-left: -150px;
-    padding: 5px;
-    border-radius: 5px;
-    -moz-border-radius: 5px;
-    -webkit-border-radius: 5px;
-    background: #333;
-    opacity: 0.3;
-    color: #eee;
+    top: 50%;
+    margin-left: -420px;
+    margin-top: -320px;
+    box-shadow: 0 0 20px #111;
+    -moz-box-shadow: 0 0 20px #111;
+    -webkit-box-shadow: 0 0 20px #111;
 }
 
-#navigator a {
-    font-weight: bold;
-    color: #eee;
+.slide.transparent {
+    background: transparent;
+    box-shadow: 0 0 0 none;
+    -moz-box-shadow: 0 0 0 transparent;
+    -webkit-box-shadow: 0 0 0 transparent;
+    color: #fff !!important;
+}
+
+.slide.black {
+    background: black;
+    background-image: -webkit-gradient(
+	linear,
+	left bottom,
+	left top,
+	color-stop(0.38, rgb(79,79,79)),
+	color-stop(0.69, rgb(33,33,33)),
+	color-stop(0.86, rgb(4,4,4))
+    );
+    background-image: -moz-linear-gradient(
+	center bottom,
+	rgb(79,79,79) 38%,
+	rgb(33,33,33) 69%,
+	rgb(4,4,4) 86%
+    );
+    color: #fff !!important;
+}
+
+.slide.black h1, .slide.black h2, .slide.black h3,
+.slide.transparent h1, .slide.transparent h2, .slide.transparent h3 {
+    color: #fff;
+    text-shadow: 0 1px 4px #aaa;
+}
+
+.slide.black a, .slide.transparent a {
+    color: #ccc;
+}
+
+.slide.white {
+    color: #333 !!important;
+}
+
+.slide.white h1, .slide.white h2, .slide.white h3 {
+    color: #333;
+}
+
+.slide.white a {
+    color: #333;
+}
+
+
+.slide h1, .slide h2, .slide h3 {
+    color: #333;
+    /* text-align: center; */
+}
+
+.slide h1 {
+    font-family: "Droid Sans";
+    font-size: 36px;
+    text-shadow: 0 1px 4px #aaa;
+    margin-top: 30px;
+    margin-bottom: 50px;
+}
+
+.slide button {
+    font-size: 18px;
+}
+
+.slide a {
+    color: #555;
     text-decoration: none;
     cursor: pointer;
-    padding: 0 2px;
-    font-size: 14px;
 }
 
-#navigator:hover {
+.slide a:hover {
+    color: #fff;
+    background: #555;
+}
+
+.slide .right {
+    text-align: right;
+}
+
+.slide .section.center {
+    text-align: center;
+    display: table-cell;
+    vertical-align: middle;
+    width: 700px;
+    height: 500px;
+}
+
+.slide code {
+    font-family: "Droid Sans Mono";
+    color: #444;
+    border: 1px solid #ddd;
+    background: #eee;
+    border-radius: 4px;
+    padding: 2px;
+    font-size: 16px;
+}
+
+.slide .code2 {
+    font-family: "Droid Sans Mono";
+    line-height: 1.2em;
+    color: #444;
+    padding: 2px;
+    font-size: 16px;
+}
+
+
+.slide .CodeMirror {
+    width: 500px;
+    height: 300px;
+    text-align: left;
+}
+
+.slide .CodeMirror-scroll {
+    text-align: left;
+}
+
+.slide .fancy {
+    margin-top: 30px;
+    -webkit-transform: rotate(-10deg);
+    -moz-transform: rotate(-10deg);
+    transform: rotate(-10deg);
+    color: red;
+}
+
+.slide .comment {
+    opacity: 0.6;
+    font-weight: normal;
+}
+
+.slide .red {
+    color: red;
+}
+
+.slide .blue {
+    color: blue;
+}
+
+#meta {
+    position: absolute;
+    font-size: 12px;
+    opacity: 0.6;
+    bottom: 0;
+    right: 0;
+    z-index: 2;
+    background: #333;
+    text-align: right;
+    padding: 0 10px;
+    line-height: 1.8em;
+    color: #eee;
+    border-top-left-radius: 5px;
+}
+
+#meta:hover {
     opacity: 0.8;
 }
-'
-! !
 
-!PresentationNavigator methodsFor: 'callbacks'!
+#meta p {
+    display: inline;
+    padding: 0 5px;
+}
 
-selectPresentation: aPresentationClass
-	self currentPresentation: aPresentationClass new.
-	self renderCurrentPresentation.
-!
+#meta a {
+    //background: #ccc;
+    color: #ccc;
+    text-decoration: none;
+    padding: 0 5px;
+}
 
-selectPresentationNamed: aString
-	|presentationClass|
-	presentationClass :=  (Smalltalk current at: aString).
-	presentationClass ifNotNil: [ self selectPresentation: presentationClass ].
-!
+.slide {
+    
+}
 
-previousSlide
-	self currentPresentation previousSlide.
-	self updateHash.
-!
+.slide.blue3d {
+  background: #feffff;
+  background: -moz-linear-gradient(top, #feffff 0%, #d2ebf9 100%);
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#feffff), color-stop(100%,#d2ebf9));
+  background: -webkit-linear-gradient(top, #feffff 0%,#d2ebf9 100%);
+  background: -o-linear-gradient(top, #feffff 0%,#d2ebf9 100%);
+  background: -ms-linear-gradient(top, #feffff 0%,#d2ebf9 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#feffff", endColorstr="#d2ebf9",GradientType=0 );
+  background: linear-gradient(top, #feffff 0%,#d2ebf9 100%);
+}
 
-nextSlide
-	self currentPresentation nextSlide.
-	self updateHash.
-!
 
-reload
-	self currentPresentation: self currentPresentation class new.
-	self renderCurrentPresentation.
-!
+.slide.red3d {
+  background: #febbbb;
+  background: -moz-linear-gradient(top, #febbbb 0%, #fe9090 71%, #ff5c5c 95%);
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#febbbb), color-stop(71%,#fe9090), color-stop(95%,#ff5c5c));
+  background: -webkit-linear-gradient(top, #febbbb 0%,#fe9090 71%,#ff5c5c 95%);
+  background: -o-linear-gradient(top, #febbbb 0%,#fe9090 71%,#ff5c5c 95%);
+  background: -ms-linear-gradient(top, #febbbb 0%,#fe9090 71%,#ff5c5c 95%);
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#febbbb", endColorstr="#ff5c5c",GradientType=0 );
+  background: linear-gradient(top, #febbbb 0%,#fe9090 71%,#ff5c5c 95%);
+}
 
-selectSlideAt: anInteger
-	self currentPresentation moveAt: anInteger.
-	self updateHash.
-!
 
-updateHash
-	document location hash: self currentPresentation class name, '-', self currentPresentation currentSlideIndex.
-! !
+.slide.green3d {
+  background: #cdeb8e;
+  background: -moz-linear-gradient(top, #cdeb8e 0%, #a5c956 100%);
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cdeb8e), color-stop(100%,#a5c956));
+  background: -webkit-linear-gradient(top, #cdeb8e 0%,#a5c956 100%);
+  background: -o-linear-gradient(top, #cdeb8e 0%,#a5c956 100%);
+  background: -ms-linear-gradient(top, #cdeb8e 0%,#a5c956 100%);
+  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#cdeb8e", endColorstr="#a5c956",GradientType=0 );
+  background: linear-gradient(top, #cdeb8e 0%,#a5c956 100%);
+}
 
-!PresentationNavigator methodsFor: 'hash'!
+@-webkit-keyframes rotate-horizontal {
+	0% { -webkit-transform: perspective(1000px) rotateY(-10deg);}
+	100% { -webkit-transform: perspective(1000px) rotateY(10deg);}
+}
 
-checkHash
-	| hash presentation |
-	hash := (document location hash  replace: '^#' with: '') tokenize: '-'. 
-	presentation := Presentation concretePresentations 
-				detect: [:aPresentationClass | aPresentationClass name == hash first]
-				ifNone: [^ self].
-	presentation == self currentPresentation class ifFalse: [
-          	self selectPresentationNamed: presentation.
-          	self selectSlideAt: hash last
-        ].
+.animate p{
+-webkit-transform-style: preserve-3d;
+-webkit-animation: rotate-horizontal 2s infinite alternate ease-in-out;
+-webkit-transform: perspective(1000px) rotateY(0deg);
+-webkit-transition: all 2s ease-in-out;
+}
+
+#FOSDEMAmberBackend img {
+	margin: 5px;
+	-webkit-animation: rotate-horizontal 2s infinite alternate ease-in-out;
+}
+'
 !
 
-checkHashChange
-	(window jQuery: window) bind: 'hashchange' do: [self checkHash]
+slideClasses
+^ {
+	FOSDEMIntroSlide.
+	CountersSlide.
+	JtalkAndJavascriptSlide.
+	FOSDEMBookletSlide.
+	FOSDEMAmberBackend
+}
 ! !
 
-!PresentationNavigator methodsFor: 'keybindings'!
+!FOSDEM2012Presentation class methodsFor: 'testing'!
 
-setKeybindings
-	(window jQuery: document) keyup: [:e || node |
-		node := e target nodeName asLowercase.
-		(node = 'textarea' or: [node = 'input']) ifFalse: [
-			e keyCode = 39 ifTrue: [self nextSlide].
-			e keyCode = 37 ifTrue: [self previousSlide]]]
-! !
+isConcrete
+	^true
+!
 
-!PresentationNavigator methodsFor: 'rendering'!
+title
+	^'Amber'
+! !
 
-renderToolsOn: html
-	html a 
-		with: 'IDE';
-		onClick: [TabManager current open].
-	html a
-		with: 'Reload';
-		onClick: [self reload].
-	html a
-		with: '←';
-		onClick: [self previousSlide].
-	html a
-		with: '→';
-		onClick: [self nextSlide].
-!
+Slide subclass: #FOSDEMIntroSlide
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-renderPresentationSelectOn: html
-	|presentationSelect|
-	presentationSelect := html select.
-	presentationSelect
-		onChange: [self  selectPresentationNamed:  presentationSelect asJQuery val];
-		with: [	Presentation concretePresentationsDo: [:aPresentationClass |   
-                                                              							html option
-                                                              								value: aPresentationClass name;
-                                                              								with: aPresentationClass title ] ].
-!
+!FOSDEMIntroSlide methodsFor: 'not yet classified'!
 
-open
-	(window jQuery: document)  ready: [
-          	self 
-          		appendToJQuery: 'body' asJQuery;
-          		setKeybindings;
-          		checkHashChange.
-        ].
-!
+renderSlideOn: html
+	html div class: 'section center animate'; with: [
+		html img src: 'fosdem2012/images/amber.png'.
+		html p: self presentation author.
+          	html p: self presentation description.
+		html p: [
+			html with: self presentation email]].
+! !
 
-renderOn: html
-	html style
-		type: 'text/css';
-		with: self style.
-	html div
-		id: 'navigator';
-		with: [	self
-					renderToolsOn: html;
-					renderPresentationSelectOn: html;
-                      			renderSlideSelectOn: html].
+Slide subclass: #FOSDEMBookletSlide
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-	presentationBrush := html div 
-							id: 'presentation';
-							yourself.
+!FOSDEMBookletSlide methodsFor: 'accessing'!
 
-	self checkHash.
-	self renderCurrentPresentation.
-!
+cssClass
+	^ 'slide blue3d'
+! !
 
-renderCurrentPresentation
-	presentationBrush contents: [:html |
-        	self currentPresentation renderOn: html.
-        ].
-	self updateSlideSelect.
-!
+!FOSDEMBookletSlide methodsFor: 'rendering'!
 
-renderSlideSelectOn: html
-	slideSelect := html select.
-	slideSelect onChange: [ self  selectSlideAt:  slideSelect asJQuery val ].
-	self updateSlideSelect.
+renderSlideOn: html
+	self renderBookOn: html.
+	html link 
+		rel:'stylesheet';
+		href: 'fosdem2012/lib/booklet/jquery.booklet.1.2.0.css'.
+	jQuery 
+		getScript: 'fosdem2012/lib/booklet/jquery.booklet.1.2.0.min.js' 	
+		do: ['#book' asJQuery booklet: self bookletOptions].
 !
 
-updateSlideSelect
-	slideSelect contents: [:html| |index|
-		                       		index := 0.
-                		       		self currentPresentation slidesDo: [ :aSlide|  
-                                		                                    				index := index + 1.
-                                                		                    				html option
-                                                                		    					value: index;
-                                                            								with: aSlide title ] ].
+renderBookOn: html
+	html div 
+		id: 'book';
+		with: [	html div
+					class: 'b-load';
+					with: [	html 
+								div: 'Amber makes it easy to plug existing javascript libraires';
+								div: 'Here is an example with the jQuery Booklet plugin';
+								div: 'Want to see how ?';
+								div: [ html button
+										onClick: [Browser openOn: FOSDEMBookletSlide ];
+										with: 'Just browse the code :)'.						] 	
+																							
+					]	
+		].
+!
+
+bookletOptions
+	^ #{ 
+		'arrows' -> true.
+		'keyboard' -> false.
+		'pageNumbers' -> false.
+		'closed' -> true
+	}
 ! !
 
-!PresentationNavigator class methodsFor: 'initialize'!
+Slide subclass: #FOSDEMAmberBackend
+	instanceVariableNames: ''
+	category: 'Presentation'!
 
-initialize
-	^ self open
-!
+!FOSDEMAmberBackend methodsFor: 'accessing'!
 
-open
-	^ self new open
+cssClass
+	^ 'slide green3d'
+! !
+
+!FOSDEMAmberBackend methodsFor: 'rendering'!
+
+renderSlideOn: html
+	html div
+		class: 'section center';
+		with: [	html h1: 'Need a backend ?'.
+				{'nodejs.png'. 'php.gif'. 'rails.png'.   'pharo.png'. 'ambrhino.jpg'} do: [:aString |
+						html img: 'fosdem2012/images/', aString.
+				]
+		]
 ! !
 

js/Canvas.deploy.js

@@ -1,2103 +1,2114 @@
 smalltalk.addPackage('Canvas', {});
-smalltalk.addClass('HTMLCanvas', smalltalk.Object, ['root'], 'Canvas');
+smalltalk.addClass('Widget', smalltalk.Object, [], 'Canvas');
 smalltalk.addMethod(
-unescape('_root_'),
+unescape('_appendToBrush_'),
 smalltalk.method({
-selector: unescape('root%3A'),
+selector: unescape('appendToBrush%3A'),
 fn: function (aTagBrush){
 var self=this;
-(self['@root']=aTagBrush);
+smalltalk.send(self, "_appendToJQuery_", [smalltalk.send(aTagBrush, "_asJQuery", [])]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.Widget);
 
 smalltalk.addMethod(
-unescape('_root'),
+unescape('_appendToJQuery_'),
 smalltalk.method({
-selector: unescape('root'),
-fn: function (){
+selector: unescape('appendToJQuery%3A'),
+fn: function (aJQuery){
 var self=this;
-return self['@root'];
+smalltalk.send(self, "_renderOn_", [smalltalk.send((smalltalk.HTMLCanvas || HTMLCanvas), "_onJQuery_", [aJQuery])]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.Widget);
 
 smalltalk.addMethod(
-unescape('_with_'),
+unescape('_renderOn_'),
 smalltalk.method({
-selector: unescape('with%3A'),
-fn: function (anObject){
+selector: unescape('renderOn%3A'),
+fn: function (html){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_root", []), "_with_", [anObject]);
+self;
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.Widget);
+
 
+
+smalltalk.addClass('TagBrush', smalltalk.Object, ['canvas', 'element'], 'Canvas');
 smalltalk.addMethod(
-unescape('_initialize'),
+unescape('_element'),
 smalltalk.method({
-selector: unescape('initialize'),
+selector: unescape('element'),
 fn: function (){
 var self=this;
-smalltalk.send(self, "_initialize", [], smalltalk.Object);
-(($receiver = self['@root']) == nil || $receiver == undefined) ? (function(){return (self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", ["div", self]));})() : $receiver;
+return self['@element'];
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_initializeFromJQuery_'),
+unescape('_contents_'),
 smalltalk.method({
-selector: unescape('initializeFromJQuery%3A'),
-fn: function (aJQuery){
+selector: unescape('contents%3A'),
+fn: function (anObject){
 var self=this;
-(self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromJQuery_canvas_", [aJQuery, self]));
+(function($rec){smalltalk.send($rec, "_empty", []);return smalltalk.send($rec, "_append_", [anObject]);})(self);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_newTag_'),
+unescape('_addBrush_'),
 smalltalk.method({
-selector: unescape('newTag%3A'),
-fn: function (aString){
+selector: unescape('addBrush%3A'),
+fn: function (aTagBrush){
 var self=this;
-return smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", [aString, self]);
+smalltalk.send(self, "_appendChild_", [smalltalk.send(aTagBrush, "_element", [])]);
+return aTagBrush;
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tag_'),
+unescape('_with_'),
 smalltalk.method({
-selector: unescape('tag%3A'),
-fn: function (aString){
+selector: unescape('with%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send(self, "_newTag_", [aString])]);
+smalltalk.send(self, "_append_", [anObject]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h1'),
+unescape('_append_'),
 smalltalk.method({
-selector: unescape('h1'),
-fn: function (){
+selector: unescape('append%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h1"]);
+smalltalk.send(anObject, "_appendToBrush_", [self]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h2'),
+unescape('_appendToBrush_'),
 smalltalk.method({
-selector: unescape('h2'),
-fn: function (){
+selector: unescape('appendToBrush%3A'),
+fn: function (aTagBrush){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h2"]);
+smalltalk.send(aTagBrush, "_addBrush_", [self]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h3'),
+unescape('_appendBlock_'),
 smalltalk.method({
-selector: unescape('h3'),
-fn: function (){
+selector: unescape('appendBlock%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h3"]);
+var root=nil;
+(root=smalltalk.send(self['@canvas'], "_root", []));
+smalltalk.send(self['@canvas'], "_root_", [self]);
+smalltalk.send(aBlock, "_value_", [self['@canvas']]);
+smalltalk.send(self['@canvas'], "_root_", [root]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h4'),
+unescape('_appendChild_'),
 smalltalk.method({
-selector: unescape('h4'),
-fn: function (){
+selector: unescape('appendChild%3A'),
+fn: function (anElement){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h4"]);
+var element=self['@element'];
+ 	if (null == element.canHaveChildren || element.canHaveChildren) {
+		element.appendChild(anElement);
+ 	} else {
+ 		element.text = String(element.text) +  anElement.innerHTML;
+ 	} ;
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h5'),
+unescape('_appendString_'),
 smalltalk.method({
-selector: unescape('h5'),
-fn: function (){
+selector: unescape('appendString%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h5"]);
+smalltalk.send(self, "_appendChild_", [smalltalk.send(self, "_createTextNodeFor_", [aString])]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h6'),
+unescape('_empty'),
 smalltalk.method({
-selector: unescape('h6'),
+selector: unescape('empty'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h6"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_empty", []);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_p'),
+unescape('_at_put_'),
 smalltalk.method({
-selector: unescape('p'),
-fn: function (){
+selector: unescape('at%3Aput%3A'),
+fn: function (aString, aValue){
 var self=this;
-return smalltalk.send(self, "_tag_", ["p"]);
+self['@element'].setAttribute(aString, aValue);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_div'),
+unescape('_removeAt_'),
 smalltalk.method({
-selector: unescape('div'),
-fn: function (){
+selector: unescape('removeAt%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["div"]);
+self['@element'].removeAttribute(aString);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_span'),
+unescape('_class_'),
 smalltalk.method({
-selector: unescape('span'),
-fn: function (){
+selector: unescape('class%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["span"]);
+self['@element'].className = aString;
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_img'),
+unescape('_id_'),
 smalltalk.method({
-selector: unescape('img'),
-fn: function (){
+selector: unescape('id%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["img"]);
+smalltalk.send(self, "_at_put_", ["id", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ul'),
+unescape('_src_'),
 smalltalk.method({
-selector: unescape('ul'),
-fn: function (){
+selector: unescape('src%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["ul"]);
+smalltalk.send(self, "_at_put_", ["src", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ol'),
+unescape('_href_'),
 smalltalk.method({
-selector: unescape('ol'),
-fn: function (){
+selector: unescape('href%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["ol"]);
+smalltalk.send(self, "_at_put_", ["href", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_li'),
+unescape('_title_'),
 smalltalk.method({
-selector: unescape('li'),
-fn: function (){
+selector: unescape('title%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["li"]);
+smalltalk.send(self, "_at_put_", ["title", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_table'),
+unescape('_style_'),
 smalltalk.method({
-selector: unescape('table'),
-fn: function (){
+selector: unescape('style%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["table"]);
+smalltalk.send(self, "_at_put_", ["style", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tr'),
+unescape('_type_'),
 smalltalk.method({
-selector: unescape('tr'),
-fn: function (){
+selector: unescape('type%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["tr"]);
+smalltalk.send(self, "_at_put_", ["type", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_td'),
+unescape('_media_'),
 smalltalk.method({
-selector: unescape('td'),
-fn: function (){
+selector: unescape('media%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["td"]);
+smalltalk.send(self, "_at_put_", ["media", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_th'),
+unescape('_rel_'),
 smalltalk.method({
-selector: unescape('th'),
-fn: function (){
+selector: unescape('rel%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["th"]);
+smalltalk.send(self, "_at_put_", ["rel", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_form'),
+unescape('_width_'),
 smalltalk.method({
-selector: unescape('form'),
-fn: function (){
+selector: unescape('width%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["form"]);
+smalltalk.send(self, "_at_put_", ["width", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_input'),
+unescape('_height_'),
 smalltalk.method({
-selector: unescape('input'),
-fn: function (){
+selector: unescape('height%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["input"]);
+smalltalk.send(self, "_at_put_", ["height", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_button'),
+unescape('_value_'),
 smalltalk.method({
-selector: unescape('button'),
-fn: function (){
+selector: unescape('value%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["button"]);
+smalltalk.send(self, "_at_put_", ["value", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_select'),
+unescape('_asJQuery'),
 smalltalk.method({
-selector: unescape('select'),
+selector: unescape('asJQuery'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["select"]);
+return smalltalk.send((typeof window == 'undefined' ? nil : window), "_jQuery_", [smalltalk.send(self, "_element", [])]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_option'),
+unescape('_onKeyDown_'),
 smalltalk.method({
-selector: unescape('option'),
-fn: function (){
+selector: unescape('onKeyDown%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["option"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keydown", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_textarea'),
+unescape('_onKeyPress_'),
 smalltalk.method({
-selector: unescape('textarea'),
-fn: function (){
+selector: unescape('onKeyPress%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["textarea"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keypress", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_a'),
+unescape('_onKeyUp_'),
 smalltalk.method({
-selector: unescape('a'),
-fn: function (){
+selector: unescape('onKeyUp%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["a"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keyup", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_canvas'),
+unescape('_onFocus_'),
 smalltalk.method({
-selector: unescape('canvas'),
-fn: function (){
+selector: unescape('onFocus%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["canvas"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focus", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_pre'),
+unescape('_onBlur_'),
 smalltalk.method({
-selector: unescape('pre'),
-fn: function (){
+selector: unescape('onBlur%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["pre"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["blur", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_code'),
+unescape('_onChange_'),
 smalltalk.method({
-selector: unescape('code'),
-fn: function (){
+selector: unescape('onChange%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["code"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["change", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_br'),
+unescape('_onClick_'),
 smalltalk.method({
-selector: unescape('br'),
-fn: function (){
+selector: unescape('onClick%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["br"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["click", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_script'),
+unescape('_initializeFromString_canvas_'),
 smalltalk.method({
-selector: unescape('script'),
-fn: function (){
+selector: unescape('initializeFromString%3Acanvas%3A'),
+fn: function (aString, aCanvas){
 var self=this;
-return smalltalk.send(self, "_tag_", ["script"]);
+(self['@element']=smalltalk.send(self, "_createElementFor_", [aString]));
+(self['@canvas']=aCanvas);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_link'),
+unescape('_initializeFromJQuery_canvas_'),
 smalltalk.method({
-selector: unescape('link'),
-fn: function (){
+selector: unescape('initializeFromJQuery%3Acanvas%3A'),
+fn: function (aJQuery, aCanvas){
 var self=this;
-return smalltalk.send(self, "_tag_", ["link"]);
+(self['@element']=smalltalk.send(aJQuery, "_get_", [(0)]));
+(self['@canvas']=aCanvas);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_style'),
+unescape('_createElementFor_'),
 smalltalk.method({
-selector: unescape('style'),
-fn: function (){
+selector: unescape('createElementFor%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send((smalltalk.StyleTag || StyleTag), "_canvas_", [self])]);
+return document.createElement(String(aString));
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_p_'),
+unescape('_createTextNodeFor_'),
 smalltalk.method({
-selector: unescape('p%3A'),
-fn: function (anObject){
+selector: unescape('createTextNodeFor%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_p", []), "_with_", [anObject]);
+return document.createTextNode(String(aString));
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h1_'),
+unescape('_onSubmit_'),
 smalltalk.method({
-selector: unescape('h1%3A'),
-fn: function (anObject){
+selector: unescape('onSubmit%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h1", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["submit", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_iframe'),
+unescape('_onDblClick_'),
 smalltalk.method({
-selector: unescape('iframe'),
-fn: function (){
+selector: unescape('onDblClick%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["iframe"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["dblclick", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_iframe_'),
+unescape('_onHover_'),
 smalltalk.method({
-selector: unescape('iframe%3A'),
-fn: function (aString){
+selector: unescape('onHover%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_iframe", []), "_src_", [aString]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["hover", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h2_'),
+unescape('_onFocusIn_'),
 smalltalk.method({
-selector: unescape('h2%3A'),
-fn: function (anObject){
+selector: unescape('onFocusIn%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h2", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusin", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h3_'),
+unescape('_onFocusOut_'),
 smalltalk.method({
-selector: unescape('h3%3A'),
-fn: function (anObject){
+selector: unescape('onFocusOut%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h3", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusout", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h4_'),
+unescape('_onMouseDown_'),
 smalltalk.method({
-selector: unescape('h4%3A'),
-fn: function (anObject){
+selector: unescape('onMouseDown%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h4", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousedown", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h5_'),
+unescape('_onMouseUp_'),
 smalltalk.method({
-selector: unescape('h5%3A'),
-fn: function (anObject){
+selector: unescape('onMouseUp%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h5", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseup", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h6_'),
+unescape('_onMouseEnter_'),
 smalltalk.method({
-selector: unescape('h6%3A'),
-fn: function (anObject){
+selector: unescape('onMouseEnter%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h6", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseenter", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_img_'),
+unescape('_onMouseLeave_'),
 smalltalk.method({
-selector: unescape('img%3A'),
-fn: function (aString){
+selector: unescape('onMouseLeave%3A'),
+fn: function (aBlock){
+var self=this;
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseleave", aBlock]);
+return self;}
+}),
+smalltalk.TagBrush);
+
+smalltalk.addMethod(
+unescape('_onMouseMove_'),
+smalltalk.method({
+selector: unescape('onMouseMove%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_img", []), "_src_", [aString]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousemove", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ol_'),
+unescape('_onMouseOut_'),
 smalltalk.method({
-selector: unescape('ol%3A'),
-fn: function (anObject){
+selector: unescape('onMouseOut%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_ol", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseout", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_li_'),
+unescape('_onMouseOver_'),
 smalltalk.method({
-selector: unescape('li%3A'),
-fn: function (anObject){
+selector: unescape('onMouseOver%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_li", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseover", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ul_'),
+unescape('_onSelect_'),
 smalltalk.method({
-selector: unescape('ul%3A'),
-fn: function (anObject){
+selector: unescape('onSelect%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_ul", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["select", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_span_'),
+unescape('_onUnload_'),
 smalltalk.method({
-selector: unescape('span%3A'),
-fn: function (anObject){
+selector: unescape('onUnload%3A'),
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_span", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["unload", aBlock]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_style_'),
+unescape('_for_'),
 smalltalk.method({
-selector: unescape('style%3A'),
+selector: unescape('for%3A'),
 fn: function (aString){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_with_", [aString]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_style", []));
+smalltalk.send(self, "_at_put_", ["for", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_audio'),
+unescape('_placeholder_'),
 smalltalk.method({
-selector: unescape('audio'),
-fn: function (){
+selector: unescape('placeholder%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["audio"]);
+smalltalk.send(self, "_at_put_", ["placeholder", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_fieldset'),
+unescape('_accesskey_'),
 smalltalk.method({
-selector: unescape('fieldset'),
-fn: function (){
+selector: unescape('accesskey%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["fieldset"]);
+smalltalk.send(self, "_at_put_", ["accesskey", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_footer'),
+unescape('_contenteditable_'),
 smalltalk.method({
-selector: unescape('footer'),
-fn: function (){
+selector: unescape('contenteditable%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["footer"]);
+smalltalk.send(self, "_at_put_", ["contenteditable", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_header'),
+unescape('_contextmenu_'),
 smalltalk.method({
-selector: unescape('header'),
-fn: function (){
+selector: unescape('contextmenu%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["header"]);
+smalltalk.send(self, "_at_put_", ["contextmenu", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_hr'),
+unescape('_draggable_'),
 smalltalk.method({
-selector: unescape('hr'),
-fn: function (){
+selector: unescape('draggable%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["hr"]);
+smalltalk.send(self, "_at_put_", ["draggable", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_section'),
+unescape('_hidden'),
 smalltalk.method({
-selector: unescape('section'),
+selector: unescape('hidden'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["section"]);
+smalltalk.send(self, "_at_put_", ["hidden", "hidden"]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tbody'),
+unescape('_tabindex_'),
 smalltalk.method({
-selector: unescape('tbody'),
-fn: function (){
+selector: unescape('tabindex%3A'),
+fn: function (aNumber){
 var self=this;
-return smalltalk.send(self, "_tag_", ["tbody"]);
+smalltalk.send(self, "_at_put_", ["tabindex", aNumber]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tfoot'),
+unescape('_target_'),
 smalltalk.method({
-selector: unescape('tfoot'),
-fn: function (){
+selector: unescape('target%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["tfoot"]);
+smalltalk.send(self, "_at_put_", ["target", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_thead'),
+unescape('_align_'),
 smalltalk.method({
-selector: unescape('thead'),
-fn: function (){
+selector: unescape('align%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["thead"]);
+smalltalk.send(self, "_at_put_", ["align", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_video'),
+unescape('_alt_'),
 smalltalk.method({
-selector: unescape('video'),
-fn: function (){
+selector: unescape('alt%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["video"]);
+smalltalk.send(self, "_at_put_", ["alt", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_label'),
+unescape('_name_'),
 smalltalk.method({
-selector: unescape('label'),
-fn: function (){
+selector: unescape('name%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["label"]);
+smalltalk.send(self, "_at_put_", ["name", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_title'),
+unescape('_valign_'),
 smalltalk.method({
-selector: unescape('title'),
-fn: function (){
+selector: unescape('valign%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["title"]);
+smalltalk.send(self, "_at_put_", ["valign", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_time'),
+unescape('_method_'),
 smalltalk.method({
-selector: unescape('time'),
-fn: function (){
+selector: unescape('method%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["time"]);
+smalltalk.send(self, "_at_put_", ["method", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_sup'),
+unescape('_action_'),
 smalltalk.method({
-selector: unescape('sup'),
-fn: function (){
+selector: unescape('action%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["sup"]);
+smalltalk.send(self, "_at_put_", ["action", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_summary'),
+unescape('_rows_'),
 smalltalk.method({
-selector: unescape('summary'),
-fn: function (){
+selector: unescape('rows%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["summary"]);
+smalltalk.send(self, "_at_put_", ["rows", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_sub'),
+unescape('_cols_'),
 smalltalk.method({
-selector: unescape('sub'),
-fn: function (){
+selector: unescape('cols%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["sub"]);
+smalltalk.send(self, "_at_put_", ["cols", aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
+
 
 smalltalk.addMethod(
-unescape('_strong'),
+unescape('_fromString_canvas_'),
 smalltalk.method({
-selector: unescape('strong'),
-fn: function (){
+selector: unescape('fromString%3Acanvas%3A'),
+fn: function (aString, aCanvas){
 var self=this;
-return smalltalk.send(self, "_tag_", ["strong"]);
+return (function($rec){smalltalk.send($rec, "_initializeFromString_canvas_", [aString, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush.klass);
 
 smalltalk.addMethod(
-unescape('_strong_'),
+unescape('_fromJQuery_canvas_'),
 smalltalk.method({
-selector: unescape('strong%3A'),
-fn: function (anObject){
+selector: unescape('fromJQuery%3Acanvas%3A'),
+fn: function (aJQuery, aCanvas){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_strong", []), "_with_", [anObject]);
+return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_canvas_", [aJQuery, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
 return self;}
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush.klass);
 
+
+smalltalk.addClass('HTMLCanvas', smalltalk.Object, ['root'], 'Canvas');
 smalltalk.addMethod(
-unescape('_source'),
+unescape('_root_'),
 smalltalk.method({
-selector: unescape('source'),
-fn: function (){
+selector: unescape('root%3A'),
+fn: function (aTagBrush){
 var self=this;
-return smalltalk.send(self, "_tag_", ["source"]);
+(self['@root']=aTagBrush);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_small'),
+unescape('_root'),
 smalltalk.method({
-selector: unescape('small'),
+selector: unescape('root'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["small"]);
+return self['@root'];
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_progress'),
+unescape('_with_'),
 smalltalk.method({
-selector: unescape('progress'),
-fn: function (){
+selector: unescape('with%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self, "_tag_", ["progress"]);
+return smalltalk.send(smalltalk.send(self, "_root", []), "_with_", [anObject]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_param'),
+unescape('_initialize'),
 smalltalk.method({
-selector: unescape('param'),
+selector: unescape('initialize'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["param"]);
+smalltalk.send(self, "_initialize", [], smalltalk.Object);
+(($receiver = self['@root']) == nil || $receiver == undefined) ? (function(){return (self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", ["div", self]));})() : $receiver;
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_output'),
+unescape('_initializeFromJQuery_'),
 smalltalk.method({
-selector: unescape('output'),
-fn: function (){
+selector: unescape('initializeFromJQuery%3A'),
+fn: function (aJQuery){
 var self=this;
-return smalltalk.send(self, "_tag_", ["output"]);
+(self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromJQuery_canvas_", [aJQuery, self]));
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_optgroup'),
+unescape('_newTag_'),
 smalltalk.method({
-selector: unescape('optgroup'),
-fn: function (){
+selector: unescape('newTag%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["optgroup"]);
+return smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", [aString, self]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_object'),
+unescape('_tag_'),
 smalltalk.method({
-selector: unescape('object'),
-fn: function (){
+selector: unescape('tag%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["object"]);
+return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send(self, "_newTag_", [aString])]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_noscript'),
+unescape('_h1'),
 smalltalk.method({
-selector: unescape('noscript'),
+selector: unescape('h1'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["noscript"]);
+return smalltalk.send(self, "_tag_", ["h1"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_nav'),
+unescape('_h2'),
 smalltalk.method({
-selector: unescape('nav'),
+selector: unescape('h2'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["nav"]);
+return smalltalk.send(self, "_tag_", ["h2"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_meta'),
+unescape('_h3'),
 smalltalk.method({
-selector: unescape('meta'),
+selector: unescape('h3'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["meta"]);
+return smalltalk.send(self, "_tag_", ["h3"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_menu'),
+unescape('_h4'),
 smalltalk.method({
-selector: unescape('menu'),
+selector: unescape('h4'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["menu"]);
+return smalltalk.send(self, "_tag_", ["h4"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_mark'),
+unescape('_h5'),
 smalltalk.method({
-selector: unescape('mark'),
+selector: unescape('h5'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["mark"]);
+return smalltalk.send(self, "_tag_", ["h5"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_map'),
+unescape('_h6'),
 smalltalk.method({
-selector: unescape('map'),
+selector: unescape('h6'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["map"]);
+return smalltalk.send(self, "_tag_", ["h6"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_legend'),
+unescape('_p'),
 smalltalk.method({
-selector: unescape('legend'),
+selector: unescape('p'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["legend"]);
+return smalltalk.send(self, "_tag_", ["p"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_html'),
+unescape('_div'),
 smalltalk.method({
-selector: unescape('html'),
+selector: unescape('div'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["html"]);
+return smalltalk.send(self, "_tag_", ["div"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_hgroup'),
+unescape('_span'),
 smalltalk.method({
-selector: unescape('hgroup'),
+selector: unescape('span'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["hgroup"]);
+return smalltalk.send(self, "_tag_", ["span"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_head'),
+unescape('_img'),
 smalltalk.method({
-selector: unescape('head'),
+selector: unescape('img'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["head"]);
+return smalltalk.send(self, "_tag_", ["img"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_figure'),
+unescape('_ul'),
 smalltalk.method({
-selector: unescape('figure'),
+selector: unescape('ul'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["figure"]);
+return smalltalk.send(self, "_tag_", ["ul"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_figcaption'),
+unescape('_ol'),
 smalltalk.method({
-selector: unescape('figcaption'),
+selector: unescape('ol'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["figcaption"]);
+return smalltalk.send(self, "_tag_", ["ol"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_embed'),
+unescape('_li'),
 smalltalk.method({
-selector: unescape('embed'),
+selector: unescape('li'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["embed"]);
+return smalltalk.send(self, "_tag_", ["li"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_em'),
+unescape('_table'),
 smalltalk.method({
-selector: unescape('em'),
+selector: unescape('table'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["em"]);
+return smalltalk.send(self, "_tag_", ["table"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_dt'),
+unescape('_tr'),
 smalltalk.method({
-selector: unescape('dt'),
+selector: unescape('tr'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["dt"]);
+return smalltalk.send(self, "_tag_", ["tr"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_dl'),
+unescape('_td'),
 smalltalk.method({
-selector: unescape('dl'),
+selector: unescape('td'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["dl"]);
+return smalltalk.send(self, "_tag_", ["td"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_details'),
+unescape('_th'),
 smalltalk.method({
-selector: unescape('details'),
+selector: unescape('th'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["details"]);
+return smalltalk.send(self, "_tag_", ["th"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_del'),
+unescape('_form'),
 smalltalk.method({
-selector: unescape('del'),
+selector: unescape('form'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["del"]);
+return smalltalk.send(self, "_tag_", ["form"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_dd'),
+unescape('_input'),
 smalltalk.method({
-selector: unescape('dd'),
+selector: unescape('input'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["dd"]);
+return smalltalk.send(self, "_tag_", ["input"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_datalist'),
+unescape('_button'),
 smalltalk.method({
-selector: unescape('datalist'),
+selector: unescape('button'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["datalist"]);
+return smalltalk.send(self, "_tag_", ["button"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_command'),
+unescape('_select'),
 smalltalk.method({
-selector: unescape('command'),
+selector: unescape('select'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["command"]);
+return smalltalk.send(self, "_tag_", ["select"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_colgroup'),
+unescape('_option'),
 smalltalk.method({
-selector: unescape('colgroup'),
+selector: unescape('option'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["colgroup"]);
+return smalltalk.send(self, "_tag_", ["option"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_col'),
+unescape('_textarea'),
 smalltalk.method({
-selector: unescape('col'),
+selector: unescape('textarea'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["col"]);
+return smalltalk.send(self, "_tag_", ["textarea"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_cite'),
+unescape('_a'),
 smalltalk.method({
-selector: unescape('cite'),
+selector: unescape('a'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["cite"]);
+return smalltalk.send(self, "_tag_", ["a"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_caption'),
+unescape('_canvas'),
 smalltalk.method({
-selector: unescape('caption'),
+selector: unescape('canvas'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["caption"]);
+return smalltalk.send(self, "_tag_", ["canvas"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_body'),
+unescape('_pre'),
 smalltalk.method({
-selector: unescape('body'),
+selector: unescape('pre'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["body"]);
+return smalltalk.send(self, "_tag_", ["pre"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_blockquote'),
+unescape('_code'),
 smalltalk.method({
-selector: unescape('blockquote'),
+selector: unescape('code'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["blockquote"]);
+return smalltalk.send(self, "_tag_", ["code"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_base'),
+unescape('_br'),
 smalltalk.method({
-selector: unescape('base'),
+selector: unescape('br'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["base"]);
+return smalltalk.send(self, "_tag_", ["br"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_aside'),
+unescape('_script'),
 smalltalk.method({
-selector: unescape('aside'),
+selector: unescape('script'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["aside"]);
+return smalltalk.send(self, "_tag_", ["script"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_article'),
+unescape('_link'),
 smalltalk.method({
-selector: unescape('article'),
+selector: unescape('link'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["article"]);
+return smalltalk.send(self, "_tag_", ["link"]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_area'),
+unescape('_style'),
 smalltalk.method({
-selector: unescape('area'),
+selector: unescape('style'),
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["area"]);
+return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send((smalltalk.StyleTag || StyleTag), "_canvas_", [self])]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_address'),
+unescape('_p_'),
 smalltalk.method({
-selector: unescape('address'),
-fn: function (){
+selector: unescape('p%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self, "_tag_", ["address"]);
+return smalltalk.send(smalltalk.send(self, "_p", []), "_with_", [anObject]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_abbr'),
+unescape('_h1_'),
 smalltalk.method({
-selector: unescape('abbr'),
-fn: function (){
+selector: unescape('h1%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self, "_tag_", ["abbr"]);
+return smalltalk.send(smalltalk.send(self, "_h1", []), "_with_", [anObject]);
 return self;}
 }),
 smalltalk.HTMLCanvas);
 
-
 smalltalk.addMethod(
-unescape('_onJQuery_'),
+unescape('_iframe'),
 smalltalk.method({
-selector: unescape('onJQuery%3A'),
-fn: function (aJQuery){
+selector: unescape('iframe'),
+fn: function (){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_", [aJQuery]);smalltalk.send($rec, "_initialize", []);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_basicNew", []));
+return smalltalk.send(self, "_tag_", ["iframe"]);
 return self;}
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isMSIE'),
+unescape('_iframe_'),
 smalltalk.method({
-selector: unescape('isMSIE'),
-fn: function (){
+selector: unescape('iframe%3A'),
+fn: function (aString){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("msie")]), "_notNil", []);
+return smalltalk.send(smalltalk.send(self, "_iframe", []), "_src_", [aString]);
 return self;}
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isOpera'),
+unescape('_h2_'),
 smalltalk.method({
-selector: unescape('isOpera'),
-fn: function (){
+selector: unescape('h2%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("opera")]), "_notNil", []);
+return smalltalk.send(smalltalk.send(self, "_h2", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isMozilla'),
+unescape('_h3_'),
 smalltalk.method({
-selector: unescape('isMozilla'),
-fn: function (){
+selector: unescape('h3%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("mozilla")]), "_notNil", []);
+return smalltalk.send(smalltalk.send(self, "_h3", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isWebkit'),
+unescape('_h4_'),
 smalltalk.method({
-selector: unescape('isWebkit'),
-fn: function (){
+selector: unescape('h4%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("webkit")]), "_notNil", []);
+return smalltalk.send(smalltalk.send(self, "_h4", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_browserVersion'),
+unescape('_h5_'),
 smalltalk.method({
-selector: unescape('browserVersion'),
-fn: function (){
+selector: unescape('h5%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_version", []);
+return smalltalk.send(smalltalk.send(self, "_h5", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.HTMLCanvas.klass);
-
+smalltalk.HTMLCanvas);
 
-smalltalk.addClass('TagBrush', smalltalk.Object, ['canvas', 'element'], 'Canvas');
 smalltalk.addMethod(
-unescape('_element'),
+unescape('_h6_'),
 smalltalk.method({
-selector: unescape('element'),
-fn: function (){
+selector: unescape('h6%3A'),
+fn: function (anObject){
 var self=this;
-return self['@element'];
+return smalltalk.send(smalltalk.send(self, "_h6", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_contents_'),
+unescape('_img_'),
 smalltalk.method({
-selector: unescape('contents%3A'),
-fn: function (anObject){
+selector: unescape('img%3A'),
+fn: function (aString){
 var self=this;
-(function($rec){smalltalk.send($rec, "_empty", []);return smalltalk.send($rec, "_append_", [anObject]);})(self);
+return smalltalk.send(smalltalk.send(self, "_img", []), "_src_", [aString]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_addBrush_'),
+unescape('_ol_'),
 smalltalk.method({
-selector: unescape('addBrush%3A'),
-fn: function (aTagBrush){
+selector: unescape('ol%3A'),
+fn: function (anObject){
 var self=this;
-smalltalk.send(self, "_appendChild_", [smalltalk.send(aTagBrush, "_element", [])]);
-return aTagBrush;
+return smalltalk.send(smalltalk.send(self, "_ol", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_with_'),
+unescape('_li_'),
 smalltalk.method({
-selector: unescape('with%3A'),
+selector: unescape('li%3A'),
 fn: function (anObject){
 var self=this;
-smalltalk.send(self, "_append_", [anObject]);
+return smalltalk.send(smalltalk.send(self, "_li", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_append_'),
+unescape('_ul_'),
 smalltalk.method({
-selector: unescape('append%3A'),
+selector: unescape('ul%3A'),
 fn: function (anObject){
 var self=this;
-smalltalk.send(anObject, "_appendToBrush_", [self]);
+return smalltalk.send(smalltalk.send(self, "_ul", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendToBrush_'),
+unescape('_span_'),
 smalltalk.method({
-selector: unescape('appendToBrush%3A'),
-fn: function (aTagBrush){
+selector: unescape('span%3A'),
+fn: function (anObject){
 var self=this;
-smalltalk.send(aTagBrush, "_addBrush_", [self]);
+return smalltalk.send(smalltalk.send(self, "_span", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendBlock_'),
+unescape('_style_'),
 smalltalk.method({
-selector: unescape('appendBlock%3A'),
-fn: function (aBlock){
+selector: unescape('style%3A'),
+fn: function (aString){
 var self=this;
-var root=nil;
-(root=smalltalk.send(self['@canvas'], "_root", []));
-smalltalk.send(self['@canvas'], "_root_", [self]);
-smalltalk.send(aBlock, "_value_", [self['@canvas']]);
-smalltalk.send(self['@canvas'], "_root_", [root]);
+return (function($rec){smalltalk.send($rec, "_with_", [aString]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_style", []));
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendChild_'),
+unescape('_audio'),
 smalltalk.method({
-selector: unescape('appendChild%3A'),
-fn: function (anElement){
+selector: unescape('audio'),
+fn: function (){
 var self=this;
-var element=self['@element'];
- 	if (null == element.canHaveChildren || element.canHaveChildren) {
-		element.appendChild(anElement);
- 	} else {
- 		element.text = String(element.text) +  anElement.innerHTML;
- 	} ;
+return smalltalk.send(self, "_tag_", ["audio"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendString_'),
+unescape('_fieldset'),
 smalltalk.method({
-selector: unescape('appendString%3A'),
-fn: function (aString){
+selector: unescape('fieldset'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_appendChild_", [smalltalk.send(self, "_createTextNodeFor_", [aString])]);
+return smalltalk.send(self, "_tag_", ["fieldset"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_empty'),
+unescape('_footer'),
 smalltalk.method({
-selector: unescape('empty'),
+selector: unescape('footer'),
 fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_empty", []);
+return smalltalk.send(self, "_tag_", ["footer"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_at_put_'),
+unescape('_header'),
 smalltalk.method({
-selector: unescape('at%3Aput%3A'),
-fn: function (aString, aValue){
+selector: unescape('header'),
+fn: function (){
 var self=this;
-self['@element'].setAttribute(aString, aValue);
+return smalltalk.send(self, "_tag_", ["header"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_removeAt_'),
+unescape('_hr'),
 smalltalk.method({
-selector: unescape('removeAt%3A'),
-fn: function (aString){
+selector: unescape('hr'),
+fn: function (){
 var self=this;
-self['@element'].removeAttribute(aString);
+return smalltalk.send(self, "_tag_", ["hr"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_class_'),
+unescape('_section'),
 smalltalk.method({
-selector: unescape('class%3A'),
-fn: function (aString){
+selector: unescape('section'),
+fn: function (){
 var self=this;
-self['@element'].className = aString;
+return smalltalk.send(self, "_tag_", ["section"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_id_'),
+unescape('_tbody'),
 smalltalk.method({
-selector: unescape('id%3A'),
-fn: function (aString){
+selector: unescape('tbody'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["id", aString]);
+return smalltalk.send(self, "_tag_", ["tbody"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_src_'),
+unescape('_tfoot'),
 smalltalk.method({
-selector: unescape('src%3A'),
-fn: function (aString){
+selector: unescape('tfoot'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["src", aString]);
+return smalltalk.send(self, "_tag_", ["tfoot"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_href_'),
+unescape('_thead'),
 smalltalk.method({
-selector: unescape('href%3A'),
-fn: function (aString){
+selector: unescape('thead'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["href", aString]);
+return smalltalk.send(self, "_tag_", ["thead"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_title_'),
+unescape('_video'),
 smalltalk.method({
-selector: unescape('title%3A'),
-fn: function (aString){
+selector: unescape('video'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["title", aString]);
+return smalltalk.send(self, "_tag_", ["video"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_style_'),
+unescape('_label'),
 smalltalk.method({
-selector: unescape('style%3A'),
-fn: function (aString){
+selector: unescape('label'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["style", aString]);
+return smalltalk.send(self, "_tag_", ["label"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_type_'),
+unescape('_title'),
 smalltalk.method({
-selector: unescape('type%3A'),
-fn: function (aString){
+selector: unescape('title'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["type", aString]);
+return smalltalk.send(self, "_tag_", ["title"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_media_'),
+unescape('_time'),
 smalltalk.method({
-selector: unescape('media%3A'),
-fn: function (aString){
+selector: unescape('time'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["media", aString]);
+return smalltalk.send(self, "_tag_", ["time"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_rel_'),
+unescape('_sup'),
 smalltalk.method({
-selector: unescape('rel%3A'),
-fn: function (aString){
+selector: unescape('sup'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["rel", aString]);
+return smalltalk.send(self, "_tag_", ["sup"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_width_'),
+unescape('_summary'),
 smalltalk.method({
-selector: unescape('width%3A'),
-fn: function (aString){
+selector: unescape('summary'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["width", aString]);
+return smalltalk.send(self, "_tag_", ["summary"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_height_'),
+unescape('_sub'),
 smalltalk.method({
-selector: unescape('height%3A'),
-fn: function (aString){
+selector: unescape('sub'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["height", aString]);
+return smalltalk.send(self, "_tag_", ["sub"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_value_'),
+unescape('_strong'),
 smalltalk.method({
-selector: unescape('value%3A'),
-fn: function (aString){
+selector: unescape('strong'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["value", aString]);
+return smalltalk.send(self, "_tag_", ["strong"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_asJQuery'),
+unescape('_strong_'),
 smalltalk.method({
-selector: unescape('asJQuery'),
-fn: function (){
+selector: unescape('strong%3A'),
+fn: function (anObject){
 var self=this;
-return smalltalk.send((typeof window == 'undefined' ? nil : window), "_jQuery_", [smalltalk.send(self, "_element", [])]);
+return smalltalk.send(smalltalk.send(self, "_strong", []), "_with_", [anObject]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onKeyDown_'),
+unescape('_source'),
 smalltalk.method({
-selector: unescape('onKeyDown%3A'),
-fn: function (aBlock){
+selector: unescape('source'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keydown", aBlock]);
+return smalltalk.send(self, "_tag_", ["source"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onKeyPress_'),
+unescape('_small'),
 smalltalk.method({
-selector: unescape('onKeyPress%3A'),
-fn: function (aBlock){
+selector: unescape('small'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keypress", aBlock]);
+return smalltalk.send(self, "_tag_", ["small"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onKeyUp_'),
+unescape('_progress'),
 smalltalk.method({
-selector: unescape('onKeyUp%3A'),
-fn: function (aBlock){
+selector: unescape('progress'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keyup", aBlock]);
+return smalltalk.send(self, "_tag_", ["progress"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onFocus_'),
+unescape('_param'),
 smalltalk.method({
-selector: unescape('onFocus%3A'),
-fn: function (aBlock){
+selector: unescape('param'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focus", aBlock]);
+return smalltalk.send(self, "_tag_", ["param"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onBlur_'),
+unescape('_output'),
 smalltalk.method({
-selector: unescape('onBlur%3A'),
-fn: function (aBlock){
+selector: unescape('output'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["blur", aBlock]);
+return smalltalk.send(self, "_tag_", ["output"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onChange_'),
+unescape('_optgroup'),
 smalltalk.method({
-selector: unescape('onChange%3A'),
-fn: function (aBlock){
+selector: unescape('optgroup'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["change", aBlock]);
+return smalltalk.send(self, "_tag_", ["optgroup"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onClick_'),
+unescape('_object'),
 smalltalk.method({
-selector: unescape('onClick%3A'),
-fn: function (aBlock){
+selector: unescape('object'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["click", aBlock]);
+return smalltalk.send(self, "_tag_", ["object"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_initializeFromString_canvas_'),
+unescape('_noscript'),
 smalltalk.method({
-selector: unescape('initializeFromString%3Acanvas%3A'),
-fn: function (aString, aCanvas){
+selector: unescape('noscript'),
+fn: function (){
 var self=this;
-(self['@element']=smalltalk.send(self, "_createElementFor_", [aString]));
-(self['@canvas']=aCanvas);
+return smalltalk.send(self, "_tag_", ["noscript"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_initializeFromJQuery_canvas_'),
+unescape('_nav'),
 smalltalk.method({
-selector: unescape('initializeFromJQuery%3Acanvas%3A'),
-fn: function (aJQuery, aCanvas){
+selector: unescape('nav'),
+fn: function (){
 var self=this;
-(self['@element']=smalltalk.send(aJQuery, "_get_", [(0)]));
-(self['@canvas']=aCanvas);
+return smalltalk.send(self, "_tag_", ["nav"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_createElementFor_'),
+unescape('_meta'),
 smalltalk.method({
-selector: unescape('createElementFor%3A'),
-fn: function (aString){
+selector: unescape('meta'),
+fn: function (){
 var self=this;
-return document.createElement(String(aString));
+return smalltalk.send(self, "_tag_", ["meta"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_createTextNodeFor_'),
+unescape('_menu'),
 smalltalk.method({
-selector: unescape('createTextNodeFor%3A'),
-fn: function (aString){
+selector: unescape('menu'),
+fn: function (){
 var self=this;
-return document.createTextNode(String(aString));
+return smalltalk.send(self, "_tag_", ["menu"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onSubmit_'),
+unescape('_mark'),
 smalltalk.method({
-selector: unescape('onSubmit%3A'),
-fn: function (aBlock){
+selector: unescape('mark'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["submit", aBlock]);
+return smalltalk.send(self, "_tag_", ["mark"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onDblClick_'),
+unescape('_map'),
 smalltalk.method({
-selector: unescape('onDblClick%3A'),
-fn: function (aBlock){
+selector: unescape('map'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["dblclick", aBlock]);
+return smalltalk.send(self, "_tag_", ["map"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onHover_'),
+unescape('_legend'),
 smalltalk.method({
-selector: unescape('onHover%3A'),
-fn: function (aBlock){
+selector: unescape('legend'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["hover", aBlock]);
+return smalltalk.send(self, "_tag_", ["legend"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onFocusIn_'),
+unescape('_html'),
 smalltalk.method({
-selector: unescape('onFocusIn%3A'),
-fn: function (aBlock){
+selector: unescape('html'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusin", aBlock]);
+return smalltalk.send(self, "_tag_", ["html"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onFocusOut_'),
+unescape('_hgroup'),
 smalltalk.method({
-selector: unescape('onFocusOut%3A'),
-fn: function (aBlock){
+selector: unescape('hgroup'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusout", aBlock]);
+return smalltalk.send(self, "_tag_", ["hgroup"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseDown_'),
+unescape('_head'),
 smalltalk.method({
-selector: unescape('onMouseDown%3A'),
-fn: function (aBlock){
+selector: unescape('head'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousedown", aBlock]);
+return smalltalk.send(self, "_tag_", ["head"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseUp_'),
+unescape('_figure'),
 smalltalk.method({
-selector: unescape('onMouseUp%3A'),
-fn: function (aBlock){
+selector: unescape('figure'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseup", aBlock]);
+return smalltalk.send(self, "_tag_", ["figure"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseEnter_'),
+unescape('_figcaption'),
 smalltalk.method({
-selector: unescape('onMouseEnter%3A'),
-fn: function (aBlock){
+selector: unescape('figcaption'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseenter", aBlock]);
+return smalltalk.send(self, "_tag_", ["figcaption"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseLeave_'),
+unescape('_embed'),
 smalltalk.method({
-selector: unescape('onMouseLeave%3A'),
-fn: function (aBlock){
+selector: unescape('embed'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseleave", aBlock]);
+return smalltalk.send(self, "_tag_", ["embed"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseMove_'),
+unescape('_em'),
 smalltalk.method({
-selector: unescape('onMouseMove%3A'),
-fn: function (aBlock){
+selector: unescape('em'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousemove", aBlock]);
+return smalltalk.send(self, "_tag_", ["em"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseOut_'),
+unescape('_dt'),
 smalltalk.method({
-selector: unescape('onMouseOut%3A'),
-fn: function (aBlock){
+selector: unescape('dt'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseout", aBlock]);
+return smalltalk.send(self, "_tag_", ["dt"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseOver_'),
+unescape('_dl'),
 smalltalk.method({
-selector: unescape('onMouseOver%3A'),
-fn: function (aBlock){
+selector: unescape('dl'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseover", aBlock]);
+return smalltalk.send(self, "_tag_", ["dl"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onSelect_'),
+unescape('_details'),
 smalltalk.method({
-selector: unescape('onSelect%3A'),
-fn: function (aBlock){
+selector: unescape('details'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["select", aBlock]);
+return smalltalk.send(self, "_tag_", ["details"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onUnload_'),
+unescape('_del'),
 smalltalk.method({
-selector: unescape('onUnload%3A'),
-fn: function (aBlock){
+selector: unescape('del'),
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["unload", aBlock]);
+return smalltalk.send(self, "_tag_", ["del"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_for_'),
+unescape('_dd'),
 smalltalk.method({
-selector: unescape('for%3A'),
-fn: function (aString){
+selector: unescape('dd'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["for", aString]);
+return smalltalk.send(self, "_tag_", ["dd"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_placeholder_'),
+unescape('_datalist'),
 smalltalk.method({
-selector: unescape('placeholder%3A'),
-fn: function (aString){
+selector: unescape('datalist'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["placeholder", aString]);
+return smalltalk.send(self, "_tag_", ["datalist"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_accesskey_'),
+unescape('_command'),
 smalltalk.method({
-selector: unescape('accesskey%3A'),
-fn: function (aString){
+selector: unescape('command'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["accesskey", aString]);
+return smalltalk.send(self, "_tag_", ["command"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_contenteditable_'),
+unescape('_colgroup'),
 smalltalk.method({
-selector: unescape('contenteditable%3A'),
-fn: function (aString){
+selector: unescape('colgroup'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["contenteditable", aString]);
+return smalltalk.send(self, "_tag_", ["colgroup"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_contextmenu_'),
+unescape('_col'),
 smalltalk.method({
-selector: unescape('contextmenu%3A'),
-fn: function (aString){
+selector: unescape('col'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["contextmenu", aString]);
+return smalltalk.send(self, "_tag_", ["col"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_draggable_'),
+unescape('_cite'),
 smalltalk.method({
-selector: unescape('draggable%3A'),
-fn: function (aString){
+selector: unescape('cite'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["draggable", aString]);
+return smalltalk.send(self, "_tag_", ["cite"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_hidden'),
+unescape('_caption'),
 smalltalk.method({
-selector: unescape('hidden'),
+selector: unescape('caption'),
 fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["hidden", "hidden"]);
+return smalltalk.send(self, "_tag_", ["caption"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_tabindex_'),
+unescape('_body'),
 smalltalk.method({
-selector: unescape('tabindex%3A'),
-fn: function (aNumber){
+selector: unescape('body'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["tabindex", aNumber]);
+return smalltalk.send(self, "_tag_", ["body"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_target_'),
+unescape('_blockquote'),
 smalltalk.method({
-selector: unescape('target%3A'),
-fn: function (aString){
+selector: unescape('blockquote'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["target", aString]);
+return smalltalk.send(self, "_tag_", ["blockquote"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_align_'),
+unescape('_base'),
 smalltalk.method({
-selector: unescape('align%3A'),
-fn: function (aString){
+selector: unescape('base'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["align", aString]);
+return smalltalk.send(self, "_tag_", ["base"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_alt_'),
+unescape('_aside'),
 smalltalk.method({
-selector: unescape('alt%3A'),
-fn: function (aString){
+selector: unescape('aside'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["alt", aString]);
+return smalltalk.send(self, "_tag_", ["aside"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_name_'),
+unescape('_article'),
 smalltalk.method({
-selector: unescape('name%3A'),
-fn: function (aString){
+selector: unescape('article'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["name", aString]);
+return smalltalk.send(self, "_tag_", ["article"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_valign_'),
+unescape('_area'),
 smalltalk.method({
-selector: unescape('valign%3A'),
-fn: function (aString){
+selector: unescape('area'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["valign", aString]);
+return smalltalk.send(self, "_tag_", ["area"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_method_'),
+unescape('_address'),
 smalltalk.method({
-selector: unescape('method%3A'),
-fn: function (aString){
+selector: unescape('address'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["method", aString]);
+return smalltalk.send(self, "_tag_", ["address"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_action_'),
+unescape('_abbr'),
 smalltalk.method({
-selector: unescape('action%3A'),
-fn: function (aString){
+selector: unescape('abbr'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["action", aString]);
+return smalltalk.send(self, "_tag_", ["abbr"]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_rows_'),
+unescape('_div_'),
 smalltalk.method({
-selector: unescape('rows%3A'),
-fn: function (aString){
+selector: unescape('div%3A'),
+fn: function (aBlock){
 var self=this;
-smalltalk.send(self, "_at_put_", ["rows", aString]);
+return smalltalk.send(smalltalk.send(self, "_div", []), "_with_", [aBlock]);
 return self;}
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
+
 
 smalltalk.addMethod(
-unescape('_cols_'),
+unescape('_onJQuery_'),
 smalltalk.method({
-selector: unescape('cols%3A'),
-fn: function (aString){
+selector: unescape('onJQuery%3A'),
+fn: function (aJQuery){
 var self=this;
-smalltalk.send(self, "_at_put_", ["cols", aString]);
+return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_", [aJQuery]);smalltalk.send($rec, "_initialize", []);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_basicNew", []));
 return self;}
 }),
-smalltalk.TagBrush);
-
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_fromString_canvas_'),
+unescape('_isMSIE'),
 smalltalk.method({
-selector: unescape('fromString%3Acanvas%3A'),
-fn: function (aString, aCanvas){
+selector: unescape('isMSIE'),
+fn: function (){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_initializeFromString_canvas_", [aString, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("msie")]), "_notNil", []);
 return self;}
 }),
-smalltalk.TagBrush.klass);
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_fromJQuery_canvas_'),
+unescape('_isOpera'),
 smalltalk.method({
-selector: unescape('fromJQuery%3Acanvas%3A'),
-fn: function (aJQuery, aCanvas){
+selector: unescape('isOpera'),
+fn: function (){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_canvas_", [aJQuery, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("opera")]), "_notNil", []);
 return self;}
 }),
-smalltalk.TagBrush.klass);
-
+smalltalk.HTMLCanvas.klass);
 
-smalltalk.addClass('Widget', smalltalk.Object, [], 'Canvas');
 smalltalk.addMethod(
-unescape('_appendToBrush_'),
+unescape('_isMozilla'),
 smalltalk.method({
-selector: unescape('appendToBrush%3A'),
-fn: function (aTagBrush){
+selector: unescape('isMozilla'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_appendToJQuery_", [smalltalk.send(aTagBrush, "_asJQuery", [])]);
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("mozilla")]), "_notNil", []);
 return self;}
 }),
-smalltalk.Widget);
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_appendToJQuery_'),
+unescape('_isWebkit'),
 smalltalk.method({
-selector: unescape('appendToJQuery%3A'),
-fn: function (aJQuery){
+selector: unescape('isWebkit'),
+fn: function (){
 var self=this;
-smalltalk.send(self, "_renderOn_", [smalltalk.send((smalltalk.HTMLCanvas || HTMLCanvas), "_onJQuery_", [aJQuery])]);
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("webkit")]), "_notNil", []);
 return self;}
 }),
-smalltalk.Widget);
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_renderOn_'),
+unescape('_browserVersion'),
 smalltalk.method({
-selector: unescape('renderOn%3A'),
-fn: function (html){
+selector: unescape('browserVersion'),
+fn: function (){
 var self=this;
-self;
+return smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_version", []);
 return self;}
 }),
-smalltalk.Widget);
-
+smalltalk.HTMLCanvas.klass);
 
 
 smalltalk.addClass('StyleTag', smalltalk.TagBrush, ['canvas', 'element'], 'Canvas');

js/Canvas.js

@@ -1,3048 +1,3064 @@
 smalltalk.addPackage('Canvas', {});
-smalltalk.addClass('HTMLCanvas', smalltalk.Object, ['root'], 'Canvas');
+smalltalk.addClass('Widget', smalltalk.Object, [], 'Canvas');
 smalltalk.addMethod(
-unescape('_root_'),
+unescape('_appendToBrush_'),
 smalltalk.method({
-selector: unescape('root%3A'),
-category: 'accessing',
+selector: unescape('appendToBrush%3A'),
+category: 'adding',
 fn: function (aTagBrush){
 var self=this;
-(self['@root']=aTagBrush);
+smalltalk.send(self, "_appendToJQuery_", [smalltalk.send(aTagBrush, "_asJQuery", [])]);
 return self;},
 args: ["aTagBrush"],
-source: unescape('root%3A%20aTagBrush%0A%20%20%20%20root%20%3A%3D%20aTagBrush'),
-messageSends: [],
+source: unescape('appendToBrush%3A%20aTagBrush%0A%20%20%20%20self%20appendToJQuery%3A%20aTagBrush%20asJQuery'),
+messageSends: ["appendToJQuery:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.Widget);
 
 smalltalk.addMethod(
-unescape('_root'),
+unescape('_appendToJQuery_'),
 smalltalk.method({
-selector: unescape('root'),
-category: 'accessing',
-fn: function (){
+selector: unescape('appendToJQuery%3A'),
+category: 'adding',
+fn: function (aJQuery){
 var self=this;
-return self['@root'];
+smalltalk.send(self, "_renderOn_", [smalltalk.send((smalltalk.HTMLCanvas || HTMLCanvas), "_onJQuery_", [aJQuery])]);
 return self;},
-args: [],
-source: unescape('root%0A%20%20%20%20%5Eroot'),
-messageSends: [],
-referencedClasses: []
+args: ["aJQuery"],
+source: unescape('appendToJQuery%3A%20aJQuery%0A%20%20%20self%20renderOn%3A%20%28HTMLCanvas%20onJQuery%3A%20aJQuery%29'),
+messageSends: ["renderOn:", "onJQuery:"],
+referencedClasses: ["HTMLCanvas"]
 }),
-smalltalk.HTMLCanvas);
+smalltalk.Widget);
 
 smalltalk.addMethod(
-unescape('_with_'),
+unescape('_renderOn_'),
 smalltalk.method({
-selector: unescape('with%3A'),
-category: 'adding',
-fn: function (anObject){
+selector: unescape('renderOn%3A'),
+category: 'rendering',
+fn: function (html){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_root", []), "_with_", [anObject]);
+self;
 return self;},
-args: ["anObject"],
-source: unescape('with%3A%20anObject%0A%20%20%20%20%5Eself%20root%20with%3A%20anObject'),
-messageSends: ["with:", "root"],
+args: ["html"],
+source: unescape('renderOn%3A%20html%0A%20%20%20%20self'),
+messageSends: [],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.Widget);
+
+
 
+smalltalk.addClass('TagBrush', smalltalk.Object, ['canvas', 'element'], 'Canvas');
 smalltalk.addMethod(
-unescape('_initialize'),
+unescape('_element'),
 smalltalk.method({
-selector: unescape('initialize'),
-category: 'initialization',
+selector: unescape('element'),
+category: 'accessing',
 fn: function (){
 var self=this;
-smalltalk.send(self, "_initialize", [], smalltalk.Object);
-(($receiver = self['@root']) == nil || $receiver == undefined) ? (function(){return (self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", ["div", self]));})() : $receiver;
+return self['@element'];
 return self;},
 args: [],
-source: unescape('initialize%0A%20%20%20%20super%20initialize.%0A%20%20%20%20root%20ifNil%3A%20%5Broot%20%3A%3D%20TagBrush%20fromString%3A%20%27div%27%20canvas%3A%20self%5D'),
-messageSends: ["initialize", "ifNil:", "fromString:canvas:"],
-referencedClasses: ["TagBrush"]
+source: unescape('element%0A%20%20%20%20%5Eelement'),
+messageSends: [],
+referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_initializeFromJQuery_'),
+unescape('_contents_'),
 smalltalk.method({
-selector: unescape('initializeFromJQuery%3A'),
-category: 'initialization',
-fn: function (aJQuery){
+selector: unescape('contents%3A'),
+category: 'adding',
+fn: function (anObject){
 var self=this;
-(self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromJQuery_canvas_", [aJQuery, self]));
+(function($rec){smalltalk.send($rec, "_empty", []);return smalltalk.send($rec, "_append_", [anObject]);})(self);
 return self;},
-args: ["aJQuery"],
-source: unescape('initializeFromJQuery%3A%20aJQuery%0A%20%20%20%20root%20%3A%3D%20TagBrush%20fromJQuery%3A%20aJQuery%20canvas%3A%20self'),
-messageSends: ["fromJQuery:canvas:"],
-referencedClasses: ["TagBrush"]
+args: ["anObject"],
+source: unescape('contents%3A%20anObject%0A%20%20%20%20self%20%0A%09empty%3B%0A%20%20%20%09append%3A%20anObject'),
+messageSends: ["empty", "append:"],
+referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_newTag_'),
+unescape('_addBrush_'),
 smalltalk.method({
-selector: unescape('newTag%3A'),
-category: 'tags',
-fn: function (aString){
+selector: unescape('addBrush%3A'),
+category: 'adding',
+fn: function (aTagBrush){
 var self=this;
-return smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", [aString, self]);
+smalltalk.send(self, "_appendChild_", [smalltalk.send(aTagBrush, "_element", [])]);
+return aTagBrush;
 return self;},
-args: ["aString"],
-source: unescape('newTag%3A%20aString%0A%20%20%20%20%5ETagBrush%20fromString%3A%20aString%20canvas%3A%20self'),
-messageSends: ["fromString:canvas:"],
-referencedClasses: ["TagBrush"]
+args: ["aTagBrush"],
+source: unescape('addBrush%3A%20aTagBrush%0A%20%20%20%20self%20appendChild%3A%20aTagBrush%20element.%0A%20%20%20%20%5EaTagBrush'),
+messageSends: ["appendChild:", "element"],
+referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tag_'),
+unescape('_with_'),
 smalltalk.method({
-selector: unescape('tag%3A'),
-category: 'tags',
-fn: function (aString){
+selector: unescape('with%3A'),
+category: 'adding',
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send(self, "_newTag_", [aString])]);
+smalltalk.send(self, "_append_", [anObject]);
 return self;},
-args: ["aString"],
-source: unescape('tag%3A%20aString%0A%20%20%20%20%5Eroot%20addBrush%3A%20%28self%20newTag%3A%20aString%29'),
-messageSends: ["addBrush:", "newTag:"],
+args: ["anObject"],
+source: unescape('with%3A%20anObject%0A%20%20%20%20self%20append%3A%20anObject'),
+messageSends: ["append:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h1'),
+unescape('_append_'),
 smalltalk.method({
-selector: unescape('h1'),
-category: 'tags',
-fn: function (){
+selector: unescape('append%3A'),
+category: 'adding',
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h1"]);
+smalltalk.send(anObject, "_appendToBrush_", [self]);
 return self;},
-args: [],
-source: unescape('h1%0A%20%20%20%20%5Eself%20tag%3A%20%27h1%27'),
-messageSends: ["tag:"],
+args: ["anObject"],
+source: unescape('append%3A%20anObject%0A%20%20%20%20anObject%20appendToBrush%3A%20self'),
+messageSends: ["appendToBrush:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h2'),
+unescape('_appendToBrush_'),
 smalltalk.method({
-selector: unescape('h2'),
-category: 'tags',
-fn: function (){
+selector: unescape('appendToBrush%3A'),
+category: 'adding',
+fn: function (aTagBrush){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h2"]);
+smalltalk.send(aTagBrush, "_addBrush_", [self]);
 return self;},
-args: [],
-source: unescape('h2%0A%20%20%20%20%5Eself%20tag%3A%20%27h2%27'),
-messageSends: ["tag:"],
+args: ["aTagBrush"],
+source: unescape('appendToBrush%3A%20aTagBrush%0A%20%20%20%20aTagBrush%20addBrush%3A%20self'),
+messageSends: ["addBrush:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h3'),
+unescape('_appendBlock_'),
 smalltalk.method({
-selector: unescape('h3'),
-category: 'tags',
-fn: function (){
+selector: unescape('appendBlock%3A'),
+category: 'adding',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h3"]);
+var root=nil;
+(root=smalltalk.send(self['@canvas'], "_root", []));
+smalltalk.send(self['@canvas'], "_root_", [self]);
+smalltalk.send(aBlock, "_value_", [self['@canvas']]);
+smalltalk.send(self['@canvas'], "_root_", [root]);
 return self;},
-args: [],
-source: unescape('h3%0A%20%20%20%20%5Eself%20tag%3A%20%27h3%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('appendBlock%3A%20aBlock%0A%20%20%20%20%7C%20root%20%7C%0A%20%20%20%20root%20%3A%3D%20canvas%20root.%0A%20%20%20%20canvas%20root%3A%20self.%0A%20%20%20%20aBlock%20value%3A%20canvas.%0A%20%20%20%20canvas%20root%3A%20root'),
+messageSends: ["root", "root:", "value:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h4'),
+unescape('_appendChild_'),
 smalltalk.method({
-selector: unescape('h4'),
-category: 'tags',
-fn: function (){
+selector: unescape('appendChild%3A'),
+category: 'adding',
+fn: function (anElement){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h4"]);
+var element=self['@element'];
+ 	if (null == element.canHaveChildren || element.canHaveChildren) {
+		element.appendChild(anElement);
+ 	} else {
+ 		element.text = String(element.text) +  anElement.innerHTML;
+ 	} ;
 return self;},
-args: [],
-source: unescape('h4%0A%20%20%20%20%5Eself%20tag%3A%20%27h4%27'),
-messageSends: ["tag:"],
+args: ["anElement"],
+source: unescape('appendChild%3A%20anElement%0A%09%22In%20IE7%20and%20IE8%20appendChild%20fails%20on%20several%20node%20types.%20So%20we%20need%20to%20check%22%20%0A%20%09%3Cvar%20element%3Dself%5B%27@element%27%5D%3B%0A%20%09if%20%28null%20%3D%3D%20element.canHaveChildren%20%7C%7C%20element.canHaveChildren%29%20%7B%0A%09%09element.appendChild%28anElement%29%3B%0A%20%09%7D%20else%20%7B%0A%20%09%09element.text%20%3D%20String%28element.text%29%20+%20%20anElement.innerHTML%3B%0A%20%09%7D%20%3E'),
+messageSends: [],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h5'),
+unescape('_appendString_'),
 smalltalk.method({
-selector: unescape('h5'),
-category: 'tags',
-fn: function (){
+selector: unescape('appendString%3A'),
+category: 'adding',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h5"]);
+smalltalk.send(self, "_appendChild_", [smalltalk.send(self, "_createTextNodeFor_", [aString])]);
 return self;},
-args: [],
-source: unescape('h5%0A%20%20%20%20%5Eself%20tag%3A%20%27h5%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('appendString%3A%20aString%0A%20%20%20%20self%20appendChild%3A%20%28self%20createTextNodeFor%3A%20aString%29'),
+messageSends: ["appendChild:", "createTextNodeFor:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h6'),
+unescape('_empty'),
 smalltalk.method({
-selector: unescape('h6'),
-category: 'tags',
+selector: unescape('empty'),
+category: 'adding',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["h6"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_empty", []);
 return self;},
 args: [],
-source: unescape('h6%0A%20%20%20%20%5Eself%20tag%3A%20%27h6%27'),
-messageSends: ["tag:"],
+source: unescape('empty%0A%09self%20asJQuery%20empty'),
+messageSends: ["empty", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_p'),
+unescape('_at_put_'),
 smalltalk.method({
-selector: unescape('p'),
-category: 'tags',
-fn: function (){
+selector: unescape('at%3Aput%3A'),
+category: 'attributes',
+fn: function (aString, aValue){
 var self=this;
-return smalltalk.send(self, "_tag_", ["p"]);
+self['@element'].setAttribute(aString, aValue);
 return self;},
-args: [],
-source: unescape('p%0A%20%20%20%20%5Eself%20tag%3A%20%27p%27'),
-messageSends: ["tag:"],
+args: ["aString", "aValue"],
+source: unescape('at%3A%20aString%20put%3A%20aValue%0A%20%20%20%20%3Cself%5B%27@element%27%5D.setAttribute%28aString%2C%20aValue%29%3E'),
+messageSends: [],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_div'),
+unescape('_removeAt_'),
 smalltalk.method({
-selector: unescape('div'),
-category: 'tags',
-fn: function (){
+selector: unescape('removeAt%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["div"]);
-return self;},
-args: [],
-source: unescape('div%0A%20%20%20%20%5Eself%20tag%3A%20%27div%27'),
-messageSends: ["tag:"],
+self['@element'].removeAttribute(aString);
+return self;},
+args: ["aString"],
+source: unescape('removeAt%3A%20aString%0A%20%20%20%20%3Cself%5B%27@element%27%5D.removeAttribute%28aString%29%3E'),
+messageSends: [],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_span'),
+unescape('_class_'),
 smalltalk.method({
-selector: unescape('span'),
-category: 'tags',
-fn: function (){
+selector: unescape('class%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["span"]);
+self['@element'].className = aString;
 return self;},
-args: [],
-source: unescape('span%0A%20%20%20%20%5Eself%20tag%3A%20%27span%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('class%3A%20aString%0A%20%20%20%20%20%20%3Cself%5B%27@element%27%5D.className%20%3D%20aString%3E'),
+messageSends: [],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_img'),
+unescape('_id_'),
 smalltalk.method({
-selector: unescape('img'),
-category: 'tags',
-fn: function (){
+selector: unescape('id%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["img"]);
+smalltalk.send(self, "_at_put_", ["id", aString]);
 return self;},
-args: [],
-source: unescape('img%0A%20%20%20%20%5Eself%20tag%3A%20%27img%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('id%3A%20aString%0A%20%20%20%20self%20at%3A%20%27id%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ul'),
+unescape('_src_'),
 smalltalk.method({
-selector: unescape('ul'),
-category: 'tags',
-fn: function (){
+selector: unescape('src%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["ul"]);
+smalltalk.send(self, "_at_put_", ["src", aString]);
 return self;},
-args: [],
-source: unescape('ul%0A%20%20%20%20%5Eself%20tag%3A%20%27ul%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('src%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27src%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ol'),
+unescape('_href_'),
 smalltalk.method({
-selector: unescape('ol'),
-category: 'tags',
-fn: function (){
+selector: unescape('href%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["ol"]);
+smalltalk.send(self, "_at_put_", ["href", aString]);
 return self;},
-args: [],
-source: unescape('ol%0A%20%20%20%20%5Eself%20tag%3A%20%27ol%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('href%3A%20aString%0A%20%20%20%20self%20at%3A%20%27href%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_li'),
+unescape('_title_'),
 smalltalk.method({
-selector: unescape('li'),
-category: 'tags',
-fn: function (){
+selector: unescape('title%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["li"]);
+smalltalk.send(self, "_at_put_", ["title", aString]);
 return self;},
-args: [],
-source: unescape('li%0A%20%20%20%20%5Eself%20tag%3A%20%27li%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('title%3A%20aString%0A%20%20%20%20self%20at%3A%20%27title%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_table'),
+unescape('_style_'),
 smalltalk.method({
-selector: unescape('table'),
-category: 'tags',
-fn: function (){
+selector: unescape('style%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["table"]);
+smalltalk.send(self, "_at_put_", ["style", aString]);
 return self;},
-args: [],
-source: unescape('table%0A%20%20%20%20%5Eself%20tag%3A%20%27table%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('style%3A%20aString%0A%20%20%20%20self%20at%3A%20%27style%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tr'),
+unescape('_type_'),
 smalltalk.method({
-selector: unescape('tr'),
-category: 'tags',
-fn: function (){
+selector: unescape('type%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["tr"]);
+smalltalk.send(self, "_at_put_", ["type", aString]);
 return self;},
-args: [],
-source: unescape('tr%0A%20%20%20%20%5Eself%20tag%3A%20%27tr%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('type%3A%20aString%0A%20%20%20%20self%20at%3A%20%27type%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_td'),
+unescape('_media_'),
 smalltalk.method({
-selector: unescape('td'),
-category: 'tags',
-fn: function (){
+selector: unescape('media%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["td"]);
+smalltalk.send(self, "_at_put_", ["media", aString]);
 return self;},
-args: [],
-source: unescape('td%20%0A%20%20%20%20%5Eself%20tag%3A%20%27td%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('media%3A%20aString%0A%20%20%20%20self%20at%3A%20%27media%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_th'),
+unescape('_rel_'),
 smalltalk.method({
-selector: unescape('th'),
-category: 'tags',
-fn: function (){
+selector: unescape('rel%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["th"]);
+smalltalk.send(self, "_at_put_", ["rel", aString]);
 return self;},
-args: [],
-source: unescape('th%0A%20%20%20%20%5Eself%20tag%3A%20%27th%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('rel%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27rel%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_form'),
+unescape('_width_'),
 smalltalk.method({
-selector: unescape('form'),
-category: 'tags',
-fn: function (){
+selector: unescape('width%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["form"]);
+smalltalk.send(self, "_at_put_", ["width", aString]);
 return self;},
-args: [],
-source: unescape('form%0A%20%20%20%20%5Eself%20tag%3A%20%27form%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('width%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27width%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_input'),
+unescape('_height_'),
 smalltalk.method({
-selector: unescape('input'),
-category: 'tags',
-fn: function (){
+selector: unescape('height%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["input"]);
+smalltalk.send(self, "_at_put_", ["height", aString]);
 return self;},
-args: [],
-source: unescape('input%0A%20%20%20%20%5Eself%20tag%3A%20%27input%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('height%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27height%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_button'),
+unescape('_value_'),
 smalltalk.method({
-selector: unescape('button'),
-category: 'tags',
-fn: function (){
+selector: unescape('value%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["button"]);
+smalltalk.send(self, "_at_put_", ["value", aString]);
 return self;},
-args: [],
-source: unescape('button%0A%20%20%20%20%5Eself%20tag%3A%20%27button%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('value%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27value%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_select'),
+unescape('_asJQuery'),
 smalltalk.method({
-selector: unescape('select'),
-category: 'tags',
+selector: unescape('asJQuery'),
+category: 'converting',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["select"]);
+return smalltalk.send((typeof window == 'undefined' ? nil : window), "_jQuery_", [smalltalk.send(self, "_element", [])]);
 return self;},
 args: [],
-source: unescape('select%0A%20%20%20%20%5Eself%20tag%3A%20%27select%27'),
-messageSends: ["tag:"],
+source: unescape('asJQuery%0A%20%20%20%20%5Ewindow%20jQuery%3A%20self%20element'),
+messageSends: ["jQuery:", "element"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_option'),
+unescape('_onKeyDown_'),
 smalltalk.method({
-selector: unescape('option'),
-category: 'tags',
-fn: function (){
+selector: unescape('onKeyDown%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["option"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keydown", aBlock]);
 return self;},
-args: [],
-source: unescape('option%0A%20%20%20%20%5Eself%20tag%3A%20%27option%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onKeyDown%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27keydown%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_textarea'),
+unescape('_onKeyPress_'),
 smalltalk.method({
-selector: unescape('textarea'),
-category: 'tags',
-fn: function (){
+selector: unescape('onKeyPress%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["textarea"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keypress", aBlock]);
 return self;},
-args: [],
-source: unescape('textarea%0A%20%20%20%20%5Eself%20tag%3A%20%27textarea%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onKeyPress%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27keypress%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_a'),
+unescape('_onKeyUp_'),
 smalltalk.method({
-selector: unescape('a'),
-category: 'tags',
-fn: function (){
+selector: unescape('onKeyUp%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["a"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keyup", aBlock]);
 return self;},
-args: [],
-source: unescape('a%0A%20%20%20%20%5Eself%20tag%3A%20%27a%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onKeyUp%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27keyup%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_canvas'),
+unescape('_onFocus_'),
 smalltalk.method({
-selector: unescape('canvas'),
-category: 'tags',
-fn: function (){
+selector: unescape('onFocus%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["canvas"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focus", aBlock]);
 return self;},
-args: [],
-source: unescape('canvas%0A%09%5Eself%20tag%3A%20%27canvas%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onFocus%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27focus%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_pre'),
+unescape('_onBlur_'),
 smalltalk.method({
-selector: unescape('pre'),
-category: 'tags',
-fn: function (){
+selector: unescape('onBlur%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["pre"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["blur", aBlock]);
 return self;},
-args: [],
-source: unescape('pre%0A%20%20%20%20%5Eself%20tag%3A%20%27pre%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onBlur%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27blur%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_code'),
+unescape('_onChange_'),
 smalltalk.method({
-selector: unescape('code'),
-category: 'tags',
-fn: function (){
+selector: unescape('onChange%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["code"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["change", aBlock]);
 return self;},
-args: [],
-source: unescape('code%0A%20%20%20%20%5Eself%20tag%3A%20%27code%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onChange%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27change%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_br'),
+unescape('_onClick_'),
 smalltalk.method({
-selector: unescape('br'),
-category: 'tags',
-fn: function (){
+selector: unescape('onClick%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["br"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["click", aBlock]);
 return self;},
-args: [],
-source: unescape('br%0A%20%20%20%20%5Eself%20tag%3A%20%27br%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onClick%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27click%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_script'),
+unescape('_initializeFromString_canvas_'),
 smalltalk.method({
-selector: unescape('script'),
-category: 'tags',
-fn: function (){
+selector: unescape('initializeFromString%3Acanvas%3A'),
+category: 'initialization',
+fn: function (aString, aCanvas){
 var self=this;
-return smalltalk.send(self, "_tag_", ["script"]);
+(self['@element']=smalltalk.send(self, "_createElementFor_", [aString]));
+(self['@canvas']=aCanvas);
 return self;},
-args: [],
-source: unescape('script%0A%20%20%20%20%5Eself%20tag%3A%20%27script%27'),
-messageSends: ["tag:"],
+args: ["aString", "aCanvas"],
+source: unescape('initializeFromString%3A%20aString%20canvas%3A%20aCanvas%0A%20%20%20%20element%20%3A%3D%20self%20createElementFor%3A%20aString.%0A%20%20%20%20canvas%20%3A%3D%20aCanvas'),
+messageSends: ["createElementFor:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_link'),
+unescape('_initializeFromJQuery_canvas_'),
 smalltalk.method({
-selector: unescape('link'),
-category: 'tags',
-fn: function (){
+selector: unescape('initializeFromJQuery%3Acanvas%3A'),
+category: 'initialization',
+fn: function (aJQuery, aCanvas){
 var self=this;
-return smalltalk.send(self, "_tag_", ["link"]);
+(self['@element']=smalltalk.send(aJQuery, "_get_", [(0)]));
+(self['@canvas']=aCanvas);
 return self;},
-args: [],
-source: unescape('link%0A%20%20%20%20%5Eself%20tag%3A%20%27link%27'),
-messageSends: ["tag:"],
+args: ["aJQuery", "aCanvas"],
+source: unescape('initializeFromJQuery%3A%20aJQuery%20canvas%3A%20aCanvas%0A%20%20%20%20element%20%3A%3D%20aJQuery%20get%3A%200.%0A%20%20%20%20canvas%20%3A%3D%20aCanvas'),
+messageSends: ["get:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_style'),
+unescape('_createElementFor_'),
 smalltalk.method({
-selector: unescape('style'),
-category: 'tags',
-fn: function (){
+selector: unescape('createElementFor%3A'),
+category: 'private',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send((smalltalk.StyleTag || StyleTag), "_canvas_", [self])]);
+return document.createElement(String(aString));
 return self;},
-args: [],
-source: unescape('style%0A%09%5E%20root%20addBrush%3A%20%20%28StyleTag%20canvas%3A%20self%29'),
-messageSends: ["addBrush:", "canvas:"],
-referencedClasses: ["StyleTag"]
+args: ["aString"],
+source: unescape('createElementFor%3A%20aString%0A%09%3Creturn%20document.createElement%28String%28aString%29%29%3E'),
+messageSends: [],
+referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_p_'),
+unescape('_createTextNodeFor_'),
 smalltalk.method({
-selector: unescape('p%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('createTextNodeFor%3A'),
+category: 'private',
+fn: function (aString){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_p", []), "_with_", [anObject]);
+return document.createTextNode(String(aString));
 return self;},
-args: ["anObject"],
-source: unescape('p%3A%20anObject%0A%20%20%20%20%5Eself%20p%20with%3A%20anObject'),
-messageSends: ["with:", "p"],
+args: ["aString"],
+source: unescape('createTextNodeFor%3A%20aString%0A%09%3Creturn%20document.createTextNode%28String%28aString%29%29%3E'),
+messageSends: [],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h1_'),
+unescape('_onSubmit_'),
 smalltalk.method({
-selector: unescape('h1%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onSubmit%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h1", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["submit", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('h1%3A%20anObject%0A%20%20%20%20%5Eself%20h1%20with%3A%20anObject'),
-messageSends: ["with:", "h1"],
+args: ["aBlock"],
+source: unescape('onSubmit%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27submit%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_iframe'),
+unescape('_onDblClick_'),
 smalltalk.method({
-selector: unescape('iframe'),
-category: 'tags',
-fn: function (){
+selector: unescape('onDblClick%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(self, "_tag_", ["iframe"]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["dblclick", aBlock]);
 return self;},
-args: [],
-source: unescape('iframe%0A%20%20%20%20%5Eself%20tag%3A%20%27iframe%27'),
-messageSends: ["tag:"],
+args: ["aBlock"],
+source: unescape('onDblClick%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27dblclick%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_iframe_'),
+unescape('_onHover_'),
 smalltalk.method({
-selector: unescape('iframe%3A'),
-category: 'tags',
-fn: function (aString){
+selector: unescape('onHover%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_iframe", []), "_src_", [aString]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["hover", aBlock]);
 return self;},
-args: ["aString"],
-source: unescape('iframe%3A%20aString%0A%20%20%20%20%5Eself%20iframe%20src%3A%20aString'),
-messageSends: ["src:", "iframe"],
+args: ["aBlock"],
+source: unescape('onHover%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27hover%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h2_'),
+unescape('_onFocusIn_'),
 smalltalk.method({
-selector: unescape('h2%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onFocusIn%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h2", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusin", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('h2%3A%20anObject%0A%20%20%20%20%5E%20self%20h2%20with%3A%20anObject'),
-messageSends: ["with:", "h2"],
+args: ["aBlock"],
+source: unescape('onFocusIn%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27focusin%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h3_'),
+unescape('_onFocusOut_'),
 smalltalk.method({
-selector: unescape('h3%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onFocusOut%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h3", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusout", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('h3%3A%20anObject%0A%20%20%20%20%5Eself%20h3%20with%3A%20anObject'),
-messageSends: ["with:", "h3"],
+args: ["aBlock"],
+source: unescape('onFocusOut%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27focusout%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h4_'),
+unescape('_onMouseDown_'),
 smalltalk.method({
-selector: unescape('h4%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onMouseDown%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h4", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousedown", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('h4%3A%20anObject%0A%20%20%20%20%5Eself%20h4%20with%3A%20anObject'),
-messageSends: ["with:", "h4"],
+args: ["aBlock"],
+source: unescape('onMouseDown%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mousedown%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h5_'),
+unescape('_onMouseUp_'),
 smalltalk.method({
-selector: unescape('h5%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onMouseUp%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h5", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseup", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('h5%3A%20anObject%0A%20%20%20%20%5Eself%20h5%20with%3A%20anObject'),
-messageSends: ["with:", "h5"],
+args: ["aBlock"],
+source: unescape('onMouseUp%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseup%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_h6_'),
+unescape('_onMouseEnter_'),
 smalltalk.method({
-selector: unescape('h6%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onMouseEnter%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_h6", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseenter", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('h6%3A%20anObject%0A%20%20%20%20%5Eself%20h6%20with%3A%20anObject'),
-messageSends: ["with:", "h6"],
+args: ["aBlock"],
+source: unescape('onMouseEnter%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseenter%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_img_'),
+unescape('_onMouseLeave_'),
 smalltalk.method({
-selector: unescape('img%3A'),
-category: 'tags',
-fn: function (aString){
+selector: unescape('onMouseLeave%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_img", []), "_src_", [aString]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseleave", aBlock]);
 return self;},
-args: ["aString"],
-source: unescape('img%3A%20aString%0A%20%20%20%20%5Eself%20img%20src%3A%20aString'),
-messageSends: ["src:", "img"],
+args: ["aBlock"],
+source: unescape('onMouseLeave%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseleave%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ol_'),
+unescape('_onMouseMove_'),
 smalltalk.method({
-selector: unescape('ol%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onMouseMove%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_ol", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousemove", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('ol%3A%20anObject%0A%20%20%20%20%5Eself%20ol%20with%3A%20anObject'),
-messageSends: ["with:", "ol"],
+args: ["aBlock"],
+source: unescape('onMouseMove%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mousemove%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_li_'),
+unescape('_onMouseOut_'),
 smalltalk.method({
-selector: unescape('li%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onMouseOut%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_li", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseout", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('li%3A%20anObject%0A%20%20%20%20%5Eself%20li%20with%3A%20anObject'),
-messageSends: ["with:", "li"],
+args: ["aBlock"],
+source: unescape('onMouseOut%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseout%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_ul_'),
+unescape('_onMouseOver_'),
 smalltalk.method({
-selector: unescape('ul%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onMouseOver%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_ul", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseover", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('ul%3A%20anObject%0A%20%20%20%20%5Eself%20ul%20with%3A%20anObject'),
-messageSends: ["with:", "ul"],
+args: ["aBlock"],
+source: unescape('onMouseOver%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseover%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_span_'),
+unescape('_onSelect_'),
 smalltalk.method({
-selector: unescape('span%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('onSelect%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_span", []), "_with_", [anObject]);
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["select", aBlock]);
 return self;},
-args: ["anObject"],
-source: unescape('span%3A%20anObject%0A%20%20%20%20%5Eself%20span%20with%3A%20anObject'),
-messageSends: ["with:", "span"],
+args: ["aBlock"],
+source: unescape('onSelect%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27select%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_style_'),
+unescape('_onUnload_'),
 smalltalk.method({
-selector: unescape('style%3A'),
-category: 'tags',
-fn: function (aString){
+selector: unescape('onUnload%3A'),
+category: 'events',
+fn: function (aBlock){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_with_", [aString]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_style", []));
+smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["unload", aBlock]);
 return self;},
-args: ["aString"],
-source: unescape('style%3A%20aString%0A%09%5E%20self%20style%20with%3A%20aString%3B%20yourself'),
-messageSends: ["with:", "yourself", "style"],
+args: ["aBlock"],
+source: unescape('onUnload%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27unload%27%20do%3A%20aBlock'),
+messageSends: ["bind:do:", "asJQuery"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_audio'),
+unescape('_for_'),
 smalltalk.method({
-selector: unescape('audio'),
-category: 'tags',
-fn: function (){
+selector: unescape('for%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["audio"]);
+smalltalk.send(self, "_at_put_", ["for", aString]);
 return self;},
-args: [],
-source: unescape('audio%0A%20%20%20%20%5Eself%20tag%3A%20%27audio%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('for%3A%20aString%0A%09self%20at%3A%20%27for%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_fieldset'),
+unescape('_placeholder_'),
 smalltalk.method({
-selector: unescape('fieldset'),
-category: 'tags',
-fn: function (){
+selector: unescape('placeholder%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["fieldset"]);
+smalltalk.send(self, "_at_put_", ["placeholder", aString]);
 return self;},
-args: [],
-source: unescape('fieldset%0A%20%20%20%20%5Eself%20tag%3A%20%27fieldset%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('placeholder%3A%20aString%0A%09self%20at%3A%20%27placeholder%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_footer'),
+unescape('_accesskey_'),
 smalltalk.method({
-selector: unescape('footer'),
-category: 'tags',
-fn: function (){
+selector: unescape('accesskey%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["footer"]);
+smalltalk.send(self, "_at_put_", ["accesskey", aString]);
 return self;},
-args: [],
-source: unescape('footer%0A%20%20%20%20%5Eself%20tag%3A%20%27footer%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('accesskey%3A%20aString%0A%09self%20at%3A%20%27accesskey%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_header'),
+unescape('_contenteditable_'),
 smalltalk.method({
-selector: unescape('header'),
-category: 'tags',
-fn: function (){
+selector: unescape('contenteditable%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["header"]);
+smalltalk.send(self, "_at_put_", ["contenteditable", aString]);
 return self;},
-args: [],
-source: unescape('header%0A%20%20%20%20%5Eself%20tag%3A%20%27header%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('contenteditable%3A%20aString%0A%09self%20at%3A%20%27contenteditable%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_hr'),
-smalltalk.method({
-selector: unescape('hr'),
-category: 'tags',
-fn: function (){
+unescape('_contextmenu_'),
+smalltalk.method({
+selector: unescape('contextmenu%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["hr"]);
+smalltalk.send(self, "_at_put_", ["contextmenu", aString]);
 return self;},
-args: [],
-source: unescape('hr%0A%20%20%20%20%5Eself%20tag%3A%20%27hr%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('contextmenu%3A%20aString%0A%09self%20at%3A%20%27contextmenu%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_section'),
+unescape('_draggable_'),
 smalltalk.method({
-selector: unescape('section'),
-category: 'tags',
-fn: function (){
+selector: unescape('draggable%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["section"]);
+smalltalk.send(self, "_at_put_", ["draggable", aString]);
 return self;},
-args: [],
-source: unescape('section%0A%20%20%20%20%5Eself%20tag%3A%20%27section%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('draggable%3A%20aString%0A%09self%20at%3A%20%27draggable%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tbody'),
+unescape('_hidden'),
 smalltalk.method({
-selector: unescape('tbody'),
-category: 'tags',
+selector: unescape('hidden'),
+category: 'attributes',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["tbody"]);
+smalltalk.send(self, "_at_put_", ["hidden", "hidden"]);
 return self;},
 args: [],
-source: unescape('tbody%0A%20%20%20%20%5Eself%20tag%3A%20%27tbody%27'),
-messageSends: ["tag:"],
+source: unescape('hidden%0A%09self%20at%3A%20%27hidden%27%20put%3A%20%27hidden%27'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_tfoot'),
+unescape('_tabindex_'),
 smalltalk.method({
-selector: unescape('tfoot'),
-category: 'tags',
-fn: function (){
+selector: unescape('tabindex%3A'),
+category: 'attributes',
+fn: function (aNumber){
 var self=this;
-return smalltalk.send(self, "_tag_", ["tfoot"]);
+smalltalk.send(self, "_at_put_", ["tabindex", aNumber]);
 return self;},
-args: [],
-source: unescape('tfoot%0A%20%20%20%20%5Eself%20tag%3A%20%27tfoot%27'),
-messageSends: ["tag:"],
+args: ["aNumber"],
+source: unescape('tabindex%3A%20aNumber%0A%09self%20at%3A%20%27tabindex%27%20put%3A%20aNumber'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_thead'),
+unescape('_target_'),
 smalltalk.method({
-selector: unescape('thead'),
-category: 'tags',
-fn: function (){
+selector: unescape('target%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["thead"]);
+smalltalk.send(self, "_at_put_", ["target", aString]);
 return self;},
-args: [],
-source: unescape('thead%0A%20%20%20%20%5Eself%20tag%3A%20%27thead%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('target%3A%20aString%0A%09self%20at%3A%20%27target%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_video'),
+unescape('_align_'),
 smalltalk.method({
-selector: unescape('video'),
-category: 'tags',
-fn: function (){
+selector: unescape('align%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["video"]);
+smalltalk.send(self, "_at_put_", ["align", aString]);
 return self;},
-args: [],
-source: unescape('video%0A%20%20%20%20%5Eself%20tag%3A%20%27video%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('align%3A%20aString%0A%09self%20at%3A%20%27align%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_label'),
+unescape('_alt_'),
 smalltalk.method({
-selector: unescape('label'),
-category: 'tags',
-fn: function (){
+selector: unescape('alt%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["label"]);
+smalltalk.send(self, "_at_put_", ["alt", aString]);
 return self;},
-args: [],
-source: unescape('label%0A%09%5Eself%20tag%3A%20%27label%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('alt%3A%20aString%0A%09self%20at%3A%20%27alt%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_title'),
+unescape('_name_'),
 smalltalk.method({
-selector: unescape('title'),
-category: 'tags',
-fn: function (){
+selector: unescape('name%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["title"]);
+smalltalk.send(self, "_at_put_", ["name", aString]);
 return self;},
-args: [],
-source: unescape('title%0A%09%5Eself%20tag%3A%20%27title%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('name%3A%20aString%0A%09self%20at%3A%20%27name%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_time'),
+unescape('_valign_'),
 smalltalk.method({
-selector: unescape('time'),
-category: 'tags',
-fn: function (){
+selector: unescape('valign%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["time"]);
+smalltalk.send(self, "_at_put_", ["valign", aString]);
 return self;},
-args: [],
-source: unescape('time%0A%09%5Eself%20tag%3A%20%27time%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('valign%3A%20aString%0A%09self%20at%3A%20%27valign%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_sup'),
+unescape('_method_'),
 smalltalk.method({
-selector: unescape('sup'),
-category: 'tags',
-fn: function (){
+selector: unescape('method%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["sup"]);
+smalltalk.send(self, "_at_put_", ["method", aString]);
 return self;},
-args: [],
-source: unescape('sup%0A%09%5Eself%20tag%3A%20%27sup%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('method%3A%20aString%0A%09self%20at%3A%20%27method%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_summary'),
+unescape('_action_'),
 smalltalk.method({
-selector: unescape('summary'),
-category: 'tags',
-fn: function (){
+selector: unescape('action%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["summary"]);
+smalltalk.send(self, "_at_put_", ["action", aString]);
 return self;},
-args: [],
-source: unescape('summary%0A%09%5Eself%20tag%3A%20%27summary%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('action%3A%20aString%0A%09self%20at%3A%20%27action%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_sub'),
+unescape('_rows_'),
 smalltalk.method({
-selector: unescape('sub'),
-category: 'tags',
-fn: function (){
+selector: unescape('rows%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["sub"]);
+smalltalk.send(self, "_at_put_", ["rows", aString]);
 return self;},
-args: [],
-source: unescape('sub%0A%09%5Eself%20tag%3A%20%27sub%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('rows%3A%20aString%0A%09self%20at%3A%20%27rows%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
 
 smalltalk.addMethod(
-unescape('_strong'),
+unescape('_cols_'),
 smalltalk.method({
-selector: unescape('strong'),
-category: 'tags',
-fn: function (){
+selector: unescape('cols%3A'),
+category: 'attributes',
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["strong"]);
+smalltalk.send(self, "_at_put_", ["cols", aString]);
 return self;},
-args: [],
-source: unescape('strong%0A%09%5Eself%20tag%3A%20%27strong%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('cols%3A%20aString%0A%09self%20at%3A%20%27cols%27%20put%3A%20aString'),
+messageSends: ["at:put:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush);
+
 
 smalltalk.addMethod(
-unescape('_strong_'),
+unescape('_fromString_canvas_'),
 smalltalk.method({
-selector: unescape('strong%3A'),
-category: 'tags',
-fn: function (anObject){
+selector: unescape('fromString%3Acanvas%3A'),
+category: 'instance creation',
+fn: function (aString, aCanvas){
 var self=this;
-return smalltalk.send(smalltalk.send(self, "_strong", []), "_with_", [anObject]);
+return (function($rec){smalltalk.send($rec, "_initializeFromString_canvas_", [aString, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
 return self;},
-args: ["anObject"],
-source: unescape('strong%3A%20anObject%0A%09%5Eself%20strong%20with%3A%20anObject'),
-messageSends: ["with:", "strong"],
+args: ["aString", "aCanvas"],
+source: unescape('fromString%3A%20aString%20canvas%3A%20aCanvas%0A%20%20%20%20%5Eself%20new%0A%09initializeFromString%3A%20aString%20canvas%3A%20aCanvas%3B%0A%09yourself'),
+messageSends: ["initializeFromString:canvas:", "yourself", "new"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush.klass);
 
 smalltalk.addMethod(
-unescape('_source'),
+unescape('_fromJQuery_canvas_'),
 smalltalk.method({
-selector: unescape('source'),
-category: 'tags',
-fn: function (){
+selector: unescape('fromJQuery%3Acanvas%3A'),
+category: 'instance creation',
+fn: function (aJQuery, aCanvas){
 var self=this;
-return smalltalk.send(self, "_tag_", ["source"]);
+return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_canvas_", [aJQuery, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
 return self;},
-args: [],
-source: unescape('source%0A%09%5Eself%20tag%3A%20%27source%27'),
-messageSends: ["tag:"],
+args: ["aJQuery", "aCanvas"],
+source: unescape('fromJQuery%3A%20aJQuery%20canvas%3A%20aCanvas%0A%20%20%20%20%5Eself%20new%0A%09initializeFromJQuery%3A%20aJQuery%20canvas%3A%20aCanvas%3B%0A%09yourself'),
+messageSends: ["initializeFromJQuery:canvas:", "yourself", "new"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas);
+smalltalk.TagBrush.klass);
 
+
+smalltalk.addClass('HTMLCanvas', smalltalk.Object, ['root'], 'Canvas');
 smalltalk.addMethod(
-unescape('_small'),
+unescape('_root_'),
 smalltalk.method({
-selector: unescape('small'),
-category: 'tags',
-fn: function (){
+selector: unescape('root%3A'),
+category: 'accessing',
+fn: function (aTagBrush){
 var self=this;
-return smalltalk.send(self, "_tag_", ["small"]);
+(self['@root']=aTagBrush);
 return self;},
-args: [],
-source: unescape('small%0A%09%5Eself%20tag%3A%20%27small%27'),
-messageSends: ["tag:"],
+args: ["aTagBrush"],
+source: unescape('root%3A%20aTagBrush%0A%20%20%20%20root%20%3A%3D%20aTagBrush'),
+messageSends: [],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_progress'),
+unescape('_root'),
 smalltalk.method({
-selector: unescape('progress'),
-category: 'tags',
+selector: unescape('root'),
+category: 'accessing',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["progress"]);
+return self['@root'];
 return self;},
 args: [],
-source: unescape('progress%0A%09%5Eself%20tag%3A%20%27progress%27'),
-messageSends: ["tag:"],
+source: unescape('root%0A%20%20%20%20%5Eroot'),
+messageSends: [],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_param'),
+unescape('_with_'),
 smalltalk.method({
-selector: unescape('param'),
-category: 'tags',
-fn: function (){
+selector: unescape('with%3A'),
+category: 'adding',
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self, "_tag_", ["param"]);
+return smalltalk.send(smalltalk.send(self, "_root", []), "_with_", [anObject]);
 return self;},
-args: [],
-source: unescape('param%0A%09%5Eself%20tag%3A%20%27param%27'),
-messageSends: ["tag:"],
+args: ["anObject"],
+source: unescape('with%3A%20anObject%0A%20%20%20%20%5Eself%20root%20with%3A%20anObject'),
+messageSends: ["with:", "root"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_output'),
+unescape('_initialize'),
 smalltalk.method({
-selector: unescape('output'),
-category: 'tags',
+selector: unescape('initialize'),
+category: 'initialization',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["output"]);
+smalltalk.send(self, "_initialize", [], smalltalk.Object);
+(($receiver = self['@root']) == nil || $receiver == undefined) ? (function(){return (self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", ["div", self]));})() : $receiver;
 return self;},
 args: [],
-source: unescape('output%0A%09%5Eself%20tag%3A%20%27output%27'),
-messageSends: ["tag:"],
-referencedClasses: []
+source: unescape('initialize%0A%20%20%20%20super%20initialize.%0A%20%20%20%20root%20ifNil%3A%20%5Broot%20%3A%3D%20TagBrush%20fromString%3A%20%27div%27%20canvas%3A%20self%5D'),
+messageSends: ["initialize", "ifNil:", "fromString:canvas:"],
+referencedClasses: ["TagBrush"]
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_optgroup'),
+unescape('_initializeFromJQuery_'),
 smalltalk.method({
-selector: unescape('optgroup'),
-category: 'tags',
-fn: function (){
+selector: unescape('initializeFromJQuery%3A'),
+category: 'initialization',
+fn: function (aJQuery){
 var self=this;
-return smalltalk.send(self, "_tag_", ["optgroup"]);
+(self['@root']=smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromJQuery_canvas_", [aJQuery, self]));
 return self;},
-args: [],
-source: unescape('optgroup%0A%09%5Eself%20tag%3A%20%27optgroup%27'),
-messageSends: ["tag:"],
-referencedClasses: []
+args: ["aJQuery"],
+source: unescape('initializeFromJQuery%3A%20aJQuery%0A%20%20%20%20root%20%3A%3D%20TagBrush%20fromJQuery%3A%20aJQuery%20canvas%3A%20self'),
+messageSends: ["fromJQuery:canvas:"],
+referencedClasses: ["TagBrush"]
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_object'),
+unescape('_newTag_'),
 smalltalk.method({
-selector: unescape('object'),
+selector: unescape('newTag%3A'),
 category: 'tags',
-fn: function (){
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["object"]);
+return smalltalk.send((smalltalk.TagBrush || TagBrush), "_fromString_canvas_", [aString, self]);
 return self;},
-args: [],
-source: unescape('object%0A%09%5Eself%20tag%3A%20%27object%27'),
-messageSends: ["tag:"],
-referencedClasses: []
+args: ["aString"],
+source: unescape('newTag%3A%20aString%0A%20%20%20%20%5ETagBrush%20fromString%3A%20aString%20canvas%3A%20self'),
+messageSends: ["fromString:canvas:"],
+referencedClasses: ["TagBrush"]
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_noscript'),
+unescape('_tag_'),
 smalltalk.method({
-selector: unescape('noscript'),
+selector: unescape('tag%3A'),
 category: 'tags',
-fn: function (){
+fn: function (aString){
 var self=this;
-return smalltalk.send(self, "_tag_", ["noscript"]);
+return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send(self, "_newTag_", [aString])]);
 return self;},
-args: [],
-source: unescape('noscript%0A%09%5Eself%20tag%3A%20%27noscript%27'),
-messageSends: ["tag:"],
+args: ["aString"],
+source: unescape('tag%3A%20aString%0A%20%20%20%20%5Eroot%20addBrush%3A%20%28self%20newTag%3A%20aString%29'),
+messageSends: ["addBrush:", "newTag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_nav'),
+unescape('_h1'),
 smalltalk.method({
-selector: unescape('nav'),
+selector: unescape('h1'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["nav"]);
+return smalltalk.send(self, "_tag_", ["h1"]);
 return self;},
 args: [],
-source: unescape('nav%0A%09%5Eself%20tag%3A%20%27nav%27'),
+source: unescape('h1%0A%20%20%20%20%5Eself%20tag%3A%20%27h1%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_meta'),
+unescape('_h2'),
 smalltalk.method({
-selector: unescape('meta'),
+selector: unescape('h2'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["meta"]);
+return smalltalk.send(self, "_tag_", ["h2"]);
 return self;},
 args: [],
-source: unescape('meta%0A%09%5Eself%20tag%3A%20%27meta%27'),
+source: unescape('h2%0A%20%20%20%20%5Eself%20tag%3A%20%27h2%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_menu'),
+unescape('_h3'),
 smalltalk.method({
-selector: unescape('menu'),
+selector: unescape('h3'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["menu"]);
+return smalltalk.send(self, "_tag_", ["h3"]);
 return self;},
 args: [],
-source: unescape('menu%0A%09%5Eself%20tag%3A%20%27menu%27'),
+source: unescape('h3%0A%20%20%20%20%5Eself%20tag%3A%20%27h3%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_mark'),
+unescape('_h4'),
 smalltalk.method({
-selector: unescape('mark'),
+selector: unescape('h4'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["mark"]);
+return smalltalk.send(self, "_tag_", ["h4"]);
 return self;},
 args: [],
-source: unescape('mark%0A%09%5Eself%20tag%3A%20%27mark%27'),
+source: unescape('h4%0A%20%20%20%20%5Eself%20tag%3A%20%27h4%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_map'),
+unescape('_h5'),
 smalltalk.method({
-selector: unescape('map'),
+selector: unescape('h5'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["map"]);
+return smalltalk.send(self, "_tag_", ["h5"]);
 return self;},
 args: [],
-source: unescape('map%0A%09%5Eself%20tag%3A%20%27map%27'),
+source: unescape('h5%0A%20%20%20%20%5Eself%20tag%3A%20%27h5%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_legend'),
+unescape('_h6'),
 smalltalk.method({
-selector: unescape('legend'),
+selector: unescape('h6'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["legend"]);
+return smalltalk.send(self, "_tag_", ["h6"]);
 return self;},
 args: [],
-source: unescape('legend%0A%09%5Eself%20tag%3A%20%27legend%27'),
+source: unescape('h6%0A%20%20%20%20%5Eself%20tag%3A%20%27h6%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_html'),
+unescape('_p'),
 smalltalk.method({
-selector: unescape('html'),
+selector: unescape('p'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["html"]);
+return smalltalk.send(self, "_tag_", ["p"]);
 return self;},
 args: [],
-source: unescape('html%0A%09%5Eself%20tag%3A%20%27html%27'),
+source: unescape('p%0A%20%20%20%20%5Eself%20tag%3A%20%27p%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_hgroup'),
+unescape('_div'),
 smalltalk.method({
-selector: unescape('hgroup'),
+selector: unescape('div'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["hgroup"]);
+return smalltalk.send(self, "_tag_", ["div"]);
 return self;},
 args: [],
-source: unescape('hgroup%0A%09%5Eself%20tag%3A%20%27hgroup%27'),
+source: unescape('div%0A%20%20%20%20%5Eself%20tag%3A%20%27div%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_head'),
+unescape('_span'),
 smalltalk.method({
-selector: unescape('head'),
+selector: unescape('span'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["head"]);
+return smalltalk.send(self, "_tag_", ["span"]);
 return self;},
 args: [],
-source: unescape('head%0A%09%5Eself%20tag%3A%20%27head%27'),
+source: unescape('span%0A%20%20%20%20%5Eself%20tag%3A%20%27span%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_figure'),
+unescape('_img'),
 smalltalk.method({
-selector: unescape('figure'),
+selector: unescape('img'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["figure"]);
+return smalltalk.send(self, "_tag_", ["img"]);
 return self;},
 args: [],
-source: unescape('figure%0A%09%5Eself%20tag%3A%20%27figure%27'),
+source: unescape('img%0A%20%20%20%20%5Eself%20tag%3A%20%27img%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_figcaption'),
+unescape('_ul'),
 smalltalk.method({
-selector: unescape('figcaption'),
+selector: unescape('ul'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["figcaption"]);
+return smalltalk.send(self, "_tag_", ["ul"]);
 return self;},
 args: [],
-source: unescape('figcaption%0A%09%5Eself%20tag%3A%20%27figcaption%27'),
+source: unescape('ul%0A%20%20%20%20%5Eself%20tag%3A%20%27ul%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_embed'),
+unescape('_ol'),
 smalltalk.method({
-selector: unescape('embed'),
+selector: unescape('ol'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["embed"]);
+return smalltalk.send(self, "_tag_", ["ol"]);
 return self;},
 args: [],
-source: unescape('embed%0A%09%5Eself%20tag%3A%20%27embed%27'),
+source: unescape('ol%0A%20%20%20%20%5Eself%20tag%3A%20%27ol%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_em'),
+unescape('_li'),
 smalltalk.method({
-selector: unescape('em'),
+selector: unescape('li'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["em"]);
+return smalltalk.send(self, "_tag_", ["li"]);
 return self;},
 args: [],
-source: unescape('em%0A%09%5Eself%20tag%3A%20%27em%27'),
+source: unescape('li%0A%20%20%20%20%5Eself%20tag%3A%20%27li%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_dt'),
+unescape('_table'),
 smalltalk.method({
-selector: unescape('dt'),
+selector: unescape('table'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["dt"]);
+return smalltalk.send(self, "_tag_", ["table"]);
 return self;},
 args: [],
-source: unescape('dt%0A%09%5Eself%20tag%3A%20%27dt%27'),
+source: unescape('table%0A%20%20%20%20%5Eself%20tag%3A%20%27table%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_dl'),
+unescape('_tr'),
 smalltalk.method({
-selector: unescape('dl'),
+selector: unescape('tr'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["dl"]);
+return smalltalk.send(self, "_tag_", ["tr"]);
 return self;},
 args: [],
-source: unescape('dl%0A%09%5Eself%20tag%3A%20%27dl%27'),
+source: unescape('tr%0A%20%20%20%20%5Eself%20tag%3A%20%27tr%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_details'),
+unescape('_td'),
 smalltalk.method({
-selector: unescape('details'),
+selector: unescape('td'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["details"]);
+return smalltalk.send(self, "_tag_", ["td"]);
 return self;},
 args: [],
-source: unescape('details%0A%09%5Eself%20tag%3A%20%27details%27'),
+source: unescape('td%20%0A%20%20%20%20%5Eself%20tag%3A%20%27td%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_del'),
+unescape('_th'),
 smalltalk.method({
-selector: unescape('del'),
+selector: unescape('th'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["del"]);
+return smalltalk.send(self, "_tag_", ["th"]);
 return self;},
 args: [],
-source: unescape('del%0A%09%5Eself%20tag%3A%20%27del%27'),
+source: unescape('th%0A%20%20%20%20%5Eself%20tag%3A%20%27th%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_dd'),
+unescape('_form'),
 smalltalk.method({
-selector: unescape('dd'),
+selector: unescape('form'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["dd"]);
+return smalltalk.send(self, "_tag_", ["form"]);
 return self;},
 args: [],
-source: unescape('dd%0A%09%5Eself%20tag%3A%20%27dd%27'),
+source: unescape('form%0A%20%20%20%20%5Eself%20tag%3A%20%27form%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_datalist'),
+unescape('_input'),
 smalltalk.method({
-selector: unescape('datalist'),
+selector: unescape('input'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["datalist"]);
+return smalltalk.send(self, "_tag_", ["input"]);
 return self;},
 args: [],
-source: unescape('datalist%0A%09%5Eself%20tag%3A%20%27datalist%27'),
+source: unescape('input%0A%20%20%20%20%5Eself%20tag%3A%20%27input%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_command'),
+unescape('_button'),
 smalltalk.method({
-selector: unescape('command'),
+selector: unescape('button'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["command"]);
+return smalltalk.send(self, "_tag_", ["button"]);
 return self;},
 args: [],
-source: unescape('command%0A%09%5Eself%20tag%3A%20%27command%27'),
+source: unescape('button%0A%20%20%20%20%5Eself%20tag%3A%20%27button%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_colgroup'),
+unescape('_select'),
 smalltalk.method({
-selector: unescape('colgroup'),
+selector: unescape('select'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["colgroup"]);
+return smalltalk.send(self, "_tag_", ["select"]);
 return self;},
 args: [],
-source: unescape('colgroup%0A%09%5Eself%20tag%3A%20%27colgroup%27'),
+source: unescape('select%0A%20%20%20%20%5Eself%20tag%3A%20%27select%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_col'),
+unescape('_option'),
 smalltalk.method({
-selector: unescape('col'),
+selector: unescape('option'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["col"]);
+return smalltalk.send(self, "_tag_", ["option"]);
 return self;},
 args: [],
-source: unescape('col%0A%09%5Eself%20tag%3A%20%27col%27'),
+source: unescape('option%0A%20%20%20%20%5Eself%20tag%3A%20%27option%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_cite'),
+unescape('_textarea'),
 smalltalk.method({
-selector: unescape('cite'),
+selector: unescape('textarea'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["cite"]);
+return smalltalk.send(self, "_tag_", ["textarea"]);
 return self;},
 args: [],
-source: unescape('cite%0A%09%5Eself%20tag%3A%20%27cite%27'),
+source: unescape('textarea%0A%20%20%20%20%5Eself%20tag%3A%20%27textarea%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_caption'),
+unescape('_a'),
 smalltalk.method({
-selector: unescape('caption'),
+selector: unescape('a'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["caption"]);
+return smalltalk.send(self, "_tag_", ["a"]);
 return self;},
 args: [],
-source: unescape('caption%0A%09%5Eself%20tag%3A%20%27caption%27'),
+source: unescape('a%0A%20%20%20%20%5Eself%20tag%3A%20%27a%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_body'),
+unescape('_canvas'),
 smalltalk.method({
-selector: unescape('body'),
+selector: unescape('canvas'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["body"]);
+return smalltalk.send(self, "_tag_", ["canvas"]);
 return self;},
 args: [],
-source: unescape('body%0A%09%5Eself%20tag%3A%20%27body%27'),
+source: unescape('canvas%0A%09%5Eself%20tag%3A%20%27canvas%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_blockquote'),
+unescape('_pre'),
 smalltalk.method({
-selector: unescape('blockquote'),
+selector: unescape('pre'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["blockquote"]);
+return smalltalk.send(self, "_tag_", ["pre"]);
 return self;},
 args: [],
-source: unescape('blockquote%0A%09%5Eself%20tag%3A%20%27blockquote%27'),
+source: unescape('pre%0A%20%20%20%20%5Eself%20tag%3A%20%27pre%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_base'),
+unescape('_code'),
 smalltalk.method({
-selector: unescape('base'),
+selector: unescape('code'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["base"]);
+return smalltalk.send(self, "_tag_", ["code"]);
 return self;},
 args: [],
-source: unescape('base%0A%09%5Eself%20tag%3A%20%27base%27'),
+source: unescape('code%0A%20%20%20%20%5Eself%20tag%3A%20%27code%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_aside'),
+unescape('_br'),
 smalltalk.method({
-selector: unescape('aside'),
+selector: unescape('br'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["aside"]);
+return smalltalk.send(self, "_tag_", ["br"]);
 return self;},
 args: [],
-source: unescape('aside%0A%09%5Eself%20tag%3A%20%27aside%27'),
+source: unescape('br%0A%20%20%20%20%5Eself%20tag%3A%20%27br%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_article'),
+unescape('_script'),
 smalltalk.method({
-selector: unescape('article'),
+selector: unescape('script'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["article"]);
+return smalltalk.send(self, "_tag_", ["script"]);
 return self;},
 args: [],
-source: unescape('article%0A%20%20%20%20%5Eself%20tag%3A%20%27article%27'),
+source: unescape('script%0A%20%20%20%20%5Eself%20tag%3A%20%27script%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_area'),
+unescape('_link'),
 smalltalk.method({
-selector: unescape('area'),
+selector: unescape('link'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["area"]);
+return smalltalk.send(self, "_tag_", ["link"]);
 return self;},
 args: [],
-source: unescape('area%0A%09%5Eself%20tag%3A%20%27area%27'),
+source: unescape('link%0A%20%20%20%20%5Eself%20tag%3A%20%27link%27'),
 messageSends: ["tag:"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_address'),
+unescape('_style'),
 smalltalk.method({
-selector: unescape('address'),
+selector: unescape('style'),
 category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(self, "_tag_", ["address"]);
+return smalltalk.send(self['@root'], "_addBrush_", [smalltalk.send((smalltalk.StyleTag || StyleTag), "_canvas_", [self])]);
 return self;},
 args: [],
-source: unescape('address%0A%09%5Eself%20tag%3A%20%27address%27'),
-messageSends: ["tag:"],
-referencedClasses: []
+source: unescape('style%0A%09%5E%20root%20addBrush%3A%20%20%28StyleTag%20canvas%3A%20self%29'),
+messageSends: ["addBrush:", "canvas:"],
+referencedClasses: ["StyleTag"]
 }),
 smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_abbr'),
+unescape('_p_'),
 smalltalk.method({
-selector: unescape('abbr'),
+selector: unescape('p%3A'),
 category: 'tags',
-fn: function (){
+fn: function (anObject){
 var self=this;
-return smalltalk.send(self, "_tag_", ["abbr"]);
+return smalltalk.send(smalltalk.send(self, "_p", []), "_with_", [anObject]);
 return self;},
-args: [],
-source: unescape('abbr%0A%09%5Eself%20tag%3A%20%27abbr%27'),
-messageSends: ["tag:"],
+args: ["anObject"],
+source: unescape('p%3A%20anObject%0A%20%20%20%20%5Eself%20p%20with%3A%20anObject'),
+messageSends: ["with:", "p"],
 referencedClasses: []
 }),
 smalltalk.HTMLCanvas);
 
-
 smalltalk.addMethod(
-unescape('_onJQuery_'),
+unescape('_h1_'),
 smalltalk.method({
-selector: unescape('onJQuery%3A'),
-category: 'instance creation',
-fn: function (aJQuery){
+selector: unescape('h1%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_", [aJQuery]);smalltalk.send($rec, "_initialize", []);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_basicNew", []));
+return smalltalk.send(smalltalk.send(self, "_h1", []), "_with_", [anObject]);
 return self;},
-args: ["aJQuery"],
-source: unescape('onJQuery%3A%20aJQuery%0A%09%5Eself%20basicNew%0A%09%09initializeFromJQuery%3A%20aJQuery%3B%0A%09%09initialize%3B%0A%09%09yourself'),
-messageSends: ["initializeFromJQuery:", "initialize", "yourself", "basicNew"],
+args: ["anObject"],
+source: unescape('h1%3A%20anObject%0A%20%20%20%20%5Eself%20h1%20with%3A%20anObject'),
+messageSends: ["with:", "h1"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isMSIE'),
+unescape('_iframe'),
 smalltalk.method({
-selector: unescape('isMSIE'),
-category: 'instance creation',
+selector: unescape('iframe'),
+category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("msie")]), "_notNil", []);
+return smalltalk.send(self, "_tag_", ["iframe"]);
 return self;},
 args: [],
-source: unescape('isMSIE%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23msie%29%20notNil'),
-messageSends: ["notNil", "at:"],
+source: unescape('iframe%0A%20%20%20%20%5Eself%20tag%3A%20%27iframe%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isOpera'),
+unescape('_iframe_'),
 smalltalk.method({
-selector: unescape('isOpera'),
-category: 'instance creation',
-fn: function (){
+selector: unescape('iframe%3A'),
+category: 'tags',
+fn: function (aString){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("opera")]), "_notNil", []);
+return smalltalk.send(smalltalk.send(self, "_iframe", []), "_src_", [aString]);
 return self;},
-args: [],
-source: unescape('isOpera%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23opera%29%20notNil'),
-messageSends: ["notNil", "at:"],
+args: ["aString"],
+source: unescape('iframe%3A%20aString%0A%20%20%20%20%5Eself%20iframe%20src%3A%20aString'),
+messageSends: ["src:", "iframe"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isMozilla'),
+unescape('_h2_'),
 smalltalk.method({
-selector: unescape('isMozilla'),
-category: 'instance creation',
-fn: function (){
+selector: unescape('h2%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("mozilla")]), "_notNil", []);
+return smalltalk.send(smalltalk.send(self, "_h2", []), "_with_", [anObject]);
 return self;},
-args: [],
-source: unescape('isMozilla%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23mozilla%29%20notNil'),
-messageSends: ["notNil", "at:"],
+args: ["anObject"],
+source: unescape('h2%3A%20anObject%0A%20%20%20%20%5E%20self%20h2%20with%3A%20anObject'),
+messageSends: ["with:", "h2"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_isWebkit'),
+unescape('_h3_'),
 smalltalk.method({
-selector: unescape('isWebkit'),
-category: 'instance creation',
-fn: function (){
+selector: unescape('h3%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("webkit")]), "_notNil", []);
+return smalltalk.send(smalltalk.send(self, "_h3", []), "_with_", [anObject]);
 return self;},
-args: [],
-source: unescape('isWebkit%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23webkit%29%20notNil'),
-messageSends: ["notNil", "at:"],
+args: ["anObject"],
+source: unescape('h3%3A%20anObject%0A%20%20%20%20%5Eself%20h3%20with%3A%20anObject'),
+messageSends: ["with:", "h3"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas.klass);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_browserVersion'),
+unescape('_h4_'),
 smalltalk.method({
-selector: unescape('browserVersion'),
-category: 'instance creation',
-fn: function (){
+selector: unescape('h4%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-return smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_version", []);
+return smalltalk.send(smalltalk.send(self, "_h4", []), "_with_", [anObject]);
 return self;},
-args: [],
-source: unescape('browserVersion%0A%09%5E%28jQuery%20at%3A%20%23browser%29%20version'),
-messageSends: ["version", "at:"],
+args: ["anObject"],
+source: unescape('h4%3A%20anObject%0A%20%20%20%20%5Eself%20h4%20with%3A%20anObject'),
+messageSends: ["with:", "h4"],
 referencedClasses: []
 }),
-smalltalk.HTMLCanvas.klass);
-
+smalltalk.HTMLCanvas);
 
-smalltalk.addClass('TagBrush', smalltalk.Object, ['canvas', 'element'], 'Canvas');
 smalltalk.addMethod(
-unescape('_element'),
+unescape('_h5_'),
 smalltalk.method({
-selector: unescape('element'),
-category: 'accessing',
-fn: function (){
+selector: unescape('h5%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-return self['@element'];
+return smalltalk.send(smalltalk.send(self, "_h5", []), "_with_", [anObject]);
 return self;},
-args: [],
-source: unescape('element%0A%20%20%20%20%5Eelement'),
-messageSends: [],
+args: ["anObject"],
+source: unescape('h5%3A%20anObject%0A%20%20%20%20%5Eself%20h5%20with%3A%20anObject'),
+messageSends: ["with:", "h5"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_contents_'),
+unescape('_h6_'),
 smalltalk.method({
-selector: unescape('contents%3A'),
-category: 'adding',
+selector: unescape('h6%3A'),
+category: 'tags',
 fn: function (anObject){
 var self=this;
-(function($rec){smalltalk.send($rec, "_empty", []);return smalltalk.send($rec, "_append_", [anObject]);})(self);
+return smalltalk.send(smalltalk.send(self, "_h6", []), "_with_", [anObject]);
 return self;},
 args: ["anObject"],
-source: unescape('contents%3A%20anObject%0A%20%20%20%20self%20%0A%09empty%3B%0A%20%20%20%09append%3A%20anObject'),
-messageSends: ["empty", "append:"],
+source: unescape('h6%3A%20anObject%0A%20%20%20%20%5Eself%20h6%20with%3A%20anObject'),
+messageSends: ["with:", "h6"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_addBrush_'),
+unescape('_img_'),
 smalltalk.method({
-selector: unescape('addBrush%3A'),
-category: 'adding',
-fn: function (aTagBrush){
+selector: unescape('img%3A'),
+category: 'tags',
+fn: function (aString){
 var self=this;
-smalltalk.send(self, "_appendChild_", [smalltalk.send(aTagBrush, "_element", [])]);
-return aTagBrush;
+return smalltalk.send(smalltalk.send(self, "_img", []), "_src_", [aString]);
 return self;},
-args: ["aTagBrush"],
-source: unescape('addBrush%3A%20aTagBrush%0A%20%20%20%20self%20appendChild%3A%20aTagBrush%20element.%0A%20%20%20%20%5EaTagBrush'),
-messageSends: ["appendChild:", "element"],
+args: ["aString"],
+source: unescape('img%3A%20aString%0A%20%20%20%20%5Eself%20img%20src%3A%20aString'),
+messageSends: ["src:", "img"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_with_'),
+unescape('_ol_'),
 smalltalk.method({
-selector: unescape('with%3A'),
-category: 'adding',
+selector: unescape('ol%3A'),
+category: 'tags',
 fn: function (anObject){
 var self=this;
-smalltalk.send(self, "_append_", [anObject]);
+return smalltalk.send(smalltalk.send(self, "_ol", []), "_with_", [anObject]);
 return self;},
 args: ["anObject"],
-source: unescape('with%3A%20anObject%0A%20%20%20%20self%20append%3A%20anObject'),
-messageSends: ["append:"],
+source: unescape('ol%3A%20anObject%0A%20%20%20%20%5Eself%20ol%20with%3A%20anObject'),
+messageSends: ["with:", "ol"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_append_'),
+unescape('_li_'),
 smalltalk.method({
-selector: unescape('append%3A'),
-category: 'adding',
+selector: unescape('li%3A'),
+category: 'tags',
 fn: function (anObject){
 var self=this;
-smalltalk.send(anObject, "_appendToBrush_", [self]);
+return smalltalk.send(smalltalk.send(self, "_li", []), "_with_", [anObject]);
 return self;},
 args: ["anObject"],
-source: unescape('append%3A%20anObject%0A%20%20%20%20anObject%20appendToBrush%3A%20self'),
-messageSends: ["appendToBrush:"],
+source: unescape('li%3A%20anObject%0A%20%20%20%20%5Eself%20li%20with%3A%20anObject'),
+messageSends: ["with:", "li"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendToBrush_'),
+unescape('_ul_'),
 smalltalk.method({
-selector: unescape('appendToBrush%3A'),
-category: 'adding',
-fn: function (aTagBrush){
+selector: unescape('ul%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-smalltalk.send(aTagBrush, "_addBrush_", [self]);
+return smalltalk.send(smalltalk.send(self, "_ul", []), "_with_", [anObject]);
 return self;},
-args: ["aTagBrush"],
-source: unescape('appendToBrush%3A%20aTagBrush%0A%20%20%20%20aTagBrush%20addBrush%3A%20self'),
-messageSends: ["addBrush:"],
+args: ["anObject"],
+source: unescape('ul%3A%20anObject%0A%20%20%20%20%5Eself%20ul%20with%3A%20anObject'),
+messageSends: ["with:", "ul"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendBlock_'),
+unescape('_span_'),
 smalltalk.method({
-selector: unescape('appendBlock%3A'),
-category: 'adding',
-fn: function (aBlock){
+selector: unescape('span%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-var root=nil;
-(root=smalltalk.send(self['@canvas'], "_root", []));
-smalltalk.send(self['@canvas'], "_root_", [self]);
-smalltalk.send(aBlock, "_value_", [self['@canvas']]);
-smalltalk.send(self['@canvas'], "_root_", [root]);
+return smalltalk.send(smalltalk.send(self, "_span", []), "_with_", [anObject]);
 return self;},
-args: ["aBlock"],
-source: unescape('appendBlock%3A%20aBlock%0A%20%20%20%20%7C%20root%20%7C%0A%20%20%20%20root%20%3A%3D%20canvas%20root.%0A%20%20%20%20canvas%20root%3A%20self.%0A%20%20%20%20aBlock%20value%3A%20canvas.%0A%20%20%20%20canvas%20root%3A%20root'),
-messageSends: ["root", "root:", "value:"],
+args: ["anObject"],
+source: unescape('span%3A%20anObject%0A%20%20%20%20%5Eself%20span%20with%3A%20anObject'),
+messageSends: ["with:", "span"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendChild_'),
+unescape('_style_'),
 smalltalk.method({
-selector: unescape('appendChild%3A'),
-category: 'adding',
-fn: function (anElement){
+selector: unescape('style%3A'),
+category: 'tags',
+fn: function (aString){
 var self=this;
-var element=self['@element'];
- 	if (null == element.canHaveChildren || element.canHaveChildren) {
-		element.appendChild(anElement);
- 	} else {
- 		element.text = String(element.text) +  anElement.innerHTML;
- 	} ;
+return (function($rec){smalltalk.send($rec, "_with_", [aString]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_style", []));
 return self;},
-args: ["anElement"],
-source: unescape('appendChild%3A%20anElement%0A%09%22In%20IE7%20and%20IE8%20appendChild%20fails%20on%20several%20node%20types.%20So%20we%20need%20to%20check%22%20%0A%20%09%3Cvar%20element%3Dself%5B%27@element%27%5D%3B%0A%20%09if%20%28null%20%3D%3D%20element.canHaveChildren%20%7C%7C%20element.canHaveChildren%29%20%7B%0A%09%09element.appendChild%28anElement%29%3B%0A%20%09%7D%20else%20%7B%0A%20%09%09element.text%20%3D%20String%28element.text%29%20+%20%20anElement.innerHTML%3B%0A%20%09%7D%20%3E'),
-messageSends: [],
+args: ["aString"],
+source: unescape('style%3A%20aString%0A%09%5E%20self%20style%20with%3A%20aString%3B%20yourself'),
+messageSends: ["with:", "yourself", "style"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_appendString_'),
+unescape('_audio'),
 smalltalk.method({
-selector: unescape('appendString%3A'),
-category: 'adding',
-fn: function (aString){
+selector: unescape('audio'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_appendChild_", [smalltalk.send(self, "_createTextNodeFor_", [aString])]);
+return smalltalk.send(self, "_tag_", ["audio"]);
 return self;},
-args: ["aString"],
-source: unescape('appendString%3A%20aString%0A%20%20%20%20self%20appendChild%3A%20%28self%20createTextNodeFor%3A%20aString%29'),
-messageSends: ["appendChild:", "createTextNodeFor:"],
+args: [],
+source: unescape('audio%0A%20%20%20%20%5Eself%20tag%3A%20%27audio%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_empty'),
+unescape('_fieldset'),
 smalltalk.method({
-selector: unescape('empty'),
-category: 'adding',
+selector: unescape('fieldset'),
+category: 'tags',
 fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_empty", []);
+return smalltalk.send(self, "_tag_", ["fieldset"]);
 return self;},
 args: [],
-source: unescape('empty%0A%09self%20asJQuery%20empty'),
-messageSends: ["empty", "asJQuery"],
+source: unescape('fieldset%0A%20%20%20%20%5Eself%20tag%3A%20%27fieldset%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_at_put_'),
+unescape('_footer'),
 smalltalk.method({
-selector: unescape('at%3Aput%3A'),
-category: 'attributes',
-fn: function (aString, aValue){
+selector: unescape('footer'),
+category: 'tags',
+fn: function (){
 var self=this;
-self['@element'].setAttribute(aString, aValue);
+return smalltalk.send(self, "_tag_", ["footer"]);
 return self;},
-args: ["aString", "aValue"],
-source: unescape('at%3A%20aString%20put%3A%20aValue%0A%20%20%20%20%3Cself%5B%27@element%27%5D.setAttribute%28aString%2C%20aValue%29%3E'),
-messageSends: [],
+args: [],
+source: unescape('footer%0A%20%20%20%20%5Eself%20tag%3A%20%27footer%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_removeAt_'),
+unescape('_header'),
 smalltalk.method({
-selector: unescape('removeAt%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('header'),
+category: 'tags',
+fn: function (){
 var self=this;
-self['@element'].removeAttribute(aString);
+return smalltalk.send(self, "_tag_", ["header"]);
 return self;},
-args: ["aString"],
-source: unescape('removeAt%3A%20aString%0A%20%20%20%20%3Cself%5B%27@element%27%5D.removeAttribute%28aString%29%3E'),
-messageSends: [],
+args: [],
+source: unescape('header%0A%20%20%20%20%5Eself%20tag%3A%20%27header%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_class_'),
+unescape('_hr'),
 smalltalk.method({
-selector: unescape('class%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('hr'),
+category: 'tags',
+fn: function (){
 var self=this;
-self['@element'].className = aString;
+return smalltalk.send(self, "_tag_", ["hr"]);
 return self;},
-args: ["aString"],
-source: unescape('class%3A%20aString%0A%20%20%20%20%20%20%3Cself%5B%27@element%27%5D.className%20%3D%20aString%3E'),
-messageSends: [],
+args: [],
+source: unescape('hr%0A%20%20%20%20%5Eself%20tag%3A%20%27hr%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_id_'),
+unescape('_section'),
 smalltalk.method({
-selector: unescape('id%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('section'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["id", aString]);
+return smalltalk.send(self, "_tag_", ["section"]);
 return self;},
-args: ["aString"],
-source: unescape('id%3A%20aString%0A%20%20%20%20self%20at%3A%20%27id%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('section%0A%20%20%20%20%5Eself%20tag%3A%20%27section%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_src_'),
+unescape('_tbody'),
 smalltalk.method({
-selector: unescape('src%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('tbody'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["src", aString]);
+return smalltalk.send(self, "_tag_", ["tbody"]);
 return self;},
-args: ["aString"],
-source: unescape('src%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27src%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('tbody%0A%20%20%20%20%5Eself%20tag%3A%20%27tbody%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_href_'),
+unescape('_tfoot'),
 smalltalk.method({
-selector: unescape('href%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('tfoot'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["href", aString]);
-return self;},
-args: ["aString"],
-source: unescape('href%3A%20aString%0A%20%20%20%20self%20at%3A%20%27href%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+return smalltalk.send(self, "_tag_", ["tfoot"]);
+return self;},
+args: [],
+source: unescape('tfoot%0A%20%20%20%20%5Eself%20tag%3A%20%27tfoot%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_title_'),
+unescape('_thead'),
 smalltalk.method({
-selector: unescape('title%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('thead'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["title", aString]);
+return smalltalk.send(self, "_tag_", ["thead"]);
 return self;},
-args: ["aString"],
-source: unescape('title%3A%20aString%0A%20%20%20%20self%20at%3A%20%27title%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('thead%0A%20%20%20%20%5Eself%20tag%3A%20%27thead%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_style_'),
+unescape('_video'),
 smalltalk.method({
-selector: unescape('style%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('video'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["style", aString]);
+return smalltalk.send(self, "_tag_", ["video"]);
 return self;},
-args: ["aString"],
-source: unescape('style%3A%20aString%0A%20%20%20%20self%20at%3A%20%27style%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('video%0A%20%20%20%20%5Eself%20tag%3A%20%27video%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_type_'),
+unescape('_label'),
 smalltalk.method({
-selector: unescape('type%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('label'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["type", aString]);
+return smalltalk.send(self, "_tag_", ["label"]);
 return self;},
-args: ["aString"],
-source: unescape('type%3A%20aString%0A%20%20%20%20self%20at%3A%20%27type%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('label%0A%09%5Eself%20tag%3A%20%27label%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_media_'),
+unescape('_title'),
 smalltalk.method({
-selector: unescape('media%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('title'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["media", aString]);
+return smalltalk.send(self, "_tag_", ["title"]);
 return self;},
-args: ["aString"],
-source: unescape('media%3A%20aString%0A%20%20%20%20self%20at%3A%20%27media%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('title%0A%09%5Eself%20tag%3A%20%27title%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_rel_'),
+unescape('_time'),
 smalltalk.method({
-selector: unescape('rel%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('time'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["rel", aString]);
+return smalltalk.send(self, "_tag_", ["time"]);
 return self;},
-args: ["aString"],
-source: unescape('rel%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27rel%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('time%0A%09%5Eself%20tag%3A%20%27time%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_width_'),
+unescape('_sup'),
 smalltalk.method({
-selector: unescape('width%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('sup'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["width", aString]);
+return smalltalk.send(self, "_tag_", ["sup"]);
 return self;},
-args: ["aString"],
-source: unescape('width%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27width%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('sup%0A%09%5Eself%20tag%3A%20%27sup%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_height_'),
+unescape('_summary'),
 smalltalk.method({
-selector: unescape('height%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('summary'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["height", aString]);
+return smalltalk.send(self, "_tag_", ["summary"]);
 return self;},
-args: ["aString"],
-source: unescape('height%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27height%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('summary%0A%09%5Eself%20tag%3A%20%27summary%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_value_'),
+unescape('_sub'),
 smalltalk.method({
-selector: unescape('value%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('sub'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["value", aString]);
+return smalltalk.send(self, "_tag_", ["sub"]);
 return self;},
-args: ["aString"],
-source: unescape('value%3A%20aString%0A%20%20%20%20self%20%20at%3A%20%27value%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('sub%0A%09%5Eself%20tag%3A%20%27sub%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_asJQuery'),
+unescape('_strong'),
 smalltalk.method({
-selector: unescape('asJQuery'),
-category: 'converting',
+selector: unescape('strong'),
+category: 'tags',
 fn: function (){
 var self=this;
-return smalltalk.send((typeof window == 'undefined' ? nil : window), "_jQuery_", [smalltalk.send(self, "_element", [])]);
+return smalltalk.send(self, "_tag_", ["strong"]);
 return self;},
 args: [],
-source: unescape('asJQuery%0A%20%20%20%20%5Ewindow%20jQuery%3A%20self%20element'),
-messageSends: ["jQuery:", "element"],
+source: unescape('strong%0A%09%5Eself%20tag%3A%20%27strong%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onKeyDown_'),
+unescape('_strong_'),
 smalltalk.method({
-selector: unescape('onKeyDown%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('strong%3A'),
+category: 'tags',
+fn: function (anObject){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keydown", aBlock]);
+return smalltalk.send(smalltalk.send(self, "_strong", []), "_with_", [anObject]);
 return self;},
-args: ["aBlock"],
-source: unescape('onKeyDown%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27keydown%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: ["anObject"],
+source: unescape('strong%3A%20anObject%0A%09%5Eself%20strong%20with%3A%20anObject'),
+messageSends: ["with:", "strong"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onKeyPress_'),
+unescape('_source'),
 smalltalk.method({
-selector: unescape('onKeyPress%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('source'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keypress", aBlock]);
+return smalltalk.send(self, "_tag_", ["source"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onKeyPress%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27keypress%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('source%0A%09%5Eself%20tag%3A%20%27source%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onKeyUp_'),
+unescape('_small'),
 smalltalk.method({
-selector: unescape('onKeyUp%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('small'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["keyup", aBlock]);
+return smalltalk.send(self, "_tag_", ["small"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onKeyUp%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27keyup%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('small%0A%09%5Eself%20tag%3A%20%27small%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onFocus_'),
+unescape('_progress'),
 smalltalk.method({
-selector: unescape('onFocus%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('progress'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focus", aBlock]);
+return smalltalk.send(self, "_tag_", ["progress"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onFocus%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27focus%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('progress%0A%09%5Eself%20tag%3A%20%27progress%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onBlur_'),
+unescape('_param'),
 smalltalk.method({
-selector: unescape('onBlur%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('param'),
+category: 'tags',
+fn: function (){
+var self=this;
+return smalltalk.send(self, "_tag_", ["param"]);
+return self;},
+args: [],
+source: unescape('param%0A%09%5Eself%20tag%3A%20%27param%27'),
+messageSends: ["tag:"],
+referencedClasses: []
+}),
+smalltalk.HTMLCanvas);
+
+smalltalk.addMethod(
+unescape('_output'),
+smalltalk.method({
+selector: unescape('output'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["blur", aBlock]);
+return smalltalk.send(self, "_tag_", ["output"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onBlur%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27blur%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('output%0A%09%5Eself%20tag%3A%20%27output%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onChange_'),
+unescape('_optgroup'),
 smalltalk.method({
-selector: unescape('onChange%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('optgroup'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["change", aBlock]);
+return smalltalk.send(self, "_tag_", ["optgroup"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onChange%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27change%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('optgroup%0A%09%5Eself%20tag%3A%20%27optgroup%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onClick_'),
+unescape('_object'),
 smalltalk.method({
-selector: unescape('onClick%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('object'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["click", aBlock]);
+return smalltalk.send(self, "_tag_", ["object"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onClick%3A%20aBlock%0A%20%20%20%20self%20asJQuery%20bind%3A%20%27click%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('object%0A%09%5Eself%20tag%3A%20%27object%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_initializeFromString_canvas_'),
+unescape('_noscript'),
 smalltalk.method({
-selector: unescape('initializeFromString%3Acanvas%3A'),
-category: 'initialization',
-fn: function (aString, aCanvas){
+selector: unescape('noscript'),
+category: 'tags',
+fn: function (){
 var self=this;
-(self['@element']=smalltalk.send(self, "_createElementFor_", [aString]));
-(self['@canvas']=aCanvas);
+return smalltalk.send(self, "_tag_", ["noscript"]);
 return self;},
-args: ["aString", "aCanvas"],
-source: unescape('initializeFromString%3A%20aString%20canvas%3A%20aCanvas%0A%20%20%20%20element%20%3A%3D%20self%20createElementFor%3A%20aString.%0A%20%20%20%20canvas%20%3A%3D%20aCanvas'),
-messageSends: ["createElementFor:"],
+args: [],
+source: unescape('noscript%0A%09%5Eself%20tag%3A%20%27noscript%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_initializeFromJQuery_canvas_'),
+unescape('_nav'),
 smalltalk.method({
-selector: unescape('initializeFromJQuery%3Acanvas%3A'),
-category: 'initialization',
-fn: function (aJQuery, aCanvas){
+selector: unescape('nav'),
+category: 'tags',
+fn: function (){
 var self=this;
-(self['@element']=smalltalk.send(aJQuery, "_get_", [(0)]));
-(self['@canvas']=aCanvas);
+return smalltalk.send(self, "_tag_", ["nav"]);
 return self;},
-args: ["aJQuery", "aCanvas"],
-source: unescape('initializeFromJQuery%3A%20aJQuery%20canvas%3A%20aCanvas%0A%20%20%20%20element%20%3A%3D%20aJQuery%20get%3A%200.%0A%20%20%20%20canvas%20%3A%3D%20aCanvas'),
-messageSends: ["get:"],
+args: [],
+source: unescape('nav%0A%09%5Eself%20tag%3A%20%27nav%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_createElementFor_'),
+unescape('_meta'),
 smalltalk.method({
-selector: unescape('createElementFor%3A'),
-category: 'private',
-fn: function (aString){
+selector: unescape('meta'),
+category: 'tags',
+fn: function (){
 var self=this;
-return document.createElement(String(aString));
+return smalltalk.send(self, "_tag_", ["meta"]);
 return self;},
-args: ["aString"],
-source: unescape('createElementFor%3A%20aString%0A%09%3Creturn%20document.createElement%28String%28aString%29%29%3E'),
-messageSends: [],
+args: [],
+source: unescape('meta%0A%09%5Eself%20tag%3A%20%27meta%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_createTextNodeFor_'),
+unescape('_menu'),
 smalltalk.method({
-selector: unescape('createTextNodeFor%3A'),
-category: 'private',
-fn: function (aString){
+selector: unescape('menu'),
+category: 'tags',
+fn: function (){
 var self=this;
-return document.createTextNode(String(aString));
+return smalltalk.send(self, "_tag_", ["menu"]);
 return self;},
-args: ["aString"],
-source: unescape('createTextNodeFor%3A%20aString%0A%09%3Creturn%20document.createTextNode%28String%28aString%29%29%3E'),
-messageSends: [],
+args: [],
+source: unescape('menu%0A%09%5Eself%20tag%3A%20%27menu%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onSubmit_'),
+unescape('_mark'),
 smalltalk.method({
-selector: unescape('onSubmit%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('mark'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["submit", aBlock]);
+return smalltalk.send(self, "_tag_", ["mark"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onSubmit%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27submit%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('mark%0A%09%5Eself%20tag%3A%20%27mark%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onDblClick_'),
+unescape('_map'),
 smalltalk.method({
-selector: unescape('onDblClick%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('map'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["dblclick", aBlock]);
+return smalltalk.send(self, "_tag_", ["map"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onDblClick%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27dblclick%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('map%0A%09%5Eself%20tag%3A%20%27map%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onHover_'),
+unescape('_legend'),
 smalltalk.method({
-selector: unescape('onHover%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('legend'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["hover", aBlock]);
+return smalltalk.send(self, "_tag_", ["legend"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onHover%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27hover%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('legend%0A%09%5Eself%20tag%3A%20%27legend%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onFocusIn_'),
+unescape('_html'),
 smalltalk.method({
-selector: unescape('onFocusIn%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('html'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusin", aBlock]);
+return smalltalk.send(self, "_tag_", ["html"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onFocusIn%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27focusin%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('html%0A%09%5Eself%20tag%3A%20%27html%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onFocusOut_'),
+unescape('_hgroup'),
 smalltalk.method({
-selector: unescape('onFocusOut%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('hgroup'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["focusout", aBlock]);
+return smalltalk.send(self, "_tag_", ["hgroup"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onFocusOut%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27focusout%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('hgroup%0A%09%5Eself%20tag%3A%20%27hgroup%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseDown_'),
+unescape('_head'),
 smalltalk.method({
-selector: unescape('onMouseDown%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('head'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousedown", aBlock]);
+return smalltalk.send(self, "_tag_", ["head"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onMouseDown%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mousedown%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('head%0A%09%5Eself%20tag%3A%20%27head%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseUp_'),
+unescape('_figure'),
 smalltalk.method({
-selector: unescape('onMouseUp%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('figure'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseup", aBlock]);
+return smalltalk.send(self, "_tag_", ["figure"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onMouseUp%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseup%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('figure%0A%09%5Eself%20tag%3A%20%27figure%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseEnter_'),
+unescape('_figcaption'),
 smalltalk.method({
-selector: unescape('onMouseEnter%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('figcaption'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseenter", aBlock]);
+return smalltalk.send(self, "_tag_", ["figcaption"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onMouseEnter%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseenter%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('figcaption%0A%09%5Eself%20tag%3A%20%27figcaption%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseLeave_'),
+unescape('_embed'),
 smalltalk.method({
-selector: unescape('onMouseLeave%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('embed'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseleave", aBlock]);
+return smalltalk.send(self, "_tag_", ["embed"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onMouseLeave%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseleave%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('embed%0A%09%5Eself%20tag%3A%20%27embed%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseMove_'),
+unescape('_em'),
 smalltalk.method({
-selector: unescape('onMouseMove%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('em'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mousemove", aBlock]);
+return smalltalk.send(self, "_tag_", ["em"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onMouseMove%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mousemove%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('em%0A%09%5Eself%20tag%3A%20%27em%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseOut_'),
+unescape('_dt'),
 smalltalk.method({
-selector: unescape('onMouseOut%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('dt'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseout", aBlock]);
+return smalltalk.send(self, "_tag_", ["dt"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onMouseOut%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseout%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('dt%0A%09%5Eself%20tag%3A%20%27dt%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onMouseOver_'),
+unescape('_dl'),
 smalltalk.method({
-selector: unescape('onMouseOver%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('dl'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["mouseover", aBlock]);
+return smalltalk.send(self, "_tag_", ["dl"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onMouseOver%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27mouseover%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('dl%0A%09%5Eself%20tag%3A%20%27dl%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onSelect_'),
+unescape('_details'),
 smalltalk.method({
-selector: unescape('onSelect%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('details'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["select", aBlock]);
+return smalltalk.send(self, "_tag_", ["details"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onSelect%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27select%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('details%0A%09%5Eself%20tag%3A%20%27details%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_onUnload_'),
+unescape('_del'),
 smalltalk.method({
-selector: unescape('onUnload%3A'),
-category: 'events',
-fn: function (aBlock){
+selector: unescape('del'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(smalltalk.send(self, "_asJQuery", []), "_bind_do_", ["unload", aBlock]);
+return smalltalk.send(self, "_tag_", ["del"]);
 return self;},
-args: ["aBlock"],
-source: unescape('onUnload%3A%20aBlock%0A%09self%20asJQuery%20bind%3A%20%27unload%27%20do%3A%20aBlock'),
-messageSends: ["bind:do:", "asJQuery"],
+args: [],
+source: unescape('del%0A%09%5Eself%20tag%3A%20%27del%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_for_'),
+unescape('_dd'),
 smalltalk.method({
-selector: unescape('for%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('dd'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["for", aString]);
+return smalltalk.send(self, "_tag_", ["dd"]);
 return self;},
-args: ["aString"],
-source: unescape('for%3A%20aString%0A%09self%20at%3A%20%27for%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('dd%0A%09%5Eself%20tag%3A%20%27dd%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_placeholder_'),
+unescape('_datalist'),
 smalltalk.method({
-selector: unescape('placeholder%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('datalist'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["placeholder", aString]);
+return smalltalk.send(self, "_tag_", ["datalist"]);
 return self;},
-args: ["aString"],
-source: unescape('placeholder%3A%20aString%0A%09self%20at%3A%20%27placeholder%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('datalist%0A%09%5Eself%20tag%3A%20%27datalist%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_accesskey_'),
+unescape('_command'),
 smalltalk.method({
-selector: unescape('accesskey%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('command'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["accesskey", aString]);
+return smalltalk.send(self, "_tag_", ["command"]);
 return self;},
-args: ["aString"],
-source: unescape('accesskey%3A%20aString%0A%09self%20at%3A%20%27accesskey%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('command%0A%09%5Eself%20tag%3A%20%27command%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_contenteditable_'),
+unescape('_colgroup'),
 smalltalk.method({
-selector: unescape('contenteditable%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('colgroup'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["contenteditable", aString]);
+return smalltalk.send(self, "_tag_", ["colgroup"]);
 return self;},
-args: ["aString"],
-source: unescape('contenteditable%3A%20aString%0A%09self%20at%3A%20%27contenteditable%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('colgroup%0A%09%5Eself%20tag%3A%20%27colgroup%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_contextmenu_'),
+unescape('_col'),
 smalltalk.method({
-selector: unescape('contextmenu%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('col'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["contextmenu", aString]);
+return smalltalk.send(self, "_tag_", ["col"]);
 return self;},
-args: ["aString"],
-source: unescape('contextmenu%3A%20aString%0A%09self%20at%3A%20%27contextmenu%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('col%0A%09%5Eself%20tag%3A%20%27col%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_draggable_'),
+unescape('_cite'),
 smalltalk.method({
-selector: unescape('draggable%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('cite'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["draggable", aString]);
+return smalltalk.send(self, "_tag_", ["cite"]);
 return self;},
-args: ["aString"],
-source: unescape('draggable%3A%20aString%0A%09self%20at%3A%20%27draggable%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('cite%0A%09%5Eself%20tag%3A%20%27cite%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_hidden'),
+unescape('_caption'),
 smalltalk.method({
-selector: unescape('hidden'),
-category: 'attributes',
+selector: unescape('caption'),
+category: 'tags',
 fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["hidden", "hidden"]);
+return smalltalk.send(self, "_tag_", ["caption"]);
 return self;},
 args: [],
-source: unescape('hidden%0A%09self%20at%3A%20%27hidden%27%20put%3A%20%27hidden%27'),
-messageSends: ["at:put:"],
+source: unescape('caption%0A%09%5Eself%20tag%3A%20%27caption%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_tabindex_'),
+unescape('_body'),
 smalltalk.method({
-selector: unescape('tabindex%3A'),
-category: 'attributes',
-fn: function (aNumber){
+selector: unescape('body'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["tabindex", aNumber]);
-return self;},
-args: ["aNumber"],
-source: unescape('tabindex%3A%20aNumber%0A%09self%20at%3A%20%27tabindex%27%20put%3A%20aNumber'),
-messageSends: ["at:put:"],
+return smalltalk.send(self, "_tag_", ["body"]);
+return self;},
+args: [],
+source: unescape('body%0A%09%5Eself%20tag%3A%20%27body%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_target_'),
+unescape('_blockquote'),
 smalltalk.method({
-selector: unescape('target%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('blockquote'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["target", aString]);
+return smalltalk.send(self, "_tag_", ["blockquote"]);
 return self;},
-args: ["aString"],
-source: unescape('target%3A%20aString%0A%09self%20at%3A%20%27target%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('blockquote%0A%09%5Eself%20tag%3A%20%27blockquote%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_align_'),
+unescape('_base'),
 smalltalk.method({
-selector: unescape('align%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('base'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["align", aString]);
+return smalltalk.send(self, "_tag_", ["base"]);
 return self;},
-args: ["aString"],
-source: unescape('align%3A%20aString%0A%09self%20at%3A%20%27align%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('base%0A%09%5Eself%20tag%3A%20%27base%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_alt_'),
+unescape('_aside'),
 smalltalk.method({
-selector: unescape('alt%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('aside'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["alt", aString]);
+return smalltalk.send(self, "_tag_", ["aside"]);
 return self;},
-args: ["aString"],
-source: unescape('alt%3A%20aString%0A%09self%20at%3A%20%27alt%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('aside%0A%09%5Eself%20tag%3A%20%27aside%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_name_'),
+unescape('_article'),
 smalltalk.method({
-selector: unescape('name%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('article'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["name", aString]);
+return smalltalk.send(self, "_tag_", ["article"]);
 return self;},
-args: ["aString"],
-source: unescape('name%3A%20aString%0A%09self%20at%3A%20%27name%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('article%0A%20%20%20%20%5Eself%20tag%3A%20%27article%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_valign_'),
+unescape('_area'),
 smalltalk.method({
-selector: unescape('valign%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('area'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["valign", aString]);
+return smalltalk.send(self, "_tag_", ["area"]);
 return self;},
-args: ["aString"],
-source: unescape('valign%3A%20aString%0A%09self%20at%3A%20%27valign%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('area%0A%09%5Eself%20tag%3A%20%27area%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_method_'),
+unescape('_address'),
 smalltalk.method({
-selector: unescape('method%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('address'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["method", aString]);
+return smalltalk.send(self, "_tag_", ["address"]);
 return self;},
-args: ["aString"],
-source: unescape('method%3A%20aString%0A%09self%20at%3A%20%27method%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('address%0A%09%5Eself%20tag%3A%20%27address%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_action_'),
+unescape('_abbr'),
 smalltalk.method({
-selector: unescape('action%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('abbr'),
+category: 'tags',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_at_put_", ["action", aString]);
+return smalltalk.send(self, "_tag_", ["abbr"]);
 return self;},
-args: ["aString"],
-source: unescape('action%3A%20aString%0A%09self%20at%3A%20%27action%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: [],
+source: unescape('abbr%0A%09%5Eself%20tag%3A%20%27abbr%27'),
+messageSends: ["tag:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
 
 smalltalk.addMethod(
-unescape('_rows_'),
+unescape('_div_'),
 smalltalk.method({
-selector: unescape('rows%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('div%3A'),
+category: 'tags',
+fn: function (aBlock){
 var self=this;
-smalltalk.send(self, "_at_put_", ["rows", aString]);
+return smalltalk.send(smalltalk.send(self, "_div", []), "_with_", [aBlock]);
 return self;},
-args: ["aString"],
-source: unescape('rows%3A%20aString%0A%09self%20at%3A%20%27rows%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: ["aBlock"],
+source: unescape('div%3A%20aBlock%0A%20%20%20%20%5Eself%20div%20with%3A%20aBlock'),
+messageSends: ["with:", "div"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
+smalltalk.HTMLCanvas);
+
 
 smalltalk.addMethod(
-unescape('_cols_'),
+unescape('_onJQuery_'),
 smalltalk.method({
-selector: unescape('cols%3A'),
-category: 'attributes',
-fn: function (aString){
+selector: unescape('onJQuery%3A'),
+category: 'instance creation',
+fn: function (aJQuery){
 var self=this;
-smalltalk.send(self, "_at_put_", ["cols", aString]);
+return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_", [aJQuery]);smalltalk.send($rec, "_initialize", []);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_basicNew", []));
 return self;},
-args: ["aString"],
-source: unescape('cols%3A%20aString%0A%09self%20at%3A%20%27cols%27%20put%3A%20aString'),
-messageSends: ["at:put:"],
+args: ["aJQuery"],
+source: unescape('onJQuery%3A%20aJQuery%0A%09%5Eself%20basicNew%0A%09%09initializeFromJQuery%3A%20aJQuery%3B%0A%09%09initialize%3B%0A%09%09yourself'),
+messageSends: ["initializeFromJQuery:", "initialize", "yourself", "basicNew"],
 referencedClasses: []
 }),
-smalltalk.TagBrush);
-
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_fromString_canvas_'),
+unescape('_isMSIE'),
 smalltalk.method({
-selector: unescape('fromString%3Acanvas%3A'),
+selector: unescape('isMSIE'),
 category: 'instance creation',
-fn: function (aString, aCanvas){
+fn: function (){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_initializeFromString_canvas_", [aString, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("msie")]), "_notNil", []);
 return self;},
-args: ["aString", "aCanvas"],
-source: unescape('fromString%3A%20aString%20canvas%3A%20aCanvas%0A%20%20%20%20%5Eself%20new%0A%09initializeFromString%3A%20aString%20canvas%3A%20aCanvas%3B%0A%09yourself'),
-messageSends: ["initializeFromString:canvas:", "yourself", "new"],
+args: [],
+source: unescape('isMSIE%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23msie%29%20notNil'),
+messageSends: ["notNil", "at:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush.klass);
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_fromJQuery_canvas_'),
+unescape('_isOpera'),
 smalltalk.method({
-selector: unescape('fromJQuery%3Acanvas%3A'),
+selector: unescape('isOpera'),
 category: 'instance creation',
-fn: function (aJQuery, aCanvas){
+fn: function (){
 var self=this;
-return (function($rec){smalltalk.send($rec, "_initializeFromJQuery_canvas_", [aJQuery, aCanvas]);return smalltalk.send($rec, "_yourself", []);})(smalltalk.send(self, "_new", []));
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("opera")]), "_notNil", []);
 return self;},
-args: ["aJQuery", "aCanvas"],
-source: unescape('fromJQuery%3A%20aJQuery%20canvas%3A%20aCanvas%0A%20%20%20%20%5Eself%20new%0A%09initializeFromJQuery%3A%20aJQuery%20canvas%3A%20aCanvas%3B%0A%09yourself'),
-messageSends: ["initializeFromJQuery:canvas:", "yourself", "new"],
+args: [],
+source: unescape('isOpera%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23opera%29%20notNil'),
+messageSends: ["notNil", "at:"],
 referencedClasses: []
 }),
-smalltalk.TagBrush.klass);
-
+smalltalk.HTMLCanvas.klass);
 
-smalltalk.addClass('Widget', smalltalk.Object, [], 'Canvas');
 smalltalk.addMethod(
-unescape('_appendToBrush_'),
+unescape('_isMozilla'),
 smalltalk.method({
-selector: unescape('appendToBrush%3A'),
-category: 'adding',
-fn: function (aTagBrush){
+selector: unescape('isMozilla'),
+category: 'instance creation',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_appendToJQuery_", [smalltalk.send(aTagBrush, "_asJQuery", [])]);
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("mozilla")]), "_notNil", []);
 return self;},
-args: ["aTagBrush"],
-source: unescape('appendToBrush%3A%20aTagBrush%0A%20%20%20%20self%20appendToJQuery%3A%20aTagBrush%20asJQuery'),
-messageSends: ["appendToJQuery:", "asJQuery"],
+args: [],
+source: unescape('isMozilla%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23mozilla%29%20notNil'),
+messageSends: ["notNil", "at:"],
 referencedClasses: []
 }),
-smalltalk.Widget);
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_appendToJQuery_'),
+unescape('_isWebkit'),
 smalltalk.method({
-selector: unescape('appendToJQuery%3A'),
-category: 'adding',
-fn: function (aJQuery){
+selector: unescape('isWebkit'),
+category: 'instance creation',
+fn: function (){
 var self=this;
-smalltalk.send(self, "_renderOn_", [smalltalk.send((smalltalk.HTMLCanvas || HTMLCanvas), "_onJQuery_", [aJQuery])]);
+return smalltalk.send(smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_at_", [smalltalk.symbolFor("webkit")]), "_notNil", []);
 return self;},
-args: ["aJQuery"],
-source: unescape('appendToJQuery%3A%20aJQuery%0A%20%20%20self%20renderOn%3A%20%28HTMLCanvas%20onJQuery%3A%20aJQuery%29'),
-messageSends: ["renderOn:", "onJQuery:"],
-referencedClasses: ["HTMLCanvas"]
+args: [],
+source: unescape('isWebkit%0A%09%5E%28%28jQuery%20at%3A%20%23browser%29%20at%3A%20%23webkit%29%20notNil'),
+messageSends: ["notNil", "at:"],
+referencedClasses: []
 }),
-smalltalk.Widget);
+smalltalk.HTMLCanvas.klass);
 
 smalltalk.addMethod(
-unescape('_renderOn_'),
+unescape('_browserVersion'),
 smalltalk.method({
-selector: unescape('renderOn%3A'),
-category: 'rendering',
-fn: function (html){
+selector: unescape('browserVersion'),
+category: 'instance creation',
+fn: function (){
 var self=this;
-self;
+return smalltalk.send(smalltalk.send((typeof jQuery == 'undefined' ? nil : jQuery), "_at_", [smalltalk.symbolFor("browser")]), "_version", []);
 return self;},
-args: ["html"],
-source: unescape('renderOn%3A%20html%0A%20%20%20%20self'),
-messageSends: [],
+args: [],
+source: unescape('browserVersion%0A%09%5E%28jQuery%20at%3A%20%23browser%29%20version'),
+messageSends: ["version", "at:"],
 referencedClasses: []
 }),
-smalltalk.Widget);
-
+smalltalk.HTMLCanvas.klass);
 
 
 smalltalk.addClass('StyleTag', smalltalk.TagBrush, ['canvas', 'element'], 'Canvas');

st/Canvas.st

@@ -1,823 +1,827 @@
 Smalltalk current createPackage: 'Canvas' properties: #{}!
-Object subclass: #HTMLCanvas
-	instanceVariableNames: 'root'
+Object subclass: #Widget
+	instanceVariableNames: ''
 	category: 'Canvas'!
 
-!HTMLCanvas methodsFor: 'accessing'!
+!Widget methodsFor: 'adding'!
 
-root: aTagBrush
-    root := aTagBrush
+appendToBrush: aTagBrush
+    self appendToJQuery: aTagBrush asJQuery
 !
 
-root
-    ^root
+appendToJQuery: aJQuery
+   self renderOn: (HTMLCanvas onJQuery: aJQuery)
 ! !
 
-!HTMLCanvas methodsFor: 'adding'!
+!Widget methodsFor: 'rendering'!
 
-with: anObject
-    ^self root with: anObject
+renderOn: html
+    self
 ! !
 
-!HTMLCanvas methodsFor: 'initialization'!
+Object subclass: #TagBrush
+	instanceVariableNames: 'canvas element'
+	category: 'Canvas'!
 
-initialize
-    super initialize.
-    root ifNil: [root := TagBrush fromString: 'div' canvas: self]
-!
+!TagBrush methodsFor: 'accessing'!
 
-initializeFromJQuery: aJQuery
-    root := TagBrush fromJQuery: aJQuery canvas: self
+element
+    ^element
 ! !
 
-!HTMLCanvas methodsFor: 'tags'!
+!TagBrush methodsFor: 'adding'!
 
-newTag: aString
-    ^TagBrush fromString: aString canvas: self
+contents: anObject
+    self 
+	empty;
+   	append: anObject
 !
 
-tag: aString
-    ^root addBrush: (self newTag: aString)
+addBrush: aTagBrush
+    self appendChild: aTagBrush element.
+    ^aTagBrush
 !
 
-h1
-    ^self tag: 'h1'
+with: anObject
+    self append: anObject
 !
 
-h2
-    ^self tag: 'h2'
+append: anObject
+    anObject appendToBrush: self
 !
 
-h3
-    ^self tag: 'h3'
+appendToBrush: aTagBrush
+    aTagBrush addBrush: self
 !
 
-h4
-    ^self tag: 'h4'
+appendBlock: aBlock
+    | root |
+    root := canvas root.
+    canvas root: self.
+    aBlock value: canvas.
+    canvas root: root
 !
 
-h5
-    ^self tag: 'h5'
+appendChild: anElement
+	"In IE7 and IE8 appendChild fails on several node types. So we need to check" 
+ 	<var element=self['@element'];
+ 	if (null == element.canHaveChildren || element.canHaveChildren) {
+		element.appendChild(anElement);
+ 	} else {
+ 		element.text = String(element.text) +  anElement.innerHTML;
+ 	} >
 !
 
-h6
-    ^self tag: 'h6'
+appendString: aString
+    self appendChild: (self createTextNodeFor: aString)
 !
 
-p
-    ^self tag: 'p'
-!
+empty
+	self asJQuery empty
+! !
 
-div
-    ^self tag: 'div'
-!
+!TagBrush methodsFor: 'attributes'!
 
-span
-    ^self tag: 'span'
+at: aString put: aValue
+    <self['@element'].setAttribute(aString, aValue)>
 !
 
-img
-    ^self tag: 'img'
+removeAt: aString
+    <self['@element'].removeAttribute(aString)>
 !
 
-ul
-    ^self tag: 'ul'
+class: aString
+      <self['@element'].className = aString>
 !
 
-ol
-    ^self tag: 'ol'
+id: aString
+    self at: 'id' put: aString
 !
 
-li
-    ^self tag: 'li'
+src: aString
+    self  at: 'src' put: aString
 !
 
-table
-    ^self tag: 'table'
+href: aString
+    self at: 'href' put: aString
 !
 
-tr
-    ^self tag: 'tr'
+title: aString
+    self at: 'title' put: aString
 !
 
-td 
-    ^self tag: 'td'
+style: aString
+    self at: 'style' put: aString
 !
 
-th
-    ^self tag: 'th'
+type: aString
+    self at: 'type' put: aString
 !
 
-form
-    ^self tag: 'form'
+media: aString
+    self at: 'media' put: aString
 !
 
-input
-    ^self tag: 'input'
+rel: aString
+    self  at: 'rel' put: aString
 !
 
-button
-    ^self tag: 'button'
+width: aString
+    self  at: 'width' put: aString
 !
 
-select
-    ^self tag: 'select'
+height: aString
+    self  at: 'height' put: aString
 !
 
-option
-    ^self tag: 'option'
+value: aString
+    self  at: 'value' put: aString
 !
 
-textarea
-    ^self tag: 'textarea'
+for: aString
+	self at: 'for' put: aString
 !
 
-a
-    ^self tag: 'a'
+placeholder: aString
+	self at: 'placeholder' put: aString
 !
 
-canvas
-	^self tag: 'canvas'
+accesskey: aString
+	self at: 'accesskey' put: aString
 !
 
-pre
-    ^self tag: 'pre'
+contenteditable: aString
+	self at: 'contenteditable' put: aString
 !
 
-code
-    ^self tag: 'code'
+contextmenu: aString
+	self at: 'contextmenu' put: aString
 !
 
-br
-    ^self tag: 'br'
+draggable: aString
+	self at: 'draggable' put: aString
 !
 
-script
-    ^self tag: 'script'
+hidden
+	self at: 'hidden' put: 'hidden'
 !
 
-link
-    ^self tag: 'link'
+tabindex: aNumber
+	self at: 'tabindex' put: aNumber
 !
 
-style
-	^ root addBrush:  (StyleTag canvas: self)
+target: aString
+	self at: 'target' put: aString
 !
 
-p: anObject
-    ^self p with: anObject
+align: aString
+	self at: 'align' put: aString
 !
 
-h1: anObject
-    ^self h1 with: anObject
+alt: aString
+	self at: 'alt' put: aString
 !
 
-iframe
-    ^self tag: 'iframe'
+name: aString
+	self at: 'name' put: aString
 !
 
-iframe: aString
-    ^self iframe src: aString
+valign: aString
+	self at: 'valign' put: aString
 !
 
-h2: anObject
-    ^ self h2 with: anObject
+method: aString
+	self at: 'method' put: aString
 !
 
-h3: anObject
-    ^self h3 with: anObject
+action: aString
+	self at: 'action' put: aString
 !
 
-h4: anObject
-    ^self h4 with: anObject
+rows: aString
+	self at: 'rows' put: aString
 !
 
-h5: anObject
-    ^self h5 with: anObject
-!
+cols: aString
+	self at: 'cols' put: aString
+! !
 
-h6: anObject
-    ^self h6 with: anObject
-!
+!TagBrush methodsFor: 'converting'!
 
-img: aString
-    ^self img src: aString
-!
+asJQuery
+    ^window jQuery: self element
+! !
 
-ol: anObject
-    ^self ol with: anObject
+!TagBrush methodsFor: 'events'!
+
+onKeyDown: aBlock
+    self asJQuery bind: 'keydown' do: aBlock
 !
 
-li: anObject
-    ^self li with: anObject
+onKeyPress: aBlock
+    self asJQuery bind: 'keypress' do: aBlock
 !
 
-ul: anObject
-    ^self ul with: anObject
+onKeyUp: aBlock
+    self asJQuery bind: 'keyup' do: aBlock
 !
 
-span: anObject
-    ^self span with: anObject
+onFocus: aBlock
+    self asJQuery bind: 'focus' do: aBlock
 !
 
-style: aString
-	^ self style with: aString; yourself
+onBlur: aBlock
+    self asJQuery bind: 'blur' do: aBlock
 !
 
-audio
-    ^self tag: 'audio'
+onChange: aBlock
+    self asJQuery bind: 'change' do: aBlock
 !
 
-fieldset
-    ^self tag: 'fieldset'
+onClick: aBlock
+    self asJQuery bind: 'click' do: aBlock
 !
 
-footer
-    ^self tag: 'footer'
+onSubmit: aBlock
+	self asJQuery bind: 'submit' do: aBlock
 !
 
-header
-    ^self tag: 'header'
+onDblClick: aBlock
+	self asJQuery bind: 'dblclick' do: aBlock
 !
 
-hr
-    ^self tag: 'hr'
+onHover: aBlock
+	self asJQuery bind: 'hover' do: aBlock
 !
 
-section
-    ^self tag: 'section'
+onFocusIn: aBlock
+	self asJQuery bind: 'focusin' do: aBlock
 !
 
-tbody
-    ^self tag: 'tbody'
+onFocusOut: aBlock
+	self asJQuery bind: 'focusout' do: aBlock
 !
 
-tfoot
-    ^self tag: 'tfoot'
+onMouseDown: aBlock
+	self asJQuery bind: 'mousedown' do: aBlock
 !
 
-thead
-    ^self tag: 'thead'
+onMouseUp: aBlock
+	self asJQuery bind: 'mouseup' do: aBlock
 !
 
-video
-    ^self tag: 'video'
+onMouseEnter: aBlock
+	self asJQuery bind: 'mouseenter' do: aBlock
 !
 
-label
-	^self tag: 'label'
+onMouseLeave: aBlock
+	self asJQuery bind: 'mouseleave' do: aBlock
 !
 
-title
-	^self tag: 'title'
+onMouseMove: aBlock
+	self asJQuery bind: 'mousemove' do: aBlock
 !
 
-time
-	^self tag: 'time'
+onMouseOut: aBlock
+	self asJQuery bind: 'mouseout' do: aBlock
 !
 
-sup
-	^self tag: 'sup'
+onMouseOver: aBlock
+	self asJQuery bind: 'mouseover' do: aBlock
 !
 
-summary
-	^self tag: 'summary'
+onSelect: aBlock
+	self asJQuery bind: 'select' do: aBlock
 !
 
-sub
-	^self tag: 'sub'
-!
+onUnload: aBlock
+	self asJQuery bind: 'unload' do: aBlock
+! !
 
-strong
-	^self tag: 'strong'
-!
+!TagBrush methodsFor: 'initialization'!
 
-strong: anObject
-	^self strong with: anObject
+initializeFromString: aString canvas: aCanvas
+    element := self createElementFor: aString.
+    canvas := aCanvas
 !
 
-source
-	^self tag: 'source'
-!
+initializeFromJQuery: aJQuery canvas: aCanvas
+    element := aJQuery get: 0.
+    canvas := aCanvas
+! !
 
-small
-	^self tag: 'small'
-!
+!TagBrush methodsFor: 'private'!
 
-progress
-	^self tag: 'progress'
+createElementFor: aString
+	<return document.createElement(String(aString))>
 !
 
-param
-	^self tag: 'param'
-!
+createTextNodeFor: aString
+	<return document.createTextNode(String(aString))>
+! !
 
-output
-	^self tag: 'output'
-!
+!TagBrush class methodsFor: 'instance creation'!
 
-optgroup
-	^self tag: 'optgroup'
+fromString: aString canvas: aCanvas
+    ^self new
+	initializeFromString: aString canvas: aCanvas;
+	yourself
 !
 
-object
-	^self tag: 'object'
-!
+fromJQuery: aJQuery canvas: aCanvas
+    ^self new
+	initializeFromJQuery: aJQuery canvas: aCanvas;
+	yourself
+! !
 
-noscript
-	^self tag: 'noscript'
-!
+Object subclass: #HTMLCanvas
+	instanceVariableNames: 'root'
+	category: 'Canvas'!
 
-nav
-	^self tag: 'nav'
-!
+!HTMLCanvas methodsFor: 'accessing'!
 
-meta
-	^self tag: 'meta'
+root: aTagBrush
+    root := aTagBrush
 !
 
-menu
-	^self tag: 'menu'
-!
+root
+    ^root
+! !
 
-mark
-	^self tag: 'mark'
-!
+!HTMLCanvas methodsFor: 'adding'!
 
-map
-	^self tag: 'map'
-!
+with: anObject
+    ^self root with: anObject
+! !
 
-legend
-	^self tag: 'legend'
-!
+!HTMLCanvas methodsFor: 'initialization'!
 
-html
-	^self tag: 'html'
+initialize
+    super initialize.
+    root ifNil: [root := TagBrush fromString: 'div' canvas: self]
 !
 
-hgroup
-	^self tag: 'hgroup'
+initializeFromJQuery: aJQuery
+    root := TagBrush fromJQuery: aJQuery canvas: self
+! !
+
+!HTMLCanvas methodsFor: 'tags'!
+
+newTag: aString
+    ^TagBrush fromString: aString canvas: self
 !
 
-head
-	^self tag: 'head'
+tag: aString
+    ^root addBrush: (self newTag: aString)
 !
 
-figure
-	^self tag: 'figure'
+h1
+    ^self tag: 'h1'
 !
 
-figcaption
-	^self tag: 'figcaption'
+h2
+    ^self tag: 'h2'
 !
 
-embed
-	^self tag: 'embed'
+h3
+    ^self tag: 'h3'
 !
 
-em
-	^self tag: 'em'
+h4
+    ^self tag: 'h4'
 !
 
-dt
-	^self tag: 'dt'
+h5
+    ^self tag: 'h5'
 !
 
-dl
-	^self tag: 'dl'
+h6
+    ^self tag: 'h6'
 !
 
-details
-	^self tag: 'details'
+p
+    ^self tag: 'p'
 !
 
-del
-	^self tag: 'del'
+div
+    ^self tag: 'div'
 !
 
-dd
-	^self tag: 'dd'
+span
+    ^self tag: 'span'
 !
 
-datalist
-	^self tag: 'datalist'
+img
+    ^self tag: 'img'
 !
 
-command
-	^self tag: 'command'
+ul
+    ^self tag: 'ul'
 !
 
-colgroup
-	^self tag: 'colgroup'
+ol
+    ^self tag: 'ol'
 !
 
-col
-	^self tag: 'col'
+li
+    ^self tag: 'li'
 !
 
-cite
-	^self tag: 'cite'
+table
+    ^self tag: 'table'
 !
 
-caption
-	^self tag: 'caption'
+tr
+    ^self tag: 'tr'
 !
 
-body
-	^self tag: 'body'
+td 
+    ^self tag: 'td'
 !
 
-blockquote
-	^self tag: 'blockquote'
+th
+    ^self tag: 'th'
 !
 
-base
-	^self tag: 'base'
+form
+    ^self tag: 'form'
 !
 
-aside
-	^self tag: 'aside'
+input
+    ^self tag: 'input'
 !
 
-article
-    ^self tag: 'article'
+button
+    ^self tag: 'button'
 !
 
-area
-	^self tag: 'area'
+select
+    ^self tag: 'select'
 !
 
-address
-	^self tag: 'address'
+option
+    ^self tag: 'option'
 !
 
-abbr
-	^self tag: 'abbr'
-! !
+textarea
+    ^self tag: 'textarea'
+!
 
-!HTMLCanvas class methodsFor: 'instance creation'!
+a
+    ^self tag: 'a'
+!
 
-onJQuery: aJQuery
-	^self basicNew
-		initializeFromJQuery: aJQuery;
-		initialize;
-		yourself
+canvas
+	^self tag: 'canvas'
 !
 
-isMSIE
-	^((jQuery at: #browser) at: #msie) notNil
+pre
+    ^self tag: 'pre'
 !
 
-isOpera
-	^((jQuery at: #browser) at: #opera) notNil
+code
+    ^self tag: 'code'
 !
 
-isMozilla
-	^((jQuery at: #browser) at: #mozilla) notNil
+br
+    ^self tag: 'br'
 !
 
-isWebkit
-	^((jQuery at: #browser) at: #webkit) notNil
+script
+    ^self tag: 'script'
 !
 
-browserVersion
-	^(jQuery at: #browser) version
-! !
+link
+    ^self tag: 'link'
+!
 
-Object subclass: #TagBrush
-	instanceVariableNames: 'canvas element'
-	category: 'Canvas'!
+style
+	^ root addBrush:  (StyleTag canvas: self)
+!
 
-!TagBrush methodsFor: 'accessing'!
+p: anObject
+    ^self p with: anObject
+!
 
-element
-    ^element
-! !
+h1: anObject
+    ^self h1 with: anObject
+!
 
-!TagBrush methodsFor: 'adding'!
+iframe
+    ^self tag: 'iframe'
+!
 
-contents: anObject
-    self 
-	empty;
-   	append: anObject
+iframe: aString
+    ^self iframe src: aString
 !
 
-addBrush: aTagBrush
-    self appendChild: aTagBrush element.
-    ^aTagBrush
+h2: anObject
+    ^ self h2 with: anObject
 !
 
-with: anObject
-    self append: anObject
+h3: anObject
+    ^self h3 with: anObject
 !
 
-append: anObject
-    anObject appendToBrush: self
+h4: anObject
+    ^self h4 with: anObject
 !
 
-appendToBrush: aTagBrush
-    aTagBrush addBrush: self
+h5: anObject
+    ^self h5 with: anObject
 !
 
-appendBlock: aBlock
-    | root |
-    root := canvas root.
-    canvas root: self.
-    aBlock value: canvas.
-    canvas root: root
+h6: anObject
+    ^self h6 with: anObject
 !
 
-appendChild: anElement
-	"In IE7 and IE8 appendChild fails on several node types. So we need to check" 
- 	<var element=self['@element'];
- 	if (null == element.canHaveChildren || element.canHaveChildren) {
-		element.appendChild(anElement);
- 	} else {
- 		element.text = String(element.text) +  anElement.innerHTML;
- 	} >
+img: aString
+    ^self img src: aString
 !
 
-appendString: aString
-    self appendChild: (self createTextNodeFor: aString)
+ol: anObject
+    ^self ol with: anObject
 !
 
-empty
-	self asJQuery empty
-! !
+li: anObject
+    ^self li with: anObject
+!
 
-!TagBrush methodsFor: 'attributes'!
+ul: anObject
+    ^self ul with: anObject
+!
 
-at: aString put: aValue
-    <self['@element'].setAttribute(aString, aValue)>
+span: anObject
+    ^self span with: anObject
 !
 
-removeAt: aString
-    <self['@element'].removeAttribute(aString)>
+style: aString
+	^ self style with: aString; yourself
 !
 
-class: aString
-      <self['@element'].className = aString>
+audio
+    ^self tag: 'audio'
 !
 
-id: aString
-    self at: 'id' put: aString
+fieldset
+    ^self tag: 'fieldset'
 !
 
-src: aString
-    self  at: 'src' put: aString
+footer
+    ^self tag: 'footer'
 !
 
-href: aString
-    self at: 'href' put: aString
+header
+    ^self tag: 'header'
 !
 
-title: aString
-    self at: 'title' put: aString
+hr
+    ^self tag: 'hr'
 !
 
-style: aString
-    self at: 'style' put: aString
+section
+    ^self tag: 'section'
 !
 
-type: aString
-    self at: 'type' put: aString
+tbody
+    ^self tag: 'tbody'
 !
 
-media: aString
-    self at: 'media' put: aString
+tfoot
+    ^self tag: 'tfoot'
 !
 
-rel: aString
-    self  at: 'rel' put: aString
+thead
+    ^self tag: 'thead'
 !
 
-width: aString
-    self  at: 'width' put: aString
+video
+    ^self tag: 'video'
 !
 
-height: aString
-    self  at: 'height' put: aString
+label
+	^self tag: 'label'
 !
 
-value: aString
-    self  at: 'value' put: aString
+title
+	^self tag: 'title'
 !
 
-for: aString
-	self at: 'for' put: aString
+time
+	^self tag: 'time'
 !
 
-placeholder: aString
-	self at: 'placeholder' put: aString
+sup
+	^self tag: 'sup'
 !
 
-accesskey: aString
-	self at: 'accesskey' put: aString
+summary
+	^self tag: 'summary'
 !
 
-contenteditable: aString
-	self at: 'contenteditable' put: aString
+sub
+	^self tag: 'sub'
 !
 
-contextmenu: aString
-	self at: 'contextmenu' put: aString
+strong
+	^self tag: 'strong'
 !
 
-draggable: aString
-	self at: 'draggable' put: aString
+strong: anObject
+	^self strong with: anObject
 !
 
-hidden
-	self at: 'hidden' put: 'hidden'
+source
+	^self tag: 'source'
 !
 
-tabindex: aNumber
-	self at: 'tabindex' put: aNumber
+small
+	^self tag: 'small'
 !
 
-target: aString
-	self at: 'target' put: aString
+progress
+	^self tag: 'progress'
 !
 
-align: aString
-	self at: 'align' put: aString
+param
+	^self tag: 'param'
 !
 
-alt: aString
-	self at: 'alt' put: aString
+output
+	^self tag: 'output'
 !
 
-name: aString
-	self at: 'name' put: aString
+optgroup
+	^self tag: 'optgroup'
 !
 
-valign: aString
-	self at: 'valign' put: aString
+object
+	^self tag: 'object'
 !
 
-method: aString
-	self at: 'method' put: aString
+noscript
+	^self tag: 'noscript'
 !
 
-action: aString
-	self at: 'action' put: aString
+nav
+	^self tag: 'nav'
 !
 
-rows: aString
-	self at: 'rows' put: aString
+meta
+	^self tag: 'meta'
 !
 
-cols: aString
-	self at: 'cols' put: aString
-! !
+menu
+	^self tag: 'menu'
+!
 
-!TagBrush methodsFor: 'converting'!
+mark
+	^self tag: 'mark'
+!
 
-asJQuery
-    ^window jQuery: self element
-! !
+map
+	^self tag: 'map'
+!
 
-!TagBrush methodsFor: 'events'!
+legend
+	^self tag: 'legend'
+!
 
-onKeyDown: aBlock
-    self asJQuery bind: 'keydown' do: aBlock
+html
+	^self tag: 'html'
 !
 
-onKeyPress: aBlock
-    self asJQuery bind: 'keypress' do: aBlock
+hgroup
+	^self tag: 'hgroup'
 !
 
-onKeyUp: aBlock
-    self asJQuery bind: 'keyup' do: aBlock
+head
+	^self tag: 'head'
 !
 
-onFocus: aBlock
-    self asJQuery bind: 'focus' do: aBlock
+figure
+	^self tag: 'figure'
 !
 
-onBlur: aBlock
-    self asJQuery bind: 'blur' do: aBlock
+figcaption
+	^self tag: 'figcaption'
 !
 
-onChange: aBlock
-    self asJQuery bind: 'change' do: aBlock
+embed
+	^self tag: 'embed'
 !
 
-onClick: aBlock
-    self asJQuery bind: 'click' do: aBlock
+em
+	^self tag: 'em'
 !
 
-onSubmit: aBlock
-	self asJQuery bind: 'submit' do: aBlock
+dt
+	^self tag: 'dt'
 !
 
-onDblClick: aBlock
-	self asJQuery bind: 'dblclick' do: aBlock
+dl
+	^self tag: 'dl'
 !
 
-onHover: aBlock
-	self asJQuery bind: 'hover' do: aBlock
+details
+	^self tag: 'details'
 !
 
-onFocusIn: aBlock
-	self asJQuery bind: 'focusin' do: aBlock
+del
+	^self tag: 'del'
 !
 
-onFocusOut: aBlock
-	self asJQuery bind: 'focusout' do: aBlock
+dd
+	^self tag: 'dd'
 !
 
-onMouseDown: aBlock
-	self asJQuery bind: 'mousedown' do: aBlock
+datalist
+	^self tag: 'datalist'
 !
 
-onMouseUp: aBlock
-	self asJQuery bind: 'mouseup' do: aBlock
+command
+	^self tag: 'command'
 !
 
-onMouseEnter: aBlock
-	self asJQuery bind: 'mouseenter' do: aBlock
+colgroup
+	^self tag: 'colgroup'
 !
 
-onMouseLeave: aBlock
-	self asJQuery bind: 'mouseleave' do: aBlock
+col
+	^self tag: 'col'
 !
 
-onMouseMove: aBlock
-	self asJQuery bind: 'mousemove' do: aBlock
+cite
+	^self tag: 'cite'
 !
 
-onMouseOut: aBlock
-	self asJQuery bind: 'mouseout' do: aBlock
+caption
+	^self tag: 'caption'
 !
 
-onMouseOver: aBlock
-	self asJQuery bind: 'mouseover' do: aBlock
+body
+	^self tag: 'body'
 !
 
-onSelect: aBlock
-	self asJQuery bind: 'select' do: aBlock
+blockquote
+	^self tag: 'blockquote'
 !
 
-onUnload: aBlock
-	self asJQuery bind: 'unload' do: aBlock
-! !
+base
+	^self tag: 'base'
+!
 
-!TagBrush methodsFor: 'initialization'!
+aside
+	^self tag: 'aside'
+!
 
-initializeFromString: aString canvas: aCanvas
-    element := self createElementFor: aString.
-    canvas := aCanvas
+article
+    ^self tag: 'article'
 !
 
-initializeFromJQuery: aJQuery canvas: aCanvas
-    element := aJQuery get: 0.
-    canvas := aCanvas
-! !
+area
+	^self tag: 'area'
+!
 
-!TagBrush methodsFor: 'private'!
+address
+	^self tag: 'address'
+!
 
-createElementFor: aString
-	<return document.createElement(String(aString))>
+abbr
+	^self tag: 'abbr'
 !
 
-createTextNodeFor: aString
-	<return document.createTextNode(String(aString))>
+div: aBlock
+    ^self div with: aBlock
 ! !
 
-!TagBrush class methodsFor: 'instance creation'!
+!HTMLCanvas class methodsFor: 'instance creation'!
 
-fromString: aString canvas: aCanvas
-    ^self new
-	initializeFromString: aString canvas: aCanvas;
-	yourself
+onJQuery: aJQuery
+	^self basicNew
+		initializeFromJQuery: aJQuery;
+		initialize;
+		yourself
 !
 
-fromJQuery: aJQuery canvas: aCanvas
-    ^self new
-	initializeFromJQuery: aJQuery canvas: aCanvas;
-	yourself
-! !
-
-Object subclass: #Widget
-	instanceVariableNames: ''
-	category: 'Canvas'!
-
-!Widget methodsFor: 'adding'!
+isMSIE
+	^((jQuery at: #browser) at: #msie) notNil
+!
 
-appendToBrush: aTagBrush
-    self appendToJQuery: aTagBrush asJQuery
+isOpera
+	^((jQuery at: #browser) at: #opera) notNil
 !
 
-appendToJQuery: aJQuery
-   self renderOn: (HTMLCanvas onJQuery: aJQuery)
-! !
+isMozilla
+	^((jQuery at: #browser) at: #mozilla) notNil
+!
 
-!Widget methodsFor: 'rendering'!
+isWebkit
+	^((jQuery at: #browser) at: #webkit) notNil
+!
 
-renderOn: html
-    self
+browserVersion
+	^(jQuery at: #browser) version
 ! !
 
 TagBrush subclass: #StyleTag