const baseUrl = './assets/img/'; // Base directory for media
const fallbackImgUrl = './assets/img/fallback.png';
/**
* Preset colors for graphic elements.
* @type {object}
*/
const colors = {
// Blues
blueDark: '#02277d', // Line color that indicates right and fraction numbers
blue: '#003cb3', // Subtitle
blueLight: '#92b3e8', //'#a4c6fc',
blueBg: '#cce5ff', // Background color
blueBgInsideLevel: '#a8c0e6', // Background color in squareOne (used for floor gap)
blueMenuLine: '#b7cdf4',
// Reds
redLight: '#d27979', // squareTwo figures
red: '#b30000', // Linecolor that indicates left
redDark: '#730101', // squareTwo figures and some titles
maroon: '#330000', // squareTwo figures and some titles
// Greens
greenLight: '#79d2a1', // squareTwo figures
green: '#00804d', // Title
greenDark: '#005231', // squareTwo figures
// Basics
white: '#fff',
gray: '#1f1f1f',
black: '#000',
};
const font = {
sizes: {
h1: '48px',
h2: '42px',
h3: '38px',
h4: '36px',
p: '30px',
display: '62px',
},
families: {
default: 'Arial, sans-serif',
btn: 'Arial, sans-serif',
fraction: 'monospace',
},
};
/**
* Preset text styles for game text.
* Contains: font, size, text color and text align.
* @type {object}
*/
const textStyles = {
h1_: {
font: `${font.sizes.h1} ${font.families.default}`,
align: 'center',
fill: colors.blue,
},
h2_: {
font: `${font.sizes.h2} ${font.families.default}`,
align: 'center',
fill: colors.blue,
},
h3_: {
font: `${font.sizes.h3} ${font.families.default}`,
align: 'center',
fill: colors.blue,
},
h4_: {
font: `${font.sizes.h4} ${font.families.default}`,
align: 'center',
fill: colors.blue,
},
p_: {
font: `${font.sizes.p} ${font.families.default}`,
align: 'center',
fill: colors.maroon,
},
btn: {
font: `${font.sizes.h2} ${font.families.btn}`,
align: 'center',
fill: colors.white,
increaseLetterSpacing: true,
},
btnLg: {
font: `${font.sizes.h1} ${font.families.btn}`,
align: 'center',
fill: colors.white,
increaseLetterSpacing: true,
},
fraction: {
font: `${font.sizes.display} ${font.families.fraction}`,
align: 'left',
fill: colors.blue,
},
};
/**
* List of URL for all media in the game
* divided 1st by the 'state' that loads the media
* and 2nd by the 'media type' for that state.
*
* @type {object}
*/
const url = {
/**
* url.
* where can be: boot, menu, squareOne, squareTwo, circleOne.
*/
boot: {
/**
* url..
* where can be: image, sprite, audio
*
* image: [ [name, source], ... ]
* sprite: [ [name, source, number of frames], ... ]
* audio: [ [name, [source, alternative source] ], ... ]
*/
image: [
['fallback', fallbackImgUrl],
// scene new level
['floor_stone_left', baseUrl + 'scene/new_level/floor_stone_left.png'],
['floor_stone_right', baseUrl + 'scene/new_level/floor_stone_right.png'],
['floor_stone', baseUrl + 'scene/new_level/floor_stone.png'],
['wood_shelf', baseUrl + 'scene/new_level/wood_shelf.png'],
['bg_snow', baseUrl + 'scene/new_level/bg_snow.png'],
// Scene
['bg_default', baseUrl + 'scene/bg_default.jpg'],
['bg_map', baseUrl + 'scene/bg_map.png'],
['bush', baseUrl + 'scene/bush.png'],
['cloud', baseUrl + 'scene/cloud.png'],
['floor_grass', baseUrl + 'scene/floor_grass.png'],
['floor_road', baseUrl + 'scene/floor_road.png'],
['rock', baseUrl + 'scene/rock.png'],
['progress_bar_tile', baseUrl + 'scene/progress_bar_tile.png'],
['sign', baseUrl + 'scene/sign.png'],
['sign_broken', baseUrl + 'scene/sign_broken.png'],
['tree_1', baseUrl + 'scene/tree_1.png'],
['tree_2', baseUrl + 'scene/tree_2.png'],
['tree_3', baseUrl + 'scene/tree_3.png'],
['tree_4', baseUrl + 'scene/tree_4.png'],
// Flags
['flag_BR', baseUrl + 'flags/br.png'],
['flag_FR', baseUrl + 'flags/fr.png'],
['flag_IT', baseUrl + 'flags/it.png'],
['flag_ES', baseUrl + 'flags/es.png'],
['flag_US', baseUrl + 'flags/us.png'],
// Navigation icons on the top of the page
['back', baseUrl + 'icons_navigation/back.png'],
['show_answer', baseUrl + 'icons_navigation/show_solution.png'],
['home', baseUrl + 'icons_navigation/home.png'],
['lang', baseUrl + 'icons_navigation/language.png'],
['menu', baseUrl + 'icons_navigation/menu.png'],
// Interactive icons
['answer_correct', baseUrl + 'icons_interactive/answer_correct.png'],
['answer_wrong', baseUrl + 'icons_interactive/answer_wrong.png'],
['arrow_down', baseUrl + 'icons_interactive/arrow_down.png'],
// ['close', baseUrl + 'icons_interactive/close.png'],
['info', baseUrl + 'icons_interactive/info.png'],
['pointer', baseUrl + 'icons_interactive/pointer.png'],
// Menu icons - Games
['game_0', baseUrl + 'icons_menu/squareOne.png'], // Square I
['game_1', baseUrl + 'icons_menu/circleOne.png'], // Circle I
['game_2', baseUrl + 'icons_menu/squareTwo.png'], // Square II
['game_3', baseUrl + 'icons_menu/scaleOne.png'], // Scale I
// Menu icons - Info box
['c1-A', baseUrl + 'info_box/c1-A.png'],
['c1-A-h', baseUrl + 'info_box/c1-A-h.png'],
['c1-B-h', baseUrl + 'info_box/c1-B-h.png'],
['c1-diff-1', baseUrl + 'info_box/c1-diff-1.png'],
['c1-diff-5', baseUrl + 'info_box/c1-diff-5.png'],
['c1-label', baseUrl + 'info_box/c1-label.png'],
['map-c1s2', baseUrl + 'info_box/map-c1s2.png'],
['map-s1', baseUrl + 'info_box/map-s1.png'],
['s1-A', baseUrl + 'info_box/s1-A.png'],
['s1-A-h', baseUrl + 'info_box/s1-A-h.png'],
['s1-B-h', baseUrl + 'info_box/s1-B-h.png'],
['s1-diff-1', baseUrl + 'info_box/s1-diff-1.png'],
['s1-diff-3', baseUrl + 'info_box/s1-diff-3.png'],
['s1-label', baseUrl + 'info_box/s1-label.png'],
['s2', baseUrl + 'info_box/s2.png'],
['s2-A-h', baseUrl + 'info_box/s2-A-h.png'],
['s2-B-h', baseUrl + 'info_box/s2-B-h.png'],
['s2-diff-1', baseUrl + 'info_box/s2-diff-1.png'],
['s2-diff-5', baseUrl + 'info_box/s2-diff-5.png'],
['s2-label', baseUrl + 'info_box/s2-label.png'],
['op_plus', baseUrl + 'info_box/op_plus.png'],
['op_min', baseUrl + 'info_box/op_min.png'],
['op_mix', baseUrl + 'info_box/op_mix.png'],
['op_eq', baseUrl + 'info_box/op_eq.png'],
],
sprite: [
// scene
['map_place', baseUrl + 'scene/map_place.png', 2],
// Game Sprites
['kid_walking', baseUrl + 'characters/kid/walking.png', 26],
// Navigation icons on the top of the page
['audio', baseUrl + 'icons_navigation/audio.png', 2],
// Interactive icons
['select_input', baseUrl + 'icons_interactive/select_input.png', 2],
['btn_square', baseUrl + 'icons_interactive/btn_square.png', 2],
// Menu icons - Game modes
['mode_0', baseUrl + 'icons_menu/squareOne_1.png', 2], // Square I : A
['mode_1', baseUrl + 'icons_menu/squareOne_2.png', 2], // Square I : B
['mode_2', baseUrl + 'icons_menu/circleOne_1.png', 2], // Circle I : A
['mode_3', baseUrl + 'icons_menu/circleOne_2.png', 2], // Circle I : B
['mode_4', baseUrl + 'icons_menu/squareTwo_1.png', 2], // Square II : A
['mode_5', baseUrl + 'icons_menu/squareTwo_2.png', 2], // Square II : B
['mode_6', baseUrl + 'icons_menu/scaleOne_1.png', 2], // Scale I : A
// Menu icons - Math operations
['operation_plus', baseUrl + 'icons_menu/operation_plus.png', 2],
['operation_minus', baseUrl + 'icons_menu/operation_minus.png', 2],
['operation_mixed', baseUrl + 'icons_menu/operation_mixed.png', 2],
['operation_equals', baseUrl + 'icons_menu/operation_equals.png', 2],
],
audio: [
// Sound effects
['beepSound', ['./assets/audio/beep.ogg', './assets/audio/beep.mp3']],
['okSound', ['./assets/audio/ok.ogg', './assets/audio/ok.mp3']],
['errorSound', ['./assets/audio/error.ogg', './assets/audio/error.mp3']],
['popSound', ['', './assets/audio/pop.wav']],
],
},
squareOne: {
image: [
// Map buildings
['farm', baseUrl + 'scene/building_farm.png'],
['garage', baseUrl + 'scene/building_garage.png'],
],
sprite: [
// Game sprites
['tractor', baseUrl + 'characters/tractor/tractor.png', 15],
],
audio: [],
},
squareTwo: {
image: [
// Map buildings
['house', baseUrl + 'scene/building_house.png'],
['school', baseUrl + 'scene/building_school.png'],
],
sprite: [
// Game sprites
['kid_standing', baseUrl + 'characters/kid/lost.png', 6],
['kid_running', baseUrl + 'characters/kid/running.png', 12],
],
audio: [],
},
circleOne: {
image: [
// Map buildings
['house', baseUrl + 'scene/building_house.png'],
['school', baseUrl + 'scene/building_school.png'],
// Game images
['balloon', baseUrl + 'characters/balloon/balloon.png'],
['balloon_basket', baseUrl + 'characters/balloon/balloon_basket.png'],
],
sprite: [
// Game sprites
['kid_running', baseUrl + 'characters/kid/running.png', 12],
],
audio: [],
},
scaleOne: {
image: [
// Map buildings
['farm', baseUrl + 'scene/building_farm.png'],
['garage', baseUrl + 'scene/building_garage.png'],
// Game images
['scale_base', baseUrl + 'characters/scale/scale_base.png'],
['scale_arm', baseUrl + 'characters/scale/scale_arm.png'],
['scale_plate', baseUrl + 'characters/scale/scale_plate.png'],
],
sprite: [
// Map buildings
['tractor', baseUrl + 'characters/tractor/tractor.png', 15],
['floor_snow', baseUrl + 'scene/new_level/floor_snow.png', 9],
],
audio: [],
},
};