HTML and CSS Reference
In-Depth Information
Representing the quest composition
In this task, we declare the quest level and then display the level in the quest composiion view.
Prepare for lift off
We will need three more JavaScript files in this task, so let's create them. These files are
as follows:
F
patch.js
: This ile is used for adding methods to exising built-in objects to
enhance convenience
F
composiion.js
: We use this ile for logic that represents the composiion
F
quest.js
: These files represent the data of a quest, including the level and
quest data manipulaing methods
At the end of this task, we should be able to create a composiion of paterns according
to our level. For example, the following quest composiion is composed of four paterns:
a circle, the left and right trapezoid, and lines, as shown in the following screenshot:
Engage thrusters
We put paterns into composiion using the following steps:
1. To start with, in HTML, we want to remove the dummy
gameover
link and the finish
link from the game scene. As we are now puing real content in the game scene,
these two links may affect the placement of our game elements:
<div id="game-scene" class="scene out">
<div id="stage">Stage 1</div>
<div id='quest' class="quest">
<div id="quest-composition"
class="composition"></div>
