EDUCATIC
/
h5p-memory-game
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge branch 'master' of github.com:h5p/h5p-memory-game

pull/43/head
Paal Joergensen 2019-01-02 15:24:16 +01:00
parent 22b5f4e0a4 e5ce754c92
commit 19b5108dac
38 changed files with 530 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
card.js
View File

@ -12,30 +12,73 @@
* @param {string} [description]
* @param {Object} [styles]
*/
MemoryGame.Card = function (image, id, alt, l10n, description, styles) {
MemoryGame.Card = function (image, id, alt, l10n, description, styles, audio) {
/** @alias H5P.MemoryGame.Card# */
var self = this;
// Initialize event inheritance
EventDispatcher.call(self);
var path = H5P.getPath(image.path, id);
var width, height, $card, $wrapper, removedState, flippedState;
var path, width, height, $card, $wrapper, removedState, flippedState, audioPlayer;
alt = alt || 'Missing description'; // Default for old games
if (image.width !== undefined && image.height !== undefined) {
if (image.width > image.height) {
width = '100%';
height = 'auto';
if (image && image.path) {
path = H5P.getPath(image.path, id);
if (image.width !== undefined && image.height !== undefined) {
if (image.width > image.height) {
width = '100%';
height = 'auto';
}
else {
height = '100%';
width = 'auto';
}
}
else {
height = '100%';
width = 'auto';
width = height = '100%';
}
}
else {
width = height = '100%';
if (audio) {
// Check if browser supports audio.
audioPlayer = document.createElement('audio');
if (audioPlayer.canPlayType !== undefined) {
// Add supported source files.
for (var i = 0; i < audio.length; i++) {
if (audioPlayer.canPlayType(audio[i].mime)) {
var source = document.createElement('source');
source.src = H5P.getPath(audio[i].path, id);
source.type = audio[i].mime;
audioPlayer.appendChild(source);
}
}
}
if (!audioPlayer.children.length) {
audioPlayer = null; // Not supported
}
else {
audioPlayer.controls = false;
audioPlayer.preload = 'auto';
var handlePlaying = function () {
if ($card) {
$card.addClass('h5p-memory-audio-playing');
self.trigger('audioplay');
}
};
var handleStopping = function () {
if ($card) {
$card.removeClass('h5p-memory-audio-playing');
self.trigger('audiostop');
}
};
audioPlayer.addEventListener('play', handlePlaying);
audioPlayer.addEventListener('ended', handleStopping);
audioPlayer.addEventListener('pause', handleStopping);
}
}
/**
@ -77,12 +120,17 @@
$card.addClass('h5p-flipped');
self.trigger('flip');
flippedState = true;
if (audioPlayer) {
audioPlayer.play();
}
};
/**
* Flip card back.
*/
self.flipBack = function () {
self.stopAudio();
self.updateLabel(null, null, true); // Reset card label
$card.removeClass('h5p-flipped');
flippedState = false;
@ -100,6 +148,7 @@
* Reset card to natural state
*/
self.reset = function () {
self.stopAudio();
self.updateLabel(null, null, true); // Reset card label
flippedState = false;
removedState = false;
@ -133,7 +182,7 @@
$wrapper = $('<li class="h5p-memory-wrap" tabindex="-1" role="button"><div class="h5p-memory-card">' +
'<div class="h5p-front"' + (styles && styles.front ? styles.front : '') + '>' + (styles && styles.backImage ? '' : '<span></span>') + '</div>' +
'<div class="h5p-back"' + (styles && styles.back ? styles.back : '') + '>' +
'<img src="' + path + '" alt="' + alt + '" style="width:' + width + ';height:' + height + '"/>' +
(path ? '<img src="' + path + '" alt="' + alt + '" style="width:' + width + ';height:' + height + '"/>' + (audioPlayer ? '<div class="h5p-memory-audio-button"></div>' : '') : '<i class="h5p-memory-audio-instead-of-image">') +
'</div>' +
'</div></li>')
.appendTo($container)
@ -176,6 +225,18 @@
self.flip();
})
.end();
if (audioPlayer) {
$card.children('.h5p-back')
.click(function () {
if ($card.hasClass('h5p-memory-audio-playing')) {
self.stopAudio();
}
else {
audioPlayer.play();
}
})
}
};
/**
@ -221,6 +282,16 @@
self.isRemoved = function () {
return removedState;
};
/**
* Stop any audio track that might be playing.
*/
self.stopAudio = function () {
if (audioPlayer) {
audioPlayer.pause();
audioPlayer.currentTime = 0;
}
};
};
// Extends the event dispatcher
@ -236,8 +307,9 @@
*/
MemoryGame.Card.isValid = function (params) {
return (params !== undefined &&
params.image !== undefined &&
params.image.path !== undefined);
(params.image !== undefined &&
params.image.path !== undefined) ||
params.audio);
};
/**
@ -249,8 +321,9 @@
*/
MemoryGame.Card.hasTwoImages = function (params) {
return (params !== undefined &&
params.match !== undefined &&
params.match.path !== undefined);
(params.match !== undefined &&
params.match.path !== undefined) ||
params.matchAudio);
};
/**

8
language/.en.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/af.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/ar.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "الوصف",
"description": "نص قصير يتم عرضه مرة واحدة علي اثنين من البطاقات متساوية"

8
language/bs.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Ista slika",
"description": "Opcionalna slika koja se koristi umjestodvije iste slike."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Opis",
"description": "Kratak tekst koji će biti prikazan čim se pronađu dvije iste karte."

8
language/ca.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/cs.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/da.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matchende billede",
"description": "Valgfrit billede som match i stedet for at have to kort med det samme billede."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Beskrivelse",
"description": "Valgfri tekst, som popper op, når to matchende billeder er fundet."

8
language/de.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Beschreibung",
"description": "Ein kurzer Text, der angezeigt wird, sobald zwei identische Karten gefunden werden."

8
language/el.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

10
language/es.json
View File

@ -18,6 +18,10 @@
"label": "Texto alternativo para la imagen",
"description": "Describe lo que se puede ver en la foto. El texto es leído por una herramienta de conversion de texto a voz, a usuarios con discapacidad visual."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Imagen coincidente",
"description": "Una imagen opcional para emparejar, en vez de usar dos tarjetas con la misma imagen."
@ -26,6 +30,10 @@
"label": "Texto alternativo para imagenes coincidentes",
"description": "El texto es leído por una herramienta de conversion de texto a voz, a usuarios con discapacidad visual."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Descripción",
"description": "Un breve texto opcional que aparecerá una vez se encuentren las dos cartas coincidentes."
@ -111,4 +119,4 @@
]
}
]
}
}

8
language/et.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

122
language/eu.json Normal file
View File

@ -0,0 +1,122 @@
{
"semantics": [
{
"widgets": [
{
"label": "Lehenetsia"
}
],
"label": "Txartelak",
"entity": "karta",
"field": {
"label": "Karta",
"fields": [
{
"label": "Irudia"
},
{
"label": "Irudiaren ordezko testua",
"description": "Deskribatu irudian ikusi daitekeena. Testua irakurketa tresna automatikoek irakurriko dute ikusmen urritasunak dituztenentzat."
},
{
"label": "Audio Pista",
"description": "Karta itzultzen denean erreproduzitzeko aukerazko soinua."
},
{
"label": "Pareko irudia",
"description": "Irudi bera duten bi karta ez erabiltzeko parekatzeko aukeran eskainiko den irudia."
},
{
"label": "Pareko irudiaren ordezko irudia",
"description": "Deskribatu argazkian ikusi daitekeena. Testua irakurketa tresna automatikoek irakurriko dute ikusmen urritasunak dituztenentzat."
},
{
"label": "Pareko Audio Pista",
"description": "Bigarren karta itzultzen denean erreproduzitzeko aukerazko soinua."
},
{
"label": "Deskribapena",
"description": "Bi karta parekatzen direnean bat-batean agertu den aukerako testu laburra."
}
]
}
},
{
"label": "Portaera-ezarpenak",
"description": "Aukera hauen bidez kontrolatu ahal izango duzu zereginaren portaera.",
"fields": [
{
"label": "Kokatu karta karratuan",
"description": "Txartelak banatzean lerro eta zutabe kopurua betetzen saiatuko da. Gero, kartak eskalatuko dira."
},
{
"label": "Erabiliko den karta kopurua",
"description": "2 baino altuagoa den zenbaki bat ezarriz gero jokoak hausazko karta hartuko du karta-zerrendatik."
},
{
"label": "Saiakera berria egiteko botoia txertatu jokoa amaitzerakoan"
}
]
},
{
"label": "Itxura",
"description": "Jokoaren itxura kontrolatu",
"fields": [
{
"label": "Estiloaren kolorea",
"description": "Aukeratu kolorea zure karta jokoarentzat estiloa sortzeko.",
"default": "#909090"
},
{
"label": "Kartaren atzeko aldea",
"description": "Erabili karta-atzeko alde pertsonalizatua."
}
]
},
{
"label": "Lokalizazioa",
"fields": [
{
"label": "Txartelak buelta ematen du testua",
"default": "Txartelak buelta ematen du"
},
{
"label": "Igarotako denboraren testua",
"default": "Igarotako denbora"
},
{
"label": "Feedback testua",
"default": "Lan bikaina!"
},
{
"label": "Saiatu berriro botoiaren",
"default": "Saiatu berriro?"
},
{
"label": "Itxi botoiaren etiketa",
"default": "Itxi"
},
{
"label": "Jokoaren etiketa",
"default": "Memoria jokoa. Aurkitu pareko kartak."
},
{
"label": "Amaitutako jokoaren etiketa",
"default": "Karta guztiak aurkitu dira."
},
{
"label": "Txartela zenbakiaren etiketa",
"default": "%num. txartela:"
},
{
"label": "buelta eman gabeko txartela",
"default": "Itzuli gabe"
},
{
"label": "Parekatutako txartelaren etiketa",
"default": "Parekoa topatuta."
}
]
}
]
}

8
language/fi.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Vastattava kuva",
"description": "Valinnainen kuva johon verrata korttia sen sijaan, että kortille etsitään toista samaa kuvaa pariksi."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Selite",
"description": "Valinnainen lyhyt teksti, joka näytetään kun oikea pari on löydetty."

8
language/fr.json
View File

@ -18,6 +18,10 @@
"label": "Texte alternatif pour l'image",
"description": "Décrivez ce que représente l'image. Le texte est lu par la synthèse vocale."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Image correspondante",
"description": "Une image facultative à comparer au lieu d'utiliser deux cartes avec la même image."
@ -26,6 +30,10 @@
"label": "Texte alternatif pour l'image correspondante",
"description": "Décrivez ce que représente l'image correspondante. Le texte est lu par la synthèse vocale."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "Un texte court optionnel qui apparaîtra une fois que les deux cartes correspondantes auront été trouvées."

8
language/he.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/hu.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/it.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Descrizione",
"description": "Breve testo visualizzato quando due carte uguali vengono trovate."

8
language/ja.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "一致させる画像",
"description": "同じ画像の2枚のカードを使用する代わりに、別に一致させるためのオプション画像"
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "説明",
"description": "一致する2つのカードが見つかるとポップアップするオプションの短文テキスト。"

8
language/ko.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/nb.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Tilhørende bilde",
"description": "Et valgfritt bilde som brukes av kort nummer to istedenfor å bruke to kort med samme bilde."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Beskrivelse",
"description": "En valgfri kort tekst som spretter opp når kort-paret er funnet."

8
language/nl.json
View File

@ -18,6 +18,10 @@
"label": "Bijpassende afbeelding",
"description": "Een optionele afbeelding die past in plaats van 2 kaarten met dezelfde afbeelding."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Omschrijving",
"description": "Een optionele korte tekst die zal verschijnen zodra de 2 overeenkomende kaarten zijn gevonden."
@ -26,6 +30,10 @@
"label": "De alternatieve tekst voor de bijpassende afbeelding",
"description": "Omschrijf wat de afbeelding voorstelt. De tekst zal worden gelezen door tekst-naar-spraak tools voor slechtzienden."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Omschrijving",
"description": "Een optionele korte tekst die zal verschijnen zodra de 2 overeenkomende kaarten zijn gevonden."

8
language/nn.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/pl.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

10
language/pt.json
View File

@ -18,6 +18,10 @@
"label": "Texto alternativo para a imagem",
"description": "Descreva o que pode ser visto na foto. O texto será lido para os usuários que necessitam utilizar leitores de tela."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Imagem-par",
"description": "Uma imagem opcional para ser combinada ao invés de utilizar dois cartões com a mesma imagem."
@ -26,6 +30,10 @@
"label": "Texto alternativo para a Imagem-par",
"description": "Descreva o que pode ser visto na foto. O texto será lido para os usuários que necessitam utilizar leitores de tela."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Descrição",
"description": "Um texto curto opcional que aparecerá quando duas cartas forem combinadas corretamente."
@ -111,4 +119,4 @@
]
}
]
}
}

8
language/ro.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/ru.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/sr.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/sv.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/tr.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/vi.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "Matching Image",
"description": "An optional image to match against instead of using two cards with the same image."
@ -26,6 +30,10 @@
"label": "Alternative text for Matching Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "Description",
"description": "An optional short text that will pop up once the two matching cards are found."

8
language/zh-tw.json
View File

@ -18,6 +18,10 @@
"label": "Alternative text for Image",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "相稱圖示",
"description": "可選用一張與主圖示相稱的圖示,並非使用兩張相同的圖示."
@ -26,6 +30,10 @@
"label": "相稱圖示的替代文字",
"description": "請描述此張圖示中可以看到什麼. 此段文字將做為閱讀器導讀文字，對視障使用者更為友善."
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "描述",
"description": "選填。當找到兩張相稱圖示時所顯示的文字."

8
language/zh.json
View File

@ -18,6 +18,10 @@
"label": "配對圖像（非必要項）",
"description": "如果遊戲中要配對的不是同一張圖像，那麼可以在這裡添加要配對的另一張圖像。"
},
{
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned."
},
{
"label": "配對成功文字（非必要項）",
"description": "在找到配對時會跳出的文字訊息。"
@ -26,6 +30,10 @@
"label": "配對圖像的替代文字",
"description": "在報讀器上用、或是配對圖像無法正常輸出時顯示的文字。"
},
{
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned."
},
{
"label": "配對成功文字（非必要項）",
"description": "在找到配對時會跳出的文字訊息。"

11
library.json
View File

@ -2,8 +2,8 @@
"title": "Memory Game",
"description": "See how many cards you can remember!",
"majorVersion": 1,
"minorVersion": 2,
"patchVersion": 14,
"minorVersion": 3,
"patchVersion": 0,
"runnable": 1,
"author": "Joubel",
"license": "MIT",
@ -52,6 +52,11 @@
"machineName": "H5PEditor.VerticalTabs",
"majorVersion": 1,
"minorVersion": 3
},
{
"machineName": "H5PEditor.AudioRecorder",
"majorVersion": 1,
"minorVersion": 0
}
]
}
}

25
memory-game.css
View File

@ -318,3 +318,28 @@
.h5p-memory-game .h5p-programatically-focusable {
outline: none;
}
.h5p-memory-audio-instead-of-image {
font-family: 'H5PFontAwesome4';
width: 100%;
height: 100%;
font-style: normal;
color: #404040;
font-size: 2em;
}
.h5p-memory-audio-button {
position: absolute;
top: 0;
right: 0;
font-family: 'H5PFontAwesome4';
width: 1em;
height: 1em;
line-height: 1;
}
.h5p-memory-audio-instead-of-image:before,
.h5p-memory-audio-button:before {
content: "\f026";
}
.h5p-memory-audio-playing .h5p-memory-audio-instead-of-image:before,
.h5p-memory-audio-playing .h5p-memory-audio-button:before {
content: "\f028";
}

20
memory-game.js
View File

@ -22,7 +22,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
// Initialize event inheritance
EventDispatcher.call(self);
var flipped, timer, counter, popup, $bottom, $taskComplete, $feedback, $wrapper, maxWidth, numCols;
var flipped, timer, counter, popup, $bottom, $taskComplete, $feedback, $wrapper, maxWidth, numCols, audioCard;
var cards = [];
var flipBacks = []; // Que of cards to be flipped back
var numFlipped = 0;
@ -218,6 +218,9 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
*/
var addCard = function (card, mate) {
card.on('flip', function () {
if (audioCard) {
audioCard.stopAudio();
}
// Always return focus to the card last flipped
for (var i = 0; i < cards.length; i++) {
@ -260,6 +263,15 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
// Count number of cards turned
counter.increment();
});
card.on('audioplay', function () {
if (audioCard) {
audioCard.stopAudio();
}
audioCard = card;
});
card.on('audiostop', function () {
audioCard = undefined;
});
/**
* Create event handler for moving focus to the next or the previous
@ -384,16 +396,16 @@ H5P.MemoryGame = (function (EventDispatcher, $) {
var cardParams = cardsToUse[i];
if (MemoryGame.Card.isValid(cardParams)) {
// Create first card
var cardTwo, cardOne = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, parameters.l10n, cardParams.description, cardStyles);
var cardTwo, cardOne = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, parameters.l10n, cardParams.description, cardStyles, cardParams.audio);
if (MemoryGame.Card.hasTwoImages(cardParams)) {
// Use matching image for card two
cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.matchAlt, parameters.l10n, cardParams.description, cardStyles);
cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.matchAlt, parameters.l10n, cardParams.description, cardStyles, cardParams.matchAudio);
cardOne.hasTwoImages = cardTwo.hasTwoImages = true;
}
else {
// Add two cards with the same image
cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, parameters.l10n, cardParams.description, cardStyles);
cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, parameters.l10n, cardParams.description, cardStyles, cardParams.audio);
}
// Add cards to card list for shuffeling

2
popup.js
View File

@ -13,7 +13,7 @@
var closed;
var $popup = $('<div class="h5p-memory-pop" role="dialog"><div class="h5p-memory-top"></div><div class="h5p-memory-desc h5p-programatically-focusable" tabindex="-1"></div><div class="h5p-memory-close" role="button" tabindex="0" title="' + (l10n.closeLabel || 'Close') + '"></div></div>').appendTo($container);
var $popup = $('<div class="h5p-memory-pop" role="dialog"><div class="h5p-memory-top"></div><div class="h5p-memory-desc h5p-programatically-focusable" tabindex="-1"></div><div class="h5p-memory-close" role="button" tabindex="0" title="' + (l10n.closeLabel || 'Close') + '" aria-label="' + (l10n.closeLabel || 'Close') + '"></div></div>').appendTo($container);
var $desc = $popup.find('.h5p-memory-desc');
var $top = $popup.find('.h5p-memory-top');

20
semantics.json
View File

@ -33,6 +33,15 @@
"importance": "high",
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"name": "audio",
"type": "audio",
"importance": "high",
"label": "Audio Track",
"description": "An optional sound that plays when the card is turned.",
"optional": true,
"extraTabs": ["AudioRecorder"]
},
{
"name": "match",
"type": "image",
@ -50,6 +59,15 @@
"optional": true,
"description": "Describe what can be seen in the photo. The text is read by text-to-speech tools needed by visually impaired users."
},
{
"name": "matchAudio",
"type": "audio",
"importance": "low",
"label": "Matching Audio Track",
"description": "An optional sound that plays when the second card is turned.",
"optional": true,
"extraTabs": ["AudioRecorder"]
},
{
"name": "description",
"type": "text",
@ -207,4 +225,4 @@
}
]
}
]
]