# Extending ct.js' events with injections
Injections are a powerful instrument to extend functionality of ct.js framework beyond adding methods or properties. It allows you to add logic to a game loop, load resources, create bundled Types, etc.
injects folder inside your module's directory accepts files with code that will be injected while exporting a game. All of them are optional, and here is a list of all the possible injections:
load.js– fired once when a game's code has loaded, but nothing still happened, e.g. no resources were loaded;
start.js– fired once when all the game's resources have been loaded. No game logic have been run yet.
switch.js– fired each time when a room is switched, but before any other code. Here, a
roomvariable is a name of the new room.
beforeroomoncreate.js— fired before a room is created, but after a camera and renderer are set.
roomoncreate.js– fired after entering a new room. This code is evaluated after user-defined OnCreate code, when all the copies were created. Here,
thisequals to a new room.
roomonleave.js– fired before leaving a room, but before any user's script. Copies still exist here.
onbeforecreate.js— applied to a newly created Copy, before its OnCreate event, but after its type information was applied. Works with bare Copies (copies of no type) as well.
oncreate.js– applied to a newly created Copy, right after its own OnCreate event.
ondestroy.js– applied to a Copy before it gets deleted. This code is called before a Copy's OnDestroy event.
Templating and utilities:
css.css– injects CSS into an exported game.
res.js– called once while parsing loaded images.
resload.js– called once after all the resources were loaded.
types.js– here you can place your own Types.
styles.js– here you can place your own drawing styles.
htmltop.html– this code is placed right before the drawing canvas.
htmlbottom.html– this code is placed right after the drawing canvas.
Each injection can substitute a special label with a value from your settings. If you defined a setting field with a key
enableSockets, then all matches with
/*%enableSockets%*/ in js, css, and html files will be replaced with user's chosen value.
[/*%enableSockets%*/]. This will return either the defined value or
Templating is also supported in your