Updates: Anonymous Functions, Image Collisions and Rounded Rectangles!

Posted: by Joe under Play My Code Announcements

Since our last update, we’ve been doing more then just playing around with raycasting engines…. This latest release is primarily about bug-fixes, which easily made up more then half of the changes. We also put a lot of effort into optimizing both Play My Code and our Quby language.

We’ve also found time to add a few new features along the way, and here are some of the highlights:

Per-Pixel Image Collision

Sometimes bounding boxes and other shapes aren’t enough, what you really want is pixel-perfect accuracy on a collision check. So, we’ve added the isPixelOverlap method to the Image class, allowing you to check if one image collides with another (on a pixel-by-pixel basis).

    a = new Image( 'a.png' )
    b = new Image( 'b.png' )
    
    if a.isPixelOverlap( aX, aY, b, bX, bY )
        // there is a collision!
    end

A collision is detected if two non-transparent pixels, from each of the two images, overlap each other.

We also implemented a pure bounds version, isOverlap, as an Image friendly version of the ‘isRectOverlap’ function.

    a = new Image( 'a.png' )
    b = new Image( 'b.png' )
    
    if a.isOverlap( aX, aY, b, bX, bY )
        // the images overlap, but it's not pixel perfect
    end

We use our own algorithm which is faster then the common way to implement this. For those working with JavaScript and the canvas, we’re planning to release a blog post later this week going into this in further detail (including code).

It should be noted that per-pixel collision detection has a much greater overhead than bounding box collision, and should only be used when such accuracy is required. For the majority of cases, bounding box collision will be accurate enough.

Rounded Rectangles

We also added two new sets of drawing calls: fillRoundedRect and drawRoundedRect.
They fill, or draw the outline, of rectangles with rounded corners. A nice extra tool for making game building a little bit easier.

Both of these excellent suggestions came from Giorgio in our forum just a few days ago, so if there is something new that you’d like to see added then feel free to post it. We’ve also implemented a few suggestions that have come in via Twitter, and of course you can also use the Feedback form on the top-left of this page if you wish to send feedback anonymously.

Anonymous Functions

You can now create first class functions in Quby, similar to in JavaScript and Ruby. This allows you to wrap up a piece of code and hold it in an object, with the ability to call it later.

The syntax is very similar to defining a function or method, only without the name:

    myFun = def( a, b )
        return a + b*2
    end

The objects are of type Function and you can then call it later using the ‘call’ method, passing in any arguments.

    result = myFun.call([ 1, 4 ])

This is especially useful for building event based systems where you want to be able to hold the actions within an object.

Faster, Faster!

Finally I mentioned at the start that the site is now faster. Some of this work is obvious improvements, such as our CSS and JavaScript being minified on every future deployment. We have also gone through optimizing lots of our CSS styles, reduced the amount of HTML served by the PMC game player, and performed a long list of other small tweaks to further keep the site as lean as possible.

Using Google Page Speed’s benchmarks, some pages now have a score as high as 95 out of 100; up to 20 points higher then they used to receive. However, we will continue optimising to ensure the site, and more importantly your games, run even faster.

Leave a Response

Your email address will not be published. Required fields are marked *