Game Development Reference
In-Depth Information
function setBrick(buttonID) {
if (currentButton) {
currentButton.removeAttr("disabled");
}
currentButton = $("#" + buttonID);
currentButton.attr("disabled", "disabled");
switch (buttonID) {
case "square-brick":
selectedBrickClass = Square;
break;
case "triangle-brick":
selectedBrickClass = Triangle;
break;
case "circle-brick":
selectedBrickClass = Circle;
break;
case "curve-brick":
selectedBrickClass = Curve;
break;
}
}
Don't worry. That looks way more complicated than it actually is. At the top you see we use a global
variable called currentButton . We added it in the beginning to our application.js .
This variable will hold a reference to the currently selected button. On the first click, no button will be
referenced by currentButton , so the if statement is not executed.
After that, we use jQuery to add a disabled attribute to the button; because once you clicked it, you don't
need to click it again. We can easily access the button because we know the id as it's passed via the
function argument.
Now the if statement makes sense, too. When you click another button, you will have to re-enable the
currentButton and disable the new one. Logic cycle, right?
Finally we use a switch statement to differentiate between the different behavior, depending on which
button was clicked. Now we use another global variable we created at the beginning: selectedBrickClass .
We always assign it with the right brick class, depending on the button.
We are almost good to go. Let's go to the createBrickAt(column, row) method and change just one little
thing. Instead of creating a square brick every time, we create a selectedBrickClass because it is only a
reference to the currently selected brick. It will look like this:
function createBrickAt(column, row) {
if (!selectedBrickClass) return;
 
Search WWH ::




Custom Search