Creating a Sushi Shop Game with Device Scaling - HTML5 Game Development - page 312

7. We then code the long addIngredientToScreen method that displays the added
ingredient on the screen:
var addIngredientToScreen = function(type) {
var isEqualToAnySushi = false;
var sushiName = '';
// loop all receipes
for (var key in game.receipes) {
if (game.receipes.hasOwnProperty(key)) {
isEqualToAnySushi =
game.helper.arrayIsEqual(game.sushiOnHand,
game.receipes[key]);
sushiName = key;
if (isEqualToAnySushi) {
break; // must break the loop to keep the current equal
one.
}
}
}
// UI
// show ingredients or final sushi image?
if (isEqualToAnySushi) {
// show one sushi image instead of individual ingredient.
game.view.clearAllIngredients();
var sushi = document.createElement('div');
sushi.classList.add(sushiName, 'sushi');
others.appendChild(sushi);
} else {
// clone the individual ingredient to sushi board.
var node =
ingredientsNode.querySelector
(".ingredient[data-type="+ type +"]").cloneNode();
if (type === 'rice') {
rices.appendChild(node);
} else if (type === 'seaweed') {
seaweeds.appendChild(node);
} else {
others.appendChild(node);
}
}
};