Software Development

Software Development Elective Resources

This page and its subpages contain the documentation for the Software Development elective at TSA. Students will learn programming by working on an independent game development project. The programming language used in the course is JavaScript, along with a custom game development library created specifically for this elective called tsagame.js. It uses a combination of the HTML5 Canvas for graphics and Box2D for a physics simulation engine.

Any TSA student or teacher can use the custom web-based programming environment by logging in with their e-mail address. The programming environment is located here:

Use “New” to create a new project. All projects are saved automatically as you work. Use the “Run” button to run the project in a new browser tab. The Chrome browser is strongly recommended due to its excellent code inspection tools. Note that you may need to give the browser permission to open pop-up windows.

Useful links:

TSA Game JavaScript Reference — detailed documentation and examples for each feature

TSA Game Resources — table of default graphics and sound resources

Quick Reference

var th = new Thing()

cosmetic elements

th.imagename -- name of image file
th.isflipped -- reverses image (set to true/false)
th.strokecolor -- color of outline
th.fillcolor -- color of filled shape
th.imagetext -- text to be drawn instead of image or shape
th.font -- font to use to draw text
th.iscentered -- set to false for x/y to refer to top-left corner
th.isoverlay -- set to true for a thing that floats above game

physical elements

th.x, th.x -- position
th.z -- depth; 100 is default, higher numbers appear above
th.xvel, th.yvel -- velocity
th.zvel -- angular velocity (degrees per second)
th.width, th.height -- size
th.angle -- rotation in degrees
th.shape -- shape of thing (CIRCLE, BOX or [[x,y], [x,y],...])
th.isfixed -- set to true to fix object in place permanently
th.bounce -- bounciness
th.friction -- coefficient of friction from 0.0 to 1.0
th.density -- mass per square meter
th.slowing -- amount of linear drag
th.spinslowing -- amount of spinning drag
th.isturnable -- set to false if object should never rotate
th.isfast -- set to true if it tunnels through between frames
th.type -- the numbered type (GHOSTTYPE for non-colliding)
th.collidetypes -- list of types it collides with [0, 1, 2, etc]

management elements

th.isdeleted -- deletes thing when set to true

th.pressfunc -- function to call when thing is pressed
th.dragfunc -- function to call as thing is dragged
th.releasefunc -- function to call when thing is released
th.framefunc -- function to call for every frame
th.collidefunc -- function to call when anything else 
    collides with or stops colliding with thing

(example management functions)
function pressthing(thing, x, y) { do stuff }
function dragthing(thing, x, y) { do stuff }
function releasething(thing, x, y) { do stuff }
function thingframe(thing) { draw stuff }
function collidething(thing, otherthing, isTouching) 
    { isTouching is true if colliding }

Thing functions

th.pointat(x, y) -- changes angle to point at a spot
th.velocityat(x, y, speed, force) -- sets velocity 
    to move toward a spot with optional force
th.setvelocity(angle, speed, force) -- sets velocities 
    according to an angle and speed with optional force
th.spin(force) -- impart angular force to thing

th.distanceto(x, y) -- returns distance to a position
th.ontile() -- returns board tile letter thing is touching
th.contains(x, y) -- returns true if point is inside shape
th.isonscreen() -- returns true if thing is on screen

th.weldto(otherthing, x, y, thingx, thingy)
th.springto(otherthing, springiness, x, y, thingx, thingy)
th.axleto(otherthing, x, y, thingx, thingy, minangle, maxangle)

th.dolater(function, timedelay) -- do function after n seconds

Utility functions

game.clear() -- remove all things and map tiles from the game
setgravity(horizontal, vertical) -- meters per second per second

tiletype('letter').imagename = image_file_name
tiletype('letter').type = tile_collision_type
tiletype('letter').shape = tile_collision_shape
tiletype('letter').bounce = tile_bounce
tiletype('letter').friction = tile_friction

setboard(array_of_strings, map_function) -- set the board 
    only after defining tile types
    map_function is "function name(letter, column, row)" 
    for special initialization 

tile(column, row) -- returns board letter

drawline(start_x, start_y, end_x, end_y, color, line_width)
drawcircle(center_x, center_y, radius, color, line_width)

playsound('soundname') -- play a sound effect
playmusic('songname') -- play music loop
stopmusic('songname') -- stop music in progress

randint(low, high) -- return a random integer from low to high
random(low, high) -- return a random value from low to high

game.pressfunc -- called when pressing anywhere (x, y)
game.dragfunc -- called when dragging anywhere (x, y)
game.releasefunc -- called when releasing anywhere (x, y)
game.framefunc -- called every frame
dolater(function, delay)
view.x, view.y -- to scroll the view 
view.width, view.height, view.aspect -- set the view scale 
board.tilesize -- set the size of environment squares