Preview lessons, content and tests

Computer Science & Programming solved. All in one platform.

1. To trial the platform and take tests, please take a few seconds to SIGN UP and SET UP FREE.

2. Searching for something specific? See our text overview of all tests. Scroll right for levels, and lists.

3. Student and Teacher User Guides |  Schemes of Work |   Real Teacher use Videos |


Join 36000+ teachers and students using TTIO.

Coding Part 2 of our game

In this lesson we add some JavaScript to the game enabling jumping capability as well as adding a 'game over' feature, introducing the idea of collision detection. You have a chance to further soak in the implications and applications of the computer coordinate system which is essential for game design. If you are unfamiliar wtih JavaScript you may find you get more of the syntax wrong, resulting in errors, so we do recommend sitting through a JavaScript basics tutorial (although it is not essential). 

Video Lesson 2

Github Repository

To download the code for this lesson, click on the link below, maximise the page. Search for "Code" and select "download zip". Once you extract the zip file, you'll see all the relevant html, css and JavaScript files for this lesson.

https://github.com/gamedesigntestandtrack/battle2.git

Extension challenge

If you're really getting into this and want to explore more complex and advanced game programming with collision detection, check out this video. 

Key Concepts

-JavaScript variables: What is a variable; JavaScript variables

-Writing functions in JavaScript

-setTimeout function

-Collision detection

-setInterval function

-EventListener

-console.log (very useful tool for development and testing - e.g. checking the value of a variable at run time)

-e.keycode and ASCII characters: This is a super cool site that allows you to find out the ASCII value and key code information for any character on your keyboard - https://keycode.info/ This is also a very useful stackoverflow article (question and answers) that shed light on how these work; https://stackoverflow.com/questions/5597060/detecting-arrow-key-presses-in-javascript

www.teachyourselfpython.com