Merge branch 'release' into stable

pull/29/head
Paal Joergensen 2017-09-04 14:07:40 +02:00
commit 65f2d1d5e3
38 changed files with 3030 additions and 259 deletions

105
card.js
View File

@ -4,11 +4,14 @@
* Controls all the operations for each card. * Controls all the operations for each card.
* *
* @class H5P.MemoryGame.Card * @class H5P.MemoryGame.Card
* @extends H5P.EventDispatcher
* @param {Object} image * @param {Object} image
* @param {number} id * @param {number} id
* @param {string} [description] * @param {string} [description]
* @param {Object} [styles]
*/ */
MemoryGame.Card = function (image, id, description) { MemoryGame.Card = function (image, id, description, styles) {
/** @alias H5P.MemoryGame.Card# */
var self = this; var self = this;
// Initialize event inheritance // Initialize event inheritance
@ -53,6 +56,13 @@
$card.addClass('h5p-matched'); $card.addClass('h5p-matched');
}; };
/**
* Reset card to natural state
*/
self.reset = function () {
$card[0].classList.remove('h5p-flipped', 'h5p-matched');
};
/** /**
* Get card description. * Get card description.
* *
@ -79,8 +89,8 @@
self.appendTo = function ($container) { self.appendTo = function ($container) {
// TODO: Translate alt attr // TODO: Translate alt attr
$card = $('<li class="h5p-memory-wrap"><div class="h5p-memory-card" role="button" tabindex="1">' + $card = $('<li class="h5p-memory-wrap"><div class="h5p-memory-card" role="button" tabindex="1">' +
'<div class="h5p-front"></div>' + '<div class="h5p-front"' + (styles && styles.front ? styles.front : '') + '>' + (styles && styles.backImage ? '' : '<span></span>') + '</div>' +
'<div class="h5p-back">' + '<div class="h5p-back"' + (styles && styles.back ? styles.back : '') + '>' +
'<img src="' + path + '" alt="Memory Card" style="width:' + width + ';height:' + height + '"/>' + '<img src="' + path + '" alt="Memory Card" style="width:' + width + ';height:' + height + '"/>' +
'</div>' + '</div>' +
'</div></li>') '</div></li>')
@ -91,7 +101,15 @@
self.flip(); self.flip();
}) })
.end(); .end();
}; };
/**
* Re-append to parent container
*/
self.reAppend = function () {
var parent = $card[0].parentElement.parentElement;
parent.appendChild($card[0].parentElement);
};
}; };
// Extends the event dispatcher // Extends the event dispatcher
@ -124,4 +142,83 @@
params.match.path !== undefined); params.match.path !== undefined);
}; };
/**
* Determines the theme for how the cards should look
*
* @param {string} color The base color selected
* @param {number} invertShades Factor used to invert shades in case of bad contrast
*/
MemoryGame.Card.determineStyles = function (color, invertShades, backImage) {
var styles = {
front: '',
back: '',
backImage: !!backImage
};
// Create color theme
if (color) {
var frontColor = shade(color, 43.75 * invertShades);
var backColor = shade(color, 56.25 * invertShades);
styles.front += 'color:' + color + ';' +
'background-color:' + frontColor + ';' +
'border-color:' + frontColor +';';
styles.back += 'color:' + color + ';' +
'background-color:' + backColor + ';' +
'border-color:' + frontColor +';';
}
// Add back image for card
if (backImage) {
var backgroundImage = 'background-image:url(' + backImage + ')';
styles.front += backgroundImage;
styles.back += backgroundImage;
}
// Prep style attribute
if (styles.front) {
styles.front = ' style="' + styles.front + '"';
}
if (styles.back) {
styles.back = ' style="' + styles.back + '"';
}
return styles;
};
/**
* Convert hex color into shade depending on given percent
*
* @private
* @param {string} color
* @param {number} percent
* @return {string} new color
*/
var shade = function (color, percent) {
var newColor = '#';
// Determine if we should lighten or darken
var max = (percent < 0 ? 0 : 255);
// Always stay positive
if (percent < 0) {
percent *= -1;
}
percent /= 100;
for (var i = 1; i < 6; i += 2) {
// Grab channel and convert from hex to dec
var channel = parseInt(color.substr(i, 2), 16);
// Calculate new shade and convert back to hex
channel = (Math.round((max - channel) * percent) + channel).toString(16);
// Make sure to always use two digits
newColor += (channel.length < 2 ? '0' + channel : channel);
}
return newColor;
};
})(H5P.MemoryGame, H5P.EventDispatcher, H5P.jQuery); })(H5P.MemoryGame, H5P.EventDispatcher, H5P.jQuery);

View File

@ -7,16 +7,32 @@
* @param {H5P.jQuery} $container * @param {H5P.jQuery} $container
*/ */
MemoryGame.Counter = function ($container) { MemoryGame.Counter = function ($container) {
/** @alias H5P.MemoryGame.Counter# */
var self = this; var self = this;
var current = 0; var current = 0;
/**
* @private
*/
var update = function () {
$container[0].innerText = current;
};
/** /**
* Increment the counter. * Increment the counter.
*/ */
self.increment = function () { self.increment = function () {
current++; current++;
$container.text(current); update();
};
/**
* Revert counter back to its natural state
*/
self.reset = function () {
current = 0;
update();
}; };
}; };

3
crowdin.yml Normal file
View File

@ -0,0 +1,3 @@
files:
- source: /language/.en.json
translation: /language/%two_letters_code%.json

87
language/.en.json Normal file
View File

@ -0,0 +1,87 @@
{
"semantics": [
{
"widgets": [
{
"label": "Default"
}
],
"label": "Cards",
"entity": "card",
"field": {
"label": "Card",
"fields": [
{
"label": "Image"
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label": "Behavioural settings",
"description": "These options will let you control how the game behaves.",
"fields": [
{
"label": "Position the cards in a square",
"description": "Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label": "Number of cards to use",
"description": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label": "Add button for retrying when the game is over"
}
]
},
{
"label": "Look and feel",
"description": "Control the visuals of the game.",
"fields": [
{
"label": "Theme Color",
"description": "Choose a color to create a theme for your card game.",
"default": "#909090",
"spectrum": {}
},
{
"label": "Card Back",
"description": "Use a custom back for your cards."
}
]
},
{
"label": "Localization",
"fields": [
{
"label": "Card turns text",
"default": "Card turns"
},
{
"label": "Time spent text",
"default": "Time spent"
},
{
"label": "Feedback text",
"default": "Good work!"
},
{
"label": "Try again button text",
"default": "Try again?"
},
{
"label": "Close button label",
"default": "Close"
}
]
}
]
}

89
language/af.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

View File

@ -1,62 +1,89 @@
{ {
"semantics": [ "semantics":[
{ {
"label": "البطاقات", "widgets":[
"entity": "بطاقة", {
"field": { "label":"Default"
"label": "البطاقة", }
"fields": [ ],
"label":"البطاقات",
"entity":"بطاقة",
"field":{
"label":"البطاقة",
"fields":[
{ {
"label": "الصورة" "label":"الصورة"
}, },
{ {
"englishLabel": "Matching Image", "label":"Matching Image",
"label": "Matching Image", "description":"An optional image to match against instead of using two cards with the same image."
"englishDescription": "An optional image to match against instead of using two cards with the same image.",
"description": "An optional image to match against instead of using two cards with the same image."
}, },
{ {
"label": "الوصف", "label":"الوصف",
"description": "نص قصير يتم عرضه مرة واحدة علي اثنين من البطاقات متساوية" "description":"نص قصير يتم عرضه مرة واحدة علي اثنين من البطاقات متساوية"
} }
] ]
} }
}, },
{ {
"englishLabel": "Behavioural settings", "label":"Behavioural settings",
"label": "Behavioural settings", "description":"These options will let you control how the game behaves.",
"englishDescription": "These options will let you control how the game behaves.", "fields":[
"description": "These options will let you control how the game behaves.",
"fields": [
{ {
"englishLabel": "Put the cards in a grid layout", "label":"Position the cards in a square",
"label": "Put the cards in a grid layout" "description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
}, },
{ {
"englishLabel": "Number of cards to use", "label":"Number of cards to use",
"label": "Number of cards to use", "description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
"englishDescription": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards.",
"description": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
}, },
{ {
"englishLabel": "Add button for retrying when the game is over", "label":"Add button for retrying when the game is over"
"label": "Add button for retrying when the game is over"
} }
] ]
}, },
{ {
"label": "الأقلمة", "label":"Look and feel",
"fields": [ "description":"Control the visuals of the game.",
"fields":[
{ {
"label": "نص تدوير البطاقة" "label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
}, },
{ {
"label": "نص التوقيت الزمني" "label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"الأقلمة",
"fields":[
{
"label":"نص تدوير البطاقة",
"default":"Card turns"
}, },
{ {
"label": "نص الملاحظات" "label":"نص التوقيت الزمني",
"default":"Time spent"
},
{
"label":"نص الملاحظات",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
} }
] ]
} }
] ]
} }

89
language/bs.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Karte",
"entity":"karte",
"field":{
"label":"Karte",
"fields":[
{
"label":"Slika"
},
{
"label":"Ista slika",
"description":"Opcionalna slika koja se koristi umjestodvije iste slike."
},
{
"label":"Opis",
"description":"Kratak tekst koji će biti prikazan čim se pronađu dvije iste karte."
}
]
}
},
{
"label":"Podešavanje ponašanja",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Poredaj karte u redove ",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Broj karata za upotrebu",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Prijevod",
"fields":[
{
"label":"Tekst kad se okrene karta ",
"default":"Okrenuta karta"
},
{
"label":"Tekst za provedeno vrijeme",
"default":"Provedeno vrijeme"
},
{
"label":"Feedback tekst",
"default":"BRAVO!"
},
{
"label":"Tekst na dugmetu pokušaj ponovo",
"default":"Pokušaj ponovo?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/ca.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/cs.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/da.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

View File

@ -1,65 +1,89 @@
{ {
"semantics": [ "semantics":[
{ {
"label": "Karten", "widgets":[
"entity": "karte", {
"field": { "label":"Vorgaben"
"label": "Karte", }
"fields": [ ],
"label":"Karten",
"entity":"karte",
"field":{
"label":"Karte",
"fields":[
{ {
"label": "Bild" "label":"Bild"
}, },
{ {
"englishLabel": "Matching Image", "label":"Passendes Bild",
"label": "Matching Image", "description":"Ein optionales anderes Bild als Gegenstück statt zwei Karten mit dem selben Bild zu nutzen"
"englishDescription": "An optional image to match against instead of using two cards with the same image.",
"description": "An optional image to match against instead of using two cards with the same image."
}, },
{ {
"label": "Beschreibung", "label":"Beschreibung",
"description": "Ein kurzer Text, der angezeigt wird, sobald zwei identische Karten gefunden werden." "description":"Ein kurzer Text, der angezeigt wird, sobald zwei identische Karten gefunden werden."
} }
] ]
} }
}, },
{ {
"englishLabel": "Behavioural settings", "label":"Interaktionseinstellungen",
"label": "Behavioural settings", "description":"Mit diesen Einstellungen kannst du das Verhalten des Spiels anpassen.",
"englishDescription": "These options will let you control how the game behaves.", "fields":[
"description": "These options will let you control how the game behaves.",
"fields": [
{ {
"englishLabel": "Put the cards in a grid layout", "label":"Positioniere die Karten in einem Quadrat.",
"label": "Put the cards in a grid layout" "description":"Es wird versucht, die Anzahl der Zeilen und Spalten passend zu den Karten einzustellen. Danach werden die Karten passend skaliert."
}, },
{ {
"englishLabel": "Number of cards to use", "label":"Anzahl der zu nutzenden Karten",
"label": "Number of cards to use", "description":"Wird hier eine Zahl größer als 2 eingestellt, werden zufällig Karten aus der Kartenliste gezogen."
"englishDescription": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards.",
"description": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
}, },
{ {
"englishLabel": "Add button for retrying when the game is over", "label":"Füge einen Button hinzu, um das Spiel noch einmal neu zu starten zu können, wenn es vorbei ist."
"label": "Add button for retrying when the game is over"
} }
] ]
}, },
{ {
"label": "Übersetzung", "label":"Design-Aspekte",
"fields": [ "description":"Beeinflusse die Optik des Spiels",
"fields":[
{ {
"label": "Text für die Anzahl der Züge", "label":"Themenfarbe",
"default": "Züge" "description":"Wähle eine Farbe, um ein Theme für deine Karten zu erstellen.",
"default":"#909090",
"spectrum":{
}
}, },
{ {
"label": "Text für die benötigte Zeit", "label":"Kartenrückseite",
"default": "Benötigte Zeit" "description":"Nutze eine individuelle Rückseite für deine Karten."
}
]
},
{
"label":"Übersetzung",
"fields":[
{
"label":"Text für die Anzahl der Züge",
"default":"Züge"
}, },
{ {
"label": "Text als Rückmeldung", "label":"Text für die benötigte Zeit",
"default": "Gute Arbeit!" "default":"Benötigte Zeit"
},
{
"label":"Text als Rückmeldung",
"default":"Gute Arbeit!"
},
{
"label":"Text des Wiederholen-Buttons",
"default":"Erneut versuchen?"
},
{
"label":"Beschriftung des \"Abbrechen\"-Buttons",
"default":"Schließen"
} }
] ]
} }
] ]
} }

89
language/el.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/es.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Predeterminado"
}
],
"label":"Tarjetas",
"entity":"card",
"field":{
"label":"Tarjeta",
"fields":[
{
"label":"Imagen"
},
{
"label":"Imagen coincidente",
"description":"Una imagen opcional para emparejar, en vez de usar dos tarjetas con la misma imagen."
},
{
"label":"Descripción",
"description":"Un breve texto opcional que aparecerá una vez se encuentren las dos cartas coincidentes."
}
]
}
},
{
"label":"Ajustes de comportamiento",
"description":"Estas opciones le permitirán controlar cómo se comporta el juego.",
"fields":[
{
"label":"Coloca las tarjetas en un cuadrado",
"description":"Intentará igualar el número de columnas y filas al distribuir las tarjetas. Después, las tarjetas se escalarán para que se ajusten al contenedor."
},
{
"label":"Número de tarjetas a utilizar",
"description":"Establecer esto a un número mayor que 2 hará que el juego seleccione tarjetas aleatorias de la lista de tarjetas."
},
{
"label":"Añadir botón para volver a intentarlo cuando el juego ha terminado"
}
]
},
{
"label":"Aspecto y comportamiento",
"description":"Controla los efectos visuales del juego.",
"fields":[
{
"label":"Color del tema",
"description":"Elegir un color para crear un tema para su juego de cartas.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Parte posterior de la tarjeta",
"description":"Utilice una parte posterior personalizada para sus tarjetas."
}
]
},
{
"label":"Localización",
"fields":[
{
"label":"Texto para los giros de tarjetas",
"default":"Giros de tarjeta"
},
{
"label":"Texto de tiempo usado",
"default":"Tiempo usado"
},
{
"label":"Texto de comentarios",
"default":"¡Buen trabajo!"
},
{
"label":"Intente del botón Intente de nuevo",
"default":"¿Volver a intentarlo?"
},
{
"label":"Etiqueta del botón Cerrar",
"default":"Cerrar"
}
]
}
]
}

89
language/et.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/fi.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

View File

@ -1,65 +1,89 @@
{ {
"semantics": [ "semantics":[
{ {
"label": "Cartes", "widgets":[
"entity": "carte", {
"field": { "label":"Default"
"label": "Carte", }
"fields": [ ],
"label":"Cartes",
"entity":"carte",
"field":{
"label":"Carte",
"fields":[
{ {
"label": "Image" "label":"Image"
}, },
{ {
"englishLabel": "Matching Image", "label":"Matching Image",
"label": "Matching Image", "description":"An optional image to match against instead of using two cards with the same image."
"englishDescription": "An optional image to match against instead of using two cards with the same image.",
"description": "An optional image to match against instead of using two cards with the same image."
}, },
{ {
"label": "Description", "label":"Description",
"description": "Petit texte affiché quand deux cartes identiques sont trouvées." "description":"Petit texte affiché quand deux cartes identiques sont trouvées."
} }
] ]
} }
}, },
{ {
"englishLabel": "Behavioural settings", "label":"Behavioural settings",
"label": "Behavioural settings", "description":"These options will let you control how the game behaves.",
"englishDescription": "These options will let you control how the game behaves.", "fields":[
"description": "These options will let you control how the game behaves.",
"fields": [
{ {
"englishLabel": "Put the cards in a grid layout", "label":"Position the cards in a square",
"label": "Put the cards in a grid layout" "description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
}, },
{ {
"englishLabel": "Number of cards to use", "label":"Number of cards to use",
"label": "Number of cards to use", "description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
"englishDescription": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards.",
"description": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
}, },
{ {
"englishLabel": "Add button for retrying when the game is over", "label":"Add button for retrying when the game is over"
"label": "Add button for retrying when the game is over"
} }
] ]
}, },
{ {
"label": "Interface", "label":"Look and feel",
"fields": [ "description":"Control the visuals of the game.",
"fields":[
{ {
"label": "Texte pour le nombre de cartes retournées", "label":"Theme Color",
"default": "Cartes retournées :" "description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
}, },
{ {
"label": "Texte pour le temps passé", "label":"Card Back",
"default": "Temps écoulé :" "description":"Use a custom back for your cards."
}
]
},
{
"label":"Interface",
"fields":[
{
"label":"Texte pour le nombre de cartes retournées",
"default":"Cartes retournées :"
}, },
{ {
"label": "Texte de l'appréciation finale", "label":"Texte pour le temps passé",
"default": "Bien joué !" "default":"Temps écoulé :"
},
{
"label":"Texte de l'appréciation finale",
"default":"Bien joué !"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
} }
] ]
} }
] ]
} }

89
language/he.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/hu.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

View File

@ -1,62 +1,89 @@
{ {
"semantics": [ "semantics":[
{ {
"label": "Carte", "widgets":[
"entity": "carta", {
"field": { "label":"Default"
"label": "Carta", }
"fields": [ ],
"label":"Carte",
"entity":"carta",
"field":{
"label":"Carta",
"fields":[
{ {
"label": "Immagine" "label":"Immagine"
}, },
{ {
"englishLabel": "Matching Image", "label":"Matching Image",
"label": "Matching Image", "description":"An optional image to match against instead of using two cards with the same image."
"englishDescription": "An optional image to match against instead of using two cards with the same image.",
"description": "An optional image to match against instead of using two cards with the same image."
}, },
{ {
"label": "Descrizione", "label":"Descrizione",
"description": "Breve testo visualizzato quando due carte uguali vengono trovate." "description":"Breve testo visualizzato quando due carte uguali vengono trovate."
} }
] ]
} }
}, },
{ {
"englishLabel": "Behavioural settings", "label":"Behavioural settings",
"label": "Behavioural settings", "description":"These options will let you control how the game behaves.",
"englishDescription": "These options will let you control how the game behaves.", "fields":[
"description": "These options will let you control how the game behaves.",
"fields": [
{ {
"englishLabel": "Put the cards in a grid layout", "label":"Position the cards in a square",
"label": "Put the cards in a grid layout" "description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
}, },
{ {
"englishLabel": "Number of cards to use", "label":"Number of cards to use",
"label": "Number of cards to use", "description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
"englishDescription": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards.",
"description": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
}, },
{ {
"englishLabel": "Add button for retrying when the game is over", "label":"Add button for retrying when the game is over"
"label": "Add button for retrying when the game is over"
} }
] ]
}, },
{ {
"label": "Localizzazione", "label":"Look and feel",
"fields": [ "description":"Control the visuals of the game.",
"fields":[
{ {
"label": "Testo Gira carta" "label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
}, },
{ {
"label": "Testo Tempo trascorso" "label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localizzazione",
"fields":[
{
"label":"Testo Gira carta",
"default":"Card turns"
}, },
{ {
"label": "Testo Feedback" "label":"Testo Tempo trascorso",
"default":"Time spent"
},
{
"label":"Testo Feedback",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
} }
] ]
} }
] ]
} }

89
language/ja.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"デフォルト"
}
],
"label":"カード",
"entity":"card",
"field":{
"label":"カード",
"fields":[
{
"label":"画像"
},
{
"label":"一致させる画像",
"description":"同じ画像の2枚のカードを使用する代わりに、別に一致させるためのオプション画像"
},
{
"label":"説明",
"description":"一致する2つのカードが見つかるとポップアップするオプションの短文テキスト。"
}
]
}
},
{
"label":"動作設定",
"description":"これらのオプションを使用して、ゲームの動作を制御できます。",
"fields":[
{
"label":"カードを正方形に配置",
"description":"カードをレイアウトするときに、列と行の数を一致させてみてください。そうすると、カードは、コンテナに合わせてスケーリングされます。"
},
{
"label":"使用するカードの数",
"description":"これを2よりも大きい数値に設定すると、カードのリストからランダムなカードが選ばれるようになります。"
},
{
"label":"ゲームが終了したときに、リトライのためのボタンを追加"
}
]
},
{
"label":"ルック&フィール",
"description":"ゲームの外観を制御します。",
"fields":[
{
"label":"テーマ色",
"description":"カードゲームのテーマとなる色を選択してください。",
"default":"#909090",
"spectrum":{
}
},
{
"label":"カード裏",
"description":"カードに独自の裏を使います。"
}
]
},
{
"label":"ローカリゼーション",
"fields":[
{
"label":"カードターン のテキスト",
"default":"カードターン"
},
{
"label":"経過時間のテキスト",
"default":"経過時間"
},
{
"label":"フィードバックテキスト",
"default":"よくできました!"
},
{
"label":"リトライボタンのテキスト",
"default":"もう一度トライしますか ?"
},
{
"label":"閉じるボタンのテキスト",
"default":"閉じる"
}
]
}
]
}

89
language/ko.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

View File

@ -1,78 +1,89 @@
{ {
"semantics": [ "semantics":[
{ {
"englishLabel": "Cards", "widgets":[
"label": "Kort", {
"englishEntity": "card", "label":"Default"
"entity": "kort", }
"field": { ],
"englishLabel": "Card", "label":"Kort",
"label": "Kort", "entity":"kort",
"fields": [ "field":{
"label":"Kort",
"fields":[
{ {
"englishLabel": "Image", "label":"Bilde"
"label": "Bilde"
}, },
{ {
"englishLabel": "Matching Image", "label":"Tilhørende bilde",
"label": "Tilhørende bilde", "description":"Et valgfritt bilde som brukes av kort nummer to istedenfor å bruke to kort med samme bilde."
"englishDescription": "An optional image to match against instead of using two cards with the same image.",
"description": "Et valgfritt bilde som brukes av kort nummer to istedenfor å bruke to kort med samme bilde."
}, },
{ {
"englishLabel": "Description", "label":"Beskrivelse",
"label": "Beskrivelse", "description":"En valgfri kort tekst som spretter opp når kort-paret er funnet."
"englishDescription": "An optional short text that will pop up once the two matching cards are found.",
"description": "En valgfri kort tekst som spretter opp når kort-paret er funnet."
} }
] ]
} }
}, },
{ {
"englishLabel": "Behavioural settings", "label":"Innstillinger for oppførsel",
"label": "Innstillinger for oppførsel", "description":"Disse instillingene lar deg bestemme hvordan spillet skal oppføre seg.",
"englishDescription": "These options will let you control how the game behaves.", "fields":[
"description": "Disse instillingene lar deg bestemme hvordan spillet skal oppføre seg.",
"fields": [
{ {
"englishLabel": "Put the cards in a grid layout", "label":"Plasser kortene i en firkant",
"label": "Putt kortene i et rutenett" "description":"Vil forsøk å samsvare antall kolonner og rader når kortene legges ut. Etterpå vil kortene bli skalert til å passe beholderen."
}, },
{ {
"englishLabel": "Number of cards to use", "label":"Antall kort som skal brukes",
"label": "Antall kort som skal brukes", "description":"Ved å sette antallet høyere enn 2 vil spillet plukke tilfeldige kort fra listen over kort."
"englishDescription": "Setting this to a number greater than 2 will make the game pick random cards from the list of cards.",
"description": "Ved å sette antallet høyere enn 2 vil spillet plukke tilfeldige kort fra listen over kort."
}, },
{ {
"englishLabel": "Add button for retrying when the game is over", "label":"Legg til knapp for å prøve på nytt når spillet er over"
"label": "Legg til knapp for å prøve på nytt når spillet er over"
} }
] ]
}, },
{ {
"englishLabel": "Localization", "label":"Tilpass utseende",
"label": "Oversettelser", "description":"Kontroller de visuelle aspektene ved spillet.",
"fields": [ "fields":[
{ {
"englishLabel": "Card turns text", "label":"Temafarge",
"label": "Etikett for antall vendte kort", "description":"Velg en farge for å skape et tema over kortspillet ditt.",
"englishDefault": "Card turns", "default":"#909090",
"default": "Kort vendt" "spectrum":{
}
}, },
{ {
"englishLabel": "Time spent text", "label":"Kortbaksiden",
"label": "Etikett for tid brukt", "description":"Bruk en tilpasset kortbakside for kortene dine."
"englishDefault": "Time spent", }
"default": "Tid brukt" ]
},
{
"label":"Oversettelser",
"fields":[
{
"label":"Etikett for antall vendte kort",
"default":"Kort vendt"
}, },
{ {
"englishLabel": "Feedback text", "label":"Etikett for tid brukt",
"label": "Tilbakemeldingstekst", "default":"Tid brukt"
"englishDefault": "Good work!", },
"default": "Godt jobbet!" {
"label":"Tilbakemeldingstekst",
"default":"Godt jobbet!"
},
{
"label":"Prøv på nytt-tekst",
"default":"Prøv på nytt?"
},
{
"label":"Lukk knapp-merkelapp",
"default":"Lukk"
} }
] ]
} }
] ]
} }

89
language/nl.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/nn.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/pl.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/pt.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/ro.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/ru.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/sr.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/sv.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/tr.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

89
language/vi.json Normal file
View File

@ -0,0 +1,89 @@
{
"semantics":[
{
"widgets":[
{
"label":"Default"
}
],
"label":"Cards",
"entity":"card",
"field":{
"label":"Card",
"fields":[
{
"label":"Image"
},
{
"label":"Matching Image",
"description":"An optional image to match against instead of using two cards with the same image."
},
{
"label":"Description",
"description":"An optional short text that will pop up once the two matching cards are found."
}
]
}
},
{
"label":"Behavioural settings",
"description":"These options will let you control how the game behaves.",
"fields":[
{
"label":"Position the cards in a square",
"description":"Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container."
},
{
"label":"Number of cards to use",
"description":"Setting this to a number greater than 2 will make the game pick random cards from the list of cards."
},
{
"label":"Add button for retrying when the game is over"
}
]
},
{
"label":"Look and feel",
"description":"Control the visuals of the game.",
"fields":[
{
"label":"Theme Color",
"description":"Choose a color to create a theme for your card game.",
"default":"#909090",
"spectrum":{
}
},
{
"label":"Card Back",
"description":"Use a custom back for your cards."
}
]
},
{
"label":"Localization",
"fields":[
{
"label":"Card turns text",
"default":"Card turns"
},
{
"label":"Time spent text",
"default":"Time spent"
},
{
"label":"Feedback text",
"default":"Good work!"
},
{
"label":"Try again button text",
"default":"Try again?"
},
{
"label":"Close button label",
"default":"Close"
}
]
}
]
}

View File

@ -3,7 +3,7 @@
"description": "See how many cards you can remember!", "description": "See how many cards you can remember!",
"majorVersion": 1, "majorVersion": 1,
"minorVersion": 2, "minorVersion": 2,
"patchVersion": 2, "patchVersion": 5,
"runnable": 1, "runnable": 1,
"author": "Joubel", "author": "Joubel",
"license": "MIT", "license": "MIT",
@ -25,6 +25,9 @@
}, },
{ {
"path": "popup.js" "path": "popup.js"
},
{
"path": "timer.js"
} }
], ],
"preloadedDependencies": [ "preloadedDependencies": [
@ -32,6 +35,23 @@
"machineName": "H5P.Timer", "machineName": "H5P.Timer",
"majorVersion": 0, "majorVersion": 0,
"minorVersion": 4 "minorVersion": 4
},
{
"machineName": "FontAwesome",
"majorVersion": 4,
"minorVersion": 5
}
],
"editorDependencies": [
{
"machineName": "H5PEditor.ColorSelector",
"majorVersion": 1,
"minorVersion": 2
},
{
"machineName": "H5PEditor.VerticalTabs",
"majorVersion": 1,
"minorVersion": 3
} }
] ]
} }

View File

@ -25,6 +25,7 @@
display: inline-block !important; display: inline-block !important;
margin: auto !important; margin: auto !important;
vertical-align: middle; vertical-align: middle;
position: relative;
} }
.h5p-memory-game .h5p-memory-wrap { .h5p-memory-game .h5p-memory-wrap {
float: left; float: left;
@ -55,6 +56,7 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
background: #cfcfcf; background: #cfcfcf;
background-size: cover;
border: 2px solid #d0d0d0; border: 2px solid #d0d0d0;
box-sizing: border-box; box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
@ -75,14 +77,32 @@
.h5p-memory-game .h5p-memory-card .h5p-front { .h5p-memory-game .h5p-memory-card .h5p-front {
cursor: pointer; cursor: pointer;
text-align: center; text-align: center;
color: #909090;
} }
.h5p-memory-game .h5p-memory-card .h5p-front:hover { .h5p-memory-game .h5p-memory-card .h5p-front:before,
background: #dfdfdf; .h5p-memory-game .h5p-memory-card .h5p-back:before,
.h5p-memory-game .h5p-memory-image:before {
position: absolute;
display: block;
content: "";
width: 100%;
height: 100%;
background: #fff;
opacity: 0;
} }
.h5p-memory-game .h5p-memory-card .h5p-front:before { .h5p-memory-game.h5p-invert-shades .h5p-memory-card .h5p-front:before,
.h5p-memory-game.h5p-invert-shades .h5p-memory-card .h5p-back:before,
.h5p-memory-game.h5p-invert-shades .h5p-memory-image:before {
background: #000;
}
.h5p-memory-game .h5p-memory-card .h5p-front:hover:before {
opacity: 0.4;
}
.h5p-memory-game .h5p-memory-card .h5p-front > span:before {
position: relative;
content: "?"; content: "?";
font-size: 3.75em; font-size: 3.75em;
color: #909090;
line-height: 1.67em; line-height: 1.67em;
} }
.h5p-memory-game .h5p-memory-card .h5p-front:after { .h5p-memory-game .h5p-memory-card .h5p-front:after {
@ -100,15 +120,19 @@
background-image: radial-gradient(ellipse closest-side, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 100%); background-image: radial-gradient(ellipse closest-side, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0) 100%);
} }
.h5p-memory-game .h5p-memory-card .h5p-back { .h5p-memory-game .h5p-memory-card .h5p-back {
line-height: 5.9em; line-height: 5.83em;
text-align: center; text-align: center;
background: #f0f0f0; background-color: #f0f0f0;
-webkit-transform: rotateY(-180deg); -webkit-transform: rotateY(-180deg);
-moz-transform: rotateY(-180deg); -moz-transform: rotateY(-180deg);
transform: rotateY(-180deg); transform: rotateY(-180deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
-ms-transform: scale(0,1.1); -ms-transform: scale(0,1.1);
} }
.h5p-memory-game .h5p-memory-card .h5p-back:before,
.h5p-memory-game .h5p-memory-image:before {
opacity: 0.5;
}
.h5p-memory-game .h5p-memory-card.h5p-flipped .h5p-back { .h5p-memory-game .h5p-memory-card.h5p-flipped .h5p-back {
-webkit-transform: rotateY(0deg); -webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg); -moz-transform: rotateY(0deg);
@ -124,6 +148,8 @@
} }
.h5p-memory-game .h5p-memory-card.h5p-matched { .h5p-memory-game .h5p-memory-card.h5p-matched {
opacity: 0.3; opacity: 0.3;
}
.h5p-memory-game .h5p-memory-card.h5p-matched img {
filter: grayscale(100%); filter: grayscale(100%);
} }
@ -170,19 +196,32 @@
.h5p-memory-game .h5p-memory-pop { .h5p-memory-game .h5p-memory-pop {
display: none; display: none;
background: #fff; background: #fff;
padding: 1em; padding: 0.25em;
width: 20em; width: 24em;
max-width: 90%;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; left: 50%;
box-shadow: 0 0 1em #666; box-shadow: 0 0 2em #666;
border-radius: 0.25em;
-webkit-transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%);
transform: translate(-50%,-50%); transform: translate(-50%,-50%);
} }
.h5p-memory-game .h5p-memory-top {
padding: 0em 1em;
background-color: #f0f0f0;
background-size: cover;
text-align: center;
margin-bottom: 1.75em;
border-bottom: 1px solid #d0d0d0;
}
.h5p-memory-game .h5p-memory-image { .h5p-memory-game .h5p-memory-image {
float: left; display: inline-block;
margin: 0 1em 1em 0; line-height: 5.83em;
position: relative;
top: 1.5em;
left: -0.5em;
border: 2px solid #d0d0d0; border: 2px solid #d0d0d0;
box-sizing: border-box; box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
@ -190,7 +229,81 @@
background: #f0f0f0; background: #f0f0f0;
width: 6.25em; width: 6.25em;
height: 6.25em; height: 6.25em;
text-align: center;
overflow: hidden;
box-shadow: 0 0 1em rgba(125,125,125,0.5);
background-size: cover;
}
.h5p-memory-game .h5p-memory-image:first-child {
top: 1em;
left: 0;
}
.h5p-memory-game .h5p-memory-two-images .h5p-memory-image:first-child {
left: 0.5em;
} }
.h5p-memory-game .h5p-row-break { .h5p-memory-game .h5p-row-break {
clear: left; clear: left;
} }
.h5p-memory-game .h5p-memory-desc {
padding: 1em;
margin-bottom: 0.5em;
text-align: center;
}
.h5p-memory-game .h5p-memory-close {
cursor: pointer;
position: absolute;
top: 0.5em;
right: 0.5em;
font-size: 2em;
width: 1em;
height: 1em;
text-align: center;
color: #888;
}
.h5p-memory-game .h5p-memory-close:before {
content: "\00D7"
}
.h5p-memory-game .h5p-memory-close:hover {
color: #666;
}
.h5p-memory-game .h5p-memory-close:focus {
outline: 2px dashed pink;
}
.h5p-memory-reset {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%) scale(1) rotate(0);
cursor: pointer;
line-height: 1.2;
white-space: nowrap;
padding: 0.5em 1.25em;
border-radius: 2em;
background: #1a73d9;
color: #ffffff;
box-shadow: 0 0.5em 1em #999;
opacity: 1;
transition: box-shadow 200ms linear, margin 200ms linear, transform 300ms ease-out, opacity 300ms ease-out;
}
.h5p-memory-reset:before {
font-family: 'H5PFontAwesome4';
content: "\f01e";
margin-right: 0.5em;
}
.h5p-memory-reset:hover,
.h5p-memory-reset:focus {
background: #1356a3;
box-shadow: 0 1em 1.5em #999;
margin-top: -0.2em;
}
.h5p-memory-reset:focus {
outline: 2px dashed pink;
}
.h5p-memory-transin {
transform: translate(-50%,-50%) scale(0) rotate(180deg);
opacity: 0;
}
.h5p-memory-transout {
transform: translate(-50%,-450%) scale(0) rotate(360deg);
opacity: 0;
}

View File

@ -9,11 +9,13 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
/** /**
* Memory Game Constructor * Memory Game Constructor
* *
* @class * @class H5P.MemoryGame
* @extends H5P.EventDispatcher
* @param {Object} parameters * @param {Object} parameters
* @param {Number} id * @param {Number} id
*/ */
function MemoryGame(parameters, id) { function MemoryGame(parameters, id) {
/** @alias H5P.MemoryGame# */
var self = this; var self = this;
// Initialize event inheritance // Initialize event inheritance
@ -21,6 +23,8 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
var flipped, timer, counter, popup, $feedback, $wrapper, maxWidth, numCols; var flipped, timer, counter, popup, $feedback, $wrapper, maxWidth, numCols;
var cards = []; var cards = [];
var flipBacks = []; // Que of cards to be flipped back
var numFlipped = 0;
var removed = 0; var removed = 0;
/** /**
@ -32,47 +36,149 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
* @param {H5P.MemoryGame.Card} correct * @param {H5P.MemoryGame.Card} correct
*/ */
var check = function (card, mate, correct) { var check = function (card, mate, correct) {
if (mate === correct) { if (mate !== correct) {
// Remove them from the game. // Incorrect, must be scheduled for flipping back
card.remove(); flipBacks.push(card);
mate.remove(); flipBacks.push(mate);
removed += 2; // Wait for next click to flip them back…
if (numFlipped > 2) {
var finished = (removed === cards.length); // or do it straight away
var desc = card.getDescription(); processFlipBacks();
if (finished) {
self.triggerXAPIScored(1, 1, 'completed');
}
if (desc !== undefined) {
// Pause timer and show desciption.
timer.pause();
popup.show(desc, card.getImage(), function () {
if (finished) {
// Game has finished
$feedback.addClass('h5p-show');
if (parameters.behaviour && parameters.behaviour.allowRetry) { /* TODO */ }
}
else {
// Popup is closed, continue.
timer.play();
}
});
}
else if (finished) {
// Game has finished
timer.stop();
$feedback.addClass('h5p-show');
if (parameters.behaviour && parameters.behaviour.allowRetry) { /* TODO */ }
} }
return;
} }
else {
// Flip them back // Remove them from the game.
card.flipBack(); card.remove();
mate.flipBack(); mate.remove();
// Update counters
numFlipped -= 2;
removed += 2;
var isFinished = (removed === cards.length);
var desc = card.getDescription();
if (desc !== undefined) {
// Pause timer and show desciption.
timer.pause();
var imgs = [card.getImage()];
if (card.hasTwoImages) {
imgs.push(mate.getImage());
}
popup.show(desc, imgs, cardStyles ? cardStyles.back : undefined, function () {
if (isFinished) {
// Game done
finished();
}
else {
// Popup is closed, continue.
timer.play();
}
});
} }
else if (isFinished) {
// Game done
finished();
}
};
/**
* Game has finished!
* @private
*/
var finished = function () {
timer.stop();
$feedback.addClass('h5p-show');
// Create and trigger xAPI event 'completed'
var completedEvent = self.createXAPIEventTemplate('completed');
completedEvent.setScoredResult(1, 1, self, true, true);
completedEvent.data.statement.result.duration = 'PT' + (Math.round(timer.getTime() / 10) / 100) + 'S';
self.trigger(completedEvent);
if (parameters.behaviour && parameters.behaviour.allowRetry) {
// Create retry button
var retryButton = createButton('reset', parameters.l10n.tryAgain || 'Reset', function () {
// Trigger handler (action)
retryButton.classList.add('h5p-memory-transout');
setTimeout(function () {
// Remove button on nextTick to get transition effect
$wrapper[0].removeChild(retryButton);
}, 300);
resetGame();
});
retryButton.classList.add('h5p-memory-transin');
setTimeout(function () {
// Remove class on nextTick to get transition effect
retryButton.classList.remove('h5p-memory-transin');
}, 0);
// Same size as cards
retryButton.style.fontSize = (parseFloat($wrapper.children('ul')[0].style.fontSize) * 0.75) + 'px';
$wrapper[0].appendChild(retryButton); // Add to DOM
}
};
/**
* Shuffle the cards and restart the game!
* @private
*/
var resetGame = function () {
// Reset cards
removed = 0;
for (var i = 0; i < cards.length; i++) {
cards[i].reset();
}
// Remove feedback
$feedback[0].classList.remove('h5p-show');
// Reset timer and counter
timer.reset();
counter.reset();
// Randomize cards
H5P.shuffleArray(cards);
setTimeout(function () {
// Re-append to DOM after flipping back
for (var i = 0; i < cards.length; i++) {
cards[i].reAppend();
}
// Scale new layout
$wrapper.children('ul').children('.h5p-row-break').removeClass('h5p-row-break');
maxWidth = -1;
self.trigger('resize');
}, 600);
};
/**
* Game has finished!
* @private
*/
var createButton = function (name, label, action) {
var buttonElement = document.createElement('div');
buttonElement.classList.add('h5p-memory-' + name);
buttonElement.innerHTML = label;
buttonElement.setAttribute('role', 'button');
buttonElement.tabIndex = 0;
buttonElement.addEventListener('click', function (event) {
action.apply(buttonElement);
}, false);
buttonElement.addEventListener('keypress', function (event) {
if (event.which === 13 || event.which === 32) { // Enter or Space key
event.preventDefault();
action.apply(buttonElement);
}
}, false);
return buttonElement;
}; };
/** /**
@ -88,6 +194,9 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
// Keep track of time spent // Keep track of time spent
timer.play(); timer.play();
// Keep track of the number of flipped cards
numFlipped++;
if (flipped !== undefined) { if (flipped !== undefined) {
var matie = flipped; var matie = flipped;
// Reset the flipped card. // Reset the flipped card.
@ -98,6 +207,11 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
}, 800); }, 800);
} }
else { else {
if (flipBacks.length > 1) {
// Turn back any flipped cards
processFlipBacks();
}
// Keep track of the flipped card. // Keep track of the flipped card.
flipped = card; flipped = card;
} }
@ -109,6 +223,16 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
cards.push(card); cards.push(card);
}; };
/**
* Will flip back two and two cards
*/
var processFlipBacks = function () {
flipBacks[0].flipBack();
flipBacks[1].flipBack();
flipBacks.splice(0, 2);
numFlipped -= 2;
};
/** /**
* @private * @private
*/ */
@ -138,21 +262,31 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
return cardsToUse; return cardsToUse;
}; };
var cardStyles, invertShades;
if (parameters.lookNFeel) {
// If the contrast between the chosen color and white is too low we invert the shades to create good contrast
invertShades = (parameters.lookNFeel.themeColor &&
getContrast(parameters.lookNFeel.themeColor) < 1.7 ? -1 : 1);
var backImage = (parameters.lookNFeel.cardBack ? H5P.getPath(parameters.lookNFeel.cardBack.path, id) : null);
cardStyles = MemoryGame.Card.determineStyles(parameters.lookNFeel.themeColor, invertShades, backImage);
}
// Initialize cards. // Initialize cards.
var cardsToUse = getCardsToUse(); var cardsToUse = getCardsToUse();
for (var i = 0; i < cardsToUse.length; i++) { for (var i = 0; i < cardsToUse.length; i++) {
var cardParams = cardsToUse[i]; var cardParams = cardsToUse[i];
if (MemoryGame.Card.isValid(cardParams)) { if (MemoryGame.Card.isValid(cardParams)) {
// Create first card // Create first card
var cardTwo, cardOne = new MemoryGame.Card(cardParams.image, id, cardParams.description); var cardTwo, cardOne = new MemoryGame.Card(cardParams.image, id, cardParams.description, cardStyles);
if (MemoryGame.Card.hasTwoImages(cardParams)) { if (MemoryGame.Card.hasTwoImages(cardParams)) {
// Use matching image for card two // Use matching image for card two
cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.description); cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.description, cardStyles);
cardOne.hasTwoImages = cardTwo.hasTwoImages = true;
} }
else { else {
// Add two cards with the same image // Add two cards with the same image
cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.description); cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.description, cardStyles);
} }
// Add cards to card list for shuffeling // Add cards to card list for shuffeling
@ -171,6 +305,9 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
this.triggerXAPI('attempted'); this.triggerXAPI('attempted');
// TODO: Only create on first attach! // TODO: Only create on first attach!
$wrapper = $container.addClass('h5p-memory-game').html(''); $wrapper = $container.addClass('h5p-memory-game').html('');
if (invertShades === -1) {
$container.addClass('h5p-invert-shades');
}
// Add cards to list // Add cards to list
var $list = $('<ul/>'); var $list = $('<ul/>');
@ -191,19 +328,9 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
'<dd class="h5p-card-turns">0</dd>' + '<dd class="h5p-card-turns">0</dd>' +
'</dl>').appendTo($container); '</dl>').appendTo($container);
timer = new H5P.Timer(100); timer = new MemoryGame.Timer($status.find('.h5p-time-spent')[0]);
timer.notify('every_tenth_second', function () {
var time = timer.getTime();
var minutes = H5P.Timer.extractTimeElement(time, 'minutes');
var seconds = H5P.Timer.extractTimeElement(time, 'seconds') % 60;
if (seconds < 10) {
seconds = '0' + seconds;
}
$status.find('.h5p-time-spent').text(minutes + ':' + seconds);
});
counter = new MemoryGame.Counter($status.find('.h5p-card-turns')); counter = new MemoryGame.Counter($status.find('.h5p-card-turns'));
popup = new MemoryGame.Popup($container); popup = new MemoryGame.Popup($container, parameters.l10n);
$container.click(function () { $container.click(function () {
popup.close(); popup.close();
@ -268,6 +395,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
// We use font size to evenly scale all parts of the cards. // We use font size to evenly scale all parts of the cards.
$list.css('font-size', fontSize + 'px'); $list.css('font-size', fontSize + 'px');
popup.setSize(fontSize);
// due to rounding errors in browsers the margins may vary a bit… // due to rounding errors in browsers the margins may vary a bit…
}; };
@ -280,5 +408,18 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
MemoryGame.prototype = Object.create(EventDispatcher.prototype); MemoryGame.prototype = Object.create(EventDispatcher.prototype);
MemoryGame.prototype.constructor = MemoryGame; MemoryGame.prototype.constructor = MemoryGame;
/**
* Determine color contrast level compared to white(#fff)
*
* @private
* @param {string} color hex code
* @return {number} From 1 to Infinity.
*/
var getContrast = function (color) {
return 255 / ((parseInt(color.substr(1, 2), 16) * 299 +
parseInt(color.substr(3, 2), 16) * 587 +
parseInt(color.substr(5, 2), 16) * 144) / 1000);
};
return MemoryGame; return MemoryGame;
})(H5P.EventDispatcher, H5P.jQuery); })(H5P.EventDispatcher, H5P.jQuery);

View File

@ -5,26 +5,41 @@
* *
* @class H5P.MemoryGame.Popup * @class H5P.MemoryGame.Popup
* @param {H5P.jQuery} $container * @param {H5P.jQuery} $container
* @param {Object.<string, string>} l10n
*/ */
MemoryGame.Popup = function ($container) { MemoryGame.Popup = function ($container, l10n) {
/** @alias H5P.MemoryGame.Popup# */
var self = this; var self = this;
var closed; var closed;
var $popup = $('<div class="h5p-memory-pop"><div class="h5p-memory-image"></div><div class="h5p-memory-desc"></div></div>').appendTo($container); var $popup = $('<div class="h5p-memory-pop"><div class="h5p-memory-top"></div><div class="h5p-memory-desc"></div><div class="h5p-memory-close" role="button" tabindex="0" title="' + (l10n.closeLabel || 'Close') + '"></div></div>').appendTo($container);
var $desc = $popup.find('.h5p-memory-desc'); var $desc = $popup.find('.h5p-memory-desc');
var $image = $popup.find('.h5p-memory-image'); var $top = $popup.find('.h5p-memory-top');
// Hook up the close button
$popup.find('.h5p-memory-close').on('click', function () {
self.close();
}).on('keypress', function (event) {
if (event.which === 13 || event.which === 32) {
self.close();
event.preventDefault();
}
});
/** /**
* Show the popup. * Show the popup.
* *
* @param {string} desc * @param {string} desc
* @param {H5P.jQuery} $img * @param {H5P.jQuery[]} imgs
* @param {function} done * @param {function} done
*/ */
self.show = function (desc, $img, done) { self.show = function (desc, imgs, styles, done) {
$desc.html(desc); $desc.html(desc);
$img.appendTo($image.html('')); $top.html('').toggleClass('h5p-memory-two-images', imgs.length > 1);
for (var i = 0; i < imgs.length; i++) {
$('<div class="h5p-memory-image"' + (styles ? styles : '') + '></div>').append(imgs[i]).appendTo($top);
}
$popup.show(); $popup.show();
closed = done; closed = done;
}; };
@ -39,6 +54,22 @@
closed = undefined; closed = undefined;
} }
}; };
/**
* Sets popup size relative to the card size
* @param {number} fontSize
*/
self.setSize = function (fontSize) {
// Set image size
$top[0].style.fontSize = fontSize + 'px';
// Determine card size
var cardSize = fontSize * 6.25; // From CSS
// Set popup size
$popup[0].style.minWidth = (cardSize * 2.5) + 'px';
$popup[0].style.minHeight = cardSize + 'px';
};
}; };
})(H5P.MemoryGame, H5P.jQuery); })(H5P.MemoryGame, H5P.jQuery);

View File

@ -2,6 +2,12 @@
{ {
"name": "cards", "name": "cards",
"type": "list", "type": "list",
"widgets": [
{
"name": "VerticalTabs",
"label": "Default"
}
],
"label": "Cards", "label": "Cards",
"importance": "high", "importance": "high",
"entity": "card", "entity": "card",
@ -52,7 +58,8 @@
{ {
"name": "useGrid", "name": "useGrid",
"type": "boolean", "type": "boolean",
"label": "Put the cards in a grid layout", "label": "Position the cards in a square",
"description": "Will try to match the number of columns and rows when laying out the cards. Afterward, the cards will be scaled to fit the container.",
"importance": "low", "importance": "low",
"default": true "default": true
}, },
@ -74,6 +81,38 @@
} }
] ]
}, },
{
"name": "lookNFeel",
"type": "group",
"label": "Look and feel",
"importance": "low",
"description": "Control the visuals of the game.",
"optional": true,
"fields": [
{
"name": "themeColor",
"type": "text",
"label": "Theme Color",
"importance": "low",
"description": "Choose a color to create a theme for your card game.",
"optional": true,
"default": "#909090",
"widget": "colorSelector",
"spectrum": {
"showInput": true
}
},
{
"name": "cardBack",
"type": "image",
"label": "Card Back",
"importance": "low",
"optional": true,
"description": "Use a custom back for your cards.",
"ratio": 1
}
]
},
{ {
"label": "Localization", "label": "Localization",
"importance": "low", "importance": "low",
@ -101,6 +140,20 @@
"name": "feedback", "name": "feedback",
"type": "text", "type": "text",
"default": "Good work!" "default": "Good work!"
},
{
"label": "Try again button text",
"importance": "low",
"name": "tryAgain",
"type": "text",
"default": "Try again?"
},
{
"label": "Close button label",
"importance": "low",
"name": "closeLabel",
"type": "text",
"default": "Close"
} }
] ]
} }

50
timer.js Normal file
View File

@ -0,0 +1,50 @@
(function (MemoryGame, Timer) {
/**
* Adapter between memory game and H5P.Timer
*
* @class H5P.MemoryGame.Timer
* @extends H5P.Timer
* @param {Element} element
*/
MemoryGame.Timer = function (element) {
/** @alias H5P.MemoryGame.Timer# */
var self = this;
// Initialize event inheritance
Timer.call(self, 100);
/** @private {string} */
var naturalState = element.innerText;
/**
* Set up callback for time updates.
* Formats time stamp for humans.
*
* @private
*/
var update = function () {
var time = self.getTime();
var minutes = Timer.extractTimeElement(time, 'minutes');
var seconds = Timer.extractTimeElement(time, 'seconds') % 60;
if (seconds < 10) {
seconds = '0' + seconds;
}
element.innerText = minutes + ':' + seconds;
};
// Setup default behavior
self.notify('every_tenth_second', update);
self.on('reset', function () {
element.innerText = naturalState;
self.notify('every_tenth_second', update);
});
};
// Inheritance
MemoryGame.Timer.prototype = Object.create(Timer.prototype);
MemoryGame.Timer.prototype.constructor = MemoryGame.Timer;
})(H5P.MemoryGame, H5P.Timer);