<?xml version='1.0' encoding='UTF-8'?><?xml-stylesheet href="http://www.blogger.com/styles/atom.css" type="text/css"?><feed xmlns='http://www.w3.org/2005/Atom' xmlns:openSearch='http://a9.com/-/spec/opensearchrss/1.0/' xmlns:georss='http://www.georss.org/georss' xmlns:gd='http://schemas.google.com/g/2005' xmlns:thr='http://purl.org/syndication/thread/1.0'><id>tag:blogger.com,1999:blog-657162030526952657</id><updated>2011-08-08T08:15:11.852-07:00</updated><category term='Open source'/><title type='text'>Unobtainium Base Material</title><subtitle type='html'></subtitle><link rel='http://schemas.google.com/g/2005#feed' type='application/atom+xml' href='http://wobblyretroaction.blogspot.com/feeds/posts/default'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default?max-results=100'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/'/><link rel='hub' href='http://pubsubhubbub.appspot.com/'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><generator version='7.00' uri='http://www.blogger.com'>Blogger</generator><openSearch:totalResults>27</openSearch:totalResults><openSearch:startIndex>1</openSearch:startIndex><openSearch:itemsPerPage>100</openSearch:itemsPerPage><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-9132216563316510354</id><published>2010-04-02T20:45:00.000-07:00</published><updated>2010-04-02T20:46:48.849-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – Irregular Apocalypse</title><content type='html'>&lt;big&gt;&lt;b&gt;Surprise&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;Just as aliens seek to strike suddenly and disappear before X-COM arrives, so to does this blog arise inexorably from the deeps to... do something and go... somewhere before... Well, perhaps that wasn't such an apt comparison after all.&lt;br /&gt;&lt;br /&gt;Nonetheless, it returns with tardy tidings of the past and elusive glimpses of the future.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;The Light of Ancient Days: Release 0.7&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;0.7 was not particularly exciting. The only real coding I did was for ticket &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/156-loadbytes"&gt;#156&lt;/a&gt;, which converted the contents of a file into a byte array (actually an array of numbers). This effectively piggy-backed off of the preexisting ajax helper function, which returned the contents of a file as a string. From there each char was converted into a number via String::charCodeAt().&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/156-loadbytes"&gt;#156 loadBytes()&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;From &lt;a href="http://wobblyretroaction.blogspot.com/2010/02/processingjs-some-bits-for-06-in-time.html"&gt;release 0.6&lt;/a&gt; one may recall how I noticed a &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/312-char-arguments-indistinguishable-from-numbers"&gt;little problem&lt;/a&gt; concerning the automatic conversion of character arguments into numbers, making it very difficult to pass chars into functions.&lt;br /&gt;&lt;br /&gt;Not able to bring myself to let it pass, I took a crack at it. Indeed, the fix seemed simple: remove these two lines from the parser:&lt;br /&gt;&lt;code&gt;// Force characters-as-bytes to work.&lt;br /&gt;aCode = aCode.replace(/('(.){1}')/g, "$1.charCodeAt(0)");&lt;/code&gt;&lt;br /&gt;With those lines removed, the tests came back green and it seemed that particular beast was on its way into the cage.  But you &lt;i&gt;know&lt;/i&gt; what they say about things that seems too easy.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://twitter.com/Corban"&gt;Corban&lt;/a&gt; was quick to show that we still needed the auto-conversion facility and if something was to be done, removing those two lines was definitely not the end of the story. Within six hours, he'd come up with a much craftier solution: a Char class. Now, functions could check if an argument was of type Char and act accordingly.  Problem solved!&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/312-char-arguments-indistinguishable-from-numbers"&gt;#312 Char arguments indistinguishable from numbers&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;Along the way, &lt;a href="http://annasob.wordpress.com/"&gt;Anna&lt;/a&gt; poked me to take a look at ticket  &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/360-basic-letters-example-displays-wrong-info"&gt;#360&lt;/a&gt;, noting that &lt;a href="http://processingjs.org/learning/basic/letters"&gt;in this example&lt;/a&gt; the yellow letters were appearing white. This was due to the char-to-int conversion issue, and when that was solved, #360 was resolved without any additional work.&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/360-basic-letters-example-displays-wrong-info"&gt;#360 basic letters example displays wrong info&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;All's well that ends well, yes?&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;A More Recent Note: Release 0.8&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;The ride on the 0.8 line started innocently enough with the conversion of some visual tests into &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/writing-automated-tests"&gt;unit tests&lt;/a&gt;. &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/414-converting-binary-tests-from-visual-to-unit-causes-two-to-fail"&gt;Two failing tests for binary()&lt;/a&gt; had to be corrected. One was caused from an incorrect comparison value (Pjs was otherwise returning the right value). The second error was fixed by converting binary() to detect objects of type Char. Along the way boolean() was changed to throw errors on invalid arguments, instead of returning undefined.&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/414-converting-binary-tests-from-visual-to-unit-causes-two-to-fail"&gt;#414 Converting binary() tests from visual to unit causes two to fail.&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/412"&gt;#412 Throw errors on invalid arguments in max() and min().&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/413-convert-visual-tests-to-unit-tests"&gt;#413 Convert visual tests to unit tests.&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;There was a short stop at ticket &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/269-arraylistclone-does-not-deep-copy"&gt;#269&lt;/a&gt;, concerning whether or not  a cloned ArrayList should contain deep copies of items contained in the original. Processing uses Java's ArrayList, which does not deep copy. Since Pjs' ArrayList already conformed to this, the ticket was resolved as invalid.&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/269-arraylistclone-does-not-deep-copy"&gt;#269 ArrayList.clone does not deep copy&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;A rather longer stop was for &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/174-printmatrix"&gt;printMatrix()&lt;/a&gt;. printMatrix() outputs the current transformation matrix to the console. Work started in 0.7 but at the time it only worked when Pjs was working in a 3D context.  Why?  Because Pjs handles the 3D matrix itself, courtesy of PMatrix3D, and so the values of the 3D transformation matrix were readily accessible.  When working in the 2D context, Pjs used &lt;a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html"&gt;canvas&lt;/a&gt;' internal matrix.  This worked very well, except there was no way to retrieve the values of canvas' transformation matrix, and so there was nothing for printMatrix() to print.&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/174-printmatrix"&gt;#174 printMatrix()&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;printMatrix() was ultimately made ready for 0.8, thanks to work on a new and wonderful class...&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;PMatrix2D&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;During a phone conference in &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Processing.js/ConferenceCalls/Mar-11-2010"&gt;early March&lt;/a&gt; I proposed the creation of PMatrix2D to get printMatrix() going.  This meant replicating everything canvas already did just to be able to get the transformation matrix values.  I was hoping I was missing something and that there was another, easier way, but apparently there was not.  At the end of March the green light was given to cobble together PMatrix2D. Maybe the canvas API will be expanded in the future to allow the values to be retrieved.&lt;br /&gt;&lt;br /&gt;Choosing where to start implementing PMatrix2D for release 0.8 was easy: I coded just what was needed to convert the existing PMatrix3D and PMatrix3DStack tests  and examples into their 2D equivalents.  &lt;br /&gt;&lt;br /&gt;Rather than creating a new PMatrix2DStack class, it was easier to transform PMatrix3DStack into PMatrixStack which handled both 2D and 3D matrices.&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/439-implement-pmatrix2dstack"&gt;#439 Implement PMatrix2DStack &lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/428-implement-pmatrix2dapply-pmatrix2dskewx-and-pmatrix2dskewy"&gt;#428 Implement PMatrix2D::apply(), PMatrix2D::skewX(), and PMatrix2D::skewY() &lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/424-implement-pmatrix2dset"&gt;#424 Implement Pmatrix2D::set().&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/432-implement-pmatrix2d-constructors"&gt;#432 Implement PMatrix2D constructors.&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/437-implement-pmatrix2dprint"&gt;#437 Implement PMatrix2D::print().&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/431-implement-pmatrix2dreset"&gt;#431 Implement Pmatrix2D::reset().&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Toward Release 0.9 and 1.0&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;Things seem pretty clear cut from here on in.  For 0.9 I hope to finish off implementing the rest of PMatrix2D's functions.  1.0 will aim to get Pjs actually using it.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-9132216563316510354?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/04/processingjs-irregular-apocalypse.html#comment-form' title='2 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/9132216563316510354'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/9132216563316510354'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/04/processingjs-irregular-apocalypse.html' title='Processing.js – Irregular Apocalypse'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-5454818590306766792</id><published>2010-02-15T14:41:00.000-08:00</published><updated>2010-02-15T14:43:20.287-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – Some bits for 0.6 in time for midterm season</title><content type='html'>The Foundations of the Universe are based upon certain Truths, like: as the time to March break/reading week approaches zero, the frequency of exams and due dates sky rocket.  Coincidence? There's got to be a formal proof somewhere on the Internet...&lt;br /&gt;&lt;br /&gt;But before the coming crunch time gets real bad, is 0.6! From a developer's standpoint, the big improvement for 0.6 is &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/writing-automated-tests"&gt;unit testing&lt;/a&gt;. Now, just testing return values no longer requires cobbling together a full Processing program, and the tests may be more easily reused and modified by other developers. Yes, this means “pretty pictures" will appear far less frequently now., but on the whole is that really a bad thing? (Using canvas and Processing just to spit out numbers and letters doesn't do justice to either.)&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;char(), float(), and str()&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;First up: enhancing a trio of conversion functions. They may now handle the range of primitive type and array arguments they are supposed to.&lt;br /&gt;&lt;br /&gt;While the functions themselves don't do anything particularly remarkable, their behaviour helped uncover a bug in Pjs. When user code is parsed, Pjs converts chars into numbers. The relevant code is inside the Processing.parse() function:&lt;br /&gt;&lt;code&gt;// Force characters-as-bytes to work.&lt;br /&gt;aCode = aCode.replace(/('(.){1}')/g, "$1.charCodeAt(0)");&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;The parser finds single characters flanked by single quotation marks and calls charCodeAt() on those characters. What this means is overloading Pjs functions to handle both arguments of type Number and characters (essentially one-character Strings in JavaScript) becomes... difficult.&lt;br /&gt;&lt;br /&gt;Take str('A'). This &lt;em&gt;should&lt;/em&gt; return the string “A". But because of the parser what actually gets processed is str(65) (the &lt;em&gt;number&lt;/em&gt; 65), returning the string “65". Without jumping additional hoops, you can't tell str() whether that 65 is supposed to be a number 65, or if you actually mean that 65 to be representative of the char 'A'.&lt;br /&gt;&lt;br /&gt;This causes some str() tests to fail. char() tests are affected although they all pass. For example:&lt;br /&gt;&lt;code&gt;int i = 65;&lt;br /&gt;_checkEqual('A', char(i));&lt;/code&gt;&lt;br /&gt;This is evaluated as _checkEqual(65,65), &lt;em&gt;not&lt;/em&gt; _checkEqual('A', 'A'). The parser's fudging is masked by the passing tests.&lt;br /&gt;&lt;br /&gt;I've &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/312-char-arguments-indistinguishable-from-numbers"&gt;filed a ticket&lt;/a&gt; with the suggestion that the parser not convert chars to Numbers, and leave functions to do this by themselves. With unit testing now rolling it'll be easier to find which functions rely on the parser's current behaviour. I may very well pick up the ticket for 0.7.&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/303-char-suppose-to-work-on-all-primitive-datatypes-including-arrays"&gt;#303 char() suppose to work on all primitive datatypes including arrays&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/302-float-suppose-to-work-on-all-primitive-datatypes-including-arrays"&gt;#302 float() suppose to work on all primitive datatypes including arrays&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/304-str-suppose-to-work-on-all-primitive-datatypes-including-arrays"&gt;#304 str() suppose to work on all primitive datatypes including arrays&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;normal()&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;normal() takes three numeric arguments representing a vector and saves them to global variables. Oh, and it changes a flag. All of these (variables and flag) are supposedly used by other functions, but none of those uses have been implemented yet. (“What came first, normal() or the code that uses normal()?")&lt;br /&gt;&lt;br /&gt;Since normal() has no return value, the unit tests content themselves with checking the correct number and type of arguments are present.&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/125-normal"&gt;#125 normal()&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;smooth()/noSmooth()&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;char(), float(), str(), and normal() are the good news. Alas, smooth() and noSmooth() fall somewhat short of that mark and probably won't appear in 0.6.&lt;br /&gt;&lt;br /&gt;smooth() and noSmooth() are intended to toggle anti-aliasing on and off when painting. Canvas has no built in facility for this. &lt;a href="http://eligrey.com/"&gt;sephr&lt;/a&gt; found a Mozilla-only CSS property &lt;a href="https://developer.mozilla.org/En/CSS/Image-rendering"&gt;image-rendering&lt;/a&gt; applicable to the canvas tag, and perhaps able to achieve what was desired.&lt;br /&gt;&lt;br /&gt;Unfortunately, while image-rendering is good for raster images it doesn't work the same magic on canvas drawings.  For the time being, it seems smooth() and noSmooth() will go into hibernation.&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/145-smooth-and-nosmooth"&gt;#145 smooth() and noSmooth()&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-5454818590306766792?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-some-bits-for-06-in-time.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/5454818590306766792'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/5454818590306766792'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-some-bits-for-06-in-time.html' title='Processing.js – Some bits for 0.6 in time for midterm season'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-7992092599549246733</id><published>2010-02-07T21:20:00.000-08:00</published><updated>2010-02-07T21:21:32.303-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js - It's a long way to 0.6</title><content type='html'>“But my heart's right there", or so the song goes.  Indeed, it looks like my work is laid out for me. So for this short update, I'll just list what I hope to get done for February 19th (in no particular order):&lt;br /&gt;&lt;ul&gt;&lt;li&gt;Port &lt;em&gt;normal()&lt;/em&gt; (&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/125-normal"&gt;Ticket&lt;/a&gt;)&lt;/li&gt;&lt;li&gt;Complete porting &lt;em&gt;smooth()&lt;/em&gt; and &lt;em&gt;noSmooth()&lt;/em&gt; (&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/145-smooth-and-nosmooth"&gt;Ticket&lt;/a&gt;)&lt;/li&gt;&lt;li&gt;Upgrade &lt;em&gt;char()&lt;/em&gt;, &lt;em&gt;float()&lt;/em&gt;, &lt;em&gt;str()&lt;/em&gt; to accept a multitude of argument types (&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/220-int-float-str-et-al-are-suppose-to-work-on-all-primitive-datatypes-including-arrays"&gt;Ticket&lt;/a&gt;)&lt;/li&gt;&lt;/ul&gt;This will also be the first release where we'll be using &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/writing-automated-tests"&gt;automated tests&lt;/a&gt;! I wonder if I still have Minefield stashed away somewhere...&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-7992092599549246733?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-its-long-way-to-06.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/7992092599549246733'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/7992092599549246733'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-its-long-way-to-06.html' title='Processing.js - It&apos;s a long way to 0.6'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-3123823216124277374</id><published>2010-02-05T03:13:00.000-08:00</published><updated>2010-02-05T03:14:42.134-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – int() and Release 0.5</title><content type='html'>&lt;big&gt;&lt;b&gt;int(), the late passenger&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;A long time ago, in the forest across the river, where fiery leaves danced upon the crisp winds of pseudo-winter (or in other words: back in the &lt;a href="http://wobblyretroaction.blogspot.com/2009/11/dps909-project-processingjs-v02.html"&gt;0.2 release&lt;/a&gt;) I finished porting &lt;a href="http://processing.org/reference/boolean_.html"&gt;boolean()&lt;/a&gt;, a function that converted primitive types to either true or false, over to &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs). As it transpires, boolean() was just one a gaggle of conversion functions, many which continue to seek the company of a code monkey willing to give them a boost over the wall from Java-land into JavaScript-land.&lt;br /&gt;&lt;br /&gt;Yesterday evening, at the behest of The Powers That Be, and against the questionable judgement of my lazy self, I tentatively picked up the rest of these converters.  And as I told &lt;a href="http://annasob.wordpress.com/"&gt;Anna&lt;/a&gt;, the recently promoted Fearless Leader, I'd try to get one of them done for 0.5, whose deadline is today. So, without further ado, I present to you &lt;a href="http://processing.org/reference/int_.html"&gt;int()&lt;/a&gt; for Pjs.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Who wants to write the thousand words?&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;Lo, see now &lt;a href="http://matrix.senecac.on.ca/%7Emlam19/processingjs/intTest0.html"&gt;int() in action in Pjs&lt;/a&gt;, and compare it to how the same code renders in Processing:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_Mot-NgE1Yes/S2v9i5GAoZI/AAAAAAAAAC4/J4DaI2MVzxM/s1600-h/intTest0.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 170px;" src="http://1.bp.blogspot.com/_Mot-NgE1Yes/S2v9i5GAoZI/AAAAAAAAAC4/J4DaI2MVzxM/s320/intTest0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5434716151236043154" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Your eyes do not deceive you: &lt;em&gt;Pjs' int() fails a test.&lt;/em&gt; But don't break out the torches and pitchforks just yet! There's a good reason for this. int() may take a byte or an array of bytes as an argument. In Processing, a &lt;a href="http://processing.org/reference/byte.html"&gt;byte&lt;/a&gt; may have a value from -128 to 127, but more importantly: byte is a static type. Through overloading this allows Processing methods, written in Java, to behave differently to accommodate different variable types.&lt;br /&gt;&lt;br /&gt;Things are not so simple in JavaScript. In Pjs a Processing byte and int gets converted into a JavaScript 'number'; effectively there is no distinction between a byte and an int in Pjs. Since there's no distinction, int() cannot be tailored to behave differently when it receives bytes. (floats and doubles are different since you can always check if there's a decimal point in there somewhere.) Therefore, the test fails.&lt;br /&gt;&lt;br /&gt;A possible solution may be to add a second parameter to int(), a flag called 'isByte' or something. That might be something to bring up in next week's telephone conference.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;int() links&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/220-int-float-str-et-al-are-suppose-to-work-on-all-primitive-datatypes-including-arrays"&gt;Lighthouse ticket #220 int(), float(), str(), et al are suppose to work on all primitive datatypes including arrays&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://github.com/mlam19/processing-js/commit/2b829739c5a70322e384b1103bf0313e1935d045"&gt;GitHub commit&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;A Quick Recap of 0.5&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;Just for the record, here are the links to the rest of the stuff I did for 0.5:&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="http://wobblyretroaction.blogspot.com/2010/01/processingjs-improving-min-and-max.html"&gt;Enhance existing min() and max() implementation&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://wobblyretroaction.blogspot.com/2010/01/processingjs-stringequals-or-how-i.html"&gt;Implement String::equals()&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://wobblyretroaction.blogspot.com/2010/02/processingjs-nf.html"&gt;Enhance existing nf() implementation&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;br /&gt;I'll be making a (hopefully) shorter post soonish outlining what I hope to accomplish for 0.6. But for now, it's time to switch gears and call it a morning.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-3123823216124277374?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-int-and-release-05.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/3123823216124277374'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/3123823216124277374'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-int-and-release-05.html' title='Processing.js – int() and Release 0.5'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_Mot-NgE1Yes/S2v9i5GAoZI/AAAAAAAAAC4/J4DaI2MVzxM/s72-c/intTest0.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-5221712313964534052</id><published>2010-02-02T19:23:00.000-08:00</published><updated>2010-02-02T19:25:31.675-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – nf()</title><content type='html'>&lt;big&gt;&lt;b&gt;Closer to release 0.5&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;With a little luck, this should be my the last piece for the 0.5 release of &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs) . The &lt;a href="http://processing.org/reference/nf_.html"&gt;nf()&lt;/a&gt; function should now &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/227-nf"&gt;be able to handle&lt;/a&gt; arrays of numbers to be formatted, and float formatting.&lt;br /&gt;&lt;br /&gt;There's a few interesting things going on here that the Processing documentation doesn't allude to, but those are more easily revealed once we see the code in action.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;A few pixels&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;Here's the &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/nfTest0.html"&gt;first batch of tests in Pjs&lt;/a&gt; (hah, there's no way I'm trying to minify that for the post!) and here's what Processing generates for the same code:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_Mot-NgE1Yes/S2jsfp_wdrI/AAAAAAAAACo/-m67f75PvLQ/s1600-h/nfTest0.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 168px;" src="http://1.bp.blogspot.com/_Mot-NgE1Yes/S2jsfp_wdrI/AAAAAAAAACo/-m67f75PvLQ/s320/nfTest0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5433852979015874226" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;And here's the &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/nfTest1.html"&gt;second batch of tests (arrays) in Pjs&lt;/a&gt;, and here's what Processing generates for the same code:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_Mot-NgE1Yes/S2jskLCIKMI/AAAAAAAAACw/jvyVMMYGBjE/s1600-h/nfTest1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 270px;" src="http://3.bp.blogspot.com/_Mot-NgE1Yes/S2jskLCIKMI/AAAAAAAAACw/jvyVMMYGBjE/s320/nfTest1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5433853056603662530" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Note the tests use &lt;a href="http://wobblyretroaction.blogspot.com/2010/01/processingjs-stringequals-or-how-i.html"&gt;String::equals()&lt;/a&gt; which I recently completed and is not yet in the public release.&lt;br /&gt;&lt;br /&gt;Also, while the documentation says all arguments should be positive integers, Processing's nf() does handle arguments with values zero or less. So I've coded Pjs' version to do the same.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;It's supposed to do that?&lt;/b&gt;&lt;/big&gt; behaviour.&lt;br /&gt;&lt;br /&gt;There are two weirder-than-normal things going on.&lt;br /&gt;&lt;br /&gt;In the tests 19 to 32 in the first batch  you'll find that depending on whether the one's digit is odd or even, the 'rounding' is different. This required a bit of extra code to replicate.&lt;br /&gt;&lt;br /&gt;In the second batch, nf() processes values in the int array “incorrectly"; running through the ints individually results in the expected results. Strangely enough, my code was able to replicate this behaviour right off the bat.http://wobblyretroaction.blogspot.com/2010/01/processingjs-stringequals-or-how-i.html&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Links&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/227-nf"&gt;Lighthouse ticket #227 nf() &lt;br /&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://github.com/mlam19/processing-js/commit/6b5d56d6f9aa2d7e431164201b9aa8a007178d34"&gt;GitHub commit&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-5221712313964534052?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-nf.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/5221712313964534052'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/5221712313964534052'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/02/processingjs-nf.html' title='Processing.js – nf()'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_Mot-NgE1Yes/S2jsfp_wdrI/AAAAAAAAACo/-m67f75PvLQ/s72-c/nfTest0.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-6287792714176794112</id><published>2010-01-31T19:18:00.000-08:00</published><updated>2010-01-31T19:27:06.928-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – String::equals() (or: how I filled something in on the way)</title><content type='html'>&lt;big&gt;&lt;b&gt;Pothole? What pothole?&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;Open source development is like driving on a road with potholes where every driver also happens to be a road worker. One day you may just get fed up with driving over the same crater over and over again and decide to do something about it in the most direct way possible: stop the car, get out, and fill it in yourself.&lt;br /&gt;&lt;br /&gt;Of course, some holes get away for a while because they're just not that bad, or too deep. Other's scream for immediate rectification. Like the maws that open up suddenly and force you to slam on the breaks less you go careening into the deeps of the Earth. Or the holes just big enough to swallow a wheel and bring the scheduled excursion to a halt.&lt;br /&gt;&lt;br /&gt;Well, on the way to giving &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/227-nf"&gt;nf()&lt;/a&gt; a nudge I discovered one of those wheel eaters. Like Java, Processing uses an &lt;a href="http://processing.org/reference/String_equals_.html"&gt;equals()&lt;/a&gt; method to compare two Strings. JavaScript gets away with just ==, and for the past while &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs) has done without equals() and used just ==.  This was all well and good... until I started writing tests for nf().&lt;br /&gt;&lt;br /&gt;The nf() tests compare the String result of nf() and an expected String result. Depending or not the two Strings are the same the output's colour changes. To ensure the code used for the test in the Processing Development Environment and in Pjs were the same I needed equals(). (Mind you, I could have used == in Pjs, equals() in Processing, and get the same output, but that would have been cheating.)&lt;br /&gt;&lt;br /&gt;So with that short story aside, I present a quick and dirty String::equals() for Pjs. May this hole never become deeper.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;How the road looks now&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;So here's how it looks in &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/stringEqualsTest0.html"&gt;Pjs&lt;/a&gt;. (Again, we'll have to make due with a link. Minifying the code for insertion into the post didn't work out to well.) This example is extended from the &lt;a href="http://processing.org/reference/String_equals_.html"&gt;Processing example&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;And here's how the same code looks like in Processing:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2ZIXZz-eaI/AAAAAAAAACg/HKM5OLIXjZE/s1600-h/stringEqualsTest0.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 210px; height: 280px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2ZIXZz-eaI/AAAAAAAAACg/HKM5OLIXjZE/s320/stringEqualsTest0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5433109567372163490" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Links&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/246-str1equalsstr2-function"&gt;Lighthouse ticket #246 "str1".equals("str2") function &lt;br /&gt;&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://github.com/mlam19/processing-js/commit/c29df2b8c9cd68572ca1e01196306770fab14ff8"&gt;GitHub commit&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-6287792714176794112?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/processingjs-stringequals-or-how-i.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/6287792714176794112'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/6287792714176794112'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/processingjs-stringequals-or-how-i.html' title='Processing.js – String::equals() (or: how I filled something in on the way)'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/_Mot-NgE1Yes/S2ZIXZz-eaI/AAAAAAAAACg/HKM5OLIXjZE/s72-c/stringEqualsTest0.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-2896249383207014662</id><published>2010-01-31T03:48:00.000-08:00</published><updated>2010-01-31T03:52:29.713-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – Improving min() and max()</title><content type='html'>&lt;big&gt;&lt;b&gt;And another brick&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;So here's another little improvement for &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;In Processing, the &lt;a href="http://processing.org/reference/min_.html"&gt;min()&lt;/a&gt; and &lt;a href="http://processing.org/reference/max_.html"&gt;max()&lt;/a&gt; functions may take 2 or 3 numeric arguments, or one argument if its an array of numbers. For a while the Pjs implementation could only take &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/185-the-min-and-max-functions-effectively-take-only-two-arguments"&gt;two arguments&lt;/a&gt;. I have since taken it in hand and the Pjs implementation should now be able to do what the Processing implementation can do.&lt;br /&gt;&lt;br /&gt;Well, not exactly.  In fact, the Pjs implementation will happily take a great many more numeric arguments than just three. It'll even take one number in a pinch. Passing in non-numeric arguments, aside from a single array, will cause "undefined" to be returned. Trying to be clever and pass in an array as one of two or more arguments will also return "undefined". In Processing these "undefines" would be "thrown exceptions".&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;My eyes!&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;This will be another post where I'll provide links to the Pjs tests and comparison Processing images.&lt;br /&gt;&lt;br /&gt;Basic Processing example for min() in &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/minTest0.html"&gt;Pjs&lt;/a&gt;, and how it looks in Processing:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2VufmdqRNI/AAAAAAAAACA/Tlf4A1WC8M0/s1600-h/minTest0.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 310px; height: 280px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2VufmdqRNI/AAAAAAAAACA/Tlf4A1WC8M0/s320/minTest0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5432870014672323794" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;Basic Processing example for max() &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/maxTest0.html"&gt;Pjs&lt;/a&gt;, and how it looks in Processing:&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2VuldSrtRI/AAAAAAAAACI/2X-yZvpbMOY/s1600-h/maxTest0.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 310px; height: 280px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2VuldSrtRI/AAAAAAAAACI/2X-yZvpbMOY/s320/maxTest0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5432870115289576722" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;3 and 4 numeric arguments, and argument type discrimination, for min() in &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/minTest1.html"&gt;Pjs&lt;/a&gt;, and how it looks in Processing. Note that only three arguments is tested in Processing since the rest cause exceptions.&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_Mot-NgE1Yes/S2VuqoOctDI/AAAAAAAAACQ/mxMDwFzv59g/s1600-h/minTest1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 310px; height: 280px;" src="http://2.bp.blogspot.com/_Mot-NgE1Yes/S2VuqoOctDI/AAAAAAAAACQ/mxMDwFzv59g/s320/minTest1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5432870204123952178" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;3 and 4 numeric arguments, and argument type discrimination, for max() in &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/maxTest1.html"&gt;Pjs&lt;/a&gt;, and how it looks in Processing. Note that only three arguments is tested in Processing since the rest cause exceptions.&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2Vu10ulhhI/AAAAAAAAACY/5r5dljR0exA/s1600-h/maxTest1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 310px; height: 280px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/S2Vu10ulhhI/AAAAAAAAACY/5r5dljR0exA/s320/maxTest1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5432870396458534418" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;For the tests I had to pull a &lt;a href="http://github.com/mlam19/processing-js/commit/e3d7a1acc5b3d5564f9c0bb80aee6521ffffeb3f"&gt;patch&lt;/a&gt; or &lt;a href="http://github.com/mlam19/processing-js/commit/67e1188f25437a294baaba482f148e07f67f0355"&gt;two&lt;/a&gt; fixing &lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/57-boolean-array-bug"&gt;Ticket #57 Boolean array bug&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Links&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/185-the-min-and-max-functions-effectively-take-only-two-arguments"&gt;Lighthouse ticket #185 The min() and max() functions effectively take only two arguments&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://github.com/mlam19/processing-js/commit/541d520221006cd37df153fa656b7a657ff8025d"&gt;GitHub commit&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-2896249383207014662?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/processingjs-improving-min-and-max.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/2896249383207014662'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/2896249383207014662'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/processingjs-improving-min-and-max.html' title='Processing.js – Improving min() and max()'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/_Mot-NgE1Yes/S2VufmdqRNI/AAAAAAAAACA/Tlf4A1WC8M0/s72-c/minTest0.png' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-6735485092926955098</id><published>2010-01-20T05:50:00.000-08:00</published><updated>2010-01-20T05:52:47.934-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>DPS911 Project – Processing.js – v0.4</title><content type='html'>&lt;big&gt;&lt;b&gt;A bit of touching up&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;So here we are: the first release for &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS911"&gt;DPS911&lt;/a&gt; this semester! For this release I've added missing functionality to &lt;a href=”http://processingjs.org/”&gt;Processing.js&lt;/a&gt;'s (Pjs) implementation of &lt;a href=”http://processing.org/reference/text_.html”&gt;text()&lt;/a&gt;. Unlike before, the function may now handle the printing of variable of integers, floats, doubles, and bytes, in addition to strings.&lt;br /&gt;&lt;br /&gt;Now I wait for a (hopefully) favourable peer review.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Pretty pictures&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;Here we see a live demo of how it works in Pjs now as shown on &lt;a href=”http://matrix.senecac.on.ca/~mlam19/processingjs/textTest1.html”&gt;this page&lt;/a&gt;:&lt;br /&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/init.js"&gt;&lt;/script&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/processing.js"&gt;&lt;/script&gt;&lt;script type="application/processing"&gt;size(200,300);background(50);text("String 10", 0, 20);text("10", 120, 20);text("String Joey", 0, 40);text("Joey", 120, 40);text("str(2.71828)", 0, 60);text(str(2.71828), 120, 60);text("Float 2.71849", 0, 100);text(2.71849, 120, 100);text("Float 2.7185", 0, 120);text(2.7185, 120, 120);text("Float 2.71851", 0, 140);text(2.71851, 120, 140);text("Float 2.7186", 0, 160);text(2.7186, 120, 160);text("Float 2.7", 0, 200);text(2.7, 120, 200);text("Int 10", 0, 220);text(10, 120, 220);byte b = -128;text("Byte -128", 0, 260);text(b, 120, 260);&lt;/script&gt;&lt;br /&gt;&lt;canvas id="test1"&gt;&lt;/canvas&gt;&lt;br /&gt;&lt;br /&gt;And here we see the same demo as displayed in the Processing Development Environment:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_Mot-NgE1Yes/S1cKm_dFmTI/AAAAAAAAAB4/gkOyGhlpco4/s1600-h/textTest1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 204px; height: 320px;" src="http://2.bp.blogspot.com/_Mot-NgE1Yes/S1cKm_dFmTI/AAAAAAAAAB4/gkOyGhlpco4/s320/textTest1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5428819540803164466" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;What are we looking at?&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;The Pjs implementation had to take a few things into account. Processing displays floats and doubles to the thousandths digit, which is easy enough to replicate in JavaScript using toFixed(). But notice how Processing rounds: for 2.7185 it rounds down to 2.718 instead of up to 2.719.&lt;br /&gt;&lt;br /&gt;toFixed(), by itself, rounds 2.7185 to  2.719, so a little bit of extra code was needed to alter this, like so:&lt;br /&gt;&lt;code&gt;&lt;pre&gt;&lt;br /&gt;if ( (val*1000) - Math.floor( val * 1000 ) == 0.5 ) {&lt;br /&gt;  val = val - 0.0001;&lt;br /&gt;}&lt;br /&gt;val = val.toFixed(3);&lt;br /&gt;&lt;/pre&gt;&lt;/code&gt;&lt;br /&gt;So for 2.7185 we craftily modify it to 2.7184 before sending it to toFixed().&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Pertinent links&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/191-the-text-function-accepts-only-strings"&gt;Lighthouse ticket (with patch)&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href="http://github.com/mlam19/processing-js/commit/b43a4854c31c27175edd4aa885bb431a79981daa"&gt;GitHub repo commit where it comes together&lt;/a&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-6735485092926955098?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/dps911-project-processingjs-v04.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/6735485092926955098'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/6735485092926955098'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/dps911-project-processingjs-v04.html' title='DPS911 Project – Processing.js – v0.4'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://2.bp.blogspot.com/_Mot-NgE1Yes/S1cKm_dFmTI/AAAAAAAAAB4/gkOyGhlpco4/s72-c/textTest1.png' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-299585324021419678</id><published>2010-01-17T11:24:00.000-08:00</published><updated>2010-01-17T12:52:10.876-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Thoughts on the Proper Care and Feeding of Git Repos on GitHub</title><content type='html'>&lt;big&gt;&lt;b&gt;The nature of the problem&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;Last semester I and the other &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Processing.js"&gt;students&lt;/a&gt; working on &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs) started using &lt;a href="https://github.com/"&gt;GitHub&lt;/a&gt;.  We all made our own branch of the Pjs trunk repo and started hacking away.  Over time we committed to our branches and some of our improvements went into trunk.&lt;br /&gt;&lt;br /&gt;But our very success started to have some unintended consequences.  Trunk advanced but our branches did not gain the improvements merged into trunk.  This made our antiquated branches increasingly  poor bases to produce patches for trunk.  Needless to say, this inconvenience was not appreciated by anybody.&lt;br /&gt;&lt;br /&gt;After a bit of experimentation I managed to find a way to keep my branch up to date without deleting it and starting fresh.  &lt;a href="http://asydik.wordpress.com/"&gt;Mickael Medel&lt;/a&gt; (aSydik), one of my classmates, has requested I spread the joy and blog about what I did. So here it is.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Fractional-reserve coding&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;In five easy steps most, if not all, problems, may be averted.&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Step 1 – Pull from trunk to the branch on your local system&lt;/b&gt;&lt;br /&gt;&lt;br /&gt;Before making any changes locally make sure you have the latest version of trunk. Pulling from trunk every time it changes isn't such a bad idea: it's much easier for Git to automatically merge code when the difference is small or simple.  If the difference is too complex Git may cry "conflict!" and make &lt;i&gt;you&lt;/i&gt; sort out the mess. Not good.&lt;br /&gt;&lt;br /&gt;For us monkeys working on Pjs, I believe the pertinent pull command is:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;git pull git://github.com/jeresig/processing-js.git master&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;Now, if you have more than one development system (as I do: desktop at home, and laptop) you may need to pull from your own repo instead of trunk. In that case the pertinent command is something like:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;git pull git@github.com:yourusername/processing-js.git master&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Step 2 – Hack on your local branch&lt;/b&gt;&lt;br /&gt;&lt;br /&gt;So now have a totally updated version on your local system and the time has come for you to work your magic.  Hack, surf, and make merry!&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Step 3 – Commit on your local branch&lt;/b&gt;&lt;br /&gt;&lt;br /&gt;After many hours of fruitful hacking you look out the window and the sun has been suspiciously replaced by the moon.  It's time to call it a morning and push things back to your GitHub repo.  But wait!  Remember to commit the changes first, otherwise you'll have nothing to push.&lt;br /&gt;&lt;br /&gt;I guess that Step 2 and 3 are just reminders, right?&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Step 4 – Push your local commits to your online repo&lt;/b&gt;&lt;br /&gt;&lt;br /&gt;Now comes the culmination of your efforts, fuelled by countless grams of caffeine and other tasty goodies: &lt;i&gt;the big push&lt;/i&gt;.  At this point you need to update your online repo to match the local repo. Not to hard, just plug in something that looks like this:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;git push git+ssh://git@github.com/yourusername/processing-js.git&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;If all goes well the local commits will flood across cyberspace, and you shall know balance and harmony...&lt;br /&gt;&lt;br /&gt;&lt;b&gt;Step 5 – Back to Step 1&lt;/b&gt;&lt;br /&gt;&lt;br /&gt;… for a little while.  When you're ready to go at it again, collect your $200 and sally back to Step 1.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Opposites attract, but sometimes we wish they wouldn't&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;The above works very well if your branch is kept up to date.  But if you're sitting on some really old revision chances are Git will be unable to do the merge in Step 1.  It'll cry "conflict!" and you'll have to sort it out.  By this I mean you'll need to do the merge &lt;i&gt;manually&lt;/i&gt; (yes, lots of copying and pasting and what not.)&lt;br /&gt;&lt;br /&gt;If the situation is really bad you may simply want to kill and remake your branch from scratch, keeping in mind to regularly update the resuscitated branch this time round.&lt;br /&gt;&lt;br /&gt;If you slog through the manual merge, then commit changes to finish the merge.  Committing will also tell Git the conflict has been resolved and you'll be back in business.  At least, that's what I think happened when I resolved my first (and so far only) conflict.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Only now, at the end, do you understand.&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;br /&gt;I hope that was helpful for those in need.&lt;br /&gt;&lt;br /&gt;I apologize to Mickael for the tardy post. He asked for this last Thursday and it took me a while to cobble this together. You see, I use an unholy combination of the command line and the &lt;a href="http://www.eclipse.org/egit/"&gt;EGit plugin&lt;/a&gt; for &lt;a href="http://www.eclipse.org/"&gt;Eclipse&lt;/a&gt; to interface with GitHub so I wasn't quite sure what the exact commands were. I tested them with my latest commit to GitHub so I hope they work for everybody else.&lt;br /&gt;&lt;br /&gt;Yes, I use Eclipse to hack Processing.js, but only because EGit appeals to my laziness.  Otherwise I'd do what sane people do and use a "regular" text editor.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-299585324021419678?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/thoughts-on-proper-care-and-feeding-of.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/299585324021419678'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/299585324021419678'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/thoughts-on-proper-care-and-feeding-of.html' title='Thoughts on the Proper Care and Feeding of Git Repos on GitHub'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-1638707882844937721</id><published>2010-01-14T01:05:00.000-08:00</published><updated>2010-01-14T01:08:09.487-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>2010, DPS911, and more Processing.js!</title><content type='html'>&lt;big&gt;&lt;b&gt;The Times They Are a-Changin'&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;Last semester in 2009 (so long!) I wandered into &lt;a href=”http://zenit.senecac.on.ca/wiki/index.php/DPS909”&gt;DPS909&lt;/a&gt; and busied myself &lt;a href=”http://zenit.senecac.on.ca/wiki/index.php/Porting_pushStyle%28%29,_popStyle%28%29,_and_boolean%28%29_to_Processing.js”&gt;porting some functions&lt;/a&gt; over from &lt;a href=”http://processing.org/”&gt;Processing&lt;/a&gt; to &lt;a href=”http://processingjs.org/”&gt;Processing.js&lt;/a&gt; (Pjs).&lt;br /&gt;For more on what Pjs is about check out a &lt;a href=”http://wobblyretroaction.blogspot.com/2009/09/processingjs-plan-to-push-and-pop.html”&gt;previous ancient post&lt;/a&gt;.&lt;br /&gt;In a fitting continuity of events , this semester in 2010 (hello!) I've wandered into DPS909's follow-on, &lt;a href=”http://zenit.senecac.on.ca/wiki/index.php/DPS911”&gt;DPS911&lt;/a&gt; and will continue futzing around with Pjs. The work done for DPS909 were released as 0.1 to 0.3, so not surprisingly the work for DPS911 will be released as 0.4 to the big 1.0.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;The Plan&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;For v0.4 to v1.0, I hope to port over some new functions in addition to fixing existing bugs.  The prospective task list and timeline is given below:&lt;br /&gt;&lt;ul&gt;&lt;li&gt;Release 0.4 – Jan. 22, 2010&lt;ul&gt;&lt;li&gt;&lt;a href=”https://processing-js.lighthouseapp.com/projects/41284/tickets/191-the-text-function-accepts-only-strings”&gt;Fix text() to accept non-String arguments.&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li&gt;Release 0.5 – Feb. 5, 2010&lt;ul&gt;&lt;li&gt;&lt;a href=”https://processing-js.lighthouseapp.com/projects/41284/tickets/185-the-min-and-max-functions-effectively-take-only-two-arguments#ticket-185-3”&gt;Fix min() and max() to take more than two arguments each.&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li&gt;Release 0.6 – Feb. 19, 2010&lt;ul&gt;&lt;li&gt;&lt;a href=”https://processing-js.lighthouseapp.com/projects/41284/tickets/156-loadbytes”&gt;Port loadBytes().&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li&gt;Release 0.7 – Mar. 13, 2010&lt;ul&gt;&lt;li&gt;&lt;a href=”https://processing-js.lighthouseapp.com/projects/41284/tickets/125-normal#ticket-125-3”&gt;Port normal().&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li&gt;Release 0.8 – Mar. 27, 2010&lt;ul&gt;&lt;li&gt;&lt;a href=”https://processing-js.lighthouseapp.com/projects/41284/tickets/174-printmatrix”&gt;Port printMatrix().&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;/li&gt;&lt;li&gt;Release 0.9 – Apr. 9, 2010&lt;ul&gt;&lt;li&gt;&lt;a href=”https://processing-js.lighthouseapp.com/projects/41284/tickets/109-printcamera”&gt;Port printCamera().&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;li&gt;Release 1.0 – Apr. 23, 2010&lt;ul&gt;&lt;li&gt;Padding for overruns and to give time to fix any bugs from releases 0.1 to 0.3 from DPS909.&lt;/li&gt;&lt;li&gt;If that happens not to be necessary, I'll just choose another function to port of bug to fix.&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;&lt;/ul&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Obligatory List of Relevant Links&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href=”https://processing-js.lighthouseapp.com/”&gt;Processing.js @ Lighthouse&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=”http://zenit.senecac.on.ca/wiki/index.php/Processing.js”&gt;Processing.js @ zenit.senecac.on.ca&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=”http://zenit.senecac.on.ca/wiki/index.php/Porting_pushStyle%28%29,_popStyle%28%29,_and_boolean%28%29_to_Processing.js”&gt;My Processing.js Project Page @ zenit.senecac.on.ca&lt;/a&gt;&lt;/li&gt;&lt;li&gt;&lt;a href=”http://github.com/mlam19/processing-js”&gt;My Processing.js repository @ GitHub&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-1638707882844937721?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/2010-dps911-and-more-processingjs.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1638707882844937721'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1638707882844937721'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2010/01/2010-dps911-and-more-processingjs.html' title='2010, DPS911, and more Processing.js!'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-3474401660486414165</id><published>2009-12-09T16:23:00.000-08:00</published><updated>2009-12-09T16:25:00.734-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>DPS909 Project – Processing.js – v0.3</title><content type='html'>&lt;big&gt;&lt;b&gt;And It's A Warp...&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;… for this phase.  This is the last release for this semester's &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; project.  For this bit &lt;a href="http://wobblyretroaction.blogspot.com/2009/11/processingjs-strokecap.html"&gt;strokeCap()&lt;/a&gt; and &lt;a href="http://wobblyretroaction.blogspot.com/2009/12/processingjs-strokejoin.html"&gt;strokeJoin()&lt;/a&gt; were ported from &lt;a href="http://processing.org/"&gt;Processing&lt;/a&gt; to &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt;.  The meat of what was done may be found in previous posts linked to above, so I won't occupy everybody again by repeating it here (after all, it's exam time!)&lt;br /&gt;So without further ado, here are pertinent the pertinent links:&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Links to Elsewhere&lt;/b&gt;&lt;/big&gt;&lt;ul&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/84-strokecap#ticket-84-7"&gt;Lighthouse ticket for strokeCap()&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="https://processing-js.lighthouseapp.com/projects/41284/tickets/146-strokejoin#ticket-146-4"&gt;Lighthouse ticket for strokeJoin()&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="http://github.com/mlam19/processing-js"&gt;Code branch at GtiHub&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Links to the Past&lt;/b&gt;&lt;/big&gt;&lt;ul&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="http://wobblyretroaction.blogspot.com/2009/10/dps909-project-processingjs-v01.html"&gt;Release 0.1&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="http://wobblyretroaction.blogspot.com/2009/10/dps909-project-processingjs-v01.html"&gt;Release 0.2&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;And Away!&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;That's it for now.  With a little luck I'll see you right back here in a months time for &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS911"&gt;DPS911&lt;/a&gt;.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-3474401660486414165?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/12/dps909-project-processingjs-v03.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/3474401660486414165'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/3474401660486414165'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/12/dps909-project-processingjs-v03.html' title='DPS909 Project – Processing.js – v0.3'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-7707314902102011199</id><published>2009-12-02T12:48:00.000-08:00</published><updated>2009-12-02T12:52:27.634-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – strokeJoin()</title><content type='html'>&lt;big&gt;&lt;b&gt;Copy and Pasting,,, Works!&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;a href=”http://wobblyretroaction.blogspot.com/2009/11/processingjs-strokecap.html”&gt;Hot on the heels&lt;/a&gt; of &lt;a href="http://processing.org/reference/strokeCap_.html"&gt;&lt;i&gt;strokeCap()&lt;/i&gt;&lt;/a&gt; &lt;i&gt;strokeCap()&lt;/i&gt; is &lt;a href="http://processing.org/reference/strokeJoin_.html"&gt;&lt;i&gt;strokeJoin()&lt;/i&gt;&lt;/a&gt;. This blazingly fast turn around was accomplished by the time honoured method of shamelessly lifting previous work wholesale and tweaking.&lt;br /&gt;Observe: here we have &lt;i&gt;strokeCap()&lt;/i&gt;:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;p.strokeCap = function strokeCap( set ){&lt;br /&gt;        if ( set == p.ROUND ) {&lt;br /&gt;                curContext.lineCap = 'round';&lt;br /&gt;        } else if ( set == p.SQUARE ) {&lt;br /&gt;                curContext.lineCap = 'butt';&lt;br /&gt;        } else if ( set == p.PROJECT ) {&lt;br /&gt;                curContext.lineCap = 'square';&lt;br /&gt;        }&lt;br /&gt;    };&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;And here we have &lt;i&gt;strokeJoin()&lt;/i&gt;:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;p.strokeJoin = function strokeJoin( set ){&lt;br /&gt;     if ( set == p.MITER ) {&lt;br /&gt;      curContext.lineJoin = 'miter';&lt;br /&gt;     } else if ( set == p.BEVEL ) {&lt;br /&gt;      curContext.lineJoin = 'bevel';&lt;br /&gt;     } else if ( set == p.ROUND ) {&lt;br /&gt;      curContext.lineJoin = 'round';&lt;br /&gt;     }&lt;br /&gt;    };&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;As we can see &lt;i&gt;strokeCap()&lt;/i&gt; gained a very close sibling in &lt;i&gt;strokeJoin()&lt;/i&gt;!&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Newborn Boo-boos&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;This is not to say the birth of the younger didn't affect the elder.  Originally the constants for &lt;i&gt;strokeCap()&lt;/i&gt; and &lt;i&gt;strokeJoin()&lt;/i&gt; were defined separately, like so:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;// Stroke cap constants.&lt;br /&gt;     p.ROUND   = 0;&lt;br /&gt;     p.SQUARE  = 1;&lt;br /&gt;     p.PROJECT = 2;&lt;br /&gt;&lt;br /&gt;     // Stroke join constants.&lt;br /&gt;     p.MITER = 0;&lt;br /&gt;     p.BEVEL = 1;&lt;br /&gt;     p.ROUND = 2;&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;p.ROUND was redefined for &lt;i&gt;strokeJoin()&lt;/i&gt; and ended up conflicting with &lt;i&gt;strokeCap()&lt;/i&gt;'s  p.PROJECT.  This caused... incorrect behaviour in an otherwise well behaved &lt;i&gt;strokeCap()&lt;/i&gt;.&lt;br /&gt;The problem was solved simply be consolidating the constants into:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;// Stroke cap and join constants.&lt;br /&gt;    p.ROUND   = 0; // Used by both cap and join.&lt;br /&gt;    p.SQUARE  = 1; // Used by cap.&lt;br /&gt;    p.PROJECT = 2; // Used by cap.&lt;br /&gt;    p.MITER   = 3; // Used by join.&lt;br /&gt;    p.BEVEL   = 4; // Used by join.&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Pretty Pixels!&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;To end off here is the code in action compared to the results of the same code in the Processing Development Environment (PDE).&lt;br /&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/init.js"&gt;&lt;/script&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/processing.js"&gt;&lt;/script&gt;&lt;script type="application/processing"&gt;size(150,100);background(204,204,204);noFill();smooth();strokeWeight(10.0);int x=0;beginShape();vertex(x+35, 20);vertex(x+65, 50);vertex(x+35, 80);endShape();x=x+25;strokeJoin(BEVEL);beginShape();vertex(x+35, 20);vertex(x+65, 50);vertex(x+35, 80);endShape();x=x+25;strokeJoin(ROUND);beginShape();vertex(x+35, 20);vertex(x+65, 50);vertex(x+35, 80);endShape();x=x+25;strokeJoin(MITER);beginShape();vertex(x+35, 20);vertex(x+65, 50);vertex(x+35, 80);endShape();&lt;/script&gt;&lt;br /&gt;&lt;canvas id="test1"&gt;&lt;/canvas&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/SxbTAtdtf2I/AAAAAAAAABw/2VlfTHNYMZk/s1600-h/strokeJoin2.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 160px; height: 158px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/SxbTAtdtf2I/AAAAAAAAABw/2VlfTHNYMZk/s320/strokeJoin2.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5410744011489902434" /&gt;&lt;/a&gt;&lt;br /&gt;On a side note I've noticed the Processing website's examples are imprecise; their code and images do not match up.  The images show the result of &lt;i&gt;strokeCap(SQUARE)&lt;/i&gt; or &lt;i&gt;strokeCap(PROJECT)&lt;/i&gt; being called, but these calls are missing in the example code.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-7707314902102011199?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/12/processingjs-strokejoin.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/7707314902102011199'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/7707314902102011199'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/12/processingjs-strokejoin.html' title='Processing.js – strokeJoin()'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/_Mot-NgE1Yes/SxbTAtdtf2I/AAAAAAAAABw/2VlfTHNYMZk/s72-c/strokeJoin2.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-1266877719808630996</id><published>2009-11-29T17:03:00.000-08:00</published><updated>2009-11-29T17:14:44.393-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – strokeCap()</title><content type='html'>&lt;big&gt;&lt;b&gt;strokeCap()&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;Another week or two, and a bit of work toward the 0.3 release of my &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Porting_pushStyle%28%29,_popStyle%28%29,_and_boolean%28%29_to_Processing.js"&gt;project&lt;/a&gt;.  This time it was &lt;a href="http://processing.org/reference/strokeCap_.html"&gt;&lt;i&gt;strokeCap()&lt;/i&gt;&lt;/a&gt;'s turn to be ported to &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs).&lt;br /&gt;So here is the basic Processing &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/strokeCapTest0.html"&gt;example&lt;/a&gt; working in Pjs:&lt;br /&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/init.js"&gt;&lt;/script&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/processing.js"&gt;&lt;/script&gt;&lt;script type="application/processing"&gt;size(100,100);background(204,204,204);smooth();strokeWeight(12.0);strokeCap(ROUND);line(20, 30, 80, 30);strokeCap(SQUARE);line(20, 50, 80, 50);strokeCap(PROJECT);line(20, 70, 80, 70);&lt;/script&gt;&lt;br /&gt;&lt;canvas id="test1"&gt;&lt;/canvas&gt;&lt;br /&gt;And here is the example running in the Processing Development Environment (PDE):&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_Mot-NgE1Yes/SxMb3Qhqo2I/AAAAAAAAABg/3ATS8KpFBhw/s1600/strokecap1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 138px; height: 158px;" src="http://1.bp.blogspot.com/_Mot-NgE1Yes/SxMb3Qhqo2I/AAAAAAAAABg/3ATS8KpFBhw/s320/strokecap1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5409698213545026402" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Squishy Innards&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;This is all done by setting canvas' &lt;a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#dom-context-2d-linecap"&gt;&lt;i&gt;lineCap&lt;/i&gt;&lt;/a&gt; attribute.  lineCap has three possible values which correspond directly to those used by Processing so &lt;i&gt;strokeCap()&lt;/i&gt;'s code looks just like this:&lt;br /&gt;&lt;code&gt;&lt;pre&gt;p.strokeCap = function strokeCap( set ){&lt;br /&gt;    if ( set == p.ROUND ) {&lt;br /&gt;        curContext.lineCap = 'round';&lt;br /&gt;    } else if ( set == p.SQUARE ) {&lt;br /&gt;        curContext.lineCap = 'butt';&lt;br /&gt;    } else if ( set == p.PROJECT ) {&lt;br /&gt;        curContext.lineCap = 'square';&lt;br /&gt;    }&lt;br /&gt;};&lt;/pre&gt;&lt;/code&gt;&lt;br /&gt;&lt;i&gt;lineCap&lt;/i&gt; is also handled by canvas' &lt;a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#the-canvas-state"&gt;state saving functions&lt;/a&gt;, which means Pjs' &lt;a href="http://wobblyretroaction.blogspot.com/2009/11/dps909-project-processingjs-v02.html"&gt;&lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt;&lt;/a&gt; can already handle saving and restoring the setting as well.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;A Different Starting Point&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;The main difference between canvas and Processing/Pjs is the default setting for &lt;i&gt;lineCap&lt;/i&gt;. Canvas' default is “butt", which is “SQUARE" in Processing.  Processing needs to default to “ROUND", which is “round" in canvas.&lt;br /&gt;&lt;br /&gt;There was a bit of trouble getting the default working in Pjs. At first adding &lt;i&gt;curContext.lineCap = 'round';&lt;/i&gt; to &lt;i&gt;&lt;b&gt;function&lt;/b&gt; init&lt;/i&gt; didn't work.  &lt;a href="http://www.hyper-metrix.com/"&gt;Al MacDonald&lt;/a&gt; (F1LT3R) was very quickly able to &lt;a href="http://github.com/mlam19/processing-js/commit/d0fb33e27e96b14304ec4902048d3f8f1447fb81"&gt;find where the problem was and fix it&lt;/a&gt;: it turns out &lt;i&gt;&lt;b&gt;function&lt;/b&gt; size&lt;/i&gt; recreated the canvas context every time it was called, which in turn reset all the attributes.  Thanks, Al!&lt;br /&gt;&lt;br /&gt;So now the default setting works &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/strokeCapTest1.html"&gt;very nicely&lt;/a&gt; in Pjs:&lt;br /&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/init.js"&gt;&lt;/script&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/js/processing.js"&gt;&lt;/script&gt;&lt;script type="application/processing"&gt;size(100,100);background(204,204,204);smooth();strokeWeight(12.0);line(20, 30, 80, 30);strokeCap(SQUARE);line(20, 50, 80, 50);strokeCap(PROJECT);line(20, 70, 80, 70);strokeCap(ROUND);line(20, 90, 80, 90);&lt;/script&gt;&lt;br /&gt;&lt;canvas id="test2"&gt;&lt;/canvas&gt;&lt;br /&gt;Compare to the same thing in PDE:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/SxMb-Ojq7FI/AAAAAAAAABo/tpHhlgyp4tE/s1600/strokecap2.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 138px; height: 158px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/SxMb-Ojq7FI/AAAAAAAAABo/tpHhlgyp4tE/s320/strokecap2.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5409698333275647058" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Useful Links&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;ul&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="http://github.com/mlam19/processing-js/commit/e365cd710adb79800ebf5daedfda773b3c29ab6c"&gt;GitHub commit&lt;/a&gt; where &lt;i&gt;strokeCap()&lt;/i&gt; works&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="http://processing-js.lighthouseapp.com/projects/41284/tickets/84-strokecap#ticket-84-4"&gt;Lighthouse ticket&lt;/a&gt; (will need to be reopened for code review)&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-1266877719808630996?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/processingjs-strokecap.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1266877719808630996'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1266877719808630996'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/processingjs-strokecap.html' title='Processing.js – strokeCap()'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_Mot-NgE1Yes/SxMb3Qhqo2I/AAAAAAAAABg/3ATS8KpFBhw/s72-c/strokecap1.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-8659818662737592819</id><published>2009-11-26T09:52:00.000-08:00</published><updated>2009-11-26T09:56:23.515-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Firefox Addon and XPCOM</title><content type='html'>So last week in &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; we were supposed to feel our way through a &lt;a href="https://wiki.mozilla.org/Education/Learning/XpcomComponents"&gt;lab&lt;/a&gt; giving some idea how Mozilla's &lt;a href="https://developer.mozilla.org/en/XPCOM"&gt;XPCOM&lt;/a&gt; works.  XPCOM is used to ensure code portability.  I do not pretend to understand how it all works, it's rather complicated and terrifying for a newbie, but at the very least I can follow instructions.&lt;br /&gt;&lt;br /&gt;The big first step is to create an XPCOM interface using a &lt;a href="https://developer.mozilla.org/en/XPIDL"&gt;XPIDL&lt;/a&gt; file, which includes function prototypes using familiar C/C++ data types (at least in the walkthrough, XPCOM may be used with other languages to).  A header file is automatically generated which, amongst other things, transforms the data types into Mozilla's data types and creates a stub class using the header.  In other words, a lot of the basic set up work is done for the code cruncher (winner!)&lt;br /&gt;&lt;br /&gt;Most of the walkthrough was pretty straight forward.  There were a few minor things that needed to be changed or were different.  In &lt;i&gt;install.rdf&lt;/i&gt;, I changed &lt;i&gt;em:minVersion&lt;/i&gt; and &lt;i&gt;em:maxVersion&lt;/i&gt; to 3.5.5 and 3.7a1pre respectively (that allowed the extension to work in the trunk build.)  Also, &lt;i&gt;IFirstXpcom,h&lt;/i&gt; was created in &lt;i&gt;$(objdir)/dist/include/&lt;/i&gt; rather than &lt;i&gt;$(objdir)/dist/include/firstxpcom/&lt;/i&gt;.&lt;br /&gt;&lt;br /&gt;But everything worked out and so I can now claim to have created (after near slavishly following somebody else's instructions) an add-on for Firefox.&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_Mot-NgE1Yes/Sw7ArOPwPxI/AAAAAAAAABI/GGn_EYiMXns/s1600/firstxpcom.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 232px;" src="http://1.bp.blogspot.com/_Mot-NgE1Yes/Sw7ArOPwPxI/AAAAAAAAABI/GGn_EYiMXns/s320/firstxpcom.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5408472051309625106" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/Sw7BNk15QNI/AAAAAAAAABQ/1JmVhQhUD_8/s1600/firstxpcom1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 229px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/Sw7BNk15QNI/AAAAAAAAABQ/1JmVhQhUD_8/s320/firstxpcom1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5408472641490731218" /&gt;&lt;/a&gt;&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-8659818662737592819?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/firefox-addon-and-xpcom.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/8659818662737592819'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/8659818662737592819'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/firefox-addon-and-xpcom.html' title='Firefox Addon and XPCOM'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_Mot-NgE1Yes/Sw7ArOPwPxI/AAAAAAAAABI/GGn_EYiMXns/s72-c/firstxpcom.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-439096305334050892</id><published>2009-11-20T18:00:00.000-08:00</published><updated>2009-11-20T18:10:16.086-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – Something Lost/Gained in the Translation</title><content type='html'>The nice thing about porting is the end result is already known.  Comparing the effects of the original with the effects of the transcription is a good indicator of how close you are and whether or not you're on the right track.&lt;br /&gt;&lt;br /&gt;Simple, yes?&lt;br /&gt;&lt;br /&gt;Sure, at least in a perfect world where I could have my kitchen faucet yield hot chocolate and have my computer magically upgrade itself to the latest hardware and software.  Alas, a perfect, honest-to-the-source, zero deviation transcription may not always be possible; such is what I have discovered while tinkering with &lt;i&gt;pushStyle()&lt;/i&gt; &lt;i&gt;popStyle()&lt;/i&gt; and &lt;i&gt;boolean()&lt;/i&gt;.&lt;br /&gt;&lt;br /&gt;Below you will find I have not embedded the Pjs examples, instead I shall provide a link to another web page with the example on it. This is because embedding requires minification, and I'd rather not go through the frustration of minifying some of the larger examples.  I'll provide screenshots of how the examples look using the Processing Development Environment (PDE) for comparison.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Differences in pushStyle() and popStyle()&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;The basic Processing reference example looks like this&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/SwdKAcetQmI/AAAAAAAAAAo/Rqwoep8iu4E/s1600/pjsppt0.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 160px; height: 180px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/SwdKAcetQmI/AAAAAAAAAAo/Rqwoep8iu4E/s320/pjsppt0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5406371249187013218" /&gt;&lt;/a&gt;&lt;br /&gt;and can now be reproduced in Pjs (&lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/pushPopTest0.html"&gt;Pjs demo here&lt;/a&gt;.)  &lt;br /&gt;&lt;br /&gt;But take a Pjs demo like &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/pushPopTest1.html"&gt;this one&lt;/a&gt;. See the extra pops at the bottom?  You can't do that in Processing.  The PDE won't allow the Pjs example code to run; it'll see the extra pops, throw an exception, and refuse to run properly until the extra pops are removed. The closest approximation to the Pjs example Processing will allow looks something like this:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/SwdKS__jxHI/AAAAAAAAAAw/OPgY0ydZJ24/s1600/pjsppt1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 308px; height: 320px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/SwdKS__jxHI/AAAAAAAAAAw/OPgY0ydZJ24/s320/pjsppt1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5406371567957689458" /&gt;&lt;/a&gt;&lt;br /&gt;Pjs doesn't really concern itself with catching logical errors in the code.  At best it just concerns itself with syntactic errors, and if there are any it simply doesn't paint anything onto the canvas.  Saying that, the Pjs version of &lt;i&gt;popStyle()&lt;/i&gt; has to be a bit more lax than its Processing counterpart and work with, rather than crash on, extra pop calls.&lt;br /&gt;&lt;br /&gt;In this matter the solution is simple.  Upon figuring out the pop call is extraneous, Pjs effectively ignores it and carries on.  It must be one of the few times burying one's head in the sand actually makes the problem go away!&lt;br /&gt;&lt;big&gt;&lt;b&gt;Differences in boolean()&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;Moving onto &lt;i&gt;boolean()&lt;/i&gt;.  Let's start out with showing a basic example based on the one found on the Processing website.  It looks like this:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_Mot-NgE1Yes/SwdKogpMHxI/AAAAAAAAAA4/sNmAbW84Ez0/s1600/pjsb0.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 210px; height: 158px;" src="http://4.bp.blogspot.com/_Mot-NgE1Yes/SwdKogpMHxI/AAAAAAAAAA4/sNmAbW84Ez0/s320/pjsb0.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5406371937499488018" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;and it too may be reproduced in Pjs (&lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/booleanTest0.html"&gt;Pjs demo here&lt;/a&gt;.)  However, &lt;i&gt;boolean()&lt;/i&gt; is afar more complicated beast than the basic example would imply.  In this case it's a matter of how Java/Processing is very strict on the number and nature of arguments passed to a method, while JavaScript/Pjs is not.&lt;br /&gt;&lt;br /&gt;Take for example the following &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/booleanTest1.html"&gt;this Pjs demo&lt;/a&gt;.  Note how we're passing in doubles, booleans, ints, nulls, undefines, etc., and arrays with mysteriously empty elements.  If you were to try the code in Processing it wouldn't work.  For one, Processing's &lt;i&gt;boolean()&lt;/i&gt; refuses to handle boolean variables, or double variables, or nulls, and other fancy things like that.  In fact, the closest Processing example to the Pjs demo is rather more sparse and looks like this:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_Mot-NgE1Yes/SwdK6MsclKI/AAAAAAAAABA/NZQT4Jpf660/s1600/pjsb1.png"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 308px; height: 320px;" src="http://2.bp.blogspot.com/_Mot-NgE1Yes/SwdK6MsclKI/AAAAAAAAABA/NZQT4Jpf660/s320/pjsb1.png" border="0" alt=""id="BLOGGER_PHOTO_ID_5406372241382085794" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;(Un)fortunately, Pjs' &lt;i&gt;boolean()&lt;/i&gt; can't take the easy way out and throw away arguments it doesn't like, coughing up an exception, and making the whole show grind to a halt.  Being JavaScript it's syntactically correct to pass a cornucopia of dynamically typed arguments into a function.  Pjs' &lt;i&gt;boolean()&lt;/i&gt; has to handle whatever comes its way gracefully.&lt;br /&gt;&lt;br /&gt;As you can tell from the Pjs &lt;i&gt;boolean()&lt;/i&gt; demo, I thought this was best done by having the function return "meaningful" results from arguments not normally handled by Processing's &lt;i&gt;boolean()&lt;/i&gt;.  Numeric arguments are handled like integers: zero values return false, non-zero values return true.  Boolean arguments are just returned as themselves.  Nulls and undefines return false.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Heresy!&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;I like to think I've cobbled together an acceptable compromise between how Pjs and Processing behave. I guess I'll find out soon whether this is acceptable or not when I try to push the code into the library.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-439096305334050892?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/processingjs-something-lostgained-in.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/439096305334050892'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/439096305334050892'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/processingjs-something-lostgained-in.html' title='Processing.js – Something Lost/Gained in the Translation'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://4.bp.blogspot.com/_Mot-NgE1Yes/SwdKAcetQmI/AAAAAAAAAAo/Rqwoep8iu4E/s72-c/pjsppt0.png' height='72' width='72'/><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-628718352497682292</id><published>2009-11-19T21:06:00.000-08:00</published><updated>2009-11-19T21:10:08.205-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>DPS909 Project – Processing.js – v0.2</title><content type='html'>&lt;big&gt;&lt;b&gt;Returning to Ground Zero&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;First, a self-plagiarized recap.  This semester at  Seneca College I am taking a course revolving around &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;open source development&lt;/a&gt;.  As part of the course the students (yours truly being no exception) were nudged into getting involved in some &lt;a href="http://www.mozilla.org/"&gt;Mozilla&lt;/a&gt; related projects, produce code for the real world, and see fist hand how the whole open source thing works.&lt;br /&gt;&lt;br /&gt;I chose to work on &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs), a JavaScript port of the Java-based &lt;a href="http://processing.org/"&gt;Processing&lt;/a&gt;.  More specifically, I volunteered to work on porting over the functions &lt;a href="http://wobblyretroaction.blogspot.com/2009/09/processingjs-plan-to-push-and-pop.html"&gt;&lt;i&gt;pushStyle()&lt;/i&gt;, &lt;i&gt;popStyle()&lt;/i&gt;&lt;/a&gt;, and &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/boolean-for-processingjs.html"&gt;&lt;i&gt;boolean()&lt;/i&gt;&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;On 19 October 2009, I threw &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/dps909-project-processingjs-v01.html"&gt;release 0.1&lt;/a&gt; out into the cruel world to fend for itself.  Today I present release 0.2 to the world.  Applause!&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Not new, but shinier!&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;The watchwords for release 0.2 were: &lt;i&gt;fix it&lt;/i&gt;.  Release 0.1 included reasonably functional code for &lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt;, and totally untested and untried code for &lt;i&gt;boolean()&lt;/i&gt;.&lt;br /&gt;&lt;br /&gt;Bringing &lt;i&gt;boolean()&lt;/i&gt; up-to-spec was the goal of this release and this was done by throwing together some &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/booleanTest1.html"&gt;test cases for &lt;i&gt;boolean()&lt;/i&gt;&lt;/a&gt;.  Bugs were indeed caught, squashed, and flushed down the toilet.&lt;br /&gt;&lt;br /&gt;Although &lt;i&gt;boolean()&lt;/i&gt; got most of the attention, the elder siblings did not totally escape notice. &lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt; received &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/pushPopTest1.html"&gt;their own test cases&lt;/a&gt; too. One issue was whether the pop should spit out alert popups if there were not enough pushes.  I decided not to use any popups and just have a warning be sent to the console, where most users probably won't notice.  &lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt; were further improved to better handle the library's own variables; before they only managed canvas' variables with any proficiency.&lt;br /&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;Better to get it when it's pleasantly warm rather than skin-charring hot&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;&lt;ul&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="http://matrix.senecac.on.ca/~mlam19/js/processing.js"&gt;Download the full Pjs library (my patched version)&lt;/a&gt;  OR&lt;/li&gt;&lt;br /&gt;&lt;li&gt;&lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/files/mlam19_procjs_0.2.diff.tar.gz"&gt;just download the patch&lt;/a&gt;&lt;/li&gt;&lt;br /&gt;&lt;/ul&gt;&lt;br /&gt;&lt;big&gt;&lt;b&gt;What now?&lt;/b&gt;&lt;/big&gt;&lt;br /&gt;Pursuant to getting my code merged into &lt;i&gt;the&lt;/i&gt; Pjs library there are a few &lt;a href="http://processing-js.lighthouseapp.com/projects/41284/project-workflow"&gt;instructions&lt;/a&gt; I have to follow. So I'll make another post comparing the results of my Pjs code with those of the Java-based Processing code.  As I have discovered it is not totally possible to faithfully port Processing to JavaScript.  For example, Processing will throw exceptions and refuse to do anything if you try to pass an argument to a function and the function is not designed to accept, say, the variable type of the argument.  But in Pjs you have to handle these weird arguments and preferably return some meaningful result.  This comes up a few times in &lt;i&gt;boolean()&lt;/i&gt;. But more on that soon.&lt;br /&gt;&lt;br /&gt;For release 0.3, it looks like I'll have to choose another function to port over, or at least get started on even if I don't finish by the end of the semester.  &lt;a href="http://processing.org/reference/strokeCap_.html"&gt;strokeCap()&lt;/a&gt; looks appropriately involving.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-628718352497682292?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/dps909-project-processingjs-v02.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/628718352497682292'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/628718352497682292'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/dps909-project-processingjs-v02.html' title='DPS909 Project – Processing.js – v0.2'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-6265347927632020640</id><published>2009-11-07T21:23:00.000-08:00</published><updated>2009-11-07T21:29:59.305-08:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Learning a Bit of JavaScript</title><content type='html'>This week in &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; we talked a bit about JavaScript. This was particularly relevant to my &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Porting_pushStyle(),_popStyle(),_and_boolean()_to_Processing.js"&gt;project&lt;/a&gt; this semester, implementing a few functions in the &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; JavaScript library. As part of this week's journey of  the mind, we were directed to watch a lecture by &lt;a href="http://www.crockford.com/"&gt;Douglas Crockford&lt;/a&gt; called "&lt;a href="http://www.youtube.com/watch?v=hQVTIJBZook"&gt;JavaScript: The Good Parts&lt;/a&gt;". Leaping over to Wikipedia for some familiarization, Crockford is the senior JavaScript Architect at Yahoo!, and wrote the specification for &lt;a href="http://en.wikipedia.org/wiki/JSON"&gt;JavaScript Object Notation&lt;/a&gt;. The lecture in the video is based off his book of the same name.&lt;br /&gt;&lt;br /&gt;Right off the bat, I'm one of those people who, as Crockford' puts it, started tinkering with JavaScript without learning it. So given my novice credentials coupled with a pressing need to "learn more" I'm pleased that the lecture had a few "do and don't" pointers that someone like me could take away.&lt;br /&gt;&lt;br /&gt;The first big thing I learned was &lt;i&gt;use ===, avoid ==&lt;/i&gt;.  I was first exposed to === by &lt;a href="https://cs.senecac.on.ca/~david.humphrey/"&gt;David&lt;/a&gt; &lt;a href="http://vocamus.net/dave/"&gt;Humphrey&lt;/a&gt;, who gave me a &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/boolean-for-processingjs.html#comments"&gt;code snippet&lt;/a&gt; demonstrating how to detect if a JavaScript variable was an array.  A bit of research revealed === compares not only the value of two variables but their types as well, a very useful feature in a language with dynamic typing. I was, not, however, inclined to use === near exclusively.&lt;br /&gt;&lt;br /&gt;After watching  Crockford's lecture made me realize using mainly == would eventually cause grief..  Sooner or later I would make compare two values, forget the variable types, or forget the distinction between &lt;i&gt;null&lt;/i&gt; and &lt;i&gt;undefined&lt;/i&gt;, and end up with an annoying, very small, difficult to track down, bug. Using === would be an easy way to save a bit of heartache in the future, which is always a good thing.&lt;br /&gt;&lt;br /&gt;Learning the distinction between &lt;i&gt;null&lt;/i&gt; and &lt;i&gt;undefined&lt;/i&gt; was an ancillary to the first major thing I picked up.  The former is a value for an object variable, the latter can be had if trying to retrieve a variable an object doesn't have. Note to self: further research required.&lt;br /&gt;&lt;br /&gt;The second, and most surprising, thing I learned was &lt;i&gt;coding style matters&lt;/i&gt;. It's easy to mistake JavaScript for a free-wheeling language: dynamic typing, you don't have to use semi-colons half the time! But apparently something as "simple" as bracket placement when defining blocks can really mess things up.  Crockford gave the following example:&lt;br /&gt;&lt;pre&gt;&lt;br /&gt;return &lt;br /&gt;{&lt;br /&gt; ok: false&lt;br /&gt;};&lt;br /&gt;&lt;/pre&gt;&lt;br /&gt;This seems innocent enough, but apparently behind-the-scenes shenanigans means it actually is interpreted like so:&lt;br /&gt;&lt;pre&gt;&lt;br /&gt;return;&lt;br /&gt;{&lt;br /&gt; ok: false;&lt;br /&gt;}&lt;br /&gt;&lt;/pre&gt;&lt;br /&gt;In other words, everything after &lt;i&gt;return&lt;/i&gt; goes nowhere and does nothing.  For this to work as intended the opening bracket &lt;i&gt;must&lt;/i&gt; be placed to the right of &lt;i&gt;return&lt;/i&gt; like so:&lt;br /&gt;&lt;pre&gt;&lt;br /&gt;return {&lt;br /&gt; ok: false&lt;br /&gt;};&lt;br /&gt;&lt;/pre&gt;&lt;br /&gt;While my coding style generally resembles the "correct" example, this will be a useful tidbit when deciphering the code of other programmers.&lt;br /&gt;&lt;br /&gt;Fortunately, it seems Crockford has developed JavaScript code quality checker called &lt;a href="http://www.jslint.com/"&gt;JSLint&lt;/a&gt; to help developers catch some of their more egregious code. Methinks I shall be availing myself of it in the near future.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-6265347927632020640?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/learning-bit-of-javascript.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/6265347927632020640'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/6265347927632020640'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/11/learning-bit-of-javascript.html' title='Learning a Bit of JavaScript'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-9065121025008158696</id><published>2009-10-31T16:31:00.000-07:00</published><updated>2009-10-31T16:33:18.891-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Standing On Their Shoulders: A Short Processing.js Tale</title><content type='html'>So this semester's reading week has come and gone and once again, as is the familiar post-mortem assessment, I have discovered the ratio of “useful" to “superfluous" work done is heavily biased toward the latter.&lt;br /&gt;&lt;br /&gt;On the &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs) front we have more baby steps!&lt;br /&gt;&lt;br /&gt;&lt;h3&gt;Don't mind if I do...&lt;/h3&gt;For &lt;a href="http://wobblyretroaction.blogspot.com/2009/09/processingjs-plan-to-push-and-pop.html"&gt;&lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt;&lt;/a&gt; I've come full circle.  First I fiddled around with storing and retrieving variables in the library, then I moved onto &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/according-to-plan.html"&gt;storing and retrieving&lt;/a&gt; &lt;a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html"&gt;canvas&lt;/a&gt; variables, and have since returned to working on the Pjs library variables.&lt;br /&gt;&lt;br /&gt;In my &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/dps909-project-processingjs-v01.html"&gt;previous post&lt;/a&gt;, I &lt;a href="http://groups.google.com/group/processingjs/browse_thread/thread/2a38070400df20e1"&gt;discovered&lt;/a&gt; some code by &lt;a href="http://www.andrewpeace.com/"&gt;Andrew Peace&lt;/a&gt;. As it turns out, not only did Peace's work handle the Pjs variables, he also did it in a more JavaScript savvy way then I would have done.&lt;br /&gt;&lt;br /&gt;The example that sticks out in my mind was his handling of arrays.  While I was busy incrementing and decrementing a counter to figure out how many states I had and which element to store and retrieve from, Peace simply used the push() and pop() functions that grace all JavaScript arrays.&lt;br /&gt;&lt;br /&gt;I have incorporated Peace's  code with only cosmetic changes, and JavaScript's push() and pop() functions for arrays has since entered my corpus of All Knowledge.  My hat off to Mr. Peace!&lt;br /&gt;&lt;br /&gt;&lt;h3&gt;But does it work?&lt;/h3&gt;In my previous post I also intimated that some work was going on with &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/boolean-for-processingjs.html"&gt;boolean()&lt;/a&gt;.  There was some code but no testing.  In the last little bit I've started cobbling together a few &lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/booleanTest1.html"&gt;test cases&lt;/a&gt;, and even thought still incomplete they've already helped flush out a few bugs.&lt;br /&gt;&lt;br /&gt;The nice test page layout was provided by classmate &lt;a href="http://dhodgin.wordpress.com/"&gt;Daniel Hodgin&lt;/a&gt;.  Thanks!&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-9065121025008158696?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/standing-on-their-shoulders-short.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/9065121025008158696'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/9065121025008158696'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/standing-on-their-shoulders-short.html' title='Standing On Their Shoulders: A Short Processing.js Tale'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-7217276229959693380</id><published>2009-10-19T18:19:00.000-07:00</published><updated>2009-10-19T18:47:16.202-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>DPS909 Project - Processing.js – v0.1</title><content type='html'>&lt;h3&gt;Last month on [insert name of media production here]...&lt;/h3&gt;First, a brief recap.  This semester at  Seneca College I am taking a course revolving around &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;open source development&lt;/a&gt;.  As part of the course the students (yours truly being no exception) were nudged into getting involved in some &lt;a href="http://www.mozilla.org/"&gt;Mozilla&lt;/a&gt; related projects, produce code for the real world, and see fist hand how the whole open source thing works.&lt;br /&gt;&lt;br /&gt;I chose to work on &lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs), a JavaScript port of the Java-based &lt;a href="http://processing.org/"&gt;Processing&lt;/a&gt;.  More specifically, I volunteered to work on porting over the functions &lt;a href="http://wobblyretroaction.blogspot.com/2009/09/processingjs-plan-to-push-and-pop.html"&gt;&lt;i&gt;pushStyle()&lt;/i&gt;, &lt;i&gt;popStyle()&lt;/i&gt;&lt;/a&gt;, and &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/boolean-for-processingjs.html"&gt;&lt;i&gt;boolean()&lt;/i&gt;&lt;/a&gt;.&lt;br /&gt;&lt;h3&gt;I've got to release something...!&lt;/h3&gt;Today I get to make my first (course mandated) release!  And this is what it does (trotting out this little “demo" for the third time):&lt;br /&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/processingjs/js/init.js"&gt;&lt;/script&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/processingjs/js/processing.js"&gt;&lt;/script&gt;&lt;script type="application/processing"&gt;smooth();ellipse(0, 50, 33, 33);pushStyle();strokeWeight(10);fill(204, 153, 0);ellipse(33, 50, 33, 33);pushStyle();stroke(0, 102, 153);ellipse(66, 50, 33, 33);popStyle();popStyle();ellipse(100, 50, 33, 33);&lt;/script&gt;&lt;br /&gt;&lt;br /&gt;&lt;canvas id="test1" style="clear:left;border:1px solid #000000;" width="150" height="150"&gt;&lt;/canvas&gt;&lt;br /&gt;&lt;br /&gt;What's that?  That, fine feathered friends, is &lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt; working just a little bit. Nothing particularly amazing, it's just the &lt;a href="http://processing.org/reference/pushStyle_.html"&gt;Processing example&lt;/a&gt; copied verbatim.&lt;br /&gt;&lt;br /&gt;A start on the &lt;i&gt;boolean()&lt;/i&gt; code is also in the release, but it's not tested at all.&lt;br /&gt;&lt;br /&gt;For those of you who want to see for yourself may:&lt;br /&gt;&lt;ul&gt;&lt;li&gt;&lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/js/processing.js"&gt;Download the  full Pjs library (my patched version)&lt;/a&gt;&lt;/li&gt; OR&lt;br /&gt;&lt;li&gt;&lt;a href="http://matrix.senecac.on.ca/~mlam19/processingjs/files/mlam19_procjs_0.1.diff.zip"&gt;Download just the patch&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;h3&gt;Toward 0.2&lt;/h3&gt;The march to enlightenment continues, and there is still much to do.  The implementation of &lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt; remains incomplete as demonstrated by &lt;a href="http://groups.google.com/group/processingjs/browse_thread/thread/2a38070400df20e1"&gt;this discussion on the Pjs Google Group&lt;/a&gt;.  So far I have only saved the state of canvas variables, and not those in the library itself.&lt;br /&gt;&lt;br /&gt;Then I need to see about putting through a more expansive test regimen.  And there's already a bug: using &lt;a href="http://www.andrewpeace.com/projects/pushpopstyle/test.html"&gt;Andrew Peace's test case&lt;/a&gt;, the “more pops than pushes" error alert just keep popping up.  I like to think the intended behaviour is for a finite number of warnings.&lt;br /&gt;&lt;br /&gt;On the other hand, &lt;i&gt;boolean()&lt;/i&gt; seems much more straight forward to test.&lt;h3&gt;A not-so-secret society&lt;/h3&gt;v0.1 releases just in time for this years &lt;a href="http://fsoss.senecac.on.ca/2009/"&gt;Free Software and Open Source Symposium&lt;/a&gt; hosted by Seneca College.  This is particularly important because &lt;a href="http://www.hyper-metrix.com/"&gt;Al MacDonald&lt;/a&gt;, Pjs project leader, is attending FSOSS and will no doubt want to have a few words with &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Processing.js"&gt;those DPS909 students&lt;/a&gt; working on Pjs.&lt;br /&gt;&lt;br /&gt;&lt;a href="https://cs.senecac.on.ca/~david.humphrey/"&gt;David&lt;/a&gt; &lt;a href="http://vocamus.net/dave/"&gt;Humphrey&lt;/a&gt; suggested us students might want to look into setting up a Pjs bug tracker, discuss ways to compile our seperate test suites into one big suite, and perhaps set up a website to showcase the newly ported capabilities.  I figure even if I somehow manage to get my project done way ahead of schedule there will not be a lack of things to do.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-7217276229959693380?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/dps909-project-processingjs-v01.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/7217276229959693380'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/7217276229959693380'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/dps909-project-processingjs-v01.html' title='DPS909 Project - Processing.js – v0.1'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-1889395416425945780</id><published>2009-10-17T13:22:00.001-07:00</published><updated>2009-10-17T13:40:16.419-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Fixing a Bug In A Harmless Test Environment</title><content type='html'>This week's &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Thunderbird_Bug_Fix_Lab"&gt;lab&lt;/a&gt; brought together everything covered thus far in the course: build the software, file a bug, find the offending code, make a patch.  If this were any other course this lab might qualify as a "quest": not a quiz, not a test, but somewhere delightfully in between!&lt;br /&gt;&lt;br /&gt;Step one was compiling a &lt;a href="https://developer.mozilla.org/en/Simple_Thunderbird_build"&gt;&lt;i&gt;debug&lt;/i&gt; build of Thunderbird/Shredder&lt;/a&gt;. I checked out straight from the repo rather than use the code provided by the lab instructions. The process was similar to &lt;a href="http://wobblyretroaction.blogspot.com/2009/09/building-minefield-or-how-i-put-some.html"&gt;building Firefox/Minefield&lt;/a&gt; and went off literally without a hitch. A very palpable hit for me!&lt;br /&gt;&lt;br /&gt;Nest was to confirm the bug's existence.  The bug we were interested in deals with Thunderbird converting a string that &lt;i&gt;looks&lt;/i&gt; like an email address into a hyperlink; the problem is the string does not represent a valid email address and so should not be converted.  We can see the fubared behaviour below:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_Mot-NgE1Yes/StoneYojkZI/AAAAAAAAAAY/ZK5_bybr1Ao/s1600-h/a2.jpg"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 160px;" src="http://1.bp.blogspot.com/_Mot-NgE1Yes/StoneYojkZI/AAAAAAAAAAY/ZK5_bybr1Ao/s320/a2.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5393666906691703186" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;So having confirmed the existence of the bug without difficulty, &lt;a href="https://landfill.bugzilla.org/bugzilla-3.0-branch/show_bug.cgi?id=7243"&gt;bug #7243 was filed in the landfill&lt;/a&gt;. I like to think I included the bare-bones information in the description answering the questions of: "what is wrong?", "how may it be reproduced?", and "what version of the software are you using?".&lt;br /&gt;&lt;br /&gt;Now came the matter of tracking down that needing futzing with. This took a while.  I spent much time plopping in search terms into the Mozilla Cross-Reference without success.  I looked into "parse message", "save draft", and the like to try and get into where the message was stored and perhaps displayed to the screen.&lt;br /&gt;&lt;br /&gt;In desperation I went back to the program and, mousing over the offending email link, saw it was a &lt;i&gt;mailto&lt;/i&gt; link. So I through in &lt;i&gt;mailto&lt;/i&gt; as the search term and... &lt;a href="http://mxr.mozilla.org/comm-central/search?string=mailto&amp;find=&amp;findi=&amp;filter=^[^\0]*%24&amp;hitlimit=&amp;tree=comm-central"&gt;there was light&lt;/a&gt;.  (Just goes to show simplicity is golden.)  Conveniently the very first result from that search took me &lt;a href="http://mxr.mozilla.org/comm-central/source/mozilla/netwerk/streamconv/converters/mozTXTToHTMLConv.cpp#196"&gt;exactly where I needed to go&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;&lt;code&gt;if (inString.FindChar('.', pos) != kNotFound)&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;The conditional only checked if a "." was found after the @ sign.  What it &lt;i&gt;also&lt;/i&gt; needed to do was check if there were any ".." after the @ too, which would mean it was not a valid address. Some way needed to be found to find whether a ".." was in the string.  Unlike what was currently in &lt;i&gt;mozTXTToHTMLConv.cpp&lt;/i&gt; I needed a way to check the presence of a string in the string, and not just a char in the string.  According to the &lt;i&gt;Mozilla internal string guide&lt;/i&gt; the correct way to find if a substring existed was to use&lt;a href="https://developer.mozilla.org/En/Mozilla_internal_string_guide#Searching_strings_-_looking_for_substrings.2c_characters.2c_etc."&gt;&lt;i&gt;FindInReadable&lt;/i&gt;&lt;/a&gt; in &lt;a href="http://mxr.mozilla.org/comm-central/source/mozilla/parser/htmlparser/src/nsScannerString.cpp#577"&gt;&lt;i&gt;nsScannerString.cpp&lt;/i&gt;&lt;/a&gt;,  However converting the code to use the newer approved way was probably a bit beyond what I wanted to delve into for this lab.&lt;br /&gt;&lt;br /&gt;So I just stuck with the old way.  Searching through the documentation some more I found &lt;i&gt;nsDependentString&lt;/i&gt;  had &lt;a href="https://developer.mozilla.org/en/nsDependentString#Find"&gt;just the function I needed&lt;/a&gt;.  The code &lt;i&gt;mozTXTToHTMLConv&lt;/i&gt; changed to:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;if (inString.FindChar('.', pos) != kNotFound &amp;&amp; inString.Find("..", pos) == kNotFound)&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;A recompile later the situation was much improved:&lt;br /&gt;&lt;a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_Mot-NgE1Yes/Stonp1eZ8LI/AAAAAAAAAAg/Lu5cuO9ZmDg/s1600-h/a1.jpg"&gt;&lt;img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 320px; height: 160px;" src="http://1.bp.blogspot.com/_Mot-NgE1Yes/Stonp1eZ8LI/AAAAAAAAAAg/Lu5cuO9ZmDg/s320/a1.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5393667103412318386" /&gt;&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;I created the &lt;a href="https://landfill.bugzilla.org/bugzilla-3.0-branch/attachment.cgi?id=1402"&gt;patch&lt;/a&gt; from &lt;i&gt;./comm-central/mozilla&lt;/i&gt; and ran it through &lt;a href="http://beaufour.dk/jst-review/"&gt;JST Review&lt;/a&gt;. A few "longer than 80 characters" and extra whitespace/tabs warnings later, it was ready to be attached to the &lt;a href="https://landfill.bugzilla.org/bugzilla-3.0-branch/show_bug.cgi?id=7243"&gt;bug report&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://ehren.wordpress.com/"&gt;Ehren&lt;/a&gt; graciously took some time to review the patch and found I had indented a line a bit too far. It was up to a &lt;a href="https://landfill.bugzilla.org/bugzilla-3.0-branch/attachment.cgi?id=1403"&gt;patched patch&lt;/a&gt; to pass muster instead.&lt;br /&gt;&lt;br /&gt;The tool-tips for the review options for attachments threw me off a bit. Super-reviews are only needed for world-shaking changes, but the super-review tool-tip says something somewhat different.  I didn't request a super-review for the revised patch.&lt;br /&gt;&lt;br /&gt;The patch and review comments have been copied to my &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/User:Mlam19#Week_6_Thunderbird_bug_fix_lab"&gt;Seneca College wiki page&lt;/a&gt;.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-1889395416425945780?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/fixing-bug-in-harmless-test-environment.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1889395416425945780'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1889395416425945780'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/fixing-bug-in-harmless-test-environment.html' title='Fixing a Bug In A Harmless Test Environment'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><media:thumbnail xmlns:media='http://search.yahoo.com/mrss/' url='http://1.bp.blogspot.com/_Mot-NgE1Yes/StoneYojkZI/AAAAAAAAAAY/ZK5_bybr1Ao/s72-c/a2.jpg' height='72' width='72'/><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-8386148291795171355</id><published>2009-10-12T19:08:00.000-07:00</published><updated>2009-10-12T19:11:48.647-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>boolean() for Processing.js</title><content type='html'>And so we return for another (short) post in the irregular series on “What is Matthew doing with Processing.js?"  Ah, the joys of lagging a bit behind from where where I should be.  But onwards to putting a little bit more on my plate!&lt;br /&gt;&lt;h3&gt;Seeking truth From variables&lt;/h3&gt;There is a spectre haunting the incompleteness of &lt;a href="http://processingjs.org/"&gt;&lt;i&gt;Processing.js&lt;/i&gt;&lt;/a&gt; (Pjs) (well, one of many spectres) - the spectre of &lt;a href="http://processing.org/reference/boolean_.html"&gt;boolean()&lt;/a&gt;.  It is a spectre I hope to, at least, partially exorcise by December.&lt;br /&gt;&lt;br /&gt;This little function takes a variable, may it be integer, String, object, or an array thereof, and spits out “true" of “false" (or even an array of such).  A little peeking into the original Java code shows that the function is actually spread over &lt;i&gt;five&lt;/i&gt; overloaded Java methods in class &lt;i&gt;PApplet&lt;/i&gt;.&lt;br /&gt;&lt;br /&gt;Of course, it will all have to be condensed into a single function in Pjs.  Since it doesn't seem JavaScript requires the explicit declaration of data types, I'll have to search around to see how one might go about distinguishing between them. However I expect there will be plenty of examples to sink my teeth into.  (I can't be the first person to ask: “How do I tell if a variable is an array?" after all!)&lt;br /&gt;&lt;br /&gt;The &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Porting_pushStyle%28%29,_popStyle%28%29,_and_boolean%28%29_to_Processing.js"&gt;project page&lt;/a&gt; has been given a minor revision to reflect the new bit on the plate.  I really must get around to jotting down some documentation on my latest work with &lt;a href="http://processing.org/reference/pushStyle_.html"&gt;&lt;i&gt;pushStyle()&lt;/i&gt;&lt;/a&gt; and &lt;a href="http://processing.org/reference/popStyle_.html"&gt;&lt;i&gt;popStyle()&lt;/i&gt;&lt;/a&gt;. See? Lagging behind.&lt;br /&gt;&lt;h3&gt;Speaking of which...&lt;/h3&gt;In my &lt;a href="http://wobblyretroaction.blogspot.com/2009/10/according-to-plan.html"&gt;previous post&lt;/a&gt; I displayed a basic working example for &lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt;. Alas, I hosted the JavaScript library on a temperamental web host so it can't be seen half the time.&lt;br /&gt;&lt;br /&gt;I redisplay the example here using (hopefully) a more reliable web host.&lt;br /&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/processingjs/js/init.js"&gt;&lt;/script&gt;&lt;script type="text/javascript" src="http://matrix.senecac.on.ca/~mlam19/processingjs/js/processing.js"&gt;&lt;/script&gt;&lt;script type="application/processing"&gt;smooth();ellipse(0, 50, 33, 33);pushStyle();strokeWeight(10);fill(204, 153, 0);ellipse(33, 50, 33, 33);pushStyle();stroke(0, 102, 153);ellipse(66, 50, 33, 33);popStyle();popStyle();ellipse(100, 50, 33, 33);&lt;/script&gt;&lt;br /&gt;&lt;canvas id="test1" style="clear:left;border:1px solid #000000;" width="150" height="150"&gt;&lt;/canvas&gt;&lt;br /&gt;&lt;br /&gt;But where has the time gone?  Release version 0.1 is just around the corner, and there is still things to ponder and code to crunch!  I guess it would not be a student's life if one did not feel kinship to the tardy White Rabbit.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-8386148291795171355?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/boolean-for-processingjs.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/8386148291795171355'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/8386148291795171355'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/boolean-for-processingjs.html' title='boolean() for Processing.js'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-3065016402657429336</id><published>2009-10-03T15:07:00.000-07:00</published><updated>2009-10-03T15:37:52.413-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>According to the Plan</title><content type='html'>… this shouldn't be happening.&lt;br /&gt;&lt;br /&gt;In a previous &lt;a href="http://wobblyretroaction.blogspot.com/2009/09/processingjs-plan-to-push-and-pop.html"&gt;post&lt;/a&gt; outlining my &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt;&lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs) project plan, I sketched out the implementation of &lt;a href="http://processing.org/reference/pushStyle_.html"&gt;pushStyle()&lt;/a&gt; and &lt;a href="http://processing.org/reference/popStyle_.html"&gt;popStyle()&lt;/a&gt; over a period of over two months.  As it turns out this may have been overly pessimistic.&lt;br /&gt;&lt;h3&gt;Climbing the Stairs&lt;/h3&gt;In the beginning, the scheme called for storing and retrieving states from a nice 2D array.  I opted for an object to store each state snapshot.I peeked into the Java Processing code (PStyle.java) to see what sort of variables I might be looking for.  The variables listed under the comment &lt;i&gt;// “Private" variables used to maintain state&lt;/i&gt; seemed like a good place to start.&lt;br /&gt;&lt;br /&gt;Throwing the code into a test page, let's just say those were not, or not &lt;i&gt;all&lt;/i&gt;, the variables I was looking for.&lt;br /&gt;&lt;h3&gt;Finding the Elevator&lt;/h3&gt;Closer examination revealed a mysterious object stored as &lt;i&gt;curContext&lt;/i&gt;, and it seemed the object's squishy innards contained what I was looking for.  Since those innards didn't seem to be defined in the Pjs library I turned to Google, and that turned up the &lt;a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html"&gt;canvas element documentation.&lt;/a&gt;&lt;br /&gt;&lt;br /&gt;As it turns out canvas comes fully equipped with functions to &lt;a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#the-canvas-state"&gt;save and retrieve&lt;/a&gt; state snapshots.  So using those functions instead of the array, and state-saving objects, we get something like:&lt;br /&gt;&lt;script type="text/javascript" src="http://ttfclusiop.hostrator.com/processingjs/js/init.js"&gt;&lt;/script&gt;&lt;script type="text/javascript" src="http://ttfclusiop.hostrator.com/processingjs/js/processing.js"&gt;&lt;/script&gt;&lt;script type="application/processing"&gt;smooth();ellipse(0, 50, 33, 33);pushStyle();strokeWeight(10);fill(204, 153, 0);ellipse(33, 50, 33, 33);pushStyle();stroke(0, 102, 153);ellipse(66, 50, 33, 33);popStyle();popStyle();ellipse(100, 50, 33, 33);&lt;/script&gt;&lt;br /&gt;&lt;canvas id="test1" style="clear:left;border:1px solid #000000;" width="150" height="150"&gt;&lt;/canvas&gt;&lt;br /&gt;&lt;br /&gt;Assuming one's browser comes with the requisite bells and whistles, it should look suspiciously similar to the &lt;a href="http://processing.org/reference/pushStyle_.html"&gt;Processing example&lt;/a&gt;.&lt;br /&gt;&lt;h3&gt;Expanding the Catch&lt;/h3&gt;In terms of getting &lt;i&gt;pushStyle()&lt;/i&gt; and &lt;i&gt;popStyle()&lt;/i&gt; to work, there are a few things I still need to look into.  In my current revision I am not handling any of the library's own variables at all.  The basic example works without them but, but some may be relevant state variables and I have to figure out which ones (if any) are so.&lt;br /&gt;&lt;br /&gt;Another concern is browser compatibility.  Canvas implementation seems to be all across the board right now.  If Pjs has to work &lt;i&gt;now&lt;/i&gt;, without reservations, then I'll have to go back to the state-saving object and array scheme, while saving all of the canvas variables manually.  On the other hand, if the onus is not on Pjs to work on browser's with incomplete canvas implementations, then that's one less thing to worry about.&lt;br /&gt;&lt;br /&gt;But the bottom line is that the project as I envisioned it will most likely be done long before early December.  This is not acceptable for DPS909 and therefore I must find additional bits of Pjs to hack away at.  I'll be figuring that out soonish and changing altering my wiki project page to reflect that.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-3065016402657429336?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/according-to-plan.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/3065016402657429336'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/3065016402657429336'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/10/according-to-plan.html' title='According to the Plan'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-4195668514934451187</id><published>2009-09-28T15:21:00.000-07:00</published><updated>2009-09-28T15:24:40.002-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>My Kingdom for a Patch?</title><content type='html'>This blog post is brought to us by the letter &lt;strong&gt;P&lt;/strong&gt; and the number &lt;strong&gt;6&lt;/strong&gt;, and today's topic is “patching".  “&lt;em&gt;Patching&lt;/em&gt;".  (Alas the written word doesn't do justice to the beginning of each &lt;a="http://www.youtube.com/results?search_query=possum+lodge+word+game&amp;search_type=&amp;aq=f"&gt;Possum Lodge Word Game&lt;/a&gt;.)&lt;br /&gt;Patches are funny “little" files that contain the list of changes or differences between two snapshots of a code base.  This is good for keeping track of changes to the code, facilitating reversions, and making it easier to spread the joy of testing and breaking systems to self-appointed guinea pigs.&lt;br /&gt;&lt;br /&gt;For this &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Working_with_Patches_Lab"&gt;lab&lt;/a&gt;, the first thing to do was hunt for a patch for my &lt;a href="http://wobblyretroaction.blogspot.com/2009/09/building-minefield-or-how-i-put-some.html"&gt;Minefield build&lt;/a&gt;.  I headed over to the &lt;a href="http://forums.mozillazine.org/viewforum.php?f=23"&gt;Firefox Builds&lt;/a&gt; forum at &lt;a href="http://forums.mozillazine.org/viewforum.php?f=23"&gt;mozillaZine&lt;/a&gt;.  From &lt;strong&gt;&lt;em&gt;P&lt;/em&gt;eter(&lt;em&gt;6&lt;/em&gt;)&lt;/strong&gt;'s seemingly endless series on the rise and fall of the nightly trunk builds, I picked out &lt;a href="https://bugzilla.mozilla.org/show_bug.cgi?id=424517"&gt;recently resolved bug 424517&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;The gist of 424517 was the “use small icons" option was affecting the additional icons added to the Bookmarks Toolbar, when such icons should be start small and remain small no matter what.&lt;br /&gt;I verified that my Minefield and Iceweasel (just because I could) were exhibiting the unfortunate symptoms of the issue.  The “refresh" icon in the Bookmarks Toolbar did indeed resize as the “use small icons" option was toggled back and forth.&lt;br /&gt;&lt;br /&gt;The &lt;a href="https://bugzilla.mozilla.org/attachment.cgi?id=401402"&gt;patch&lt;/a&gt; added a mere two lines, but the important thing was the results could be easily verified.  So I applied it:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;mlam@mlamprimary:~/src/mozilla-central$ patch -p1 &lt; lockiconsize.diff&lt;br /&gt;patching file browser/base/content/browser.xul&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;After some rebuilding I prodded open my improved version of Minefield and, lo and behold, &lt;em&gt;it was cured&lt;/em&gt;!  The “use small icons" had no effect on the Bookmarks Toolbar, just as the Givers Of Data deemed it should be (and there was much rejoicing.)  But just to be perverse:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;mlam@mlamprimary:~/src/mozilla-central$ patch -R -p1 &lt; lockiconsize.diff&lt;br /&gt;patching file browser/base/content/browser.xul&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;And after another bit of rebuilding the issue returned as mysteriously as it had vanished.  Very sad.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-4195668514934451187?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/my-kingdom-for-patch.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/4195668514934451187'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/4195668514934451187'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/my-kingdom-for-patch.html' title='My Kingdom for a Patch?'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-1093020536466351776</id><published>2009-09-27T00:07:00.000-07:00</published><updated>2009-09-27T07:56:34.810-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Processing.js – A Plan to Push and Pop Styles</title><content type='html'>&lt;h3&gt;1 What this is all about&lt;/h3&gt;&lt;a href="http://processing.org/"&gt;Processing&lt;/a&gt; is a Java-based programming language used to display rich graphical content, like animations, on web pages.  The content was embedded on web pages using Java applets.  Since the time of the original implementation improvements in web technology, such as the capability of web browsers and JavaScript execution speed, has opened the possibility of accomplishing Processing's objective without Java.&lt;br /&gt;&lt;br /&gt;&lt;a href="http://processingjs.org/"&gt;Processing.js&lt;/a&gt; (Pjs) is a JavaScript port of Processing currently in development.  Users need only a sufficiently capable web browser to view the content; there is no need for Java or Flash, their plugins, and the overhead and possible software troubles arising from using those plugins.  Matters are also simplified for developers who only need Pjs's JavaScript library.&lt;br /&gt;&lt;br /&gt;A convenient collection of links to mailing lists and code repository may be found &lt;a href="http://processingjs.org/community"&gt;here&lt;/a&gt;.  A specific list of "things needing code monkey labour" may be found &lt;a href="https://wiki.mozilla.org/Education/Projects/ProcessingForTheWeb/Tasks"&gt;on MozillaWiki&lt;/a&gt;&lt;br /&gt;&lt;h3&gt;2 Choosing the road frequently travelled&lt;/h3&gt;For &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; I and my fellow code monkeys-in-training were directed to jump into a Mozilla-related project.  As the old (and perhaps overused) saying goes: I hear and I forget, I see and I remember, I do and I understand.  Appropriately for a course about open source development, we were going to &lt;em&gt;do&lt;/em&gt; it, and, hopefully, emerge from the experience with greater understanding.&lt;br /&gt;&lt;br /&gt;One available set of projects fell under Pjs.  Within that project I chose to work on porting  &lt;a href="http://processing.org/reference/pushStyle_.html"&gt;pushStyle()&lt;/a&gt; and &lt;a href="http://processing.org/reference/popStyle_.html"&gt;popStyle()&lt;/a&gt; from Processing to Pjs.&lt;br /&gt;&lt;br /&gt;Before going on I should disclose that I like Java.  It's the first object-oriented language I picked up.  At the very least, reading the code to be ported would be easier.  However, Java was not the major reason for my project choice; that language plays a relatively diminutive part in the overall task.  The major part is reading and writing JavaScript which. I have very little experience with JavaScript and working on Pjs presented an opportunity to rectify this for fun and profit!  Oh, and there would be ancillary social benefits such as being useful in the process.&lt;br /&gt;&lt;br /&gt;Aren't win-win situations wonderful?&lt;br /&gt;&lt;br /&gt;I chose tasks from the "miscellaneous feature" list rather than the "3D features" list because the latter constitutes a "here be dragons" area for me.  When the course concludes and my work is evaluated, I would rather submit better material and feel silly for choosing something that did not wander far from my starting experience, than submit sub-par material and experience the self-recrimination of having barrelled toward the "bridge too far".&lt;br /&gt;&lt;br /&gt;Discretion is the better part of valour.&lt;br /&gt;&lt;h3&gt;3 The information must flow&lt;/h3&gt;So that a record of progress, U-turns, and backtracking, may be preserved for future generations to point and snicker at, I will be maintaining a &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/Porting pushStyle%28%29%20and%20popStyle%28%29 to Processing.js%20"&gt;wiki page&lt;/a&gt;.  There is also a &lt;a href="http://github.com/mlam19/processing-js"&gt;branch of the development tree&lt;/a&gt;. Hopefully there will be weekly posts on this blog concerning the project work.&lt;br /&gt;&lt;h3&gt;4 If everything is going according to plan, it's a trap&lt;/h3&gt;As per the requirements for DPS909 the aim is for three "point releases" within the next two and a half months.  This means version 0.3 will be available in early December.  Per the expectations of the course it is not intended to be the final product although one hopes it will be of sufficient quality for somebody to pick up where I leave off, providing I do not take &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS911"&gt;DPS911&lt;/a&gt; next semester.&lt;br /&gt;&lt;br /&gt;The following is a brief overview of the objectives and predicted issues for the point releases.&lt;br /&gt;&lt;h4&gt;4.1 Version 0.1 (October 19)&lt;/h4&gt;&lt;h5&gt;4.1.1 What it to be done&lt;/h5&gt;&lt;ul&gt;&lt;li&gt;Add a 2D array of style variables with each "row" representing a style set.&lt;/li&gt;&lt;li&gt;Add a variable tracking the style set currently in use.  This will be technically superfluous during the interim since only a single style set will be used.&lt;/li&gt;&lt;li&gt;See if we need functions to save the current style variable values or load a set into the variables.  Might be overkill.&lt;/li&gt;&lt;/ul&gt;&lt;h5&gt;4.1.2 Gathering the pieces&lt;/h5&gt;&lt;ul&gt;&lt;li&gt;Install &lt;a href="http://wiki.eclipse.org/index.php/ATF/JSDT"&gt;JavaScript Development Tools&lt;/a&gt; for &lt;a href="http://www.eclipse.org/"&gt;Eclipse&lt;/a&gt;&lt;/li&gt;&lt;li&gt;Try &lt;a href="http://github.com/guides/using-the-egit-eclipse-plugin-with-github"&gt;Egit&lt;/a&gt; with &lt;a href="http://github.com/"&gt;github&lt;/a&gt;.&lt;/li&gt;&lt;li&gt;Check out Pjs using Egit.&lt;/li&gt;&lt;li&gt;Check out &lt;a href="http://dev.processing.org/build/"&gt;Processing code&lt;/a&gt; for reference.&lt;/li&gt;&lt;li&gt;&lt;a href="http://processingjs.org/learning"&gt;Learn enough Processing&lt;/a&gt; to set up examples.&lt;/li&gt;&lt;li&gt;&lt;a href="http://www.w3schools.com/js/default.asp"&gt;(Re)learn JavaScript&lt;/a&gt;&lt;/li&gt;&lt;li&gt;Use Processing to ensure the visual results are the same.&lt;/li&gt;&lt;li&gt;Firefox, Internet Explorer (with Explorer Canvas), Opera, Safari, etc., on as wide a range of operating systems as possible, for testing&lt;/li&gt;&lt;/ul&gt;&lt;h4&gt;4.2 Version 0.2 (November 16)&lt;/h4&gt;&lt;h5&gt;4.2.1 What it to be done&lt;/h5&gt;&lt;ul&gt;&lt;li&gt;Complete implementing multiple style set storage and conversion of existing code.&lt;/li&gt;&lt;li&gt;Implement &lt;em&gt;pushStyle()&lt;/em&gt; and &lt;em&gt;popStyle()&lt;/em&gt;.&lt;/li&gt;&lt;/ul&gt;&lt;h5&gt;4.2.2 Gathering the pieces&lt;/h5&gt;&lt;ul&gt;&lt;li&gt;Reference Processing code to ensure similar behaviour.&lt;/li&gt;&lt;li&gt;Set up a web page using canvas and Pjs for testing purposes.&lt;/li&gt;&lt;li&gt;Use Processing to ensure the visual results are the same.&lt;/li&gt;&lt;li&gt;Firefox, Internet Explorer (with Explorer Canvas), Opera, Safari, etc., on as wide a range of operating systems as possible, for testing&lt;/li&gt;&lt;/ul&gt;&lt;h4&gt;4.3 Version 0.3 (December 7)&lt;/h4&gt;&lt;h5&gt;4.3.1 What it to be done&lt;/h5&gt;&lt;ul&gt;&lt;li&gt;Complete implementing &lt;em&gt;pushStyle()&lt;/em&gt; and &lt;em&gt;popStyle()&lt;/em&gt;.&lt;/li&gt;&lt;li&gt;Firefox, Internet Explorer (with Explorer Canvas), Opera, Safari, etc., on as wide a range of operating systems as possible, for testing&lt;/li&gt;&lt;/ul&gt;&lt;h5&gt;4.3.2 Gathering the pieces&lt;/h5&gt;&lt;ul&gt;&lt;li&gt;Reference Processing code to ensure similar behaviour.&lt;/li&gt;&lt;li&gt;Use Processing to ensure the visual results are the same.&lt;/li&gt;&lt;li&gt;Firefox, Internet Explorer (with Explorer Canvas), Opera, Safari, etc., on as wide a range of operating systems as possible, for testing&lt;/li&gt;&lt;/ul&gt;&lt;h3&gt;5 From here on in it's who you know&lt;/h3&gt;I briefly "spoke" to &lt;a href="http://www.hyper-metrix.com/"&gt;Al MacDonald&lt;/a&gt; (F1LT3R) on IRC (&lt;a href="irc://irc.mozilla.org/processing.js"&gt;#processing.js&lt;/a&gt; on &lt;a href="http://irc.mozilla.org/"&gt;moznet&lt;/a&gt;).  He had no objections and suggested &lt;em&gt;pushStyle()&lt;/em&gt; and &lt;em&gt;popStyle()&lt;/em&gt; might be placed after &lt;em&gt;pushMatrix()&lt;/em&gt; and &lt;em&gt;popMatrix()&lt;/em&gt; in the library, and that I should not hesitate to ask if I needed help.&lt;br /&gt;&lt;h3&gt;6 There's no party like the...&lt;/h3&gt;I anticipate that others may assist in testing.  I have learned from first hand experience that supposedly "identical" browsers on different operating systems may behave differently.  (I recall sometime in the past that the "same" version of Firefox rendered a page differently on Windows than on Debian.  In hindsight, it may have been something with the libraries Firefox depended on in Debian.)  I do not have immediate access to the full range of combinations and it would be good to have a list of browser misbehaviour, even if making workarounds for some of them is impractical.&lt;br /&gt;&lt;br /&gt;Then there is a matter of reviewing the code.  There will no doubt be my unwanted idiosyncrasies and stealthy errors in the code, and these will be easier for others to pick out.&lt;br /&gt;&lt;br /&gt;When my familiarization with the Pjs library improves I hope to have time to take cracks at some of the smaller functions that are still outstanding.&lt;br /&gt;&lt;h3&gt;7 What could possibly go wrong?&lt;/h3&gt;There is no one element if the project, or combination thereof, that strikes me as requiring more than the usual caution.  There are sufficient examples and documentation to make learning Processing and JavaScript, at worst, a trial-and-error proposition.  Setting up new tools, like the Eclipse plugins, may involve some work, but if it goes badly they may be discarded without crippling the project; strictly speaking they are not essential and a normal text editor will do.  Within the project I fear mainly the usual obscure bugs that resist solution, but these are not things that are generally "prevented" so much as "solved".&lt;br /&gt;&lt;br /&gt;The greatest concern is when the project is considered in conjunction with other exterior projects.  Already other courses are handing out assignments that are far more involved than my portion of Pjs.  The question is not whether there is enough time to complete them all, but rather how many mornings I may resemble a shuffling zombie.  I suppose it's a good thing I take public transit to school!&lt;br /&gt;&lt;h3&gt;8 Once started, there is no going back&lt;/h3&gt;So this is it, open source software project number one!  From this point shall I achieve fame, fortune, world domination...!  Or I could just concentrate on getting through the semester and hoping my code passes muster.  Yes, that sounds like a much better idea.&lt;br /&gt;&lt;br /&gt;Let the good times roll.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-1093020536466351776?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/processingjs-plan-to-push-and-pop.html#comment-form' title='1 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1093020536466351776'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/1093020536466351776'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/processingjs-plan-to-push-and-pop.html' title='Processing.js – A Plan to Push and Pop Styles'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>1</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-2812648544213858911</id><published>2009-09-21T18:44:00.000-07:00</published><updated>2009-09-24T07:46:51.928-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Building the Minefield or: How I Put Some Under My Own Feet</title><content type='html'>This week in &lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt; it was time to &lt;a href="https://developer.mozilla.org/En/Developer_Guide/Build_Instructions"&gt;build&lt;/a&gt; the latest development version of Mozilla Firefox.&lt;br /&gt;&lt;br /&gt;The first time I ever built something after checking out from a repository was a few years ago with the &lt;a href="http://icculus.org/freespace2/"&gt;Icculus FreeSpace 2 Linux port&lt;/a&gt;.  This was followed a bit later later with the &lt;a href="http://scp.indiegames.us/"&gt;FreeSpace 2 Source Code Project&lt;/a&gt;, and then somewhat more recently with the &lt;a href="http://lumaki.com/code/cdogs/"&gt;C-Dogs SDL port&lt;/a&gt;.  For all of these configuring the system and building was a simple affair.  Most of the configuration files, like ./configure and make and makefile, were already included with the checked out files and waiting to be run. The most trouble to be had was ensuring one had all the dependencies; this usually meant attempting to build multiple times, with each time following a fix to another missing dependency.&lt;br /&gt;&lt;br /&gt;Building Mozilla Firefox was much the same, in which much of the trouble was fullfilling the dependencies.  I started with the &lt;a href="https://developer.mozilla.org/En/Simple_Firefox_build"&gt;simple build instructions&lt;/a&gt;.  Having casually browsed &lt;i&gt;only&lt;/i&gt; that page the first attempt failed miserably because I had neglected to install autoconf.  As we will soon see this would not be the only time my unfortunate habit of acting before browsing the literature with due diligence would haunt me.&lt;br /&gt;&lt;br /&gt;Then the second attempt failed.  The error message stated autoconf 2.13 was missing, but I assumed that any newer version would do, so I got autoconf 2.64 from the &lt;a href="http://www.debian.org/"&gt;Debian GNU/Linux&lt;/a&gt; repository.  This was a very poor assumption on my part.  Finally getting to &lt;a href="https://developer.mozilla.org/en/Linux_Build_Prerequisites"&gt;Linux build instructions&lt;/a&gt; it said that &lt;i&gt;only&lt;/i&gt; 2.13 would work.  Some Googling revealed the newer versions of autoconf were not backward compatible and Mozilla had stuck with 2.13 to avoid &lt;a href="https://bugzilla.mozilla.org/show_bug.cgi?id=104642"&gt;breaking and having to rewrite their scripts&lt;/a&gt;.&lt;br /&gt;&lt;br /&gt;At that point I was getting that sinking feeling.  I do not cherish the thought of cobbling together a package for Debian which may not coexist nicely with a newer version in the repository.  After all, I might need the newer version sometime, and what if I had to get other older libraries to get the older autoconf to work?  Fortunately, after some searching, I discovered Debian &lt;a href="http://packages.debian.org/sid/autoconf2.13"&gt;maintained autoconf 2.13&lt;/a&gt; in the repository for the exact reason of backward compatibility.&lt;br /&gt;&lt;br /&gt;So now I had autoconf 2.13 and (surprise, surprise!) the third build attempt also failed.  The code  in &lt;i&gt;configure&lt;/i&gt; was malformed and gave this cryptic message like:&lt;br /&gt;&lt;br /&gt;&lt;code&gt;/home/mlam/src/mozilla-central/configure: line 4980: syntax error near unexpected token `}'   &lt;br /&gt;/home/mlam/src/mozilla-central/configure: line 4980: `$as_echo "yes" &gt;&amp;6; }'&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;I admit I barely know the first thing about scripting and was not pleased with this since, I was fairly sure, this was not something &lt;i&gt;I&lt;/i&gt; could fix by messing around with the script.  Googling didn't turn up anything on this.  Looking into the script the top comment said autoconf &lt;i&gt;2.64&lt;/i&gt; was the generator.  This got me worried: if the Mozilla script was using the wrong one something might be wrong with Debian's inner workings and this, again, was not something I relished poking and prodding.  I read the Debian documentation for autoconf 2.13 on how which version to use was determined and as far as I could tell the Mozilla code was correctly setup to use 2.13.&lt;br /&gt;&lt;br /&gt;So, going out on a limb and simply deleted the old &lt;i&gt;configure&lt;/i&gt; and entered &lt;i&gt;make -f client.mk&lt;/i&gt; yet again to regenerate.  Fortunately that worked and got me past the problem.  &lt;br /&gt;&lt;br /&gt;Now, if I was in the habit of paying attention and reading the instructions, I could have avoided the previous problem.  The error messages explicitly state to use&lt;br /&gt;&lt;br /&gt;&lt;code&gt;make -f client.mk build&lt;/code&gt;&lt;br /&gt;&lt;br /&gt;when attempting to rebuild.  It was only after solving the previous problem in that particularly ignorant fashion that I picked up on this.&lt;br /&gt;&lt;br /&gt;The final problem was a run-of-the-mill missing dependency, in this case libidl.&lt;br /&gt;&lt;br /&gt;Final time spend: over an hour puzzling through the build errors, and 20 minutes for the final successful build (naturally in my obstinance I insisted on using the system for other tasks at the same time.)  So now Minefield is back on my system after a multi-year hiatus, although this time round I have no idea what I'm going to do with it.&lt;br /&gt;&lt;br /&gt;However, all being said and done, building Firefox is ridiculously easy compared to the complexity of the program itself.  No doubt a good number of people tore out hair getting the build infrastructure in place but the results are undoubtedly effective.&lt;br /&gt;&lt;br /&gt;Now, if only Iceweasel 3.5.3 would enter the Debian Unstable repository...&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-2812648544213858911?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/building-minefield-or-how-i-put-some.html#comment-form' title='2 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/2812648544213858911'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/2812648544213858911'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/building-minefield-or-how-i-put-some.html' title='Building the Minefield or: How I Put Some Under My Own Feet'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>2</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-5795558113564649668</id><published>2009-09-17T08:53:00.000-07:00</published><updated>2009-09-17T09:00:44.720-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>Disembodied voices and talking heads!</title><content type='html'>This past Wednesday I dialled into the Mozilla's weekly &lt;a href="https://wiki.mozilla.org/Firefox/DeliveryMeetings/2009-09-16"&gt;delivery meeting&lt;/a&gt; for Firefox and Gecko. Unfortunately, this required a long-distance call; my schedule constrained the meeting I could “attend”.  On the up side, as an end-user I had some context to understand what was being discussed.  Listening in on the developer meeting held Tuesdays might have been more arduous, if the wiki notes are anything to judge by.&lt;br /&gt;&lt;br /&gt;It was of interest that the meeting's wiki page was used by the speakers.  Each speaker edited in a summery of their points prior to, and sometimes almost right before, their turn to speak.  One could tell who was absent simply by observing the empty sections on the page!  Aside from leaving a record for the future, the wiki page content also helped me understand the point being discussed whenever it became difficult to hear what was being said; I suspect the meeting participants also appreciate the alternate channel the wiki provides.&lt;br /&gt;&lt;br /&gt;Next I viewed a lecture by &lt;a href="https://wiki.mozilla.org/User:Beltzner"&gt;Mike&lt;/a&gt; &lt;a href="http://beltzner.ca/mike/"&gt;Beltzner&lt;/a&gt;. He gave a brief overview of some of tools used for development and communications by Mozilla, such as Bugzilla and IRC.  Beltzner also spoke about netiquette and how to go about communicating and asking for help, of respecting other people's time by being up front with what you need help with, doing the research before hand, and of course listening and implementing feedback.  This was related to the brief section on “social capital” and the relationship between the influence of a person with the perceived value of the person by the community. I touched on this in a previous from a wiki sysop's perspective &lt;a href=”http://wobblyretroaction.blogspot.com/2009/09/milestone-of-sorts-first-blog-post-ever.html”&gt;post&lt;/a&gt; where I related how a contributor's enthusiasm was no substitute for integration when seeking to become a valued member of a project.&lt;br /&gt;&lt;br /&gt;Finally there was &lt;a href="https://cs.senecac.on.ca/~david.humphrey/"&gt;David&lt;/a&gt; &lt;a href="http://vocamus.net/dave/"&gt;Humphrey&lt;/a&gt;'s lecture “Learning to be at the festival”.  Humphrey emphasized the most important element of open source is the community rather than the code.  The prominence of the code and product as the public face of the project makes it easy to forget that the participants, the community, are the project's fount and true source of influence.  He also touched on ways to help new contributors submerge themselves into the project, such as existing contributors acting as mentors.&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-5795558113564649668?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/disembodied-voices-and-talking-heads.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/5795558113564649668'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/5795558113564649668'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/disembodied-voices-and-talking-heads.html' title='Disembodied voices and talking heads!'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry><entry><id>tag:blogger.com,1999:blog-657162030526952657.post-2864024229134141991</id><published>2009-09-13T05:39:00.000-07:00</published><updated>2009-09-13T06:27:10.448-07:00</updated><category scheme='http://www.blogger.com/atom/ns#' term='Open source'/><title type='text'>A milestone of sorts: first blog post ever.</title><content type='html'>Greetings!  My name is Matthew Lam, and I am a student in a software development program at Seneca College, Toronto, Canada.  The main focus of the blog will be an open source project pursuant to achieving the objectives of an open source development course I am pursuing this semester (&lt;a href="http://zenit.senecac.on.ca/wiki/index.php/DPS909"&gt;DPS909&lt;/a&gt;).  The scope may broaden as time and whim permits.&lt;br /&gt;&lt;br /&gt;As a lead-in to the course, I was required to read/listen/watch to a number of items concerning the nature and history of open source development.  I have never participated in an open source software project before despite being familiar with the concepts and using the fruits of such endeavours myself.  (Many years ago I was interested in the &lt;a href=”http://scp.indiegames.us/”&gt;FreeSpace 2 Source Code Project&lt;/a&gt; but was fatally handicapped by a lack of knowledge of C/C++; now if I could just find the time...)&lt;br /&gt;&lt;br /&gt;More recently most of my collaborative work has been as a sysop on a Wikia wiki.  Imminently I face the reality that as part of DPS909 I will soon be experiencing a reversal of states.  On the wiki part of the responsibility of determining the project's direction and environment is invested in me.  However, soon I will be joining an established project where I will be the new contributor, not as a core driver.&lt;br /&gt;&lt;br /&gt;In open source and wiki projects, treating users as co-developers is how the project gains person-power, but as I have learned it is practically a more complex matter.  Acclimatizing new contributors is the challenge and the success of which lies mainly with the contributor.  Contributors who really want to become valued members need little prompting to learn (by example, by asking for help, by heeding the advice of established members, etc.) how the project “works”; it is, after all, not enough to just contribute, one must contribute in the “right way”, according to the expectations prevalent within the project.&lt;br /&gt;&lt;br /&gt;Having seen some new enthusiastic wiki contributors fail at the crucible, the main lesson is to be adaptable.  The project may do things in ways not to one's liking but it is still contingent on oneself, at least at the beginning, to do things their way.  To do otherwise makes it more difficult for one's contributions to be accepted.&lt;br /&gt;&lt;br /&gt;Saying that, allow me to offer humble apologies in advance to all of the drivers/managers/etc. whom I may be a cause of distress for in the coming months.  I know where you're coming from. :)&lt;div class="blogger-post-footer"&gt;&lt;img width='1' height='1' src='https://blogger.googleusercontent.com/tracker/657162030526952657-2864024229134141991?l=wobblyretroaction.blogspot.com' alt='' /&gt;&lt;/div&gt;</content><link rel='replies' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/milestone-of-sorts-first-blog-post-ever.html#comment-form' title='0 Comments'/><link rel='edit' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/2864024229134141991'/><link rel='self' type='application/atom+xml' href='http://www.blogger.com/feeds/657162030526952657/posts/default/2864024229134141991'/><link rel='alternate' type='text/html' href='http://wobblyretroaction.blogspot.com/2009/09/milestone-of-sorts-first-blog-post-ever.html' title='A milestone of sorts: first blog post ever.'/><author><name>Matthew Lam</name><uri>http://www.blogger.com/profile/14101149970200967165</uri><email>noreply@blogger.com</email><gd:image rel='http://schemas.google.com/g/2005#thumbnail' width='16' height='16' src='http://img2.blogblog.com/img/b16-rounded.gif'/></author><thr:total>0</thr:total></entry></feed>
