Przeglądaj źródła

now 'audio' and 'language' files are loaded using Fetch API and no longer need phaser to work
(in the process of removing phaser from ifractions)

laira 4 lat temu
rodzic
commit
38eadd22a1
20 zmienionych plików z 595 dodań i 559 usunięć
  1. 24 0
      assets/lang/en_US
  2. 0 26
      assets/lang/en_US.json
  3. 24 0
      assets/lang/es_PE
  4. 0 26
      assets/lang/es_PE.json
  5. 24 0
      assets/lang/fr_FR
  6. 0 26
      assets/lang/fr_FR.json
  7. 24 0
      assets/lang/it_IT
  8. 0 26
      assets/lang/it_IT.json
  9. 24 0
      assets/lang/pt_BR
  10. 0 26
      assets/lang/pt_BR.json
  11. 6 7
      index.html
  12. 16 22
      js/boot.js
  13. 39 39
      js/circleOne.js
  14. 30 30
      js/difficulty.js
  15. 242 186
      js/globals.js
  16. 1 1
      js/map.js
  17. 5 5
      js/menu.js
  18. 15 18
      js/preMenu.js
  19. 50 50
      js/squareOne.js
  20. 71 71
      js/squareTwo.js

+ 24 - 0
assets/lang/en_US

@@ -0,0 +1,24 @@
+loading=LOADING
+title=Fractions
+menu_title=SELECT GAME
+difficulty=Difficulty
+level=Level
+game_menu_title=SELECT OPERATION AND DIFFICULTY
+good_job=Good Job
+retry=Try again
+menu_world=LANGUAGE SELECTION
+menu_list=MAIN MENU
+menu_back=GO BACK
+menu_help=SEE SOLUTION
+circle_name=Circles
+square_name=Quadrangles
+label_name=labels
+mode_name=MODE
+with_name=WITH
+without_name=WITHOUT
+insert_name=ENTER YOUR NAME
+ready=READY
+welcome=Welcome
+error_msg=You should select a smaller portion than it's full size
+empty_name=You forgot to type your name
+audio=AUDIO

+ 0 - 26
assets/lang/en_US.json

@@ -1,26 +0,0 @@
-{
-    "loading": "LOADING",
-    "title": "Fractions",
-    "menu_title": "SELECT GAME",
-    "difficulty": "Difficulty",
-    "level": "Level",
-    "game_menu_title": "SELECT OPERATION AND DIFFICULTY",
-    "good_job": "Good Job",
-    "retry": "Try again",
-    "menu_world": "LANGUAGE SELECTION",
-    "menu_list": "MAIN MENU",
-    "menu_back": "GO BACK",
-    "menu_help": "SEE SOLUTION",
-    "circle_name": "Circles",
-    "square_name": "Quadrangles",
-    "label_name": "labels",
-    "mode_name": "MODE",
-    "with_name": "WITH",
-    "without_name": "WITHOUT",
-    "insert_name": "ENTER YOUR NAME",
-    "ready": "READY",
-    "welcome": "Welcome",
-    "error_msg": "You should select a smaller portion than it's full size",
-    "empty_name": "You forgot to type your name",
-    "audio": "AUDIO"
-}

+ 24 - 0
assets/lang/es_PE

@@ -0,0 +1,24 @@
+loading=CARGANDO
+title=Fracciones
+menu_title=SELECCIONE UN JUEGO
+difficulty=Dificultad
+level=Nivel
+game_menu_title=SELECCIONA LA OPERACION Y DIFICULTAD
+good_job=Bien hecho
+retry=Inténtalo de nuevo
+menu_world=SELECCION DE IDIOMA
+menu_list=MENU PRINCIPAL
+menu_back=REGRESAR
+menu_help=VER SOLUCION
+circle_name=Circulos
+square_name=Cuadrilateros
+label_name=etiquetas
+mode_name=MODO
+with_name=CON
+without_name=SIN
+insert_name=INGRESA TU NOMBRE
+ready=LISTO
+welcome=Hola que tal
+error_msg=Debes seleccionar una porción más pequeña que su tamaño completo
+empty_name=Usted ha olvidado de escribir su nombre
+audio=AUDIO

+ 0 - 26
assets/lang/es_PE.json

@@ -1,26 +0,0 @@
-{
-    "loading": "CARGANDO",
-    "title": "Fracciones",
-    "menu_title": "SELECCIONE UN JUEGO",
-    "difficulty": "Dificultad",
-    "level": "Nivel",
-    "game_menu_title": "SELECCIONA LA OPERACION Y DIFICULTAD",
-    "good_job": "Bien hecho",
-    "retry": "Inténtalo de nuevo",
-    "menu_world": "SELECCION DE IDIOMA",
-    "menu_list": "MENU PRINCIPAL",
-    "menu_back": "REGRESAR",
-    "menu_help": "VER SOLUCION",
-    "circle_name": "Circulos",
-    "square_name": "Cuadrilateros",
-    "label_name": "etiquetas",
-    "mode_name": "MODO",
-    "with_name": "CON",
-    "without_name": "SIN",
-    "insert_name": "INGRESA TU NOMBRE",
-    "ready": "LISTO",
-    "welcome": "Hola que tal",
-    "error_msg": "Debes seleccionar una porción más pequeña que su tamaño completo",
-    "empty_name": "Usted ha olvidado de escribir su nombre",
-    "audio": "AUDIO"
-}

+ 24 - 0
assets/lang/fr_FR

@@ -0,0 +1,24 @@
+loading=CHARGEMENT
+title=Fractions
+menu_title=SÉLECTIONNER UN JEU
+difficulty=Difficulté
+level=Niveau
+game_menu_title=OPERATION SELECT ET DIFFICULTÉ
+good_job=Bon travail
+retry=Réessayer
+menu_world=SÉLECTION DE LA LANGUE
+menu_list=MENU PRINCIPAL
+menu_back=RETOUR
+menu_help=VIEW SOLUTION
+circle_name=Circles
+square_name=Quadrangles
+label_name=étiquettes
+mode_name=MODE
+with_name=AVEC
+without_name=SANS
+insert_name=ENTREZ VOTRE NOM
+ready=PRET
+welcome=Salut
+error_msg=Vous devriez choisir une portion plus petite que sa taille totale
+empty_name=Vous avez oublié de taper votre nom
+audio=AUDIO

+ 0 - 26
assets/lang/fr_FR.json

@@ -1,26 +0,0 @@
-{
-    "loading": "CHARGEMENT",
-    "title": "Fractions",
-    "menu_title": "SÉLECTIONNER UN JEU",
-    "difficulty": "Difficulté",
-    "level": "Niveau",
-    "game_menu_title": "OPERATION SELECT ET DIFFICULTÉ",
-    "good_job": "Bon travail",
-    "retry": "Réessayer",
-    "menu_world": "SÉLECTION DE LA LANGUE",
-    "menu_list": "MENU PRINCIPAL",
-    "menu_back": "RETOUR",
-    "menu_help": "VIEW SOLUTION",
-    "circle_name": "Circles",
-    "square_name": "Quadrangles",
-    "label_name": "étiquettes",
-    "mode_name": "MODE",
-    "with_name": "AVEC",
-    "without_name": "SANS",
-    "insert_name": "ENTREZ VOTRE NOM",
-    "ready": "PRET",
-    "welcome": "Salut",
-    "error_msg": "Vous devriez choisir une portion plus petite que sa taille totale",
-    "empty_name": "Vous avez oublié de taper votre nom",
-    "audio": "AUDIO"
-}

+ 24 - 0
assets/lang/it_IT

@@ -0,0 +1,24 @@
+loading=CARICANDO
+title=Frazioni
+menu_title=SELEZIONA UN GRIOCO
+difficulty=Difficoltá
+level=Livello
+game_menu_title=SELEZIONARE UNA OPERAZIONE E UNA DIFFICOLTÁ
+good_job=Buon lavoro
+retry=Tenta di nuovo
+menu_world=SELEZIONARE IDIOMA
+menu_list=MENÚ PRINCIPALE
+menu_back=INDIETRO
+menu_help=GUARDA SOLUZIONE
+circle_name=Cerchi
+square_name=Quadrilateri
+label_name=legenda
+model_name=MODO
+with_name=CON
+without_name=SENZA
+insert_name=SCRIVI IL TUO NOME
+ready=OK
+welcome=Ciao
+error_msg=Devi scegliere una porzione minore della grandezza totale
+empty_name=Ti sei dimenticato di digitare il tuo nome
+audio=AUDIO

+ 0 - 26
assets/lang/it_IT.json

@@ -1,26 +0,0 @@
-{
-    "loading": "CARICANDO",
-    "title": "Frazioni",
-    "menu_title": "SELEZIONA UN GRIOCO",
-    "difficulty": "Difficoltá",
-    "level": "Livello",
-    "game_menu_title": "SELEZIONARE UNA OPERAZIONE E UNA DIFFICOLTÁ",
-    "good_job": "Buon lavoro",
-    "retry": "Tenta di nuovo",
-    "menu_world": "SELEZIONARE IDIOMA",
-    "menu_list": "MENÚ PRINCIPALE",
-    "menu_back": "INDIETRO",
-    "menu_help": "GUARDA SOLUZIONE",
-    "circle_name": "Cerchi",
-    "square_name": "Quadrilateri",
-    "label_name": "legenda",
-    "model_name": "MODO",
-    "with_name": "CON",
-    "without_name": "SENZA",
-    "insert_name": "SCRIVI IL TUO NOME",
-    "ready": "OK",
-    "welcome": "Ciao",
-    "error_msg": "Devi scegliere una porzione minore della grandezza totale",
-    "empty_name": "Ti sei dimenticato di digitare il tuo nome",
-    "audio": "AUDIO"
-}

+ 24 - 0
assets/lang/pt_BR

@@ -0,0 +1,24 @@
+loading=CARREGANDO
+title=Frações
+menu_title=SELECIONE UM JOGO
+difficulty=Dificuldade
+level=Nível
+game_menu_title=SELECIONAR OPERAÇÃO E DIFICULDADE
+good_job=Bom trabalho
+retry=Tente novamente
+menu_world=SELECIONAR IDIOMA
+menu_list=MENU PRINCIPAL
+menu_back=VOLTAR
+menu_help=VER SOLUÇÃO
+circle_name=Círculos
+square_name=Quadriláteros
+label_name=legendas
+model_name=MODO
+with_name=COM
+without_name=SEM
+insert_name=DIGITE SEU NOME
+ready=PRONTO
+welcome=Olá
+error_msg=Você deve selecionar uma porção menor que o seu tamanho total
+empty_name=Você esqueceu de digitar seu nome
+audio=ÁUDIO

+ 0 - 26
assets/lang/pt_BR.json

@@ -1,26 +0,0 @@
-{
-    "loading": "CARREGANDO",
-    "title": "Frações",
-    "menu_title": "SELECIONE UM JOGO",
-    "difficulty": "Dificuldade",
-    "level": "Nível",
-    "game_menu_title": "SELECIONAR OPERAÇÃO E DIFICULDADE",
-    "good_job": "Bom trabalho",
-    "retry": "Tente novamente",
-    "menu_world": "SELECIONAR IDIOMA",
-    "menu_list": "MENU PRINCIPAL",
-    "menu_back": "VOLTAR",
-    "menu_help": "VER SOLUÇÃO",
-    "circle_name": "Círculos",
-    "square_name": "Quadriláteros",
-    "label_name": "legendas",
-    "model_name": "MODO",
-    "with_name": "COM",
-    "without_name": "SEM",
-    "insert_name": "DIGITE SEU NOME",
-    "ready": "PRONTO",
-    "welcome": "Olá",
-    "error_msg": "Você deve selecionar uma porção menor que o seu tamanho total",
-    "empty_name": "Você esqueceu de digitar seu nome",
-    "audio": "ÁUDIO"
-}

+ 6 - 7
index.html

@@ -4,9 +4,9 @@
 
 <head>
 
-	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
-	<meta name="description" content="Educational game for teaching fractions"/>
-	<meta name="keywords" content="ifractions, fraction, game"/>
+	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+	<meta name="description" content="Educational game for teaching fractions" />
+	<meta name="keywords" content="ifractions, fraction, game" />
 	<link rel="shortcut icon" href="assets/img/scenario/flag.png">
 	<title> iFractions </title>
 	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
@@ -21,7 +21,7 @@
 	<script type="text/javascript" src="js/squareOne.js"></script>
 	<script type="text/javascript" src="js/squareTwo.js"></script>
 	<script type="text/javascript" src="js/globals.js"></script>
-	
+
 	<script type="text/javascript" src="js/boot.js"></script>
 
 	<style>
@@ -42,11 +42,10 @@
 			color: rgb(0, 0, 0);
 			text-align: center;
 		}
-	
-		input:focus{
+
+		input:focus {
 			outline: 3px solid #85accc;
 		}
-	
 	</style>
 
 </head>

+ 16 - 22
js/boot.js

@@ -1,7 +1,7 @@
 // Start phaser
 const game = new Phaser.Game(
-	defaultWidth, 
-	defaultHeight, 
+	defaultWidth,
+	defaultHeight,
 	Phaser.CANVAS,
 	'fractions-game'
 );
@@ -9,10 +9,10 @@ const game = new Phaser.Game(
 // Game state : preload progress bar icon to use while preloading game assets
 
 let loadProgressBar = {
-	preload: function(){ 
-		game.load.image('progressBar', imgsrc+'scenario/pgbar.png');
+	preload: function () {
+		game.load.image('progressBar', imgsrc + 'scenario/pgbar.png');
 	},
-	create: function(){
+	create: function () {
 		game.state.start('loadAssets');
 	}
 };
@@ -21,7 +21,7 @@ let loadProgressBar = {
 
 let loadAssets = {
 
-	preload: function() {
+	preload: function () {
 
 		// Create progress bar
 		const progressBar = game.add.sprite(game.world.centerX, game.world.centerY, 'progressBar');
@@ -34,40 +34,34 @@ let loadAssets = {
 
 		// Loading assets
 
-		for (let i = 0, image = media.boot('image'); i < image.length; i++){
+		loadAudios(media.boot('audio'));
+
+		for (let i = 0, image = media.boot('image'); i < image.length; i++) {
 			game.load.image(image[i][0], image[i][1]);
 		}
 
-		for (let i = 0, sprite = media.boot('spritesheet'); i < sprite.length; i++){
+		for (let i = 0, sprite = media.boot('spritesheet'); i < sprite.length; i++) {
 			game.load.spritesheet(sprite[i][0], sprite[i][1], sprite[i][2], sprite[i][3], sprite[i][4]);
-		}	
-
-		for (let i = 0, audio = media.boot('audio'); i < audio.length; i++){
-			game.load.audio(audio[i][0], audio[i][1][0], audio[i][1][1]);
 		}
-		
+
+
 	},
 
-	create: function(){
+	create: function () {
 
 		// Centers phaser canvas in its containing div
 		game.scaleMode = Phaser.ScaleManager.SHOW_ALL;
 		game.scale.pageAlignHorizontally = true;
 		game.scale.pageAlignVertically = true;
-		
+
 		// Enable phaser Arcade Physics system
 		game.physics.startSystem(Phaser.Physics.ARCADE);
 
-		//loading game sounds
-		beepSound = game.add.audio('sound_beep');   // default feedback sound
-		okSound = game.add.audio('sound_ok');       // correct answer sound
-		errorSound = game.add.audio('sound_error'); // wrong answer sound
-
 		// Calls first screen seen by the player
 		game.state.start('language');
-	
+
 	}
-	
+
 };
 
 // Adding game states

+ 39 - 39
js/circleOne.js

@@ -61,7 +61,7 @@ let gameCircleOne = {
         this.result = false; //Game is correct
         let hasBaseDifficulty = false; //If has level figure
         this.divisorsList = "";
-        
+
         this.DIREC_LEVEL = (sublevelType == 'Minus') ? -1 : 1;    // Will be multiplied to values to easily change kid direction when needed
 
         // GAME VARIABLES
@@ -156,7 +156,7 @@ let gameCircleOne = {
 
             let direction = '';
             let lineColor = '';
-            
+
             if (sublevelType == 'Mixed') {
                 if (i <= this.numPlus) {
                     direction = 'Right';
@@ -197,32 +197,32 @@ let gameCircleOne = {
                     const label = game.add.text(x, 490 - i * this.circleSize, divisor, textStyles.valueLabelBlue1);
                     label.anchor.setTo(0.5, 0.5);
                     this.circleLabel.add(label);
-                
+
                 }
 
             } else {
 
                 const distance = 360 / divisor + 5;
-                
+
                 circle.arc(0, 0, this.circleSize / 2, game.math.degToRad(distance), 0, true);
 
                 this.circleDistance.push(Math.floor(placeDistance / divisor));
                 this.circleAngle.push(distance);
 
                 if (levelLabel) {
-                
+
                     const x = startX + 65 * this.DIREC_LEVEL;
-                
+
                     const label = game.add.text(x, 488 - i * this.circleSize, '1\n' + divisor, textStyles.valueLabelBlue1);
                     label.anchor.setTo(0.5, 0.5);
                     this.circleLabel.add(label);
                     // Sprite that serves as line in the middle of a fraction
                     const fractionLine = game.add.sprite(x, 485 - i * this.circleSize, 'fractionLine');
                     fractionLine.anchor.setTo(0.5, 0.5);
-                    this.fractionLines.add(fractionLine);  
-                    
+                    this.fractionLines.add(fractionLine);
+
                 }
-                
+
             }
 
             if (direction == 'Right') this.endPosition += Math.floor(placeDistance / divisor);
@@ -247,19 +247,19 @@ let gameCircleOne = {
         //Calculate next circle
         if (this.circleDirection[this.curCircle] == 'Right') this.nextEnd = startX + this.circleDistance[this.curCircle];
         else this.nextEnd = startX - this.circleDistance[this.curCircle];
-        
+
 
         //If game is type B, selectiong a random balloon place
         if (levelType == 'B') {
 
             this.balloonPlace = startX;
             this.endIndex = game.rnd.integerInRange(this.numPlus, this.numCircles);
-            
+
             for (let j = 0; j < this.endIndex; j++) {
                 if (this.circleDirection[j] == 'Right') this.balloonPlace += this.circleDistance[j];
                 else if (this.circleDirection[j] == 'Left') this.balloonPlace -= this.circleDistance[j];
             }
-        
+
             if (this.balloonPlace < 66 || this.balloonPlace > 66 + 5 * placeDistance || !hasBaseDifficulty) {
                 game.state.start('gameCircleOne');
             }
@@ -279,7 +279,7 @@ let gameCircleOne = {
 
         this.kid_walk.animations.add('right', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11]);
         this.kid_walk.animations.add('left', [23, 22, 21, 20, 19, 18, 17, 16, 15, 14, 13, 12]);
-        
+
         if (sublevelType == 'Minus') {
             this.kid_walk.animations.play('left', 6, true);
             this.kid_walk.animations.stop();
@@ -331,16 +331,16 @@ let gameCircleOne = {
         if (game.input.activePointer.isDown && !this.animateEnding && !this.hasClicked) {
 
             // Game wont consider click if clicking on navigation icons
-            if (levelType == 'A' && game.input.mousePointer.y > 60) { 
-                    
+            if (levelType == 'A' && game.input.mousePointer.y > 60) {
+
                 this.balloon.x = game.input.mousePointer.x;
                 this.basket.x = game.input.mousePointer.x;
 
                 // Balloon is completely visible
                 this.balloon.alpha = 1;
-                
-                if (audioStatus) beepSound.play();
-                
+
+                if (audioStatus) sound.beepSound.play();
+
                 // Turn on kid animation
                 if (this.circleDirection[this.curCircle] == 'Right') {
                     this.kid_walk.animations.play('right', 6, true);
@@ -349,7 +349,7 @@ let gameCircleOne = {
                 }
 
                 //Hiding labels
-                if (levelLabel) { 
+                if (levelLabel) {
                     this.circleLabel.visible = false;
                     this.fractionLines.visible = false;
                 }
@@ -358,7 +358,7 @@ let gameCircleOne = {
                 this.animate = true;
 
             }
-            
+
         }
 
         // while player not clicked : track mouse to move baloon according to its position
@@ -386,7 +386,7 @@ let gameCircleOne = {
             this.trace.rect(this.kid_walk.x, 526, 2, 2, color);
 
             //Moving every circle
-            for (let i = 0; i < this.numCircles; i++) { 
+            for (let i = 0; i < this.numCircles; i++) {
                 if (this.circleDirection[this.curCircle] == 'Right') this.circles.children[i].x += 2;
                 else this.circles.children[i].x -= 2;
             }
@@ -398,8 +398,8 @@ let gameCircleOne = {
             this.circles.children[this.curCircle].arc(0, 0, this.circleSize / 2, game.math.degToRad(this.circleAngle[this.curCircle]), 0, true);
             this.circles.children[this.curCircle].endFill();
 
-            if ( (this.circleDirection[this.curCircle] == 'Right' && this.circles.children[this.curCircle].x >= this.nextEnd) ||
-            (this.circleDirection[this.curCircle] == 'Left' && this.circles.children[this.curCircle].x <= this.nextEnd)
+            if ((this.circleDirection[this.curCircle] == 'Right' && this.circles.children[this.curCircle].x >= this.nextEnd) ||
+                (this.circleDirection[this.curCircle] == 'Left' && this.circles.children[this.curCircle].x <= this.nextEnd)
             ) {
 
                 this.circles.children[this.curCircle].visible = false;
@@ -427,16 +427,16 @@ let gameCircleOne = {
         if (this.checkAnswer) {
 
             this.kid_walk.animations.stop();
-            
+
             this.timer.stop();
-            
+
             if (this.func_checkOverlap(this.basket, this.kid_walk)) {
 
                 this.kid_walk.frame = (this.kid_walk.frame < 12) ? 24 : 25;
 
                 this.result = true;
 
-                if (audioStatus) okSound.play();
+                if (audioStatus) sound.okSound.play();
 
                 this.okImg.visible = true;
 
@@ -447,17 +447,17 @@ let gameCircleOne = {
 
                 this.result = false;
 
-                if (audioStatus) errorSound.play();
-            
+                if (audioStatus) sound.errorSound.play();
+
                 this.errorImg.visible = true;
-            
+
             }
 
             this.func_postScore();
 
             this.animateEnding = true;
             this.checkAnswer = false;
-        
+
         }
 
         // balloon flying animation
@@ -473,9 +473,9 @@ let gameCircleOne = {
 
                 if (this.result) mapCanMove = true;
                 else mapCanMove = false;
-                
+
                 game.state.start('map');
-            
+
             }
         }
 
@@ -494,7 +494,7 @@ let gameCircleOne = {
 
     // in levelType 'B'
     func_outCircle: function () {
-        
+
         if (!self.hasClicked) {
             for (let i = 0; i <= this.index; i++) {
                 self.circles.children[i].alpha = 0.5;
@@ -527,8 +527,8 @@ let gameCircleOne = {
 
             self.balloon.alpha = 1;
 
-            if (audioStatus) beepSound.play();
-            
+            if (audioStatus) sound.beepSound.play();
+
             if (self.circleDirection[self.curCircle] == 'Right') {
                 self.kid_walk.animations.play('right', 6, true);
             } else {
@@ -542,7 +542,7 @@ let gameCircleOne = {
 
             self.hasClicked = true;
             self.animate = true;
-            
+
         }
 
     },
@@ -555,8 +555,8 @@ let gameCircleOne = {
             self.basket.x = game.input.x;
 
             self.balloon.alpha = 1;
-            
-            if (audioStatus) beepSound.play();
+
+            if (audioStatus) sound.beepSound.play();
 
             if (self.circleDirection[self.curCircle] == 'Right') {
                 self.kid_walk.animations.play('right', 6, true);
@@ -571,7 +571,7 @@ let gameCircleOne = {
 
             self.hasClicked = true;
             self.animate = true;
-            
+
         }
 
     },

+ 30 - 30
js/difficulty.js

@@ -1,36 +1,36 @@
 /*
     let difficultyState = {
         preload: function(){},
-		create: function(){},
+        create: function(){},
         ---------------------------- end of phaser functions
         func_loadMap: function()
         func_setLabel: function()
-	};
+    };
 */
 
 // DIFFICULTY SCREEN: player can select (I) sublevel type, (II) game difficulty and (III) turn on/off fractions labels
 let difficultyState = {
 
-    preload: function() {
-        
+    preload: function () {
+
         let curMedia;
 
-        switch(currentGameState){
+        switch (currentGameState) {
             case 'gameSquareOne': curMedia = media.gameSquareOne; break;
             case 'gameSquareTwo': curMedia = media.gameSquareTwo; break;
             case 'gameCircleOne': curMedia = media.gameCircleOne; break;
         }
 
-        for (let i = 0, image = curMedia('image'); i < image.length; i++){
+        for (let i = 0, image = curMedia('image'); i < image.length; i++) {
             game.load.image(image[i][0], image[i][1]);
-		}
-		for (let i = 0, sprite = curMedia('spritesheet'); i < sprite.length; i++){
+        }
+        for (let i = 0, sprite = curMedia('spritesheet'); i < sprite.length; i++) {
             game.load.spritesheet(sprite[i][0], sprite[i][1], sprite[i][2], sprite[i][3], sprite[i][4]);
-		}	
-		for (let i = 0, audio = curMedia('audio'); i < audio.length; i++){
+        }
+        for (let i = 0, audio = curMedia('audio'); i < audio.length; i++) {
             game.load.audio(audio[i][0], audio[i][1][0], audio[i][1][1]);
         }
-        
+
     },
 
     create: function () {
@@ -48,7 +48,7 @@ let difficultyState = {
 
         // TURN LABEL ON/OFF ICON
 
-        if ( currentGameState != 'gameSquareTwo') {
+        if (currentGameState != 'gameSquareTwo') {
             // Text : 'with/without' labeling the fractions
             let labelText = game.add.text(game.world.centerX - 110, 80, "", textStyles.subtitle2);
             labelText.text = levelLabel ? lang.with_name + " " + lang.label_name : lang.without_name + " " + lang.label_name;
@@ -74,7 +74,7 @@ let difficultyState = {
         let maxSublevel;
         let maxDifficulty;
 
-        switch(currentGameState) {
+        switch (currentGameState) {
             case "gameSquareOne":
                 stairHeight = 40;
                 stairWidth = 100;
@@ -83,7 +83,7 @@ let difficultyState = {
                 startShape = (startTheme / 2) + startStair + stairWidth * 3;
                 maxSublevel = 2;
                 maxDifficulty = 3;
-            break;
+                break;
             case "gameSquareTwo":
             case "gameCircleOne":
                 stairHeight = 29;
@@ -93,7 +93,7 @@ let difficultyState = {
                 startShape = (startTheme / 2) + startStair + stairWidth * 5;
                 maxSublevel = 3;
                 maxDifficulty = 5;
-            break;
+                break;
             default: if (debugMode) console.log("Error! Name of the game state is not valid!");
         }
 
@@ -104,10 +104,10 @@ let difficultyState = {
         let stairs = [];
 
         const aux = {
-            maxSublevel:    null,
-            maxDifficulty:  null,
-            color:      [colors.diffBlue, colors.diffRed, colors.diffPurple],
-            base_y1:    [135, 285, 435],
+            maxSublevel: null,
+            maxDifficulty: null,
+            color: [colors.diffBlue, colors.diffRed, colors.diffPurple],
+            base_y1: [135, 285, 435],
             sublevel_1: ['Plus', 'Minus', 'Mixed'],
             sublevel_2: ['A', 'B', 'C'],
             get sublevel() {
@@ -160,7 +160,7 @@ let difficultyState = {
                 arrowIcons[1].anchor.setTo(0.5, 0.5);
                 arrowIcons[1].scale.x *= -1;
 
-            break;
+                break;
             case "gameCircleOne":
 
                 // Blue Circle
@@ -218,14 +218,14 @@ let difficultyState = {
                 arrowIcons[2].alpha = 0.8;
                 arrowIcons[2].anchor.setTo(0.5, 0.5);
 
-            break;
+                break;
             case "gameSquareTwo":
 
                 themeIcons[0] = game.add.sprite(startTheme, 370, 'equal');
                 themeIcons[0].scale.setTo(0.7);
                 themeIcons[0].anchor.setTo(0.5, 0.5);
 
-            break;
+                break;
             default: if (debugMode) console.log("Error: couldn't finish loading difficulty screen assets");
 
         }
@@ -263,7 +263,7 @@ let difficultyState = {
     // Calls map state
     func_loadMap: function () {
 
-        if (audioStatus) beepSound.play();
+        if (audioStatus) sound.beepSound.play();
 
         mapPosition = 0;   //Map position
         mapCanMove = true;       //Move no next point
@@ -278,20 +278,20 @@ let difficultyState = {
     func_setLabel: function () {
 
         if (levelLabel) {
-        
+
             levelLabel = false;
             this.selectionBox.frame = 0;
             this.labelText.text = lang.without_name + " " + lang.label_name;
-        
+
         } else {
-        
+
             levelLabel = true;
             this.selectionBox.frame = 1;
             this.labelText.text = lang.with_name + " " + lang.label_name;
-        
+
         }
-        
-        if (audioStatus) beepSound.play();
-    
+
+        if (audioStatus) sound.beepSound.play();
+
     }
 };

+ 242 - 186
js/globals.js

@@ -5,8 +5,10 @@ const defaultHeight = 600;
 const debugMode = false; 	// Turns console messages ON/OFF
 let audioStatus = false; 	// Turns game audio ON/OFF
 
-let lang, langString; 		// Object and String that contain the selected language
 let playerName;
+let langString; 			// String that contains the selected language
+let lang = {};
+let sound = {};
 
 let levelLabel = true; 		// Turns explicitly showing the fractions in levels ON/OFF
 
@@ -31,191 +33,189 @@ let levelType;
  * in squareTwo     levels can be: 'A', 'B' or 'C' */
 let sublevelType;
 
-let beepSound, okSound, errorSound; // output game sounds
-
 let timer, totalTime; // Counts time spent in each game
 
 const hip = "143.107.45.11"; // Host ip
 
 // Colors available
 const colors = {
-    // used in text
-	green: "#00804d",
-	darkRed: "#330000",
-    blue: "#003cb3",
-    mediumBlue: "#000080",
-	black: "#000000",
+	// used in text
+	green: 		"#00804d",
+	darkRed: 	"#330000",
+	blue: 		"#003cb3",
+	mediumBlue: "#000080",
+	black: 		"#000000",
 	almostWhite: "#f0f5f5",
 	// difficulty stairs
-	diffBlue: "0x99b3ff",
-	diffRed: "0xff6666",
+	diffBlue: 	"0x99b3ff",
+	diffRed: 	"0xff6666",
 	diffPurple: "0xb366ff",
 	// Background color
-	blueBckg: 0xcce5ff, // default 
-	blueBckgLevel: 0xa8c0e6, // in gameSquareOne (used for floor gap)
+	blueBckg: 		0xcce5ff, // default 
+	blueBckgLevel: 	0xa8c0e6, // in gameSquareOne (used for floor gap)
 	// ok button in name State
-	teal: 0x3d5c5c, 
+	teal:			0x3d5c5c,
 	// difficulty symbols and game color identifier 
-	darkBlue: 0x31314e,
-	red: 0xb30000,
-	lightBlue: 0xefeff5,
+	darkBlue: 		0x31314e,
+	red: 			0xb30000,
+	lightBlue: 		0xefeff5,
 	// gameSquareTwo
-	darkRed_: 0x330000,
-	lightRed: 0xd27979,
-	lighterRed: 0xf2d9d9,
-	darkGreen: 0x1e2f2f,
-	lightGreen: 0x83afaf,
-	lighterGreen: 0xe0ebeb,
+	darkRed_: 		0x330000,
+	lightRed: 		0xd27979,
+	lighterRed: 	0xf2d9d9,
+	darkGreen: 		0x1e2f2f,
+	lightGreen: 	0x83afaf,
+	lighterGreen: 	0xe0ebeb,
 };
 
 // Text styles available
 const textStyles = {
 
 	// titles
-    title1: { font: "32px Arial", fill: colors.green, align: "center" },
+	title1: { font: "32px Arial", fill: colors.green, align: "center" },
 	title2: { font: "27px Arial", fill: colors.green, align: "center" },
 
 	overtitle: { font: "20px Arial", fill: colors.darkRed, align: "center" },
 
-    subtitle1: { font: "27px Arial", fill: colors.blue, align: "center" },
-    subtitle2: { font: "27px Arial", fill: colors.black, align: "center" },
-	
+	subtitle1: { font: "27px Arial", fill: colors.blue, align: "center" },
+	subtitle2: { font: "27px Arial", fill: colors.black, align: "center" },
+
 	// button labels
-    buttonLabel: { font: '34px Arial', fill: colors.almostWhite, align: 'center' },
-    difficultyLabel: { font: '25px Arial', fill: colors.almostWhite, align: 'center' },
+	buttonLabel: { font: '34px Arial', fill: colors.almostWhite, align: 'center' },
+	difficultyLabel: { font: '25px Arial', fill: colors.almostWhite, align: 'center' },
 	// in game labels
 	valueLabelBlue1: { font: '26px Arial', fill: colors.mediumBlue, align: 'center' },
-    valueLabelBlue2: { font: '20px Arial', fill: colors.mediumBlue, align: 'center' }, // numbers in gameSquareTwo
-    valueLabelBlue3: { font: '15px Arial', fill: colors.mediumBlue, align: 'center' }, // fractions numbers in gameSquareOne
+	valueLabelBlue2: { font: '20px Arial', fill: colors.mediumBlue, align: 'center' }, // numbers in gameSquareTwo
+	valueLabelBlue3: { font: '15px Arial', fill: colors.mediumBlue, align: 'center' }, // fractions numbers in gameSquareOne
 
 };
 
 // images, spritesheets and audio files
 const media = {
 
-	boot : function ( type ) {
+	boot: function (type) {
 		image = [
 			// scenario
-			['birch', 	imgsrc+'scenario/birch.png'],
-			['bgimage', imgsrc+'scenario/bg.jpg'],
-			['bgmap', 	imgsrc+'scenario/bg_map.png'],
-			['cloud', 	imgsrc+'scenario/cloud.png'],
-			['floor',	imgsrc+'scenario/floor.png'],
-			['place_a', imgsrc+'scenario/place_a.png'],
-			['place_b', imgsrc+'scenario/place_b.png'],
-			['rock', 	imgsrc+'scenario/rock.png'],
-			['road', 	imgsrc+'scenario/road.png'],
-			['sign',	imgsrc+'scenario/sign.png'],
-			['tree1', 	imgsrc+'scenario/tree.png'],
-			['tree2', 	imgsrc+'scenario/tree2.png'],
-			['tree3', 	imgsrc+'scenario/tree3.png'],
-			['tree4', 	imgsrc+'scenario/tree4.png'],
+			['birch',	imgsrc + 'scenario/birch.png'],
+			['bgimage', imgsrc + 'scenario/bg.jpg'],
+			['bgmap',	imgsrc + 'scenario/bg_map.png'],
+			['cloud', 	imgsrc + 'scenario/cloud.png'],
+			['floor', 	imgsrc + 'scenario/floor.png'],
+			['place_a', imgsrc + 'scenario/place_a.png'],
+			['place_b', imgsrc + 'scenario/place_b.png'],
+			['rock', 	imgsrc + 'scenario/rock.png'],
+			['road', 	imgsrc + 'scenario/road.png'],
+			['sign', 	imgsrc + 'scenario/sign.png'],
+			['tree1', 	imgsrc + 'scenario/tree.png'],
+			['tree2', 	imgsrc + 'scenario/tree2.png'],
+			['tree3', 	imgsrc + 'scenario/tree3.png'],
+			['tree4', 	imgsrc + 'scenario/tree4.png'],
 			// flags
-			['flag_BR', imgsrc+'flag/BRAZ.jpg'], 
-			['flag_FR', imgsrc+'flag/FRAN.jpg'], 
-			['flag_IT',	imgsrc+'flag/ITAL.png'],
-			['flag_PE', imgsrc+'flag/PERU.jpg'], 
-			['flag_US', imgsrc+'flag/UNST.jpg'], 
+			['flag_BR', imgsrc + 'flag/BRAZ.jpg'],
+			['flag_FR', imgsrc + 'flag/FRAN.jpg'],
+			['flag_IT', imgsrc + 'flag/ITAL.png'],
+			['flag_PE', imgsrc + 'flag/PERU.jpg'],
+			['flag_US', imgsrc + 'flag/UNST.jpg'],
 			// Navigation icons on the top of the page
-			['back', 	imgsrc+'navIcon/back.png'],
-			['block', 	imgsrc+'navIcon/block.png'],
-			['help', 	imgsrc+'navIcon/help.png'],
-			['home', 	imgsrc+'navIcon/home.png'],
-			['world', 	imgsrc+'navIcon/language.png'],
-			['list', 	imgsrc+'navIcon/menu.png'],
-			['pgbar', 	imgsrc+'navIcon/progressBar.png'],
+			['back', 	imgsrc + 'navIcon/back.png'],
+			['block', 	imgsrc + 'navIcon/block.png'],
+			['help',	imgsrc + 'navIcon/help.png'],
+			['home', 	imgsrc + 'navIcon/home.png'],
+			['world', 	imgsrc + 'navIcon/language.png'],
+			['list', 	imgsrc + 'navIcon/menu.png'],
+			['pgbar', 	imgsrc + 'navIcon/progressBar.png'],
 			// mathematical operators 
-			['equal', 		imgsrc+'operator/equal.png'],
-			['fractionLine',	imgsrc+'operator/fractionLine.png'],
+			['equal', 			imgsrc + 'operator/equal.png'],
+			['fractionLine', 	imgsrc + 'operator/fractionLine.png'],
 			//feedback options 
-			['h_arrow', 	imgsrc+'help/arrow.png'],
-			['h_double', 	imgsrc+'help/double.png'],
-			['down', 		imgsrc+'help/down.png'],
-			['h_error', 	imgsrc+'help/error.png'],
-			['h_ok', 		imgsrc+'help/ok.png'],
-			['pointer', 	imgsrc+'help/pointer.png'],						
+			['h_arrow', 	imgsrc + 'help/arrow.png'],
+			['h_double', 	imgsrc + 'help/double.png'],
+			['down', 		imgsrc + 'help/down.png'],
+			['h_error', 	imgsrc + 'help/error.png'],
+			['h_ok', 		imgsrc + 'help/ok.png'],
+			['pointer', 	imgsrc + 'help/pointer.png'],
 		];
 		spritesheet = [
 			// Game Sprites
-			['kid_walk', imgsrc+'character/kid/walk.png', 78, 175, 26],
+			['kid_walk', imgsrc + 'character/kid/walk.png', 78, 175, 26],
 			// Menu icons n the top of the page
-			['audio',	imgsrc+'navIcon/audio_48x48.png',48, 48, 2],
+			['audio', 	imgsrc + 'navIcon/audio_48x48.png', 48, 48, 2],
 			// feedback options 
-			['select',	imgsrc+'help/selectionBox.png', 310, 310, 2],
+			['select', 	imgsrc + 'help/selectionBox.png', 310, 310, 2],
 		];
 		audio = [
 			// Sound effects
-			['sound_beep', 	['assets/audio/beep.ogg', 'assets/audio/beep.mp3'] ],
-			['sound_error', ['assets/audio/error.ogg', 'assets/audio/error.mp3'] ],
-			['sound_ok', 	['assets/audio/ok.ogg', 'assets/audio/ok.mp3'] ],
+			['beepSound', ['/Ifractions-web/assets/audio/beep.ogg', '/Ifractions-web/assets/audio/beep.mp3']],
+			['okSound', ['/Ifractions-web/assets/audio/ok.ogg', '/Ifractions-web/assets/audio/ok.mp3']],
+			['errorSound', ['/Ifractions-web/assets/audio/error.ogg', '/Ifractions-web/assets/audio/error.mp3']],
 		];
 		return media.returnType(type);
 	},
 
-	gameSquareOne : function ( type ){
+	gameSquareOne: function (type) {
 		image = [
 			// scenario
-			['farm', 	imgsrc+'scenario/farm.png'],
-			['garage', 	imgsrc+'scenario/garage.png'],
+			['farm', 	imgsrc + 'scenario/farm.png'],
+			['garage', 	imgsrc + 'scenario/garage.png'],
 		];
 		spritesheet = [
 			// Game sprites
-			['tractor', 	imgsrc+'character/tractor/frame.png', 201, 144, 10]	
+			['tractor', imgsrc + 'character/tractor/frame.png', 201, 144, 10]
 		];
 		audio = [];
 		return media.returnType(type);
 	},
 
-	gameSquareTwo : function ( type ){
+	gameSquareTwo: function (type) {
 		image = [
 			// scenario
-			['house', 	imgsrc+'scenario/house.png'],
-			['school', 	imgsrc+'scenario/school.png'],
+			['house', 	imgsrc + 'scenario/house.png'],
+			['school', 	imgsrc + 'scenario/school.png'],
 		];
 		spritesheet = [
-			['kid_lost', 	imgsrc+'character/kid/lost.png', 72, 170, 6],
-			['kid_run',		imgsrc+'character/kid/run.png', 82, 178, 12],
+			['kid_lost',	imgsrc + 'character/kid/lost.png', 72, 170, 6],
+			['kid_run', 	imgsrc + 'character/kid/run.png', 82, 178, 12],
 		];
 		audio = [];
 		return media.returnType(type);
 	},
 
-	gameCircleOne : function ( type ){
+	gameCircleOne: function (type) {
 		image = [
 			// scenario
-			['house', 	imgsrc+'scenario/house.png'],
-			['school', 	imgsrc+'scenario/school.png'],
+			['house', 	imgsrc + 'scenario/house.png'],
+			['school', 	imgsrc + 'scenario/school.png'],
 			// Game Sprites
-			['balloon', 		imgsrc+'character/balloon/airballoon_upper.png'],
-			['balloon_basket', 	imgsrc+'character/balloon/airballoon_base.png'],	
+			['balloon', 		imgsrc + 'character/balloon/airballoon_upper.png'],
+			['balloon_basket', 	imgsrc + 'character/balloon/airballoon_base.png'],
 		];
 		spritesheet = [
-			['kid_run',	imgsrc+'character/kid/run.png', 82, 178, 12],
+			['kid_run', imgsrc + 'character/kid/run.png', 82, 178, 12],
 		];
 		audio = [];
 		return media.returnType(type);
 	},
-	
-	menu : function (type) {
-		image = [ 
+
+	menu: function (type) {
+		image = [
 			// level Icrons
-			['', imgsrc+'game/squareOne_1.png', 'Square', 'A'], // Square I
-			['', imgsrc+'game/squareOne_2.png', 'Square', 'B'], // Square II
-			['', imgsrc+'game/circleOne_1.png', 'Circle', 'A'], // Circle I
-			['', imgsrc+'game/circleOne_2.png', 'Circle', 'B'], // Circle II
-			['', imgsrc+'game/squareTwo_3.png', 'Square', 'C']	// Square III
+			['', imgsrc + 'game/squareOne_1.png', 'Square', 'A'], // Square I
+			['', imgsrc + 'game/squareOne_2.png', 'Square', 'B'], // Square II
+			['', imgsrc + 'game/circleOne_1.png', 'Circle', 'A'], // Circle I
+			['', imgsrc + 'game/circleOne_2.png', 'Circle', 'B'], // Circle II
+			['', imgsrc + 'game/squareTwo_3.png', 'Square', 'C']	// Square III
 		];
-		if (debugMode) { 
-			for (let i = 0; i < 8; i++) { 
-				image.push(['', imgsrc+'game/squareTwo_3.png', 'Square', 'C']);
+		if (debugMode) {
+			for (let i = 0; i < 8; i++) {
+				image.push(['', imgsrc + 'game/squareTwo_3.png', 'Square', 'C']);
 			}
 		}
 		audio = [];
 		spritesheet = [];
-		return media.returnType(type); 
+		return media.returnType(type);
 	},
 
-	returnType : function (type) {
+	returnType: function (type) {
 		if (type == 'image') return image;
 		else if (type == 'spritesheet') return spritesheet;
 		else if (type == 'audio') return audio;
@@ -226,104 +226,160 @@ const media = {
 // Control navigation icons on the top of the screen
 let iconSettings = {
 
-    // Add navigation icons on the top of the screen based on parameters
-    func_addIcons: function (left_side, right_side, // icon side
-							left_btn0, left_btn1, left_btn2, // first 3 icon spaces
-							right_btn0, right_btn1, // last 2 icon spaces
-							level, helpBtn) { // auxiliar variables
+	// Add navigation icons on the top of the screen based on parameters
+	func_addIcons: function (left_side, right_side, // icon side
+		left_btn0, left_btn1, left_btn2, // first 3 icon spaces
+		right_btn0, right_btn1, // last 2 icon spaces
+		level, helpBtn) { // auxiliar variables
 
-        let left_x = 10;
-        let right_x = defaultWidth - 50 - 10;
+		let left_x = 10;
+		let right_x = defaultWidth - 50 - 10;
 
-        // 'Descriptive labels' for the navigation icons
+		// 'Descriptive labels' for the navigation icons
 
-        if (left_side) this.left_text = game.add.text(left_x, 53, "", textStyles.overtitle);
+		if (left_side) this.left_text = game.add.text(left_x, 53, "", textStyles.overtitle);
 
-        if (right_side) {
-            this.right_text = game.add.text(right_x + 50, 53, "", textStyles.overtitle);
-            this.right_text.anchor.setTo(1, 0.02);
-        }
+		if (right_side) {
+			this.right_text = game.add.text(right_x + 50, 53, "", textStyles.overtitle);
+			this.right_text.anchor.setTo(1, 0.02);
+		}
 
-        // 'Icons' on the LEFT side of the page
+		// 'Icons' on the LEFT side of the page
 
-        if (left_btn0) { // Return to select difficulty screen
+		if (left_btn0) { // Return to select difficulty screen
 			const icon_back = game.add.sprite(left_x, 10, 'back');
-			
-            icon_back.inputEnabled = true;
-            icon_back.input.useHandCursor = true;
-            icon_back.events.onInputDown.add(this.func_callState, { state: level });
-            icon_back.events.onInputOver.add(function () { this.left_text.text = lang.menu_back }, { left_text: this.left_text });
-            icon_back.events.onInputOut.add(function () { this.left_text.text = "" }, { left_text: this.left_text });
-            // Offsets value of x for next icon
-            left_x += 50;
-        }
-
-        if (left_btn1) { // Return to main menu screen
+
+			icon_back.inputEnabled = true;
+			icon_back.input.useHandCursor = true;
+			icon_back.events.onInputDown.add(this.func_callState, { state: level });
+			icon_back.events.onInputOver.add(function () { this.left_text.text = lang.menu_back }, { left_text: this.left_text });
+			icon_back.events.onInputOut.add(function () { this.left_text.text = "" }, { left_text: this.left_text });
+			// Offsets value of x for next icon
+			left_x += 50;
+		}
+
+		if (left_btn1) { // Return to main menu screen
 			const icon_list = game.add.sprite(left_x, 10, 'list');
-			
-            icon_list.inputEnabled = true;
-            icon_list.input.useHandCursor = true;
-            icon_list.events.onInputDown.add(this.func_callState, { state: "menu" });
-            icon_list.events.onInputOver.add(function () { this.left_text.text = lang.menu_list }, { left_text: this.left_text });
-            icon_list.events.onInputOut.add(function () { this.left_text.text = "" }, { left_text: this.left_text });
-            // Offsets value of x for next icon
-            left_x += 50;
-        }
-
-        if (left_btn2) { // In some levels, shows solution to the game
+
+			icon_list.inputEnabled = true;
+			icon_list.input.useHandCursor = true;
+			icon_list.events.onInputDown.add(this.func_callState, { state: "menu" });
+			icon_list.events.onInputOver.add(function () { this.left_text.text = lang.menu_list }, { left_text: this.left_text });
+			icon_list.events.onInputOut.add(function () { this.left_text.text = "" }, { left_text: this.left_text });
+			// Offsets value of x for next icon
+			left_x += 50;
+		}
+
+		if (left_btn2) { // In some levels, shows solution to the game
 			const icon_help = game.add.sprite(left_x, 10, 'help');
-			
-            icon_help.inputEnabled = true;
-            icon_help.input.useHandCursor = true;
-            icon_help.events.onInputDown.add(helpBtn);
-            icon_help.events.onInputOver.add(function () { this.left_text.text = lang.menu_help }, { left_text: this.left_text });
-            icon_help.events.onInputOut.add(function () { this.left_text.text = "" }, { left_text: this.left_text });
-            // Offsets value of x for next icon
-            left_x += 50;
-        }
-
-        // 'Icons' on the RIGHT side of the page
-
-        if (right_btn0) { // Turns game audio on/off
-            this.icon_audio = game.add.sprite(right_x, 10, 'audio');
+
+			icon_help.inputEnabled = true;
+			icon_help.input.useHandCursor = true;
+			icon_help.events.onInputDown.add(helpBtn);
+			icon_help.events.onInputOver.add(function () { this.left_text.text = lang.menu_help }, { left_text: this.left_text });
+			icon_help.events.onInputOut.add(function () { this.left_text.text = "" }, { left_text: this.left_text });
+			// Offsets value of x for next icon
+			left_x += 50;
+		}
+
+		// 'Icons' on the RIGHT side of the page
+
+		if (right_btn0) { // Turns game audio on/off
+			this.icon_audio = game.add.sprite(right_x, 10, 'audio');
 			audioStatus ? this.icon_audio.frame = 0 : this.icon_audio.frame = 1;
-			
-            this.icon_audio.inputEnabled = true;
-            this.icon_audio.input.useHandCursor = true;
-            this.icon_audio.events.onInputDown.add(function () { if (audioStatus) { audioStatus = false; this.icon_audio.frame = 1; } else { audioStatus = true; this.icon_audio.frame = 0; } }, { icon_audio: this.icon_audio });
-            this.icon_audio.events.onInputOver.add(function () { this.right_text.text = lang.audio }, { right_text: this.right_text });
-            this.icon_audio.events.onInputOut.add(function () { this.right_text.text = "" }, { right_text: this.right_text });
-            // Offsets value of x for next icon
-            right_x -= 50;
-        }
-
-        if (right_btn1) { // Return to select language screen
+
+			this.icon_audio.inputEnabled = true;
+			this.icon_audio.input.useHandCursor = true;
+			this.icon_audio.events.onInputDown.add(function () { if (audioStatus) { audioStatus = false; this.icon_audio.frame = 1; } else { audioStatus = true; this.icon_audio.frame = 0; } }, { icon_audio: this.icon_audio });
+			this.icon_audio.events.onInputOver.add(function () { this.right_text.text = lang.audio }, { right_text: this.right_text });
+			this.icon_audio.events.onInputOut.add(function () { this.right_text.text = "" }, { right_text: this.right_text });
+			// Offsets value of x for next icon
+			right_x -= 50;
+		}
+
+		if (right_btn1) { // Return to select language screen
 			this.icon_world = game.add.sprite(right_x, 10, 'world');
-			
-            this.icon_world.inputEnabled = true;
-            this.icon_world.input.useHandCursor = true;
-            this.icon_world.events.onInputDown.add(this.func_callState, { state: "language" });
-            this.icon_world.events.onInputOver.add(function () { this.right_text.text = lang.menu_world }, { right_text: this.right_text });
-            this.icon_world.events.onInputOut.add(function () { this.right_text.text = "" }, { right_text: this.right_text });
-            // Offsets value of x for next icon
-            right_x -= 50;
-        }
-
-    },
-
-    // refresh values of x for icons when menu screen move sideways
-    func_refreshRightIcons_x: function (newWidth) {
-        this.right_text.x = newWidth - 10;
-        this.icon_audio.x = newWidth - 50 - 10;
-        this.icon_world.x = newWidth - 50 - 50 - 10;
-    },
-
-    func_callState: function () {
-
-        if (audioStatus) beepSound.play();
-		
+
+			this.icon_world.inputEnabled = true;
+			this.icon_world.input.useHandCursor = true;
+			this.icon_world.events.onInputDown.add(this.func_callState, { state: "language" });
+			this.icon_world.events.onInputOver.add(function () { this.right_text.text = lang.menu_world }, { right_text: this.right_text });
+			this.icon_world.events.onInputOut.add(function () { this.right_text.text = "" }, { right_text: this.right_text });
+			// Offsets value of x for next icon
+			right_x -= 50;
+		}
+
+	},
+
+	// refresh values of x for icons when menu screen move sideways
+	func_refreshRightIcons_x: function (newWidth) {
+		this.right_text.x = newWidth - 10;
+		this.icon_audio.x = newWidth - 50 - 10;
+		this.icon_world.x = newWidth - 50 - 50 - 10;
+	},
+
+	func_callState: function () {
+
+		if (audioStatus) sound.beepSound.play();
+
 		game.state.start(this.state);
-	
+
 	}
 
 };
+
+let loadLangs = function (url) {
+
+	lang = {};
+
+	var init = {
+		mode: "same-origin"
+	};
+
+	fetch(url, init)
+
+		.then(function (response) {
+			return response.text();
+		})
+
+		.then(function (text) {
+
+			let msg = text.split("\n");
+
+			msg.forEach((temp) => {
+
+				try {
+
+					let msg = temp.split("=");
+
+					lang[msg[0].trim()] = msg[1].trim();
+
+				} catch { console.log("erro de sintaxe corrigido"); }
+
+			});
+
+		});
+
+}
+
+let loadAudios = function (audiosURL) {
+
+	sound = {};
+
+	var init = {
+		mode: "same-origin",
+	};
+
+	audiosURL.forEach((item) => {
+
+		fetch(item[1][1], init)
+
+			.then(response => response.blob())
+
+			.then(function (myBlob) {
+				sound[item[0]] = new Audio(URL.createObjectURL(myBlob));
+			})
+
+	});
+
+};

+ 1 - 1
js/map.js

@@ -179,7 +179,7 @@ let mapState = {
     //MapLoading function
     func_loadGame: function () {
 
-        if (audioStatus) beepSound.play();
+        if (audioStatus) sound.beepSound.play();
 
         if (mapPosition <= 4) game.state.start(currentGameState);
         else game.state.start('end');

+ 5 - 5
js/menu.js

@@ -12,10 +12,10 @@
 // MENU SCREEN: main menu of the game where the user can select the level he wants to play
 let menuState = {
 
-    preload: function() {
-        for(let i=0, menuIcons = media.menu('image'); i < menuIcons.length; i++){
-			game.load.image('game' + i, menuIcons[i][1]);
-		}
+    preload: function () {
+        for (let i = 0, menuIcons = media.menu('image'); i < menuIcons.length; i++) {
+            game.load.image('game' + i, menuIcons[i][1]);
+        }
     },
 
     create: function () {
@@ -142,7 +142,7 @@ let menuState = {
         // Sets stage width back to default
         this.game.world.setBounds(0, 0, defaultWidth, this.game.world.height);
 
-        if (audioStatus) beepSound.play();
+        if (audioStatus) sound.beepSound.play();
 
         levelShape = this.shape;
         levelType = this.levelType;

+ 15 - 18
js/preMenu.js

@@ -26,14 +26,14 @@ let langState = {
 
         // Sets stage width back to default (if we are back from 'menu' state where it can be changed) 
         if (this.game.world.width != defaultWidth) this.game.world.setBounds(0, 0, defaultWidth, this.game.world.height);
-        
+
         // Parameters for the elements on the screen
         const langs = {
             text: ['FRAÇÕES  ', 'FRAZIONI  ', 'FRACTIONS  ', 'FRACCIONES  ', 'FRACTIONS  '], // Language names
-            flag: ['flag_BR'  , 'flag_IT'   , 'flag_US'    , 'flag_PE'     , 'flag_FR'    ], // Icon names
-            lang: ['pt_BR'    , 'it_IT'     , 'en_US'      , 'es_PE'       , 'fr_FR'      ], // Parameters sent for language object
-            x: [-220, -220, -220,  200, 200],
-            y: [-180,    0,  180, -100, 100]
+            flag: ['flag_BR', 'flag_IT', 'flag_US', 'flag_PE', 'flag_FR'], // Icon names
+            lang: ['pt_BR', 'it_IT', 'en_US', 'es_PE', 'fr_FR'], // Parameters sent for language object
+            x: [-220, -220, -220, 200, 200],
+            y: [-180, 0, 180, -100, 100]
         }
 
         // Create elements on screen  
@@ -51,7 +51,7 @@ let langState = {
             flag.events.onInputDown.add(this.func_setLang, { langs_lang: langs.lang[i] });
             flag.events.onInputOver.add(function () { this.flag.scale.setTo(1.05) }, { flag: flag });
             flag.events.onInputOut.add(function () { this.flag.scale.setTo(1) }, { flag: flag });
-        
+
         }
 
     },
@@ -75,24 +75,21 @@ let loadState = {
     preload: function () {
 
         // Progress bar
-		const progressBar = game.add.sprite(game.world.centerX, game.world.centerY, 'progressBar');
-		progressBar.anchor.setTo(0.5, 0.5);
-		game.load.setPreloadSprite(progressBar);
+        const progressBar = game.add.sprite(game.world.centerX, game.world.centerY, 'progressBar');
+        progressBar.anchor.setTo(0.5, 0.5);
+        game.load.setPreloadSprite(progressBar);
 
-        // Loads json with language chosen by the player
-        game.load.json('dictionary', 'assets/lang/' + langString + '.json');
+        // Loads selected language
+        loadLangs('/Ifractions-web/assets/lang/' + langString);
 
     },
 
     create: function () {
- 
-        // object used to translate text
-        lang = game.cache.getJSON('dictionary'); 
-        
+
         if (debugMode) console.log("Language: " + langString);
 
         // Make sure to only ask for player name on the first time oppening the game
-        if (this.firstTime == undefined) { 
+        if (this.firstTime == undefined) {
             this.firstTime = false;
             game.state.start('name'); // first time opening ifractions ('language' >> 'name' >> 'menu')
         } else {
@@ -120,7 +117,7 @@ let nameState = {
         this.warningEmptyName.anchor.setTo(0.5);
 
         // Set 'ok' button that gets player's information
-        
+
         const btn = game.add.graphics(this.game.world.centerX - 84, this.game.world.centerY + 70);
         btn.beginFill(colors.teal);
         btn.drawRect(0, 0, 168, 60);
@@ -167,7 +164,7 @@ let nameState = {
         document.getElementById("text-field").style.visibility = "hidden";
         document.getElementById("name_id").value = "";
 
-        if (audioStatus) beepSound.play();
+        if (audioStatus) sound.beepSound.play();
 
         if (debugMode) console.log("Username: " + playerName);
 

+ 50 - 50
js/squareOne.js

@@ -59,7 +59,7 @@ let gameSquareOne = {
         this.result = false;        // Checks player 'answer' 
         let hasBaseDifficulty = false;  // Checks if level is too easy for its difficulty
         this.divisorsList = "";     // Hold the divisors for each fraction on stacked blocks (created for func_postScore)
-        
+
         this.DIREC_LEVEL = (sublevelType == 'Minus') ? -1 : 1;    // Will be multiplied to values to easily change tractor direction when needed
         this.animationSṕeed = 2 * this.DIREC_LEVEL;   // Distance in which the tractor moves in each iteration of the animation
 
@@ -68,7 +68,7 @@ let gameSquareOne = {
         const defaultBlockWidth = 80;   // Base block width
         const defaultBlockHeight = 40;  // Base block height
         const startX = (sublevelType == 'Minus') ? 730 : 170; // Initial 'x' coordinate for the tractor and the blocks
-        
+
 
 
 
@@ -80,29 +80,29 @@ let gameSquareOne = {
         game.add.image(300, 100, 'cloud');
         game.add.image(660, 80, 'cloud');
         game.add.image(110, 85, 'cloud').scale.setTo(0.8);
-        
+
         // Add floor of grass
         for (let i = 0; i < 9; i++) { game.add.image(i * 100, 501, 'floor'); }
-        
+
         // Calls function that loads navigation icons
         iconSettings.func_addIcons(true, true,
             true, true, true,
             true, false,
             'difficulty', this.func_viewHelp);
-        
+
         // Add tractor    
-        
+
         this.tractor = game.add.sprite(startX, 445, 'tractor');
         this.tractor.scale.setTo(0.8);
-        if (sublevelType == 'Plus'){
+        if (sublevelType == 'Plus') {
             this.tractor.anchor.setTo(1, 0.5);
             this.tractor.animations.add('run', [0, 1, 2, 3, 4]);
-        } else { 
+        } else {
             this.tractor.anchor.setTo(0, 0.5);
             this.tractor.animations.add('run', [5, 6, 7, 8, 9]);
             this.tractor.frame = 5;
         }
-        
+
 
 
 
@@ -127,9 +127,9 @@ let gameSquareOne = {
 
         this.stck_fractionLines = game.add.group(); // Group of sprites that serves as line in the middle of a fraction
         this.stck_blockLabels = game.add.group();   // Group of labels that display fraction on side of stacked blocks
-        
-        
-        
+
+
+
         this.nextStartX;
 
 
@@ -183,14 +183,14 @@ let gameSquareOne = {
             }
 
             // Add current block to the group of stacked blocks
-            this.stck_blocks.add(block); 
+            this.stck_blocks.add(block);
 
             // If 'show labels' is turned on, create labels that display the fractions on the side of each block
             if (levelLabel) {
 
                 const x = startX + (blockWidth + 15) * this.DIREC_LEVEL;
                 let label;
-                
+
                 if (divisor == 1) {
                     label = game.add.text(x, 483 - i * (defaultBlockHeight - lineSize), divisor, textStyles.valueLabelBlue1);
                 } else {
@@ -201,22 +201,22 @@ let gameSquareOne = {
                     fractionLine.anchor.setTo(0.5, 0.5);
                     this.stck_fractionLines.add(fractionLine);
                 }
-                
+
                 label.anchor.setTo(0.5, 0.5);
-                
+
                 // Add current label to group of labels
-                this.stck_blockLabels.add(label); 
+                this.stck_blockLabels.add(label);
             }
 
         }
 
         // check for errors (level too easy for its difficulty or end position out of bounds)
         if ((!hasBaseDifficulty) ||
-        (sublevelType == 'Plus' && (stck_finalPosition < (startX + defaultBlockWidth) || stck_finalPosition > (startX + 8 * defaultBlockWidth))) ||
-        (sublevelType == 'Minus' && (stck_finalPosition < (startX - (8 * defaultBlockWidth)) || stck_finalPosition > (startX - defaultBlockWidth)))
+            (sublevelType == 'Plus' && (stck_finalPosition < (startX + defaultBlockWidth) || stck_finalPosition > (startX + 8 * defaultBlockWidth))) ||
+            (sublevelType == 'Minus' && (stck_finalPosition < (startX - (8 * defaultBlockWidth)) || stck_finalPosition > (startX - defaultBlockWidth)))
         ) {
             // If any error is found restart the level
-            game.state.start('gameSquareOne'); 
+            game.state.start('gameSquareOne');
         }
 
         // will be used as a counter in update, adding in the width of each stacked block to check if the end matches the floor selected position
@@ -232,18 +232,18 @@ let gameSquareOne = {
         // Define the total number of floor blocks
         this.floor_numBlocks = 8 * divisor;
         // Define the with of each floor block
-        const floor_blockWidth = defaultBlockWidth / divisor; 
+        const floor_blockWidth = defaultBlockWidth / divisor;
+
 
-        
         // If game is type B, selectiong a random 'x' coordinate for the floor
         if (levelType == 'B') {
-            
+
             this.stck_correctIndex = game.rnd.integerInRange(0, (this.stck_numBlocks - 1));
-            
-            for (let i = 0; i <= this.stck_correctIndex; i++) { 
-                this.floor_correctPositionX += this.stck_blocks.children[i].width; 
+
+            for (let i = 0; i <= this.stck_correctIndex; i++) {
+                this.floor_correctPositionX += this.stck_blocks.children[i].width;
             }
-        
+
         }
 
         let flag = true;
@@ -254,17 +254,17 @@ let gameSquareOne = {
             const x = startX + (defaultBlockWidth + i * floor_blockWidth) * this.DIREC_LEVEL;
 
             if ((flag) &&
-            (levelType == 'A') &&
-            ((sublevelType == 'Plus' && x >= stck_finalPosition) || (sublevelType == 'Minus' && x <= stck_finalPosition))
+                (levelType == 'A') &&
+                ((sublevelType == 'Plus' && x >= stck_finalPosition) || (sublevelType == 'Minus' && x <= stck_finalPosition))
             ) {
                 this.floor_correctIndex = i - 1; // Set index of correct floor block
                 flag = false;
             }
-            
+
             if ((levelType == 'B') &&
-            ((sublevelType == 'Plus' && x >= this.floor_correctPositionX) || (sublevelType == 'Minus' && x <= this.floor_correctPositionX)) 
+                ((sublevelType == 'Plus' && x >= this.floor_correctPositionX) || (sublevelType == 'Minus' && x <= this.floor_correctPositionX))
             ) {
-                this.floor_numBlocks = i; 
+                this.floor_numBlocks = i;
                 break; // Leaves for loop    
             }
 
@@ -293,7 +293,7 @@ let gameSquareOne = {
 
         }
 
-        if (levelType == "A") this.floor_correctPositionX = stck_finalPosition; 
+        if (levelType == "A") this.floor_correctPositionX = stck_finalPosition;
 
         // Creates labels on the floor to display the numbers
         for (let i = 0; i <= 8; i++) {
@@ -399,11 +399,11 @@ let gameSquareOne = {
                 if (this.stck_blocks.children[0].x >= (this.nextStartX + extra)) {
 
                     let stck_curEnd = this.stck_blocks.children[0].x + this.stck_blocks.children[this.stck_curIndex].width;
-                    
+
                     if (this.stck_curIndex == this.stck_index) {
                         const floor_curEnd = this.floor_blocks.children[this.floor_index].x + this.floor_blocks.children[this.floor_index].width;
                         if (stck_curEnd > floor_curEnd) updateBlocks = false;
-                    } 
+                    }
 
                     if (updateBlocks) {
                         // Blocks on the floor
@@ -422,19 +422,19 @@ let gameSquareOne = {
                         this.nextStartX += this.stck_blocks.children[this.stck_curIndex + 1].width;
                     }
                     this.stck_curIndex++;
-                    
+
                 }
-            } 
-            
+            }
+
             if (sublevelType == 'Minus') {
                 if (this.stck_blocks.children[0].x <= (this.nextStartX + extra)) {
 
                     let stck_curEnd = this.stck_blocks.children[0].x + this.stck_blocks.children[this.stck_curIndex].width;
-                    
+
                     if (this.stck_curIndex == this.stck_index) {
                         const floor_curEnd = this.floor_blocks.children[this.floor_index].x + this.floor_blocks.children[this.floor_index].width;
                         if (stck_curEnd < floor_curEnd) updateBlocks = false;
-                    } 
+                    }
 
                     if (updateBlocks) {
                         // Blocks on the floor
@@ -453,12 +453,12 @@ let gameSquareOne = {
                         this.nextStartX += this.stck_blocks.children[this.stck_curIndex + 1].width;
                     }
                     this.stck_curIndex++;
-                
+
                 }
             }
 
             // Checks if it reached the clicked position 
-            if (this.stck_curIndex > this.stck_index || this.floor_curIndex >= this.floor_index) {           
+            if (this.stck_curIndex > this.stck_index || this.floor_curIndex >= this.floor_index) {
                 this.animate = false;
                 this.checkAnswer = true;
             }
@@ -472,7 +472,7 @@ let gameSquareOne = {
 
             this.tractor.animations.stop();
 
-            if (levelType=='A') {
+            if (levelType == 'A') {
                 this.result = (this.floor_index == this.floor_correctIndex);
             } else {
                 this.result = (this.stck_index == this.stck_correctIndex);
@@ -486,7 +486,7 @@ let gameSquareOne = {
                 // Displays feedback image and sound 
                 this.okImg.visible = true;
 
-                if (audioStatus) okSound.play();
+                if (audioStatus) sound.okSound.play();
 
                 completedLevels++; // increases number os passed levels
                 if (debugMode) console.log("completedLevels = " + completedLevels);
@@ -496,7 +496,7 @@ let gameSquareOne = {
                 // Displays feedback image and sound
                 this.errorImg.visible = true;
 
-                if (audioStatus) errorSound.play();
+                if (audioStatus) sound.errorSound.play();
 
             }
 
@@ -544,7 +544,7 @@ let gameSquareOne = {
                 // Saves the index of the selected 'floor' block
                 self.floor_index = this.index;
 
-            // On leveltype B
+                // On leveltype B
             } else {
 
                 for (let i = 0; i < self.stck_numBlocks; i++) {
@@ -573,7 +573,7 @@ let gameSquareOne = {
 
                 self.floor_index = -1;
 
-            //on level type B
+                //on level type B
             } else {
 
                 for (let i = 0; i < self.stck_numBlocks; i++) {
@@ -608,7 +608,7 @@ let gameSquareOne = {
                 // save the 'stacked' blocks index to compare to the floor index in update
                 self.stck_index = self.stck_numBlocks - 1;
 
-            // On leveltype B
+                // On leveltype B
             } else {
 
                 for (let i = 0; i < self.stck_numBlocks; i++) {
@@ -625,7 +625,7 @@ let gameSquareOne = {
             }
 
             // Play beep sound
-            if (audioStatus) beepSound.play();
+            if (audioStatus) sound.beepSound.play();
 
             // Hide labels
             if (levelLabel) {
@@ -655,7 +655,7 @@ let gameSquareOne = {
             if (levelType == 'A') {
                 aux = self.floor_blocks.children[0];
                 self.pointer = game.add.image(self.floor_correctPositionX - aux.width / 2, 501, 'pointer');
-            // On leveltype B
+                // On leveltype B
             } else {
                 aux = self.stck_blocks.children[self.stck_correctIndex];
                 self.pointer = game.add.image(aux.x + aux.width / 2, aux.y, 'pointer');

+ 71 - 71
js/squareTwo.js

@@ -64,7 +64,7 @@ let gameSquareTwo = {
         this.endDelay = 60; // Maximum value for the counter
 
 
-        
+
 
         // BACKGROUND AND KID
 
@@ -72,8 +72,8 @@ let gameSquareTwo = {
         game.add.image(0, 0, 'bgimage');
         // Add clouds
         game.add.image(300, 100, 'cloud');
-        game.add.image(660, 80,  'cloud');
-        game.add.image(110, 85,  'cloud').scale.setTo(0.8);
+        game.add.image(660, 80, 'cloud');
+        game.add.image(110, 85, 'cloud').scale.setTo(0.8);
 
         // Add floor of grass
         for (let i = 0; i < 9; i++) { game.add.image(i * 100, 501, 'floor'); }
@@ -125,11 +125,11 @@ let gameSquareTwo = {
 
         // Random index for 'points'
         const randomIndex = game.rnd.integerInRange((levelDifficulty - 1) * 2 + 1, (levelDifficulty - 1) * 2 + 3);
-        
+
         // number of subdivisions of A and B (blocks)
         this.numBlocksA = points[randomIndex];
         this.numBlocksB = this.func_getRndDivisor(this.numBlocksA);
-        
+
         if (debugMode) {
             console.log("----------");
             console.log("Difficulty " + levelDifficulty + ", ini " + ((levelDifficulty - 1) * 2 + 1) + ", end " + ((levelDifficulty - 1) * 2 + 3));
@@ -141,15 +141,15 @@ let gameSquareTwo = {
 
 
         // CREATING TOP FIGURE (A)
-        
+
         let blockWidth = this.figureWidth / this.numBlocksA; // width of each block in A
-        let lineColor = colors.darkGreen; 
-        let fillColor = colors.lightGreen; 
+        let lineColor = colors.darkGreen;
+        let fillColor = colors.lightGreen;
         let fillColorAux = colors.lighterGreen;
-        
+
         // Create blocks
         for (let i = 0; i < this.numBlocksA; i++) {
-                        
+
             const x = xA + i * blockWidth;
 
             // Blocks
@@ -223,12 +223,12 @@ let gameSquareTwo = {
 
             block.inputEnabled = true;
             block.input.useHandCursor = true;
-            block.events.onInputDown.add(this.func_clickSquare, { figure: 'B', index: i, xA: xA, xB: xB  });
-            block.events.onInputOver.add(this.func_overSquare, { figure: 'B', index: i, xA: xA, xB: xB  });
+            block.events.onInputDown.add(this.func_clickSquare, { figure: 'B', index: i, xA: xA, xB: xB });
+            block.events.onInputOver.add(this.func_overSquare, { figure: 'B', index: i, xA: xA, xB: xB });
             block.events.onInputOut.add(this.func_outSquare, { figure: 'B', index: i });
 
             this.blocksB.add(block);
-            
+
             // Auxiliar blocks
             let yAux = yB + figureHeight + 10; // on the bottom of B
 
@@ -262,7 +262,7 @@ let gameSquareTwo = {
 
 
         // OUTPUT ICONS AND TEXT
-        
+
         // Ok image
         this.okImg = game.add.image(game.world.centerX, game.world.centerY, 'h_ok');
         this.okImg.anchor.setTo(0.5);
@@ -302,7 +302,7 @@ let gameSquareTwo = {
             for (let i = 0; i < this.selectedA; i++) {
                 this.blocksA.children[i].y += 2;
             }
-            
+
             // After fully lowering blocks, set fraction value
             if (this.blocksA.children[0].y >= this.auxBlocksA.children[0].y) {
 
@@ -312,17 +312,17 @@ let gameSquareTwo = {
 
                 this.animateA = false;
             }
-        
+
         }
 
         // If clicked B, animate B blocks
         if (this.animateB) {
-            
+
             // Lower selected blocks
             for (let i = 0; i < this.selectedB; i++) {
                 this.blocksB.children[i].y += 2;
             }
-            
+
             // Sets fraction value
             if (this.blocksB.children[0].y >= this.auxBlocksB.children[0].y) {
                 this.fractionB.alpha = 1;
@@ -331,7 +331,7 @@ let gameSquareTwo = {
 
                 this.animateB = false;
             }
-        
+
         }
 
         // if A and B are already clicked
@@ -348,7 +348,7 @@ let gameSquareTwo = {
                 // fractions are equivalent : correct
                 if ((this.selectedA / this.numBlocksA) == (this.selectedB / this.numBlocksB)) {
 
-                    if (audioStatus) okSound.play();
+                    if (audioStatus) sound.okSound.play();
 
                     this.okImg.visible = true;
 
@@ -359,11 +359,11 @@ let gameSquareTwo = {
                     if (debugMode) console.log("completedLevels = " + completedLevels);
 
 
-                // fractions are not equivalent : incorrect
+                    // fractions are not equivalent : incorrect
                 } else {
-                    
-                    if (audioStatus) errorSound.play();
-                    
+
+                    if (audioStatus) sound.errorSound.play();
+
                     this.errorImg.visible = true;
 
                     this.result = false; // player answer is incorrect
@@ -389,9 +389,9 @@ let gameSquareTwo = {
         if (this.ending) {
 
             this.delay++;
-            
-            if (this.delay >= this.endDelay) { 
-                game.state.start('map'); 
+
+            if (this.delay >= this.endDelay) {
+                game.state.start('map');
             }
 
         }
@@ -407,17 +407,17 @@ let gameSquareTwo = {
 
                 self.warningTextA.setText(lang.error_msg);
                 self.warningTextB.setText("");
-            
+
             } else {
-                
+
                 self.warningTextA.setText("");
                 self.warningTextB.setText("");
-            
+
                 // selected blocks become fully visible
                 for (let i = 0; i < self.numBlocksA; i++) {
                     self.blocksA.children[i].alpha = (i <= this.index) ? 1 : 0.5;
                 }
-            
+
                 self.fractionA.x = this.xA + ((this.index + 1) * (self.figureWidth / self.numBlocksA)) + 25;
                 self.fractionA.alpha = 1;
                 self.fractionA.setText(this.index + 1);
@@ -433,12 +433,12 @@ let gameSquareTwo = {
 
                 self.warningTextA.setText("");
                 self.warningTextB.setText(lang.error_msg);
-            
+
             } else {
-            
+
                 self.warningTextA.setText("");
                 self.warningTextB.setText("");
-            
+
                 // selected blocks become fully visible
                 for (let i = 0; i < self.numBlocksB; i++) {
                     self.blocksB.children[i].alpha = (i <= this.index) ? 1 : 0.5;
@@ -447,7 +447,7 @@ let gameSquareTwo = {
                 self.fractionB.x = this.xB + ((this.index + 1) * (self.figureWidth / self.numBlocksB)) + 25;
                 self.fractionB.alpha = 1;
                 self.fractionB.setText(this.index + 1);
-            
+
             }
 
         }
@@ -459,21 +459,21 @@ let gameSquareTwo = {
         // On level type A
         if (!self.hasClickedA && this.figure == "A") {
 
-            for (let i = 0; i <= this.index; i++) { 
-                self.blocksA.children[i].alpha = 0.5; 
+            for (let i = 0; i <= this.index; i++) {
+                self.blocksA.children[i].alpha = 0.5;
             }
             self.fractionA.alpha = 0;
-        
+
         }
-        
+
         // On level type B
         if (!self.hasClickedB && this.figure == "B") {
-        
-            for (let i = 0; i <= this.index; i++) { 
-                self.blocksB.children[i].alpha = 0.5; 
+
+            for (let i = 0; i <= this.index; i++) {
+                self.blocksB.children[i].alpha = 0.5;
             }
             self.fractionB.alpha = 0;
-        
+
         }
 
     },
@@ -482,19 +482,19 @@ let gameSquareTwo = {
 
         // On level type A 
         if (!self.hasClickedA && this.figure == "A" && this.index != self.numBlocksA - 1) {
-            
+
             for (let i = 0; i < self.numBlocksA; i++) {
                 // desable block input
                 self.blocksA.children[i].inputEnabled = false;
                 // turn auxiliar blocks invisible
                 if (i > this.index) self.auxBlocksA.children[i].alpha = 0;
             }
-            
+
             // turn value label invisible
             self.labelA.alpha = 0;
-            
-            if (audioStatus) beepSound.play();
-            
+
+            if (audioStatus) sound.beepSound.play();
+
             // Save number of selected blocks
             self.selectedA = this.index + 1;
 
@@ -502,9 +502,9 @@ let gameSquareTwo = {
             self.fractionA.x = this.xA + (self.selectedA * (self.figureWidth / self.numBlocksA)) + 25;
             self.fractionLineA.x = self.fractionA.x
 
-            self.hasClickedA = true;            
+            self.hasClickedA = true;
             self.animateA = true;
-        
+
         }
 
         // On level type B
@@ -520,11 +520,11 @@ let gameSquareTwo = {
             // turn value label invisible
             self.labelB.alpha = 0;
 
-            if (audioStatus) beepSound.play();
-            
+            if (audioStatus) sound.beepSound.play();
+
             // Save number of selected blocks
             self.selectedB = this.index + 1;
-            
+
             // Set fraction x position
             self.fractionB.x = this.xB + (self.selectedB * (self.figureWidth / self.numBlocksB)) + 25;
             self.fractionLineB.x = self.fractionB.x
@@ -560,11 +560,11 @@ let gameSquareTwo = {
 
             // if 'number' can be divided by 'div', add to list of 'validDivs'
             if (number % div == 0) validDivs.push(div);
-        
+
         }
 
         const randIndex = game.rnd.integerInRange(0, validDivs.length - 1);
-        
+
         return validDivs[randIndex];
 
     },
@@ -577,26 +577,26 @@ let gameSquareTwo = {
 
     func_postScore: function () {
 
-        let abst = "numBlocksA: " + this.numBlocksA 
-                + ", valueA: " + this.selectedA 
-                + ", numBlocksB: " + this.numBlocksB 
-                + ", valueB: " + this.selectedB;
+        let abst = "numBlocksA: " + this.numBlocksA
+            + ", valueA: " + this.selectedA
+            + ", numBlocksB: " + this.numBlocksB
+            + ", valueB: " + this.selectedB;
 
         let hr = new XMLHttpRequest();
-        
+
         // Create some variables we need to send to our PHP file
         let url = "php/save.php";
-        let vars = "s_ip=" + hip 
-                + "&s_name=" + playerName 
-                + "&s_lang=" + langString 
-                + "&s_game=" + levelShape 
-                + "&s_mode=" + levelType;
-        vars +=   "&s_oper=Equal"
-                + "&s_leve=" + levelDifficulty 
-                + "&s_posi=" + mapPosition 
-                + "&s_resu=" + this.result 
-                + "&s_time=" + this.totalTime 
-                + "&s_deta=" + abst;
+        let vars = "s_ip=" + hip
+            + "&s_name=" + playerName
+            + "&s_lang=" + langString
+            + "&s_game=" + levelShape
+            + "&s_mode=" + levelType;
+        vars += "&s_oper=Equal"
+            + "&s_leve=" + levelDifficulty
+            + "&s_posi=" + mapPosition
+            + "&s_resu=" + this.result
+            + "&s_time=" + this.totalTime
+            + "&s_deta=" + abst;
 
         hr.open("POST", url, true);
         hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");