Scott Downe

Moving to wordpress...

2010-06-05T15:40:00.000-07:00

I'm in the middle of moving my blog over to http://scottdowne.wordpress.com/. I will be spending the next few weeks fiddling with the smaller details of design, the sort of detail that can get someone like me wrapped up for days doing, but not accomplishing anything :).

I was impressed that I was able to just export all my old posts over to wordpress, by clicking a "magic button", literally, that's what it was labeled as. It's all automated, and a really painless process.

The reason for the move was for more robust visitor tracking.

I have some pretty cool ideas in mind for my new blog, as far as design goes, so we'll see how far wordpress allows me to hack it. I would like to get some processing.js sketches in my design, maybe in the background, or the banner, or both! if it's possible. If not, I might consider writing something myself, and hosting it myself, but I'm not there yet.

JavaScript is not Java

2010-05-21T19:46:00.001-07:00

Just how deep does this rabbit hole go?

Make one to throw it away

2010-05-15T05:05:00.000-07:00

The title of this blog becomes more and more true the more I work in open source, but if you don't know what the title means, let me describe to you something about open source before i tell you what it means.

Open source development differs from school, and I can only assume, propriety jobs like a bank because in open source, if something has been written before, why are you going to write it again? At school, you spend so much time writing code that has been written hundreds of times before, by hundreds of students before you, these assignments are possible, have been proven, and if they were not possible, and they asked you to do it, you would be pretty ticket off spending days trying to figure it out, and you would probably think you accomplished nothing, and wasted time. You are wrong. When you are working on something that has never been done before, you have to try different things, there is no one to tell you what works, only ideas, because no one has done it. You have to think for yourself, make decisions for yourself, and be prepared to be wrong most of the time, until you get it right. You can be wrong hundreds of times, but only be right once... per problem that is.

To "make one to throw it away" means, before you get code that is working, and doing what you want, you have to make one or more versions that fail. This isn't too bad when dealing with a couple hundred lines of code, but something like 8000+ well, that bring me to my next story.

I've been spending the last week, trying to figure out a way to remove the final with() function call from Processing.js. In order to remove the with() function call, I had to rewrite a lot of the code... 8000+ lines of code, which also meant I had to understand (more or less) 8000 lines of code. If you are curious, here is the source in all it's glory. When you "make one to throw it away", you have just written and thrown away 8000 lines of code... if you think that's a waste of time, you are again wrong. This was 8000 lines more educational for me than rewriting 500 lines. It's simple math, really.


lines written * rewrites = productivity score :P

Processing.js casting bug

2010-05-06T10:45:00.000-07:00

I have been working on processing.js bug #625.

What's happening is there is some Java like code, that's being converted into JavaScript, so it can be run in a browser, and this bug deals with converting cast like syntax in java, into something usable in JavaScript.

JavaScript is typeless, what is important about this is the types between variables don't matter (for the most part) so when I create a variable of an int, I just create a variable, and make it an int, and if I need to know the type of the variable, I can check the type of what's in the variable, which would be an int. Looking at p5 append(), is what the cast is being used for in this bug.

"When using an array of objects, the data returned from the function must be cast to the object array's data type. For example: SomeClass[] items = (SomeClass[]) append(originalArray, element)."

In pjs, I don't think the cast is even needed, as append just returns an array, this is the pjs append code:


    p.append = function(array, element) {
      array[array.length] = element;
      return array;
    };

Maybe p5 (the Java version of processing) has append returning an array list, which would require the cast.

Either way, JavaScript does not need the cast.

I removed the cast in the example, and it works, but the problem still remains with parsing the cast, as it's valid code. In p5 the cast still needs to be handled by the parser, cannot just remove it. There is a way to do this currently in the parser, but it will only parse out classes inside a list.

One thing I could do is add "PVector" to the list of classes, which currently looks like this:


var classes = ["int", "float", "boolean", "String", "byte", "double", "long", "ArrayList"];

then in this code:


    // Remove Casting
    aCode = aCode.replace(new RegExp("\\((" + classes.join("|") + ")(\\[\\])*\\)", "g"), "");

It would find PVector, and remove the cast, without hurting anything else. Only problem I see in this is we'll have to add each and every pjs class to the list of classes, and if a new class is added to pjs, someone will have to remember to add the class to the list of classes. There must be a more dynamic way to accomplish this, which is what I want.

I thought about possibly parsing any instance of $/w+$ and check that the match in w+ is "typeof Object" or something along those lines. Then I could remove the list of classes all together. Yes, I will try that. Thanks for the help blog.

Building Firefox on Fedora

2010-05-05T08:28:00.001-07:00

Today I went to set up a working Firefox build environment ON Linux Fedora. It was actually easier than I first felt. When I would run into an error message, I would google it, and get an answer usually saying to add modifications in the config file to pass over, or to include, or change the version of various products.

Some of the problems:

Something called necko-wifi was not compatible, researching it I found I could just disable it in the mozconfig file by appending a line "ac_add_options --disable-necko-wifi". Solved, next error!

Something called maemo was causing an error message, and researching that I found a similar solution that didn't work, to append "ac_add_options --with-maemo-version=5", fixed, but this caused other issues.

I then found out, I could do a search for the missing files Firefox was complaining about using Fedora's "yum search 'name of file'" looking for something that looked like what was missing, and then "yum install 'file you found'" and crossed my fingers, would sometimes take a couple hits and misses before it would build, but after that each and every error was solved in that manner, including maemo.

I have to say I'm liking Fedora a lot. I also found a neat trick using vim, where you can do ctrl-p while typing a word to finish it, or scroll through words kinda like auto-complete. Linux can pretty much do anything I would need now.

Solution to my last post.

2010-04-25T17:29:00.001-07:00

In my last post I was trying to create a function that receives a multidimensional array inside parameters like (2, 4, 5) but with an infinite amount that could be passed in, and I was having problems with pass by reference, instead of pass by value.

I fixed it, and came up with a very simple solution:


    p.ArrayList = function() {
      var createArrayList = function(args){
        var array = new Array();
        for (var i = 0; i < args[0]; i++){
          array[i] = (args.length !== 1 ? createArrayList(args.slice(1)) : 0 );
        }
    
        return array;
      };
      return createArrayList(Array.prototype.slice.call(arguments));
    };

I came across the problem of arguments only acting like an array, but not having access to many array like functions, like slice(). Solution.


Array.prototype.slice.call(arguments)

Array.prototype.slice gets the slice method from the Array object.
call() allows you to call an object's function from the context of another object.
and the slice method would be called, using the function definition attached to Array, like it was part of arguments, and just return a copy of the array's values, as an array. :D

copy a multidimensional array in js.

2010-04-25T07:34:00.000-07:00

I'm working on ticket #587, for processing.js.

What I have to do is convert a custom ArrayList function to create a multidimensional array based on parameters passed in. For example:


var array = new ArrayList(4, 5, 6);

would create a 3D array, similar to:


int[][][] array = new int[4][5][6]

This is what I've put together:


    p.ArrayList = function() {
      var array = [],
          tempArray = [];

      for (var i = 0, aLength = arguments[arguments.length-1]; i < aLength; i++){
        array[i] = 0;
      }
        
      for (var i = arguments.length-2; i >= 0; i--){
        tempArray = array.slice();
        array = [];
        for (var j = 0, aLength = arguments[i]; j < aLength; j++){
          array[j] = tempArray.slice();
        }
      }
      return array;
    };

It starts at the back of the arguments, and copies the array recursively until it's done arguments[0], then returns the array.

In JavaScript arrays are copied by reference, and not by value, but if you use array.slice() it creates a copy of the array's values, but not a copy of the array inside the array, those are still passed by reference. In other words, it only works for single, and 2D arrays, anything larger and you start getting arrays containing references to the same data, which is not good.

I'm going to have to find a better way to do this, it must be recursive, and must be based on the number of arguments.

OSD600 is over

2010-04-21T18:22:00.000-07:00

After tomorrow, I'm done this semester, and the real test begins: will I continue blogging between OSD600 and OSD700. It's already been a week since my last post, but not because of being almost finished, but because of English assignments and exams, and right now I have a breather (I never study hard the night before the exam, I just make sure I didn't miss anything). I would like to say I'll continue blogging for as long as the internet lives, but time is a better test. I really do feel like I've found a great spot in open source, and I'll enjoy it while it lasts.

Anyway, I've been trying to do at least one push to processing.js a day, while I study, big or small, at least one contribution.

Over the last week though, I've really got into irc, and branched into a few of the other channels, which have a totally different atmosphere than the processing.js channel. I got involved in the open source vs proprietary argument, which despite being educational and funny, really is never solved. I've tried to get some to at least try it before they slag it, but I guess for some programming is for money *shrugs*. I've told them to at least take the osd600 class in the fall, because they are quite promising students, just bias and not willing to try certain things. I tried explaining that open source is a good way to get work experience to get those jobs that make all the money they keep talking about. For them to take OSD600, they wouldn't be programming for free, but for marks, and that's what they do in all their other classes.

JavaScript this keyword

2010-04-14T04:35:00.000-07:00

I know this this keyword's (in JavaScript) meaning changes depending on how it's called, considering this class:


function Obj() {
  this.item = "contents";
}

and using it like this:


var obj = new Obj();
obj.item += " of this.item"; // item now contains "contents of this.item"

the this. keyword means the object only when it's called with new keyword, which declares it as an object.

Now, if I am to change the object slightly, like so:


function Obj() {
  this.item = "contents";
  var funct = this.funct = function(){
    return this.item;
  };
}

I have two functions that should return the item inside the object. var funct should be usable inside the object, and this.funct should be usable outside the object, and do the same thing. Cept, when a function is created with var funct, the meaning of this. changes again. I'm not sure what it changes into, but in the above example, when I call funct() from inside the class, it returns "undefined". Everything makes sense, I'm just not sure what happens to this. in that crazy example. There is a way to fix this. You need to put the function inside of a closure, sending this, and using it as another word. For example:


function Obj() {
  this.item = "contents";
  var funct = this.funct = (function(obj) { return function(){
    return this.item;
  };})(this);
}

What this does is, instead of sending a function using the this. keyword inside, it creates an anonymous function, sending the object this, RENAMING it to obj, and returning a new function where this is changed to obj, hiding the double meaning of the this keyword, making it refer to the same thing no matter when and how it's called.

I've been learning the meaning of this, and I thought I had it figured out. This just shows you can never know you know everything, only that you don't know everything, by learning something you didn't know :P

with(this) { ... } // no more

2010-04-12T01:47:00.001-07:00

Here is the source, and an example for processing.js with "with(this) { ... }" removed.

I was having issues using the new getters and setters. What was happening was considering this JavaScrpt class.


function Foo() {
  this.value = 0;
  __defineGetter__('value', function()  { return this.value; });
  __defineSetter__('value', function(x) { this.value = x;    });

  this.getValue = function(){ return value; };
  this.setValue = function(x) { value = x; };
}

The this. keywords scope wasn't as intended. It was actually referring to the getter or setters, and not the object that uses it. I solved this by putting it into a closure, and passing the object I wanted the getters and setters to be added to, like so:


function Foo() {
  this.value = 0;
  __defineGetter__('value', (function(obj) { return function()  { return obj.value; };})(this));
  __defineSetter__('value', (function(obj) { return function(x) { obj.value = x;    };})(this));

  this.getValue = function(){ return value; };
  this.setValue = function(x) { value = x; };
}

OSD600 release 0.3

2010-04-12T01:18:00.000-07:00

I guess technically I'm late on this release, but these things happen when you're doing stuff with this ;)

I have been back and forth on this private ticket for while, trying different things, doing research, and then finally worked with Dave to get it perfect. I did get lots done on it, even thought it's not all going to be used, I consider the research and work I did to be part of my 0.3. Here is a post on what me and Dave worked on, and this is a better foundation for future work in the class parser.

I also worked with Andor Salga. One of his 3D examples had a silly parser error, so I filed a ticket and fixed it. It was up for review, but I had to back up because it was relying on code from a previous fix that's not going in. It was a simple parser fix, so it won't be hard for me to re implement it when the time comes. Also, Andor has a way around it, so his 3D example does work now. This is the example he was working with, if anyone is interested.

I was able to fix, and not have to back up ticket #536 and it's awaiting review.

I have learned one very important lesson; if two, or more bugs reside in the same spot in the code, I should consider keeping them in the same ticket, then I wouldn't of had the problems I'm having with ticket #133, mainly, having to revert a bunch of my "peer review requested". Really though, with the getters and setter, these are all going to be easy to refix (also, because I've already fixed them).

processing.js private and public finally working, I think

2010-04-09T21:44:00.000-07:00

I think I have finally finished processing.js ticket #133.

A simple test to see it.

And a cool example that uses public variables. This particular test program was giving me the most difficulties while I was coding. It seemed whenever I would run the automated tests, this one would always have a new problem, and it also happens to be a long test, so it's harder to debug, so to be able to edit it and change the example is satisfying.

I just need to write some clear, simple, and thorough test cases for private and public use, and I'll be done.

I love you word boundary.

2010-04-08T20:48:00.000-07:00

A word boundary is, other than my savior, a regular expression match that matches the tiny, invisible space between a word character (a-zA-Z0-9_) and a non-word character.

You use it with \b and \B (\B matching a non-word boundary, same as [^\b])

Example: "this is some text" with the regular expression \bs. This would only match the "s" in "some" because there is a non word character before the s. Also, if you did s\b it would match the "s" in "this" because it's before a non word character. Finally, \Bs would match "this" and "is" and s\B would match "some". I hope that all made sense.

I needed this in a particular problem where I had to parse some code, and catch any specific words, globally. The problem was, when I checked for a match (previously) I was checking for (\W) which is a non word character, then check for my matching word, so if I was looking for all instances of "scott" I would not want to catch "scotty" as in this case, would be a different variable. So, /(\W)(scott){\W)/g, problem with this is, it would "eat" the leading and trailing characters, making any other matches in the string not check the leading and trailing characters again.

By using \b, I was able to check what I needed, without "eating" the leading and trailing characters.

If anyone is curious, the final product looks like so:


      // add this. to public variables used inside member functions, and constructors
      if (publicVars) {
        // Search functions for public variables
        for (var i = 0; i < methodsArray.length; i++) {
          methods += methodsArray[i].replace(/(addMethod.*?\{)([\s|\S]*\}\);)/g, function(all, header, body) {
            return header + body.replace(new RegExp("(\\.)?\\b(" + publicVars.substr(0, publicVars.length-1) + ")\\b", "g"), function (all, first, variable) {
              if (first === ".") {
                return all;
              } else {
                return "this." + variable;
              }
            });
          });
        }
        // Search constructors for public variables
        constructors = constructors.replace(new RegExp("(var\\s*?|\\.)?\\b(" + publicVars.substr(0, publicVars.length-1) + ")\\b", "g"), function (all, first, variable) {
          if (/var\s*?$/.test(first) || first === ".") {
            return all;
          } else {
            return "this." + variable;
          }
        });
      }

Obviously, there is code before and after, with declared variables, but just use your imagination ;) and I'm still looking for bug, but feel free to scrutinize my code.

Stuck on Processing.js private and public variables

2010-04-07T11:45:00.000-07:00

It's been awhile since I posted, but I needed to create some time, which meant moving things around.

Warning, this may seem more like a rant, or crazy ramblings than a normal blog post. I'm just going to write it all down, in hopes that it helps me better understand all that I'm dealing with.

Alright, to start off I'm working on processing,js, specifically ticket #133 (still). It didn't seem hard at first, and I had a lot of initial success, but as I went deeper, I kept finding more and more. This has really taken a lot to get right.

What I'm trying to accomplish, is to grab a class, so I can work with, and parse just the class, as to not parse non class related code. Once I'm in the class, I want to grab and remove the class functions, and constructors for later use, I don't want to be parsing "var i" that is contained in a function, into a private variable. Outside the function, anything that's private, is private, and public is public, but by default, it should be public. This is why I cannot be parsing functions and constructors, but I also have to know what's public, and what's private by the time I work with the functions and constructors, because when a public variable is used in a function or constructor, I need to add a "this." in front of it.

I think some day, hopefully soon, all this class parsing code should have a major overhaul, as I keep coming to code that I don't see any use for, but I'm not comfortable removing it yet. I'm starting to fix things, and as I do, other areas should be removed. I think that would be better suited for a separate bug once I got private and public working.

I did take an attempt at overhauling the class parsing, but I'm conflicted if I should just redo it, and go from there, or if I should use what's already there. I believe most would say not to redo it, but it's still tempting.

Right now, I'm dealing with some code that's being "left behind" as I move parts of the class up, and other parts down. I know that classes with a constructor is parsed separately than a class without a constructor, but I don't think we should be doing this. What we should do is, open the class up, from top brace to bottom brace, and deal with any constructors contained within, as we get to them. This also has the advantage of not needing constructors to be declared first thing, and any member variables can also be declared anywhere. I've made a work around for this, but now I think it's causing my "code left behind" problem, as the code left behind is either the class declaration, or a constructor declaration. For example, imagine a class called Place, when I parse it, I'm left with a line of code like this "processing.Place = function" I think it's a case of a regex somewhere just working with what's between the {} and not what's also in front of it.

Another issue that was solved about a day ago, is private and public functions, being declared with a custom "addMethod()" function, which for the longest time made no sense to me, and I hated it. I have since understood it, and although I still don't like it much, I see the need and don't want to remove it. This function wants an object, a String, and a function as it's parameters, and it will then create a function, with that name, and add it to the object you send, also allowing for overloading (the reason why it's there, is for overloading) I was stuck figuring out how to add a function to this. without making it public. I would send "this" as the object, into addMethod, I thought about intercepting it, and making private functions separately, but then we would be left with separate code for public functions, and private functions, not very ideal. I decided on adding a private object called private to the scope of the class, then when I want to add a function to the private scope, instead of sending "this" I would send my "private" object. The caveat with this is I now have to parse the functions and constructors in the class for any use of a private function, and add "private." in front of it, much like how I add "this." to public variables.

The other option would be to add a "with(this){with(private){ .. }}" around all the code. This would check all variable and function calls if it's inside private (which I would create as "var private = {}"), if not, it would then check if it exists inside this, the problem is, if it doesn't exist inside private, or this, it would be created as a global variable, I think, possibly overwritting any global instances of that variable already defined. Processing.js already uses "with(this) { .. }", and I'm trying to remove it, with moderate success, but it's extremely helpful in this case, and is the difference between 2 lines of code, vs 50 lines of code (I may be exaggerating, as I have not counted which lines are new, and which are being left, or modified, but it's a lot). I plan on talking to David Humphrey in person about possibly, continuing the use of "with()" even with the dangers involved.

I have to admit, this has been quite challenging, and I'm getting kinda frustrated with it, but I guess that's a good thing? *shrugs*

public and private in JavaScript

2010-03-30T20:34:00.000-07:00

In order to enjoy programming in JavaScript you have to be at least a little crazy. Take this for example:


function Obj() {
  var private = {};

  this.publicVar = "inside";
  private.privateVar = "inside";
  this.getPublic = function() {with(this){with(private){
    return publicVar;
  }}};
  this.getPrivate = function() {with(this){with(private){
    return privateVar;
  }}};
}

This is, I think, the complete way to emulate Java objects with private and public usage. All other ways are close, but always lack some little oddity that makes it less than pure. Another good thing about this method is it's easily created after parsing Java-like code.

Take this usage for the above object:


var obj = new Obj();
alert(obj.getPublic());     // should alert inside
alert(obj.publicVar);       // should alert inside
obj.publicVar = "outside";
alert(obj.publicVar);       // should alert outside
alert(obj.getPublic());     // should alert outside

alert(obj.getPrivate());    // should alert inside
alert(obj.privateVar);      // should alert undefined
obj.privateVar = "outside";
alert(obj.privateVar);      // should alert outside
alert(obj.getPrivate());    // should alert inside

Now, I think I've thought of everything, and everything else, but if anyone out there can break this, or find a shortcut, or challenge it in another means, I would be very grateful. Note, if you want to try breaking it, you don't have to understand the class itself, just how to use it, like I did in the second example.

blog post patch

2010-03-29T17:28:00.000-07:00

Ok, I wasn't 100% correct in my last post. There was something I didn't consider.

Where I said:


Considering this class:


class Obj {
  private String item;
  public void setItem(String str) {
    item = str;
  }
  public String getItem() {
    return item;
  }
}


and consider this usage:


Obj thing = new Obj();
thing.setItem("this has been set");
println(thing.getItem()); // prints "this has been set"
println(thing.item); // prints undefined, as it's not been used yet


Everything working as intended, until I try this:


thing.item = "if you see this, it's broken";
println(thing.getItem()) // prints "if you see this, it's broken" :(

I was wrong, that should work as I originally had hoped, but what was happening was processing.js would wrap it inside a with(this){...} function, which I'm still looking into, but it was doing things that I figured was just normal JavaScript, so I over looked it.

Here are some comparing classes, to illustrate what I mean:


// What should, and does work as intended.
function Obj() {
  var privateMember = "hidden";
  this.getMember = function() {
    return privateMember;
  }
}
var obj = new Obj();
alert(obj.getMember()); // alerts "hidden"
obj.privateMember = "not hidden";
alert(obj.getMember()); // alerts "hidden" :D

Now, what processing.js does:


// Does not work as intended.
function Obj() { with (this) { // This is the only change
  var privateMember = "hidden";
  this.getMember = function() {
    return privateMember;
  }
}}
var obj = new Obj();
alert(obj.getMember()); // alerts "hidden"
obj.privateMember = "not hidden";
alert(obj.getMember()); // alerts "not hidden" :(

Now, why not yank "with(this){...}" right out of there? I don't know what it's doing, yet. More on that later. But I'm hopeful to say I have a pretty solid direction.

processing.js public members public to everyone but itself

2010-03-29T12:27:00.000-07:00

Ok, here's what I'm doing. I'm trying to implement the private/public keywords for processing.js

And here are the problems. First attempt was ages ago, and that was to, inside a class, use this.variable; for public, and var variable; for private. This sort of worked, as it allowed me to use public members freely inside and outside the object, and I could not access private members, until they were set from outside the object.

Considering this class:


class Obj {
  private String item;
  public void setItem(String str) {
    item = str;
  }
  public String getItem() {
    return item;
  }
}

and consider this usage:


Obj thing = new Obj();
thing.setItem("this has been set");
println(thing.getItem()); // prints "this has been set"
println(thing.item); // prints undefined, as it's not been used yet

Everything working as intended, until I try this:


thing.item = "if you see this, it's broken";
println(thing.getItem()) // prints "if you see this, it's broken" :(

It's not very useful if private is restrictive but not protective. I thought the whole purpose was to protect you, the person using the object, from themselves, and not just restrict them from, themselves.

Anyway, I wasn't done there. I spent this weekend rewriting the way processing.js translates a class. I was changing it so when you created an object, instead of returning an object, I would call a function that would set all the private members and functions, then return an object literal that would contain all the public variables and functions, which had access to the members in the preceding function, but those members no longer existed, and it worked! Here is an example of what I mean:


function Obj() {
  var privateVariable = "It's a secret to everybody";
  function privateFunction() {
    ...
  }
  return {
    publicVariable: "...",
    publicFunction: function() { return privateVariable; }
  };
}

Usage of this is like so:


var obj = new Obj();
alert(obj.publicVariable); // alertss "..."
alert(obj.publicFunction()); // alerts "It's a secret to everybody"

Everything as expected until I try this... Consider this modified class:


function Obj() {
  return {
    publicVariable: "...",
    publicFunction: function() { return publicVariable; }
  };
}

and this usage:


var obj = new Obj();
alert(obj.publicFunction()); // crashes

So now, a private member is private to everyone but itself, which is good, and a public member is public to everyone... but itself. Two solutions, with two completely opposite caveats.

Final though: while writing this, I was thinking, and organizing my thoughts (kinda the point of blogging, for me) and I have two options I need to explore.

Change the public functions to use public variables with a "this." before it. Example:
```
  return {
    publicVariable: "...",
    publicFunction: function() { return this.publicVariable; }
  };
```
This works, but isn't very practical as I'm translating Java-like class syntax into the javascript you see now, and I don't want to go through all the code, just the structure; this method would require looking for the usage of all public variables, once I have a list of public variables, and add "this.". Not ideal.

Another option, which I'll try, is to add a list of public variables at the top of the code inside a function, like this:
```
  return {
    publicVariable: "...",
    publicFunction: function() { var publicVariable = this.publicVariable; return publicVariable; }
  };
```
Passes the public variable inside this, into a new variable with said name, so I don't have to touch the code inside the function, just add a header of sorts. I would have to do this with functions too.

JavaScript and multiline regular expressions

2010-03-28T11:42:00.000-07:00

Just something I would like to share, because it was causing me grief :P.

While working on parsing a Java-like class into a JavaScript class, for processing.js. I needed to grab all member variables that are marked as public, using a regular expression, and return them as an object literal. Given this as an example:


public String thingOne;
public String thingTwo;

Into this:


{
  thingOne: null,
  thingTwo: null
}

This is what I ended up doing:


      middle = middle.replace(/(?:(private|public)\s+)?(var[\s|\S]*?;)/g, function(all, access, variable) {
        if (access === "private") {
          return variable;
        } else {
          variable = variable.replace(/,\s*/g, ";\nvar ");
          publicVars += variable.replace(/(?:var\s+)?(\w+)\s*=?\s*([^;,]*)(?:;)?/g, function(all, name, value) {
            if (value) {
              return "\n" + name + ": " + value + ",";
            } else {
              return "\n" + name + ": null,";
            }
          });
          return "";
        }
      });

Now don't worry too much about that, just a short background of what I was doing to bring me to the problem. Multiline regular expressions in Javascript.

From my favourite Javascript regex resource "Multiline Input 'm' This flag makes the beginning of input (^) and end of input ($) codes also catch beginning and end of line respectively.". It does NOT do what you would expect, it simply allows code like this:


String one;
String two;

to match both lines with this /^String/gm. Without m, String two; would not match as it does not start at the beginning of the line, but after a \n. Another way to look at it is, m changes the meaning of ^ and $ to also match \n and \r (\r being carriage return). JavaScript regular expression is already multiline, in a way, as all lines are actually one long line with newline characters.

What I wanted to do was match any instance of "var (bunch of stuff) ;" spanning multiple lines. To grab examples like this:


public String thingOne,
  thingTwo;

What I was using was something like this /var.*?;/g grabbing anything between var and ;, including whitespace and newlines? right? Nope, apparently not.

There was a trick I found to solve this. /var[\s|\S]*?;/ This uses \s which is any whitespace, including newline, OR \S which is anything NOT a white space, this is the TRUE anything, and a neat little trick.

morning train ride tangent

2010-03-24T05:22:00.000-07:00

This morning, on the train, I wanted to open up processing.js and get back to working on ticket #237. I got into it, earlier and reproduced all the problems that the ticket entails. We have empty classes with no methods or constructors not working, we have constructors following methods working, but the methods above the constructor not working, and we have the hardest problem in overloading only working in terms of number of arguments, and not types of arguments. What I mean is:


void addItem(int item){...}
void addItem(String item){...}

This is valid processing, because the two methods are different, but, in JavaScript, variable types are not important, and the above code will be translated into:


var addItem = function(var item){...};
var addItem = function(var item){...};

The methods are translated into the same method, this also does not work with constructors either, which is a different problem because the way processing.js handles consturctors. What processing.js does is, because you can send any number of arguments into a method or constructor, and access the variable by using arguments[n], in a for loop less than arguments.length. This is how constructor overloading is handled in processing.js. There is only one real constructor, it just has if statements checking how many arguments there are. Here is an example for how processing.js translates a class:


class Obj{
  Obj(String item){
    item = "in constructor one";
  }
  Obj(int item, String item2){
    item = "in constructor two";
  }
}

into this:


function Obj() {with(this){
 if ( arguments.length === 1 ) {
 var item = arguments[0];


    item = "in constructor one";

  }

  if ( arguments.length === 2 ) {
 var item = arguments[0];
 var  item2 = arguments[1];


    item = "in constructor two";

  }


}}

If you notice, it's just one method that filters out the contents of the constructor into various if statements, but it's only the length of the arguments, and not the types. What I would need to do is grab the types before the types are lost, and then add a type check for all variables at the same time I check the argument length, but methods are not like this.

Funny thing is, while researching this, I came across this blog post, and as soon as I saw the code, I recognized it. This is John Resig's blog, and he is the creator of processing.js, and his post helped me a lot with how to understand the addMethod, method, and the caveats involved.

Ah shoot, I got off on another tangent. Ok, While I was planning on doing this ticket I have been talking about up to this point on the train, I ended up seeing something in code that made me go back to my last ticke on array initialization. I noticed, later in the code, the use of ArrayList() for more than just creating an array, but initializing. I still cannot get it to initialize the array, but I've spend an unexpected morning on this. The idea of ArrayList is to send a size for the array, to create it, but all the values will be empty. Like so:


new ArrayList(2); // creates an arraylist with 2 empty items
new ArrayList(2, 2);  // creates a 2D arraylist with an array of two, with two empty items

I saw later in the code something like this


new ArrayList(["Thing 1", "Thing 2"]); // apparently, this is creating and initializing an arraylist

Like I said, I didn't (yet) get this to work, but I think it would improve the way it's already being done, with just the array like this:


var things = ["Thing 1", "Thing 2"];

I should get this wrapped up into:


var things = new ArrayList(["Thing 1", "Thing 2"]); // this would be ideal

My train ride tests did not work, but I'm going to reduce it more and see why. First I should get arraylist initialization to work. period. Then I will attempt to add it into processing.js. Anyway, that's all for today.

Processing.js array initialization

2010-03-23T19:08:00.000-07:00

Just the other day I fixed a bug for processing.js, where creating an array and initializing it at the same time would crash the parser. What was happening was, code like this:


float[] baz;
baz = new float[] {1.0, 2.5};

when parsed, "new float[]" would be converted to "new ArrayList[]" then "{1.0, 2.5};" would get tacked onto the end, and it shouldn't. "new ArrayList[]" is only for creating an empty array, without initializing it. If you want to initialize, you want the JavaScript to look like this:


baz = [1.0, 2.5];

notice how I no longer use new ArrayList. ArrayList just isn't setup for initialization that I could see, but the above method works.

Anyway, I got all this working fine and dandy here.

When the parser came across something with the word "new\s(\w)" which translates to "new" + whitespace + any word, it would package it all up, what I did was added a check for the array contents, ie. everything inside {} it even worked for 2D arrays and beyond. I would then simply replace the whole thing with the array initialization, and later in the parser it would be changed from {} to []. So, whatever the array was, {{1.2, 2.1}, {7.6, 8.8}} for a 2D array, would just replace all {}'s with []. The problem was, and I didn't notice this until after the patch was submitted, noticed it on the train ride home, was that two arrays can be declared on one line. Sometimes things like this just slip everyone's minds, there are so many ins and outs of a language, and to translate one language to another you have to have good attention to detail. So, something like this:


baz = new float[][] {{1.0, 2.0}, {3.0, 4.0}}; baz2 = new float[][] {{1.0, 2.0}, {3.0, 4.5}};

would break my fix. It would gobble up the whooole thing into one, and the second "new" would get lost, and cause a syntax error. the fix was pretty easy, and I fixed it one the same train I thought of it on. All I had to do was eat all {}'s and everything inside of them until I hit the semi-colon, then stop! the stop is important, and the part I was lacking before. Before I would gobble it all up until I hit the last semi-colon, so, it was greedy.

Here is the fix. Also, I'll be fitting this work into my 0.2 release as it's so very close.

Something else I noticed today (hijacking my own blog post here) working in Processing.js has a pretty big advantage over working in other open source projects. We are a community of developers, so when someone finds a bug, half the time, most of the work in finding the bug is done for us, because the person that found the bug can read the code, and reduce it to a acceptable level of code. But, in a project like Firefox, when a user finds a bug, it might just be a description of what they were doing at the time, and that it crashed. Which is an interesting aspect maybe some of the other members of the processing.js team might not of considered, yet.

0.2

2010-03-19T04:17:00.000-07:00

Intro

This release has been weird. My main, original tickets 230 and 133 for this release were not as expected.

Problems and Challenges

230 already existed, but just didn't have any life, I just needed to breathe some life into it by writing some code to show it works, it was more of a documentation issue. The ticket is still awaiting review. I felt out of place with this one, and still do. I had a lot of fun writing it, and even more fun creating this example, but the fact that my code isn't really going to be added, just, feels weird. What I think would be best, and I'll push for this when the time comes. In the original processing there is a place on their website for hacks, basically, lists features, and shows examples, of things that can be done with processing through the use of java, that was not intended. What could happen in processing.js is sort of the same thing, a place on the website, that documents all the hacks that can be used, through the use of JavaScript inside the processing.js code, and this would be a big job, but something that should probably be done much later, maybe even after 1.0 of processing.js has been released. Until then, I feel like my 230 creation is a lost soul.

My other main ticket, ticket #133 also had issues. In the past I struggled with getting the private keyword to work on member functions, but the way processing.js created member functions, through using an addMember function, caused me issues. I would have to intercept the the addMember function, and create it my way. Although, Dave, was showing a trick in JavaScript, on how to make classes, with members, and it seemed to make a lot of sense. This is the code.



  var counter = (function (){
    var c = arguments[0];
    var i = arguments[1];

    return {
      increase: function(){c+=i;},
      getValue: function(){return c;}
    };
  })(1, 2);

  counter.increase();
  alert(counter.getValue());

  counter.increase();
  alert(counter.getValue());

Also, I have mentioned before, that Corban Brook is working on ticket #237 and talked about restructuring the way classes are parsed. I've been holding off working on ticket #133 prviate keyword because of possible changes.

Specifications

What I did do for 0.2:
The main one, was the example used for 230, and the ticket itself.

I also did three little ones to to supplement this release.
Tickets:

#382

#411

#351

I've done some review of other tickets, and found a ticket that was fixed from my 0.1 that I didn't see. All easy stuff, but it adds up, and still must be done right.

Conclusion

This release has been very different than my last in terms of the work done, and I spent a lot less time trouble shooting, and more time creating tests and examples. I am still finding my groove. Finally, Corban said I could take a stab at ticket #237, I will probably do that and my private keyword at the same time, for my 0.3, and still try to get my regex parser fit in somehow, it shouldn't be a problem as it's really only two tickets, and all related to parsing, stuff I've been doing since the beginning of my stay here :)

Quick little fix

2010-03-16T17:42:00.000-07:00

Yesterday, while cruising the processing.js bug tracking website lightouse looking at the open tickets, and seeing what was happening I can across ticket #382.

It was small so I figured I might as well do it. Throw it in with my 0.2.

I've also started thinking about doing what I did here for string parsing to regular expressions. The first thing that comes to mind is the order in which I must do this. I can mask all strings first, then mask all regular expressions, or vice versa. I would have to replace them in the opposite order in which I mask them, that's a given. I also have to now modify my as I now have to check if a string contains OR , as an example. I think it would be easiest to mask regex first, as I already have the code to check that it's not in a string. So, use that code, find all regex's not in a string, mask them, and any string like code inside the regex will already be gone, so I wouldn't have to check for regex when I mask the strings, and replace again, but in reverse.

Tabs break nothing!

2010-03-14T20:42:00.000-07:00

I mentioned in my last post that I would be taking something on to add to my 0.2, so I did processing.js ticket #351 and wrapped it up the same day. Not bad, but it was easy.

In my last post I talked about how I was able to reproduce the bug, and the next step was to find, where in the code, variables are changed to var. This is what the code in question looked like before I got to it.


    // float foo = 5;
    aCode = aCode.replace(/(?:static\s+)?(?:final\s+)?(\w+)((?:\[\])+| ) *(\w+)\[?\]?(\s*[=,;])/g, function (all, type, arr, name, sep) {
      if (type === "return") {
        return all;
      } else {
        return "var " + name + sep;
      }
    });

What is happening, is it's matching a regular expression to the code to be parsed, sending the matched groups into a function in the order of (all, type, arr, name, sep) the first parameter is always the whole matching string, and each one that follows is the next match group and so on. The function will do something with the sent values, in this case, swapping the variable type for "var " and removing any array brackets. this new string is then replaced with the original matching string.

The problem was, it was only doing this if there was a space between "int i" this is a closer look at the culprit "(\w+)((?:\[\])+| ) *(\w+)" first it matches a word, something like int, char, anything like that, then it look for any number of [] OR a space, then 0 or more spaces, then another word. I simply changed the spaces to \s, which included all whitespace, including tab, and not just a space, resulting in this.


    // float foo = 5;
    aCode = aCode.replace(/(?:static\s+)?(?:final\s+)?(\w+)((?:\[\])+|\s)\s*(\w+)\[?\]?(\s*[=,;])/g, function (all, type, arr, name, sep) {
      if (type === "return") {
        return all;
      } else {
        return "var " + name + sep;
      }
    });

Now when a tab is found between int i; it's not ignored, the parsing of int i; is not ignored.

Back!

2010-03-13T11:44:00.000-08:00

It's been a week since I blogged, but I've been all over the place doing small stuff and getting organized, and there wasn't much to say :P

My 0.2 is due next week and I've got my mouse scroll awaiting review, and here is my post covering that, but I would like to get one more thing pushed out before next week is over.

I have the private keyword that I've been working on in the past, and kinda pushed it to the side in favour of string parsing. I figured I would go back to the private keyword but I noticed Corban Brook was working on this ticket, which may include an overhauling for the way processing.js handles the parsing of classes, which would make the way it handles the private keyword too, hopefully making it easier for me later. This excites me and I'm going to be following it, and pushing the private key word back to 0.3 along with another planned ticket to parse regex content much like I parsed string content.

Anyway, for now, I've decided to take on this one tabs break code. This is a bug that causes the code to crash if a tab is used in a certain place instead of a space. I have reproduced the bug and it seems to only work (the bug works, not the code:P) when there is a tab after a variable type, but before the variable name, like so:


int  anInt = 0;

This does not work, but oddly enough, these example DO work:


 int anInt = 0;
 println  (anInt);

The only place this causes the error (that I have found) is after the variable type and before the variable name. I printed off the translated code, after it's been turned into javascript to see what's going on, and this is the result of the above error:


int  anInt = 0;

and if I take out the tab, I get:


var anInt = 0;

Which works, so obviously, the tab is stopping the conversion of variable names in java like int, to var in javascript. The solution is probably pretty easy, just need to look through the parser, look for the regex that converts variables to vars, and add in a condition for tabs

Study week day 4: something to show

2010-03-04T17:49:00.000-08:00

My five day mission is coming to an end, and I have something to show for it.

In order to view this experiment, you must have a capable browser. I use Minefield. Click this link for more information.

Once inside, you can use the arrow keys to rotate the cubes up and down. Not much else to tell, so here are the examples: example 1 and example 2

A screen shot of example 2 for those currently not with a capable browser.

This gives me an idea though. Have a player that can be moved with the arrow keys, and he moves along this giant cube. You can rotate the cube with the mouse, and there is a 3D randomly generated maze on the cube. As the cube moves gravity would change, so the player (and the maze) wrap around the cube. Finally, add multiplayer.

Study week day 3: Vectors Matrices and Vertices

2010-03-03T17:32:00.000-08:00

In this post, I blindly set out on a mission, a mission that may or may not change, and has changed.

I was going through these tutorials and as helpful as they are, it's just syntax at this point. I am able to modify, through trial and error, and create and move things, the problem is I don't fully understand what's going down. In these three things: Vectors Matrices and Vertices, are giant question marks.

So I've decided to back it up, and get an understanding of how to represent, modify, and move 3D objects.

What I know and understand.

A vertices is a set of three x, y and z axis that create one point (or corner) of a 3D object. x and y axis is left right, top and down, 2D stuff, the z axis is the third dimension.

These are stored in a matrix, which is just a grid of numbers, rows and columns, that hold these vertices, kinda like an array of vertices. example:


1, 0, 0, 0
0, 1, 0, 0
0, 0, 1, 0
0, 0, 0, 1

This is called the identity matrix (correct me if I'm wrong). It's like a null matrix as anything you try to translate it into would end up being the same thing as it was before the translation. I cannot explain it much more as the technical concepts of translation still escapes me, but I know it's used to move the objects axis in a uniform manner, keeping the integrity of the shape, I get the concepts, I just don't know how it all works (yet).

Not sure what the fourth axis is for; I know it should always be a one, and "is needed to transform points this way" I read that it was also not always needed, but helpful. It's a one, so it's not going to be a problem, as one times anything is always the later.

I'm spending time just doing matrix math, and it's fun, and is giving me a better understanding of what's going on, then, I will go back to the code. Really, this matrix math concept is the only thing that's new in what I'm doing, so I'm pretty confident that I'm on the right track with this.

Study week day 2

2010-03-02T16:12:00.000-08:00

After yesterday's post I started on lesson 2. It all made relative sense, and it was pretty small compared to the first one, which is good I think. I have to admit I just flipped through lesson 2, as the colour stuff isn't of huge interest to me yet; I wanted to make it move! Which is where lesson 3 comes in.

Lesson 3 was neat, and repeatedly drawing the scene makes perfect sense to me ;) I've done stuff like that in Java applets, although this is much cleaner implementation of the code. Java has a nasty flicker which you must compensate for. Basically, what happens in java is when you draw the screen, it's drawn as you processing the code, and not all at once. So, say you try and draw six objects on the screen; first clear the screen, then the first object will get drawn, and second, and so on. This causes a flicker for whatever reason. The solution is called a double buffering Basically, you draw each item to an offscreen image, one at a time, then draw the offscreen image to the onscreen image in one shot. With this, I did not have to worry about stuff like that, or I do, and it's been done for me and I will soon find out. Actually, it's probably happening behind the scenes because it's awesome. A quick google out of curiosity came up with this four posts down, someone gives a good simple explanation for how double buffering works in webgl.

really though, the way the lessons have it worked out, it's a lot like drawing with an x, y and z axis; the z axis is the third dimension, and all you have to do is change this axis at set intervals to make something move. Pretty simple!! or this info has been spoon fed to me, either way, I'm liking it!

The basis for what I accomplished today is reading lesson 3, and played with it a bit; changing the axis of the objects to -1, to make it spin the other way, or making it spin on a different axis. All neat stuff but now I think I'm done with lesson 3 and want to get started on lesson 4 where I get to make a true 3D object spin! Like so.

Also, giles, the author of these wonderful tutorials has been on my blog, which kinda proves the usefulness of blogging, for all those naysayers. I must thank him for his service and help in making these tutorials :)

I also feel like I've given myself very little time to do this, 5 days is not enough, so I'll get as much as I can, and pick up the pieces later. Think of it like getting my feet wet, then splashing wildly around in the water, It's chaos! but it's fun.

Thunderbird lab

2010-03-02T11:27:00.000-08:00

I have finished the Thunderbird lab. I need to make the patch and push it still, and I will updated this post with that later tonight.

Basically, I was doing the whole processing of fixing a bug, from start to end.

A few hurdles.

I was able to find the file I needed to edit, the location in that file, and a pretty good idea of what needed to be done, quite quickly. The hard part was reproducing the bug, getting a built version that worked, and getting a result from editing the file.

The first thing was, when I tried to run my built Thunderbird, I would get this:

Two other students: Jianming and Crystal also received this. I think this was simply an error in the branch that was now fixed, as I don't *think* I did anything to fix it, but I tried. I tried using the comm-1.9.1 repo, which allowed me to build and run the program, but was ridden with error pop ups. I tried for awhile to use comm-1.9.1, but I could not seem to reproduce the bug; I thought it could be because of the version I was using. When it comes to experimenting, you need a completely perfect simulation to be sure something is not the problem, and in this case, I could not be sure until I had the same errors in the comm-central build; which wasn't running. So I continued.

I was having problems reproducing the bug. I was just trying to send myself an email, containing an email in the text, and receive it and expect the mail address to be linked, which it was not. I came across something helpful while re reading the instructions about reproducing the bug. It said "try creating a message with the text above, saving it to Drafts, then open in Drafts to see how it gets rendered." Ah, something I did not try. I did this, and I got the links I wanted.

So the bug is now reproduced, now I need to break this area of the code. I already know where and what I have to do, but I'm just going to make sure I'm in the right spot and it's working before I start coding.

I tried simply adding some letters "HAHA" to the end of the "mailto:" string, to see if I'm in the right spot. and it didn't seem to accept the change. I would reload my draft, and it would just be a boring old "mailto:". I was stumped, and was looking wondering why the code I was changing, did not change the program. Usually these simple, but seemingly impossible problems are the silly ones. I was thinking maybe I had two separate directories I was working in, one I was editing, and the other I was building, or something along those lines. I figured it out when I tried to copy and paste a previous draft into a new email, which shouldn't link the mail address, but all of a sudden it was. It hit me, if I change the code, and wanted to see the results, I would have to make a NEW draft, each time, as the draft only uses the code at the time you create it, and not when you view it. I created a new draft, and voila.

I'm in HAHA.
the next step is to code. I had to find a way to check if there were any "." after the @ but not "..". It was already checking for "." inside an if, so I just needed to add an && !string.contains(".."), or something along those lines. It's already using FincChar to find the "." which won't work for me as I need a character string, and not just a character. My answer was google. I googled "nsDependentString" and came up with Find(). Seems logical "FindChar()" for chars, and "Find()" for strings. Anyway, I implemented it, and ran it.

Looks good to me. I'm leaving out the actual code in case another student wants to read this for hints, but if you want help please ask.

Update: The bug and patch is awaiting review, and located here.

Study week day 1

2010-03-01T06:46:00.000-08:00

What's a vertices?

Today I am starting with this tutorial.

First thing, get a browser that can support webGL. I already have one, but if you don't I recommend Minefield. I used it mostly because I had it installed anyway, and it sounds cool. If you don't know what I'm talking about, you should start at tutorial 0.

Anyway, I was going through the code example, and figuring things out along the way. It did some basic stuff like:


<body onload="webGLStart();">

which just loaded the code when it "hit" the body tag.
Inside the body it setup a canvas:


<canvas id="lesson01-canvas" style="border: none;" width="500" height="500">

Then inside the webGLStart(), which was called in the body onload, it got our canvas element:


var canvas = document.getElementById("lesson01-canvas");

I kept on cruising through the code, and got to something I could edit, and see the result!


    var vertices = [
         0.0,  1.0,  0.0,
        -1.0, -1.0,  0.0,
         1.0, -1.0,  0.0
    ];

A vertices is the plural of vertex. Basically the dots that connect the shape, or corners.

By looking at this, I figured out the triangle, and made the top point larger. I was actually looking at it upside down, and still not sure why. Either -1 means down or to the right, and 1 mean up or to the left, or it's flipped later in the code *shrugs* time will tell. See if you can spot the top most point of the triangle, and make it bigger or smaller. Hint: 0, 0, 0 is the center of the triangle.

There was more stuff to setup and a second shape, a square which is the same as the triangle cept it has an extra vertex.

First moment of weakness


gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);

When I first hit this, and at the time of writing this, sentence, I am lost on this one. This | operator, what's it doing. I've never seen this other than c++ bitwise operator, either that, or I'm forgetting something long buried in my head. But as with most thing in javascript, I must trust that they know what they are doing, move along, and the pieces will fall into place when they are ready to. Also, it doesn't seem like a line that I really have to worry about; I just use it, and it does it's thing, for now. This is what the tutorial said about this line "A simple first step: we clear the canvas in preparation for drawing on it." Um, ok, I know what it does, and it sounds pretty simple. It clears the canvas. This must be done once everytime the screen is to be drawn, inside the:


function drawScene() {

This was setup earlier as:


setInterval(drawScene, 15);

These setup a function to be called every 15 intervals, in this case, the function drawScene(), not sure, probably in milliseconds, but as I'm displaying a static none moving image, it could be 15 seconds, but not likely.

Next line... lost again.


perspective(45, 1.0, 0.1, 100.0);

Nvm, it's not as bad as I though. I changed the 45 to 100, and reloaded, and the shapes zoomed out. I'm sure the other three numbers do something just as cool. Weird, I changed the first parameter to 1000 and it flipped the shapes. Something it not what I thought it was. The first parameter is called the field of view. Starting to make sense of it with this "This perspective function is very useful, but is not built into WebGL, so it’s defined as a utility function further up in the code." So, I can see the inner workings of this function and why it's doing things I did not expect. Excellent.

What's a matrices?

Like vertices, matrices is the plural for matrix. It's beyond me right now, but I think it's how you track the movement of a 3D object. Actually, I think it tracks the movements, or path, of an object as it moves, maybe. Anyway, it looks like a grid of numbers, rows and columns. I think that's all I can handle on matrices at this moment, but I'll come back to them as other pieces fall into place.

Making another side of a cube

I decided, with what I've learned, to try and copy and paste bits of the square to make another side of the square. I was able to tilt the one square I had, SO i figured if I drew another square under it, and lined them up, it would look like another side of the square.

Anyway, I played around with the numbers, and settled on this.

I could of probably of documented more, but I went through a lot of iterations while playing, and noticed a lot of what I was doing is still limited because I'm not using shaders, colour, and doing it in a pretty manual way. I am sure there are better ways so I don't want to spend too much time on it. I want to get to the good stuff!

Pay no attention to that man behind the curtain

The rest of what is covered in this tutorial is the use of a few functions used to make everything work. Stuff that can be copied and pasted and used without understanding; I of course must understand it.

Conclusion

This is all the blogging I can handle. I will keep playing with this and get a better understanding of the matrix in general.

Study week project: day 0.5

2010-02-28T18:37:00.000-08:00

This week (starting tomorrow), I'll be going through and learning as much as I can of webGl and 3D programming.

I am doing this because it interests me, and this is the sort of stuff I wanted to learn when I first applied to Seneca. Although, what I have been learning up to this point has been great, and it's all one piece of something valuable, sometimes, it doesn't matter what. A challenge is a challenge.

I will start by going through these tutorials. See how far I get and how long it takes me. I'm not in any rush, and I don't know how far I will end up. I hope to finish up these tutorials and just play around with it a bit. I would like to be able to create a house like object sitting on a flat green surface. I really don't know what I'm getting into, though, so this objective might be too small, or too large, so we'll see. Should be fun.

I skimmed through the tutorials, and they seem to move pretty quick, and it looks like it's mostly the building blocks I will be doing, so that's always good. 15 tutorials total, so obviously if I want to get through this in a week, I must do more than one a day, might be harder than expected *shrugs* The final tutorial has a spinning planet with a reflective water surface. So it's got a moving, 3D shape with a texture, lighting, camera, and reflective surface. Start at the beginning I must.

That is all.

Today's Challenge:

2010-02-26T07:33:00.000-08:00

Today, I am going to see if I can edit what I created in my last post, but this time, when the mouse scrolls, I want the circle in this example to follow a circular track, and not an up and down track. Then before the end of the day, I will post my results.

So far, I believe this is what I must do.

Create a circle of x and y points, and store them in an array instead of drawing them to the screen

Sort the array's points, as I cannot think of a way(yet) to draw a circle in the order it is used.

When the mouse wheel is moved up, go to the next point up in the array if it's not the last one, if it's the last one, go to the first. Same thing but reversed for mouse wheel down.

Update: I have created the circle, and set the point into an unsorted array.
Next: sort it, and apply the "track" to the mouse scroll

Update: To make my life and my computer's life easier, I'm going to just create an arc, and sort the arc, then apply the arc three more times. Kinda like 1/4 of the circle, then must copy and paste it, flipping it, after the arc is sorted.

Update: And challenge complete.

Self reminder: As of this point, when I scroll the mouse, it moves the objects, but it will also scroll the scroll bar in the window, I want to figure out a way to disable this, while still allowing the mouse wheel to scroll the scroll bar when the user wants it.

Mouse scroll wheel hack: update

2010-02-24T16:10:00.000-08:00

Hey.

So I was playing around with my solution, my little mouse wheel hack for processing.js, that I mentioned in my last post. I first was making sure I could get it to work in Firefox, Safari, Opera, and Chrome. It really wasn't all that hard. I also wanted to jazz it up a bit, and use the mouse scroll for something more meaty. This is what I came up with.

In my last example, it was setup to work in all browsers, but it was only being called the Firefox way.

The problem was in this line:


addEventListener('DOMMouseScroll', wheel, false);

Firefox uses 'DOMMouseScroll', Opera, Chrome, and Safari use "mousewheel"

So, after some research, I changed the line to this:


addEventListener(/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)?"DOMMouseScroll":"mousewheel", wheel, false);

What this is doing, is testing the navigator.userAgent for the word Firefox. Obviously, if you're using Firefox, the word will exist in the same spot. There are other less reliable ways to do this, as I found in my researching of this problem. I usually lean towards the solutions that make the most sense to me (obviously :P). The rest of the line just loads the certain string inside a ?: conditional statement.

I'll do some testing and cleaning tomorrow, and if I don't find any bugs, I'll flag it for peer-review.

Mouse scroll wheel hack

2010-02-20T04:22:00.000-08:00

Progress for the mouse wheel feature in processing.js.

This is the hack. They call it a hack, as it was not intended for use with processing. It just so happens that any Java code written in processing works, I believe. So I think all I need to do here is the same thing, add a hack. It's already possible to use the mouse wheel in processing.js, as I show here Note, this only works in Firefox that I know of, it does not work in Chrome or Opera. This is without adding anything to the processing code. Because processing.js uses javascript, any javascript is valid code, so I wrote a simple mouse wheel event in javascript using DOMMouseScroll.

I want to clean up the code in the example, though. That's my next task.

processing.js 0.1 release

2010-02-19T08:46:00.000-08:00

Introduction
I have finished my work for 0.1 as detailed in my project plans here and here

The project wiki: here.

Specifications
my 0.1 release was in time to make it into the 0.5 release of processing.js

I did bug #226 for my 0.1 as well as some automated test cases for the new code I implemented.

What I had to do was protect string content from the procesing.js parser, then test it.

my initial patch: here

second patch: here

Final result: This code was modified to increase speed every so slightly, but every bit counts.


    var strings = aCode.match(/(["'])(\\\1|.)*?(\1)/g);
    for ( var i = 0; /(["'])(\\\1|.)*?(\1)/.test(aCode); i++){
      aCode = aCode.replace(/(["'])(\\\1|.)*?(\1)/, "");
    }

into this.


    var strings = [];
    aCode = aCode.replace(/(["'])(\\\1|.)*?(\1)/g, function(all) {
      strings.push(all);
      return "";
    });

I have to thank Corban Brook for helping me fix the code, and get it out as soon as I did.

Automated tests: here

What I learned

Object orientation in javascript. By seeing Java object oriented code being transformed to JavaScript, I got a good understanding of how JavaScript objects work.

Managing and working with processing.js source code; large code, that was not created by me.

Basic uses of irc. I used ChatZilla and later irssi. I switched so I could use irssi with screen.

Revision control: git and mercurial. I used git to work with processing,js, and mercurial to work with Firefox (to setup js.exe, which I mentioned in this post)

I learned how to build Firefox, and setup a Firefox build enviroment.

I learned some standards for code. Like where to and not to use whitespace.

One of the most important things; I learned the importance of blogs.

I learned there is no such thing as too much testing.

Conclusion
A lot of this is technical stuff that required troubleshooting. I am confident that the next release will be less of a learning process, and I can get deeper into the code.

re initial project plan

2010-02-19T07:58:00.000-08:00

Introduction
Ok, so I'm going to go back to my initial project plan and re assess things.

project wiki: containing basic information of the overall project. I will be updating it more frequently throughout 0.2 and 0.3.

Changes

0.1: Bug #226
While researching my first initial processing.js bug, I noticed when there was a comment // inside a character string, the parser would be happy to remove it, which is only the beginning. If there is ANYTHING inside a string that resembled code or keywords, it would break. the parser would grab the keyword, and change it to javasctipt. For example:
text("int i = 0;", 0, 15);
would then be parsed to:
text("var i = 0;", 0, 15);
After noticing this, I went right to the bug tracking system and found this. The bug I, myself just found. So, I'm going to complete that for my 0.1. I will also implement automated test cases for it.

0.2: Bugs #133 and #230.
These have been bumped to 0.2 from 0.1. I will also do automated test cases for these too.

0.3: TBD.
I hope with the experience I have gained, I can do three bugs, and implement automated test cases for them as well.

Conclusion
I've got down the process involved in doing this, and I hope to start back on 0.2 as soon as possible, Monday at the latest. It's best to start small, and start early. This stuff is not something that, for me, can always be accomplished in one night.

Scott 1 : Firefox 0... 10

2010-02-18T21:20:00.000-08:00

The Problem
Alright, I've been messing around with Firefox as described in two previous posts, here and here. Trying to make new tabs load your homepage.

The Solution
I got a solution that works perfectly (assuming you don't mind alerts popping up while browsing...).

First, a HUGE thanks to Benjamin Huang and his post.

What I did was:
In tabbrowser.xml. Note, my copy is a slightly different version.


            var blank = !aURI || (aURI == "about:blank");

            if ( blank && confirm("would you like to load your homepage?")) {
              aURI = gHomeButton.getHomePage();
              blank = false;
            }

I added a the if statement bellow the var blank statement. This made sense to me as it was an easier way to check everything, then if the page is blank (you don't want the homepage to load when you click on a non new link) it prompts the user to open his/her homepage or not, then set blank to false.

The Conclusion
It's sooooo easy, it just took me time to get there. And honestly, I don't know how long it would of taken me to find gHomeButton.getHomePage() on my own, Benjamin Huang and his post are to thank for that one.

I broke Firefox!

2010-02-18T16:09:00.000-08:00

In my last post I attempted to make a simple change to Firefox. Allow an option to select a new tab to open your home page, or a blank page.

I said what I've accomplished. I've found the spot in the code where a new tab is created, and change it to load anything I wanted based on code hard coded right into the code.

Today, I added a simple confirm box, that asked if you wanted to load your homepage (which at this point was just "google.ca") The box appeared, but the page was no longer loaded. It was not working, so I removed the code I added, and reloaded it again, which broke it more. Now, when I load a new tab, it loads the tab as a blank page with the same address fromthe first page writting in the new tabs address box, and if you chage a new tabs address, and hit enter, the original tab loads that page. I highly doubt this is a desired feature :P.

It's because when you're stuck on a problem, you usually have to learn something new to solve it, but it isn't always what you think it is. For example, first step is to understand the problem, second is to get an idea or some direction for what the solution could be, this is usually an abstract idea of sorts, usually has nothing to do with code, just an idea. Like "If I could do this, or bypass this, it would solve the problem". Then, you research your solution, see if it's already been solved by someone, if not, see how it's done (it's always possible), implement it (this is the coding part (notice how it's only one step in the process (for me anyway))), then debug it. This is assuming your idea or solution is the right one, sometimes it's not, but you still learned loads from dead ends. Anyway, this happens a lot, and can happen in a short period of time, then when you discover an answer, you notice you answered the wrong question. This can break code. You can find later, something you tried that did not work, that you forgot to remove, and it's breaking the code. This is what I think I did. So now, instead of combing through 2000 lines of code trying to get it to a working state, I'm just going to start again with a fresh build (that's good practice too, as I learned that when you first clone Firefox, you can specify the name of the directory it will go in, not a big deal, but it's the little things you learn that are the most fascinating sometimes).

I was recently asked in an interview how I go about solving a problem, and well, I don't feel like I gave a complete answer as I was not prepared and answered it best and honest as I could on the fly, well, that last paragraph was the whole answer :P

I've been stumped on this homepage part, and on my last blog another student has given me a useful like I'm going to poke around in, see what I turn up. Reading code seems to be the most time consuming process right now.

Firefox build 2.0

2010-02-16T17:28:00.000-08:00

In a post which seems like ages ago, I attempted to build Firefox, and, I believe I got it working, and I did, I suppose, but not to my standards.

After what I've learned from working on processing.js and setting up js.exe to use with Javascript, by building Firefox. I needed js.exe to work with javascript right on my box, and setting up a mozilla-build was the easiest way.

I thought this time, I would attempt not only building it again, but attempt some changes. Right now I'm building it to make sure it works under the new build I created for js.exe, then, I'll make some changes (thanks for the push David).

My planned changes are simple (apparently :P ) I plan to add a feature, so when you open a new tab, you get the option to open an about:blank page, or your homepage. I'm pretty sure I know what I need to do, to do this. The step now is to start getting into the code and breaking it, and seeing what I can do :O

I will be back with more later (success/failure) as I plan on pulling an all nighter.

Update:
This Firefox build was more of a success than last time. This time I got Minefiled, which I'm using now to write this post. Last time, I ended up with Namoroka, which was pretty cool too because, and I wouldn't know what it is if I did not stumble upon it.

Update++:
Seriously, it's easier than I thought.

I went though this code, and found the file tabbrowser.xml, then located it on my own box, and just did a simple edit. I added a simple


  alert("hihi");

Inside the area that is used to reload a tab *shrugs* it looked like an easy place to find my change.

Recompiled it, not knowing if it would work, and expecting another 40 minutes compile time. This time, it was done in a matter of minutes, maybe 5 minutes? Anyway, I loaded up the new Firefox.exe and hit reload on a tab, and this was the result!

I know, it's a silly update. But it worked. I think this was the hardest hurdle though, as the rest of it is just editing and playing with code, something I have experience in.

Final update:
I'm editing the "addtab" method in the tabbrowser.xml file with some success. The code is beginning to make sense, just so long as I stick to "addtab". What I've done, after breaking it a few times, is this. I fist editied line 1044 to instead contain (!blank) to (true). I'm just testing here. Anyway, now that I broke the "about:blank" load, I was free to tell it to load any page I wanted, so I tested with a string of "http://www.google.ca" instead of aURI on line 1054, compiled, and reloaded. It worked, no point in a screenshot though as you'll just see a new page of google... but yes, it worked. Every time I made a new tab, I was sent to google. Now, I'm testing the "browser.startup.homepage" property? I think that's what it is, well, that's what I'll call it here in my blog, for now. I must close and finish this update in order to test, and I'll continue tomorrow as it's late, and I must wake up at 5.

finished ticket #226, and back to private

2010-02-13T11:25:00.000-08:00

Alright, I finished and submitted my solution to the processing.js ticket #226, and pushed it into my github repository, which was accepted with some advice, and modifications. I was critiqued, for the first time, on my code style. For example, putting a space before and after a conditional statement, like.


if (foo) {


if(foo){

I even got nabbed for a spelling mistake inside a comment :P

In other words, making sloppy code that works, might work in school, but it won't work in a real project that consumers are not only going to be using, but developers will be maintaining. That is why this OSD class is so great. I know the concepts, I can figure out the syntax, and learn what I need from there for the problem solving. I just didn't know the standards.

Now that that is done, I'm going back to #133. I will have to start from scratch, but I've looked at code in the source that I didn't understand the first attempt, that I understand now after my work with ticket #226. My last post on ticket #133 still works, I can still make private work on variables, but I'm stuck on getting it to work on functions and nested classes. I don't think it will be difficult to implement for inner classes, as it's a variable, but functions are a problem. The way the parser applys functions is with the apply method, and I'm not sure how to tell that to be private. I've thought about bypassing the apply method for private only, or all in general, as I'm not 100% sure why the apply method is being used. For this one, I'm going to have to ponder, and read code for a day or two

knee deep now

2010-02-10T08:57:00.000-08:00

Yesterday was the most frustrating day yet in my submersion of open source, but might of been the best. A lot of good things came from it.

One, I got a new direction on my http://processingjs.org/ bug, bug #226. I'm still going with the mask all strings approach, and then later replace them, like I decided in this post, but the difference is in the implementation. The way fill the array, and mask the string has not changed. For replacing the masks with the strings, before, I was simply going through a for loop, and replacing all matches for <STRING n> using n as the loop index, and replacing that with the string in the index of the array. Like this.


    // replaces all masked strings from  to the appropriate string
    if (strings != null){
      for( var i = 0; l = i < strings.length; i++ ){
        var ex = new RegExp("\<STRING " + i + "\>");
        aCode = aCode.replace(ex, strings[i]);
      }
    }

This worked in the most basic sense, but if someone had a string containing <STRING n>, like I mentioned in the same post I earlier mentioned, it would crash. The solution was, what I thought, regular expressions. I was doing it all in one, and it looked like this.


((((\\\"|\\')|[^'\"])*['\"]((\\\"|\\')|[^'\"])*['\"])*[^'\"]*)

What it's doing is counting all the instances of single or double quotes that do not follow a backslash, then if it was an even number of quotes, it was NOT in a string, odd number of quotes, and I was inside a string, not including escaped quotes.

It technically worked, but I over looked something. It didn't care which kind of quotes I used, so a string this like "'", which is valid, would need to be escaped. It would be expecting "\'". That last one would work, but isn't valid code as the quote being escaped can only be the one used to start the string.

My solution was to look deeper into regular expressions. I looked into some advanced regular expressions and I learned a lot. It was productive, but no code was written. I looked at concepts like attomic grouping, which is not available in JavaScript, but this blog post explains how to emulate atomic grouping in JavaScript. It was interesting. I also found this link, on some advanced regular expression techniques. It was a great read. But, none of these had the answer I was looking for. I asked around, obviously asking my professor David Humphrey first. He gave me some advice, and direction, or redirection. A link and some encouragement.

I'm knee deep in a new solution now, that's a lot more code, but looks very promising already. This is the idea.


        aCode = aCode.replace(new RegExp("(.*)(\<STRING " + i + "\>)(.*)", "g"), function(all, quoteStart, match, quoteEnd){

        });

Inside this function, which is pretty cool by the way, I'll just parse the single "quoteStart" and or "quoteEnd", without regex, and see if "match" is inside a string or not, if it's not, I return the new string, if it is, I return "all".

The inner functions classes are filled based on the order of matches in the regex. So, the first parameter sent is $0, or the whole matched string. Second is $1, which is the first matched pattern, inside the first brackets. etc.

I prefer it this way, it's easier to read and understand than a complex regex, and modular, because it's easier to edit what happens inside the inner function, without breaking the regular expression.

There and back again, and regular expressions are hardcore

2010-02-08T16:10:00.001-08:00

So, I've been thinking about my solution to bug #226, and at one point, I changed my mind on my solution, of masking all strings, and later replacing them based on <STRING n>. I thought of a few possible bugs, mostly the odd chance someone enters <STRING 7> (for example) as a string, and that would be a problem, because the parser would put <STRING 7> into it's array, and mask it with the appropriate mask, then later replace the string, but if it happens to contain a string of a string that has yet to be replaced, the parser would then find that string, replace it. Hmm, hard to explain, but I decided the only solution would be to only replace <STRING n> later, when all the code is replaced, if the <STRING n> is NOT inside a string, and that was kinda what I wanted to avoid in the first place.

So, I figured I should re consider checking all parser regexs to not parse while in a string, like I have to do while replacing <STRING n> with the appropriate strings. The advantage of doing the later, is I don't have to worry about keeping an array of all strings, which might get quite large, but only has to be done once for each time the code is parsed, I believe, which isn't too bad, but not optimal.

I thought more about it (this was while taking my 2 hour bus ride home) and decided against it, so I was back to my original solution. My reasoning: KISS. The original method might not be the fastest, but it's simple, you do it once, and it's done. The other way, might be faster (marginal) and it's situational, but it's a debugging nightmare. Each time someone adds something to the parser, they must remember to check to make sure it's not in a string. I only need to check to make sure it's not in a string once, and no one else has to ever worry about my code, also making it more modular.

The other thing I've been working on: really tweaking the regex for checking for strings. It's not apparent, there were a lot of things I was not considering, and I've been changing and testing various solutions, and right now, this is how it looks.


/(["'])([^"'\\]|\\.)*(\1)/g

Before, I was being greeeedy, things like this test, would muck it all up.


text("Hello World!" + (4 + 5) + "Hello World",50,i+=15);

Now, it was being printed off fine in this case, but any processing that was between the two strings, would NOT get parsed, so I changed it to a non greedy string, and added a few more touches, like using ['"] instead of ('|"), which are pretty much the same, but to me, the first one is simpler, and using back reference on the string type, just because I think it's cleaner that way. Anyway, all for today.

2010-02-07T04:22:00.000-08:00

Yesterday was not the most productive day, I sort of did little bits of work, on and off all day, amongst other things.

I did get something pushed into my repository by following these instructions throughout the day yesterday.

Only two things left to do.


6. Update the LightHouse ticket with your repo information as well as the url's of the tests.
7. Send annasob a pull request using the pull request button.

I've been going through other finished tickets, and looking at the tests they have completed. For example, this test here by Andor Salga is way better than mine, which is a good thing. It's a guide, something for me to shoot for. I've actually noticed a few others using a very similar testing process. Maybe there is a guide on the processing.js lighthouse, and these are the standard tests? This seems like the last step, and there is still a week until release 0.1 is due.

processing.js bug #284 and #226

2010-02-06T15:51:00.000-08:00

I've been doing some Processing.js debugging and testing, for tickets #226 and now #284 because of the close relation.

Originally, I did some tests for removing the comment regex, and these were the results source code. The problem is with the comments, the parser is having problems as it's not expecting a comment. I believe parsing out the comments is the easiest solution.

Here is my solution to both tickets. souce and a test.

What I am doing is first, creating an array that contains all the strings.
Then, masking all the strings, this will also grab any strings inside a comment


    // Saves all strings into an array
    // masks all strings into <STRING n>
    // to be replaced with the array strings later
    var strings = aCode.match(/("|').*("|')/g);
    for ( var i = 0; /("|').*("|')/.test(aCode); i++)
    {
      aCode = aCode.replace(/("|').*("|')/, "<STRING " + i + ">");
    }

Then, I parse away all comments.


    // Remove end-of-line comments
    aCode = aCode.replace(/\/\/.*\n/g, "\n");

Any strings inside a comment do not matter, and any // inside a string have already been converted to .
I then replace all the strings as the final step.


    // replaces all masked strings from <STRING n> to the appropriate string
    if (strings != null){
      for( var i = 0; l = i < strings.length; i++ ){
        var ex = new RegExp("\<STRING " + i + "\>");
        aCode = aCode.replace(ex, strings[i]);
      }
    }

any strings that were removed because of being in a comment, are not replaced, and the program simply skips it.

I'm ready to upload it, and hope I have not missed anything as it's my first time! *fingers crossed*

Update! working tests

2010-02-05T17:13:00.000-08:00

At the end my last post, I mentioned how my program was failing tests due to testing old code with my bug fix, with new code, so my tests were off, anyway, I tested my bug fix for bug #226 with up to date code, and these are the results!

as you can see, the results are the same as the original test, which is great. I learned more by not getting it right the first time! Anyway, I have to double check the quality of my code, comment it, keep it in the appropriate style, and go for pushing it to my repository. I believe I need to put together some files for that, some examples, and show some tests. I am confident though. I am also getting down the system used to do this development, so my next few attempts will go much smoother!

Testing of bug number 226

2010-02-05T14:39:00.000-08:00

After an evening and morning of setting up an environment, my curiosity peaked when I was doing the tests on processing.js, so I decided to go back to my friend bug #226, and run that through some tests. This is the result!

Ah, I consider this interesting, compared to the tests on my blog post from this morning. I have to admit, I was disappointed... but it's all part of the process. One of the obvious errors was strings was == null, and I was trying to access it's length property. This was an easy fix, as I just needed to put the for loop into an if checking to see if strings was != null, like so.


    if (strings != null)
      {
      for( var i = 0; l = i < strings.length; i++ ){
        var ex = new RegExp("\<STRING " + i + "\>");
        aCode = aCode.replace(ex, strings[i]);
      }
    }

I then re ran the test, and there was progress. Here are the results.

As you can see this is considerable progress from last test, but still down from the original test. So I still have work to do. Now I think I should redirect the results from both tests into a file, and see which errors are new, and start working on them.

Update!!

So, I checked, and a lot of these errors I'm getting is simply because of an old build, so I'm adding all the string updates to the new Processing.js. I'll probably post the results into a new post, though, as too many updates in one post, might make it hard for people to follow my progress.

setting up Git and GitHub

2010-02-05T10:12:00.000-08:00

Last night I went onto the Processing.js Lighthouse page, to get the instructions on how to push my code. I'm quite new to this, and am following the instructions, and learning what I'm doing while I do it, usually after making a mistake, then I get it right, then I know what it is I was trying to do :). I think that's normal... I hope it's normal... it's normal for me, and works.

Anyway, I went to these instructions on setting up Git and GitHub, and created a new fork of jeresig's repository into my ownfork. I had some difficulty with some of the instructions setting up Git to connect to GitHub, and it was a silly mistake. It ended up being because I was so tired, as after going to bed, I woke up, and everything was so clear and easy. A good thing too, because I could of easily wasted hours on it. What was happening was, when I tried to connect, I would get an error, because my SSH key was not properly set. The key was right, the file location was wrong, as I didn't let the key go into the default location. The key is used to connect my Git command line, to GitHub, which holds my fork, I believe. Ah, so many new terms :). Anyway, I simply generated a new key with the "ssh-keygen -C “youremailinquotes@com” -t rsa" command, this time leaving all requested fields blank. So I believe the first time I tried, my key was right, it was just looking for it in the wrong place. Which is an easy mistake to over look if you over think things. Some say children are better at solving logic puzzles simply because they don't over think things, or they get more sleep :).

Finally, here I am in the morning, 5:00ish, going through my newly cloned source, trying to get that setup. I figured a good place to start would be checking out the READMEs. So I've bee folloing the README instructions in the test folder, and it's been going quite well. I first had to setup a Mozilla build again, like I did on in my last post, which I wanted to do again anyway, as I made some mistakes last time, and I will understand things better the second time though. It's always good to be able to work on one thing, and get two things done. Last time I built Firefox, I used a tarball, as apposed to cloning a new one. The tarball before worked, but it was confusing, this time, it's been smooth.

I am now making a JavaScript shell, to use to for the test code for Processing.js. It is running as I started this post, and it is now done. So I'm off to do the next step.

Two more things I want to improve on.

Start putting screen shots into my blog.

And post at least two blogs a day, as I didn't get a chance to yesterday.

Or one large, detailed post.

Update, with screen shots! I have a working js.exe, and adding the path to my Processing.js makefile. I know this, because I ran a test "make test" on the processing,js file, this was the result.

I am now doing "make test-parser", will come back with updates.

Ok, ran "make test-parser". I won't bother with the screen shot, as it looks a lot like the last one, cept it has 662 passed, 188 failed, and 850 total. I'm excited to run my code from a few days ago through the tests, but I still have a few more steps in the README.

Next step has to do with converting a processing file into JavaScript. It all made sense to me, cept it wants the processing file to be of type pde, not sure what that is, so I'll go check that out now. Here is an article on pde. There is a spot near the bottom of interest to us.

Processing Development Environment (PDE) (Source Code File) by ProcessingThe Processing Development Environment (PDE) consists of a simple text editor for writing code, It is an open source programming language and environment for people who want to program images, animation, and interactions. When programs are run, they open in a new window called the display window. Software written in PDE and also all Processing projects are called sketches. Each sketch is saved in its own folder. The main program file for each sketch has the same name as the folder and is found inside it. For example, if the sketch is named "Sketch123", the folder for the sketch will be called "Sketch123" and the main file will be called "Sketch123.pde". The PDE file extension stands as an acronym for the Processing Development Environment. This association is classified as Source Code.

I noticed some .pde files already in the processing.js test folder, going to play around with them.

I just ran the command "make test/parser/shiffman-test.js", with success. What happened was, it took the file shiffman-test.pde, which is a processing file, and converted it to javascript, using processing.js. It outputted the new code right in the command line, I was expecting a new file to be saved, but that's no big deal, as I just used "make test/parser/shiffman-test.js > shiffman-test.js". easy enough.

Next step is to go through the workflow link, add my code to the local processing.js file, test it, then submit it if everything is good.

It's quite a learning process getting this all setup for the first time, and I find this class to be one of the more challenging classes. Not that it's harder, just that I'm doing more learning, and challenges. I find the solution is usually quite small, it's just getting there. Ah, I should use the word "new challenges" instead of the usual jump-through-the-same-old-hoops challenges. I'm really enjoying editing and working with code, it's more professional, I'm actually starting my career now, as apposed to before, when I was just doing academic assignments. I don't know if any Seneca faculty are reading this that don't already agree with me, but this class, this OSD600 has been the best fit for me, I highly recommend it to any 4th semester students that can get over the hurdle of making a blog *gasp*, but I would not be able to do it if it wasn't for the steps before. It feels like a long process, but to think, just 5 semesters ago, not much more than a year, I knew nothing about programming! Ok, I'm rambling now.

Firefox build

2010-02-03T16:48:00.000-08:00

Well, after a few problems, Firefox seems to be building fine now. It's been compiling for about twelve minutes, and before my problems all seemed to be early in the build, so I hope I'm out of the woods now.

The hardest part was simply downloading the files I needed to do this. I felt like there was no guide giving step by step instructions all in one place, but parts of guides. And, it seemed all of the parts vary for different machines and versions. It was up to me to learn it, understand it, and make the right choices.

Google was not much help in getting answers to my specific error messages, so what I would end up doing, when I hit a problem I didn't understand, I would go back a step or two, and try again, paying close attention to what is happening, and I may go back more than one step, or in some cases, right back to the beginning until I understand it. Each pass through I knew more and more, and by going back, I could see things with a knowledgeable eye, and stuff just sort of clicked.

Anyway, on to my specific errors and how I solved them. Once I got the commands working understood, I started using the make command, until I figured that out, and my first error was something to do with --enable-application=APP, which made no sense at the time. I was trying things like adding it to the end of the make command, and moving my .mozconfig file around. I read that it was important, and I thought I had it. But, it turned out I had a .mozconfig.mk and .mozconfig.out, which are not the same. I needed to create it myself, and then add the --enable-application-APP command there, so I tried that, still didn't work. I think found some advice on the web, with "ac_add_options --enable-application=browser" thinking I needed ac_add_options before my =APP, still didn't work. So, I tried "ac_add_options --enable-application=browser" without APP and browser instead. And voila, it seems to be going error free. In fact, it's still going, and I think it's going to finish problem free from this point on. If there are any more problems, I'll be back to edit this post, actually, I;ll be back if it works too.

So, it completed with what I think is no errors, although, It took me awhile to figure out how to install it. I found something under the name of Namoroka, which I believe to be it, so I installed it. It installed fine, or what I thought, but it would run, said it was missing Firefox.exe, so I aded that, just out of curiosity, then it wanted a .dll, and it kept going. So eventually I found all the files in one location in the firefox build files, so I just copied it all into the Namoroka folder. It now has no errors, but no program is actually started. Ah well, I think though, that's all I have time for and is a good amount for only an hour (7:38 - 8:48) little more than an hour. Anyway, I have to wake up tomorrow at 5:00 to make it to Java EE on time tomorrow.

parsing indifferent to strings

2010-02-03T11:09:00.000-08:00

I think I have implemented a solution to #226. The problem was seemingly complex, first thing I thought is I would have to keep track of all the parsing, so that it didn't parse a string, but then I thought if I could remove all strings, then replace them later, after the parsing is completed, and that's what I've done. It seems to be working! This is what I did.

At the beginning of the parsing, I run this block of code


    var strings = aCode.match(/".*"/g);
    
    for ( var i = 0; /".*"/.test(aCode); i++)
    {
        aCode = aCode.replace(/".*"/, "<STRING " + i + ">");
    }

This, first, goes through all the code, and grabs all strings, and saves them in an array. Then, I loop through the code, applying in place of the "string". I do this until there is no more "string"'s left.

Then, at the end of the code, after all other parsing has been done, before I return aCode, I reapply all the strings like this


    for( var i = 0; l = i < strings.length; i++ ){
      var ex = new RegExp("\<STRING " + i + "\>");
      aCode = aCode.replace(ex, strings[i]);
    }

This goes through the array of strings, one at a time, until they have all been gone through, each time, applying that string to the proper with n being the index of that string in relation the the array of strings.

I believe this is pretty solid and can be demonstrated here. You should see three alert boxes, displaying messages that would normally be parsed out, then the usual black box of success. Also notice how I put a string inside the comment, to make sure it was able to handle that, as I parse the string before I parse a comment, as to avoid removing some string that happens to contain // in it. I also tested a multi line string, as I was curious, it handles it fine just so long as it's not written like this.


alert("first line
second line");

which to my knowledge, should not work anyway, plus, it's horrible code!

I think I'm done this bug, and I think the next step is to figure out how to submit my code...

good morning

2010-02-03T05:01:00.000-08:00

Alright, so last night I was officially assigned a new ticket, notably the string parsing one I talked about last post.

I have been thinking about how I'm going to do this, and I think I found a solution. I'm going to parse through the whole page with a replace regex, like is frequently done in the process, and replace all strings with <STRING n> where n is a unique, incrementing number, like how when an object is created, its replaced with <CLASS name> temporarily. Then hold all the strings in an array. I will do this before all the parsing begins, and once everything is complete, I will replace all <STRING n>'s with the appropriate string from the array. In this way, I'm masking the strings from the parser. I know the parser can move things around, so I think keeping track of them by a number, than relying on the order in which the strings appear, is a safer way to do it.

I've also still been working on #133. Specifically, trying to get the private word to work on a method. For now I'm stuck on it. I mention the problems in this post, which still stands.

The member keyword still works, and I think is finished, I just now have a bug where if in the Processing code someone assigns a private member inside a method, using something like this


this.num = num;

It will instead make a new var, "replacing" the one I already defined as private, and making this one not private. I'm not sure if this is beyond my scope at this moment, or if it should be tagged as a new, separate ticket. I show this problem here. After clicking through all the alerts, the black screen should NOT load, as I'm trying to call a private variable directly, but it works, because the private variable is being over written by this.num, which in javascript, is how one would make a public variable inside a class.

bugs

2010-02-02T11:03:00.000-08:00

I noticed a bug that was kinda messing with my parse fix from last post, which I was simply checking for all instances of "private this.", which is working, cept if it appears inside a string. I looked through the bug list, and found what I was looking for here. It's a tricky and nasty, but fascinating problem.

Buy anyway, here are some examples on what I have working.

private working this time, for real

2010-02-02T05:41:00.000-08:00

Still working on Processing.js's bug number #133.

In my last post I said I had private working for private variables, but I was wrong. It worked, as it was able to handle the word private, as in not crash, but the variable still was not private. There were a few reasons why this was happening, but mostly I was doing my conversion in the wrong location. I decided to start printing off my html page's processing code, in various stages of conversion, and noticed my old method for converting private, was being converted back again by another part of the code, so I added my conversion to that block of code, this is what it looked like originally.


        // Replace var foo = 0; with this.foo = 0;
        // and force var foo; to become this.foo = null;
        vars
          .replace( /\s*,\s*/g, ";\n  this." ).replace( /\b(var |final |public )+\s*/g, "this." )
          .replace( /\b(var |final |public )+\s*/g, "this." )
          .replace( /this.(\w+);/g, "this.$1 = null;" ) + 
          ( extend ? "extendClass(this, " + extend + ");\n" : "" ) +
          "" + ( typeof last == "string" ? last : name + "(" );

I added one line to the end of the replaces


          .replace(/\b(private this.)/g, "var ") +

It now looks like this.


        // Replace var foo = 0; with this.foo = 0;
        // and force var foo; to become this.foo = null;
        vars
          .replace( /\s*,\s*/g, ";\n  this." ).replace( /\b(var |final |public )+\s*/g, "this." )
          .replace( /\b(var |final |public )+\s*/g, "this." )
          .replace( /this.(\w+);/g, "this.$1 = null;" )
          .replace(/\b(private this.)/g, "var ") + 
          ( extend ? "extendClass(this, " + extend + ");\n" : "" ) +
          "" + ( typeof last == "string" ? last : name + "(" );

What this now does, is after it's done parsing through the variables, if it's going to be private, it'll look like this


private this.i;

So I'm replacing this with.


var i;

Instead of.


this.i;

An apparent problem is if later in the constructor, I'm using something like this


this.num = num;

It will cause problems. It will be trying to use a private member, by declaring it later with this., which in JavaScript, will make it a public method, ignoring the previously set private one. Also, I don't have private methods working, but I have located the location in the code that I have to work with it. It appears it's adding the methods to the object through the use of a created method called addMethod, which I don't understand yet. Here is the implementation and calling of said code.


    p.addMethod = function addMethod( object, name, fn ){
      if( object[ name ] ){
        var args  = fn.length,
            oldfn = object[ name ];
        
        object[ name ] = function(){
          if( arguments.length == args ){
            return fn.apply( this, arguments );
          }else{
            return oldfn.apply( this, arguments );
          }
        };
      }else{
        object[ name ] = fn;
      }
    };

and calling


        // Fix class method names
        // this.collide = function() { ... }
        // and add closing } for with(this) ...
        rest = rest.replace( /(?:public )?Processing.\w+ = function (\w+)\((.*?)\)/g, function( all, name, args ){
          return "ADDMETHOD(this, '" + name + "', function(" + args + ")";
        });

I'm not sure how this is all working, but the second part of code here will change the html processing code, to call the addMethod, I'm pretty sure about this, just not sure how it's doing it.

Finally, I noticed comments are removed only if a space follows the //. This is easy to fix, I'm just trying to find a good reason as to why this is here, or if it's simply been over looked. Like this.


    // Remove end-of-line comments
    aCode = aCode.replace( /\/\/ .*\n/g, "\n" );

As you can see, someone has added a space after the //, is this on purpose? why?

private working

2010-02-01T16:12:00.000-08:00

I was able to use a simple solution on #133. What I did was implement one line of code

aCode = aCode.replace(/(private)/g, "var");

I added this to line 82(about) of the source. This was just to test, but it worked. You can see the implementation here. This is the Processing.js source I am now using.

I just remembered I need to make sure it doesn't parse any character strings with the word private in it. I need to test it for use with private functions, check syntax variations, and debug.

Just noticed the "private" member is not actually private, probably because it's still creating a "this.variable". So in the end it looks like "var this.i;" which, probably is not private as I expect.

Processing.js source code

2010-02-01T13:47:00.001-08:00

Today, Feb 1st, I've been going through the JavaScript source for Processing.js, and I think I've figured out what I have to do, and how I have to do it, I'm just tno sure where.

I'm enabling the private keyword to be usable in Processing.js, bug number #133.

Last post I mentioned how I would just need to use the basis behind the public keyword, that I could just "flip that", whatever that meant... I figured if public is working in Processing.js, the same concepts could be applied to private. Oh, how wrong I was.

What I have to do is, wherever a private variable is declared, I need to change the JavaScript to specify as a var. This link was helpful in refreshing my memory. An example.

private int i; //Java

var i; //JavaScript

I believe this is the concept. I should find where in the source a public variable is converted.

public int i;

to

this.i;

and add a regex that does this feature, but with private.

There are a few things I have not fully thought through, yet, like if a variable is created in java without the use of public, the JavaScript probably finds the int word, and creates this.i anyway, and I don't want to just look for all private and switch it with var, that would leave me with var this.i.

I don't know exactly where in the source this needs to be done, but starting on line 71 there is a var called aCode going through multiple regex's. What this is, is a string containing Java source, being parsed into JavaScript.

// Remove end-of-line comments
aCode = aCode.replace( /\/\/ .*\n/g, "\n" );

I'm going to replace instances of private with a regex in this manner.

I also must consider private functions, so a small check list, of things to consider.

Consider private member functions

Consider private member variables

Consider variations in the syntax

That seems to be all for now, I don't think getting something working is going to take much longer, hopefully it'll be done by Wed night.

emulating the bug, #133

2010-01-31T16:02:00.000-08:00

I've started to tackle the #133 bug, or in this case, a missing feature. The idea is simple. Allow use of the private keyword in Processing.js.

Ah, technically, I don't think this is a bug, but a missing feature.

What I have done.

I setup a simple example, that creates an object that holds a number, and returns the number. It can be viewed here. The black square shows up, which is as expected as I have not broke it yet.

I also setup the same example, this time using the private keyword. This can be found here. I noticed the black canvas does not load, because there is no support for the private keyword.

I've started to go through the processing.js source, and after all this initial setup, I've hit my first real task. Find where, and how, the private keyword must be created or used.

Ok, here is the documentation on the private keyword in processing, note, this is the regular, Java based version, and not the JavaScript one.

And here is the documentation for the private keyword, in the JavaScript version, which works. I figure this would be a great place to start, as I may just need to flip that. Here is a test of the public keyword, working as expected, and this is the processing.js source code that I must work with.

Ah, I think that's enough for this blog post.

setting up Processing.js

2010-01-31T13:18:00.000-08:00

At the end of my last post. I mentioned I was going to start researching the bug, but it was apparent I needed to get Processing.js setup so I could run in off my box, thus able to change the source, and test it. The little test page wasn't going to cut it for very long.

I am going to start by going through this walkthrough and report back in when I got it up and running, hopefully tonight as I have school tomorrow morning, and may not get a chance tomorrow.

Update. It didn't take long at all to go through the example here. and this is what I came up with link. I didn't have any problems, and it's pretty straight forward.

Playing with Processing.js

2010-01-31T08:21:00.000-08:00

My last blog entry, I started my initial project plan.

And today I'm starting the process of learning Processing.js.

get the basics of the syntax

how to run a program in a canvas tag

and understand the basic, mandatory methods used to run a program

Upon going to the Processing.js home page I saw a link at the bottom "Try out some Processing code!". What this is, is a page that you can edit, and immediately view the results of your changes.

First thing I noticed is that it uses setup() and draw(), which seem to be pretty mandatory methods. setup() is pretty self explanatory, sets up the canvas, and is run once as soon as the canvas loads. The second method, draw() is called based on the interval set in frameRate(), which in the default case was set to 20, that's in seconds. So, the example is running at 20 frames per second, or, a better way to put it, it's calling the draw() method 20 times per second.

The first thing I did was change the frames per second to 2, my results were as expected, slow. Next I tried a large number, 99999, and it seemed fast, but not nearly as fast as I expected, so I tried 30, which I believe to be the frame rate used in TV, and it seemed to be as fast as 99999. I later noticed in the frameRate() method, that 60 was default, and if the local machine could not handle whatever is requested, it will simply not be achieved. I tried 30 and 60, and noticed a slight difference. But, obviously not as noticeable of a difference between 1 and 30.

I then noticed in the draw() method, there was background() and random(). I promptly changed the background(50) to background(random(9999), and it did not work well, as expected. There are not 9999 potential colours, and anything over 255 would default to 255. I then played around with stroke() and tried some random colours there too. I found out that stroke sets the colour that is to be used while drawing to the screen.

I also moved the background() method from draw() into setup(), and the results were logical. It didn't remove the old lines, and they kept drawing blue lines to the screen until the screen was blue.

Then removed background() completely, by commenting it out with //. It defaulted to white.

Honestly, with my experience in other programming languages, this languages seems very straight forward and within about an hour I was done playing with it and ready to start researching the bugs I was assigned.

One final not about learning Processing.js, this is a great place to get detailed into on the methods used.

Initial Project Plan

2010-01-29T12:41:00.000-08:00

Porting processing to the canvas.

Processing is an open source programming language intended for programmers and artists to create programs in a visual context. A few links that are a good place to understand what it is.

home page
wikipedia
examples

For this project, I will be working with Processing.js. Basically, allowing Processing programs to be developed, and run directly in HTML, through the use of the HTML canvas tag, retiring Flash and Java applets. This way, users can browse the web, view animation, run games, look at digital art, all without having to download and install any additional plug-ins.

I mentioned a bit about this project on my last blog post. But I have officially accepted it as a project and to sum that up, I am a fan of Java, and java applets, because of how easy it is to distribute digital art through the web, and making that easier excites me not only as a programmer, but also as an artist. Maybe this will bring back my passion for art that has been beaten into submission!

The essence behind what I will be doing is debugging. This is the valuable bug tracking system used for Processing.js.

The processing process

The progress of this project can easily be followed through this blog, under the open source tag. I will be updating the blog atleast once a week, hopefully more with, what I have accomplished, what I have learned, my failures, problems and my goals as I see them. I will also have a wiki page here.

As easy as one, two, three

Over the course of this project, I will be working on three releases, 0.1, 0.2 and 0.3.

Release 0.1 will be to work on two bugs. Bug #133 and #230.
I hope to get both bugs fixed for the 0.1 release.

Release 0.2 and 0.3 will be more bugs to work on.

Debugging bugs

Bugs are something I enjoy, as they are like self contained puzzles. Debugging is not about learning a specific task, and doing that task every time you are presented with the problem that task solves. Debugging is more like a puzzle because it's always different. Once something is solved, it's no longer a puzzle, and the fun has been spoiled. Sure, it can be frustrating, and you never quite know what you're getting into, it could snowball into more than you expected, or it could be one line, or one word of code. It could be a simple matter of =+ instead of =.

If by each release, I have solved the bug's puzzle, I will have been successful in my mission.

The ingredients

In order to accomplish this mission, I will need to heavily refresh my JavaScript skills. It's been about a year since I last worked with it, and that was only an intro. I've been meaning to shake the JavaScript cobwebs out for a long time now, and this is a good way to do that. When I first learned JavaScript, oh so long ago, I used Seneca's INT222 website, and that's where I will start as I work on this project

I will also need to understand Processing. I expect I will be doing most of the Processing heavy learning through these two links.

learning
reference

My knowledge of Java is moderately good, what I know, I know well, what I don't know, I can easily learn as I go from the java api. I always found the java api to be a well documented source for learning java.

I have been in contact with my professor for this project, Prof David Humphrey and he has supplied me with some links to start with. He also has a blog which covers processing beyond what I know. A good place to start.

Collaboration of fellow students

There has been multiple Seneca students, past and present that have been working on this. If I need help, I can start by contacting another student through this blog posting.

It is my hope that by having this blog I will get in contact with others, and we'll see how that goes! This is quite new to me, and I'm taking it one step at a time, moving in bit by bit, chipping away, and getting my feet wet.

Problems of the future and beyond

There is little that I know about this, as I have not even compiled and ran a Processing program yet. I would also need to figure out how to submit my finished work, and have it approved and entered into the collective. One step at a time, starting with research, then reading examples, compiling examples, modifying examples, looking at past bugs and how they were solved, and the compiling and running the bug in question, recreating the bug and seeing it first hand.

January 26th

2010-01-26T19:36:00.000-08:00

Blog time.

Today we talked about our potential project for OSD, and I'm excited about learning the language Processing. It's basically a more creative language for programming media and art. I like it's potential for neat, unique, 3D or 2D, physics, and games.

The project would be transferring the language to be usable inside an html script tag. The task would consist of converting functions written in Java into Javascript. Allowing digital art, media and games to be run in a browser, without the need of applet software being installed. I'm a fan of Java, and java applets, because of how easy it is to distribute digital art through the web, and making that easier excites me not only as a programmer, but also as an artist. Maybe this will bring back my passion for art that has been beaten into submission!

I feel my proficiency in Java is strong, but my proficiency in Javascript is slipping away, and add a new language I don't even know. It's got everything. Keeps me sharp, shakes off the dust, and pushes me into strange new lands.

This is what excites me the most, for now. But I'm up for anything, and any challenge.

This is all for now, up to my knowledge on the subject. If I take the project, I'll be blogging more on it.

I believe I've got to read and listen to some articles this week. Been putting that aside, and then totally ignored it in favour of this blog entry!

week of Jan 18th

2010-01-20T20:16:00.000-08:00

The article on Academic source code dust-up symptom of CS education ills really caught my eye. I've long been a critic of academia, mostly the testing of individual achievement. It's really become a student's focus of school, and it's perhaps the part of school where you do the least learning.

The idea of learning in an open source environment is my white knight, and it's why I'm taking OSD600. I have high hopes, and think the open source course at seneca should mirror the importance of the sys and prj courses.

Often have I mentioned my issues on academia to a prof in a casual discussion, only to hear "that's just how it's done". It's roots run deep. But on the other hand, is it school where we do our learning? or is it at home, on our own where we do our learning? A creative writing student at York university said to me "never let school get in the way of your education" and it's soo true. School only shows us the door, it's up to use to walk through it, and upon exiting, we must write a test on it. Tests have a valuable place, but the final grade portion should be from a large assignment, and a short interview with the prof about the assignment. Tests are best served as a personal marker for the student, the student exits the door, writes the test, and instead of failing or passing, the student can re enter the door, or enter the next door. That's a start, anyway. Another student at OCAD said to me that they only write tests in their history class, and that anything that you learn by doing, or you create something, has no place for a test in memory. Programming is a highly creative skill, we learn by making mistakes, and fixing them, which happens to be a lot more fun than reading a boring textbook. OCAD's solution to the lack of testing, is to interview and critique the student about their final works. If the student cheater and got someone else to create the work, it'll show in the interview no doubt when the student has no clue how to talk about the work. This also gives OCAD the chance to bring in processional art critiques to help the student, making it a positive situatio, with rewards instead of punishments. Is cheating really a big a deal as it seems? Is testing and not sharing really the only options? Not at all. It's safe to say testing and individual assignments are most valuable in the earlier semesters, and later semesters where the students that are still studying, have proven that they are there to learn. Then, roll out the group work, when my group members are more liekly to take it seriously, and at the very least, show up to class

It's true, how in the article it says "it's up to the students to take their learning seriously" what I think he means is it's our job to make the change happen the way we want it to happen.

Finally, not everyone learns the same way, and it's great to have options. Everything has it's place, even horrible students and teachers, it's all a learning experience.

2010-01-14T18:48:00.000-08:00

I'm a little behind on some sort of welcome post, but here it comes anyway. In this blog, I'm going to be blogging on open source, to help me learn about it. My name is Scott Downe, and I'm a 5th semester student at Seneca College, in their computer programming and analysis program.

I'll also use this blog to document my findings as I program in an open source environment.

I never saw myself using a blog, but it's been two days, and I have three posts, so it must not be that bad. I also have a hard time getting into any sort of habit, good or bad. I can do something for as long as it needs to be done, and after that, I tend to move onto other things. So I don't see myself blogging after I have done, what I set out to do, with this blog. So far so good though.

2010-01-14T18:33:00.000-08:00

I just read the New York Times article on Firefox and Google, and I think, after reading this, I hold loyalty, bias, and faith towards Firefox. Mostly, it's the addons I like, something Chrome, to my knowledge, doesn't have yet.

It's also interesting to hear about Google and Mozilla parting ways. Something I have not heard of until this article, or is it New York Times taking something that's not final, and make it sound more dramatic. in this article, it definitely sounded like Mozilla and Google were at war to the same degree as Microsoft, or is it simply that their partnership is shrinking, as Mozilla grows, as it should.

It's interesting though, that sometimes, it's such a small feature that puts someone on the top of a market. When left with two almost identical products, it can come down to one or two little things that decides which one gets picked up by the user, makes the choice easier, and the competition is good for all industries.

2010-01-13T13:48:00.001-08:00

I watched Revolution OS, and I found it to be inspiring. Although I felt a slight bias, especially towards Microsoft. Microsoft isn't the only proprietary software out there. The content was still good, but the way it was presented felt very bias, like the music, and clips of the evil Bill Gates, looking all evil. And then Linus, the father of two, with his cute little kids. Felt like I was watching an election campaign with baby kissing. Although, I can respect the tactics. I particularly liked when Microsoft used the existence of Linux in their defense. And it's a good thing they played that little rock video at the end, and not at the start. I would of been very turned off.

It's amazing what they have accomplished, bigger than Microsoft. Because of the nature of open source, as long as people are writting code, Linux will always be around.

I still prefer Windows as an OS, but I've also never paid for an OS, and never will. If left with the choice of free linux vs paying for windows, I'll take Linux, but free Windows vs free Linux, I take Windows. I have used Linux when it's needed, just on a daily casual basis I find Windows easier to use. And I prefer Apache over Windows Server. But in the end, they are both very usable>

I do on the other hand, hate MS Office. Hate it, I don't think it's usable. at all. and give me Gimp over photoshop anyday. Luckily, Gimp and OpenOffice can both be run on Windows. Oh, and I hate IE. I love Firefox, mostly because of one single addon in NoScript, but all personal decisions come down to one make or break feature. I still wouldn't use IE if it did have NoScript, though.