Abusing JavaScript for fun and profit

What I do www.madpilot.com.au www.88miles.net

JavaScript: A brief history

Developed by Brendan Eich
Mocha: A brief history

At Netscape
LiveScript: A brief history

At Netscape
Around the time Java was added
JavaScript: A brief history

At Netscape
Was implented in IE 3.0
JScript: A brief history

At Netscape
Was implented in IE 3.0
Became an official ECMA standard
ECMAScript: A brief history

Mouseovers
Status bars
Annoying Popups
Get’s a bad name
JavaScript in the 90s 90’s 2000 2002 2004 2006 Today

Microsoft invents
XMLRequest
Make server requests
without refreshing
AJAX 90’s 2000 2002 2004 2006 Today

Move stuff around
Dynamic Menus
Show/hide elements
DHTML and the DOM 90’s 2000 2002 2004 2006 Today

Three browsers – three technologies
Create vector graphics
Think outside the box
Canvas/SVG/VML 90’s 2000 2002 2004 2006 Today

Separate JS from the HTML
Creates Business Logic layer
Unobstrusive JavaScript 90’s 2000 2002 2004 2006 Today

User interface widgets
Frameworks a go-go
Closer to desktop apps
Cool Experiments
We ♥ JavaScript 90’s 2000 2002 2004 2006 Today

How far can HTML CSS and JavaScript be pushed?
Pretty far actually…
We are losing interest…

Make it think it is an
8-bit video console
Fool your browser

Prototype JavaScript Library
XHTML + CSS + Unobtrusive JS
DOM manipulation
JS Events
Our tools

JavaScript supports
classes
Almost supports
inheritance
Create sprite classes
Oh, so classy

Need to create animation loop
setInterval ( interval , function );
Check collisions
Render animations
JS isn’t threaded!
Using timers

Pointless without User Input
Event .observe ( element , event , handler );
Listen to keypress, window load
Create some pseudo events
Input Events

An old game technique
Move background image
… then mask
el.style.backgroundPosition = '0px 0px';
Animation strips

Basic square
Uses vectors
Check distance
And direction
Collision Detection

Fixed view point
Move the background
Capture arrow events (ignore)
Move character – background scrolls
Sideways scrolling

Wrap it all together

by Myles Eftos on Aug 24, 2008