From 196c112243c81ead6a7c7c7013424d8c774cc8e1 Mon Sep 17 00:00:00 2001 From: Frode Petterson Date: Tue, 20 Jun 2017 16:47:07 +0200 Subject: [PATCH 01/11] Start improving accessibility --- card.js | 86 +++++++++++++++++++++++++++++++++++++++++++------- memory-game.js | 39 +++++++++++++++++++++-- semantics.json | 17 +++++++++- 3 files changed, 126 insertions(+), 16 deletions(-) diff --git a/card.js b/card.js index 660a9bf..76a1c73 100644 --- a/card.js +++ b/card.js @@ -7,10 +7,11 @@ * @extends H5P.EventDispatcher * @param {Object} image * @param {number} id + * @param {string} alt * @param {string} [description] * @param {Object} [styles] */ - MemoryGame.Card = function (image, id, description, styles) { + MemoryGame.Card = function (image, id, alt, description, styles) { /** @alias H5P.MemoryGame.Card# */ var self = this; @@ -18,7 +19,7 @@ EventDispatcher.call(self); var path = H5P.getPath(image.path, id); - var width, height, margin, $card; + var width, height, margin, $card, $wrapper, removedState, flippedState; if (image.width !== undefined && image.height !== undefined) { if (image.width > image.height) { @@ -40,6 +41,7 @@ self.flip = function () { $card.addClass('h5p-flipped'); self.trigger('flip'); + flippedState = true; }; /** @@ -47,6 +49,7 @@ */ self.flipBack = function () { $card.removeClass('h5p-flipped'); + flippedState = false; }; /** @@ -54,6 +57,7 @@ */ self.remove = function () { $card.addClass('h5p-matched'); + removedState = true; }; /** @@ -88,27 +92,85 @@ */ self.appendTo = function ($container) { // TODO: Translate alt attr - $card = $('
  • ' + + $wrapper = $('
  • ' + '
    ' + (styles && styles.backImage ? '' : '') + '
    ' + '
    ' + - 'Memory Card' + + '' + (alt || 'Memory Image') + '' + '
    ' + '
  • ') .appendTo($container) - .children('.h5p-memory-card') - .children('.h5p-front') - .click(function () { - self.flip(); - }) - .end(); + .on('keydown', function (event) { + switch (event.which) { + case 13: // Enter + case 32: // Space + if (!flippedState) { + self.flip(); + event.preventDefault(); + } + return; + case 39: // Right + case 40: // Down + // Move focus forward + self.trigger('next'); + event.preventDefault(); + return; + case 37: // Left + case 38: // Up + // Move focus back + self.trigger('prev'); + event.preventDefault(); + return; + } + }); + $card = $wrapper.children('.h5p-memory-card') + .children('.h5p-front') + .click(function () { + self.flip(); + }) + .end(); }; /** * Re-append to parent container */ self.reAppend = function () { - var parent = $card[0].parentElement.parentElement; - parent.appendChild($card[0].parentElement); + var parent = $wrapper[0].parentElement; + parent.appendChild($wrapper[0]); + }; + + /** + * + */ + self.makeTabbable = function () { + if ($wrapper) { + $wrapper.attr('tabindex', '0'); + } + }; + + /** + * + */ + self.makeUntabbable = function () { + if ($wrapper) { + $wrapper.attr('tabindex', '-1'); + } + }; + + /** + * + */ + self.setFocus = function () { + self.makeTabbable(); + if ($wrapper) { + $wrapper.focus(); + } + }; + + /** + * + */ + self.isFlipped = function () { + return flippedState; }; }; diff --git a/memory-game.js b/memory-game.js index a0029f6..894f512 100644 --- a/memory-game.js +++ b/memory-game.js @@ -220,6 +220,38 @@ H5P.MemoryGame = (function (EventDispatcher, $) { counter.increment(); }); + /** + * @private + * @param {number} direction + */ + var createCardChangeFocusHandler = function (direction) { + return function () { + // Locate next card + for (var i = 0; i < cards.length; i++) { + if (cards[i] === card) { + // Found current card + + var nextCard, fails = 0; + do { + fails++; + nextCard = cards[i + (direction * fails)]; + if (!nextCard) { + return; // No more cards + } + } + while (nextCard.isFlipped()); + + card.makeUntabbable(); + nextCard.setFocus(); + + return; + } + } + }; + }; + + card.on('next', createCardChangeFocusHandler(1)); + card.on('prev', createCardChangeFocusHandler(-1)); cards.push(card); }; @@ -277,16 +309,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.description, cardStyles); + var cardTwo, cardOne = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, cardParams.description, cardStyles); if (MemoryGame.Card.hasTwoImages(cardParams)) { // Use matching image for card two - cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.description, cardStyles); + cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.matchAlt, cardParams.description, cardStyles); cardOne.hasTwoImages = cardTwo.hasTwoImages = true; } else { // Add two cards with the same image - cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.description, cardStyles); + cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, cardParams.description, cardStyles); } // Add cards to card list for shuffeling @@ -314,6 +346,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { for (var i = 0; i < cards.length; i++) { cards[i].appendTo($list); } + cards[0].makeTabbable(); if ($list.children().length) { $list.appendTo($container); diff --git a/semantics.json b/semantics.json index fd274e2..52a1f10 100644 --- a/semantics.json +++ b/semantics.json @@ -26,6 +26,13 @@ "importance": "high", "ratio": 1 }, + { + "name": "imageAlt", + "type": "text", + "label": "Alternative text for Image", + "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": "match", "type": "image", @@ -35,6 +42,14 @@ "description": "An optional image to match against instead of using two cards with the same image.", "ratio": 1 }, + { + "name": "matchAlt", + "type": "text", + "label": "Alternative text for Matching Image", + "importance": "low", + "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": "description", "type": "text", @@ -146,7 +161,7 @@ "importance": "low", "name": "tryAgain", "type": "text", - "default": "Try again?" + "default": "Reset" }, { "label": "Close button label", From fbe10b4fe2cc6019100c810aa10764ed4a7dca18 Mon Sep 17 00:00:00 2001 From: Peter Leth Date: Wed, 13 Sep 2017 11:51:47 +0200 Subject: [PATCH 02/11] Update da.json Checked on jsonlint.com --- language/da.json | 66 ++++++++++++++++++++++++------------------------ 1 file changed, 33 insertions(+), 33 deletions(-) diff --git a/language/da.json b/language/da.json index 240360f..5a248a2 100644 --- a/language/da.json +++ b/language/da.json @@ -3,87 +3,87 @@ { "widgets":[ { - "label":"Default" + "label":"Standard" } ], - "label":"Cards", + "label":"Kort", "entity":"card", "field":{ - "label":"Card", + "label":"Kort", "fields":[ { - "label":"Image" + "label":"Billede" }, { - "label":"Matching Image", - "description":"An optional image to match against instead of using two cards with the same image." + "label":"Matchende billede", + "description":"Valgfrit billede som match i stedet for at have to kort med det samme billede." }, { - "label":"Description", - "description":"An optional short text that will pop up once the two matching cards are found." + "label":"Beskrivelse", + "description":"Valgfri tekst, som popper op, når to matchende billeder er fundet." } ] } }, { - "label":"Behavioural settings", - "description":"These options will let you control how the game behaves.", + "label":"Indstillinger", + "description":"Disse indstillinger giver dig mulighed for at bestemme, hvordan spillet fremstår.", "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":"Placer kortene kvadratisk", + "description":"Vil forsøge at matche antallet af kolonner og rækker, når kortene placeres. Efterfølgende vil størrelsen på kortene blive tilpasset." }, { - "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":"Antal kort i opgaven", + "description":"Vælges et større tal end 2, vælges kort tilfældigt fra listen af kort." }, { - "label":"Add button for retrying when the game is over" + "label":"Tilføj knap for at prøve spillet igen, når spillet er afsluttet." } ] }, { - "label":"Look and feel", - "description":"Control the visuals of the game.", + "label":"Udseende", + "description":"Indstil spillets udseende.", "fields":[ { - "label":"Theme Color", - "description":"Choose a color to create a theme for your card game.", + "label":"Farvetema", + "description":"Vælg en farve til bagsiden af dine kort.", "default":"#909090", "spectrum":{ } }, { - "label":"Card Back", - "description":"Use a custom back for your cards." + "label":"Bagsidebillede", + "description":"Brug et billede som bagside på dine kort." } ] }, { - "label":"Localization", + "label":"Oversættelse", "fields":[ { - "label":"Card turns text", - "default":"Card turns" + "label":"Tekst når kort vendes", + "default":"Kort vendes" }, { - "label":"Time spent text", - "default":"Time spent" + "label":"Tekst for tidsforbrug", + "default":"Tidsforbrug" }, { - "label":"Feedback text", - "default":"Good work!" + "label":"Feedback tekst", + "default":"Godt klaret!" }, { - "label":"Try again button text", - "default":"Try again?" + "label":"Prøv igen knaptekst", + "default":"Prøv igen?" }, { - "label":"Close button label", - "default":"Close" + "label":"Luk knaptekst", + "default":"Luk" } ] } ] -} \ No newline at end of file +} From f17d7cb4b2887edfde590644988ceb733e9231ab Mon Sep 17 00:00:00 2001 From: Frode Petterson Date: Fri, 22 Sep 2017 16:54:08 +0200 Subject: [PATCH 03/11] HFP-1266 Add accessibility labels to controls Improve the overall behavior when using a readspeaker. Still missing localization, dialog support and a proper timer. --- card.js | 65 ++++++++++++++++++++++++++++++++++++++----------- memory-game.css | 8 ++++++ memory-game.js | 62 ++++++++++++++++++++++++++++++++++------------ 3 files changed, 105 insertions(+), 30 deletions(-) diff --git a/card.js b/card.js index 76a1c73..38d1ffe 100644 --- a/card.js +++ b/card.js @@ -21,6 +21,8 @@ var path = H5P.getPath(image.path, id); var width, height, margin, $card, $wrapper, removedState, flippedState; + alt = alt || 'Missing description'; // Default for old games + if (image.width !== undefined && image.height !== undefined) { if (image.width > image.height) { width = '100%'; @@ -35,10 +37,42 @@ width = height = '100%'; } + /** + * Update the cards label to make it accessible to users with a readspeaker + * + * @param {boolean} isMatched The card has been matched + * @param {boolean} announce Announce the current state of the card + * @param {boolean} reset Go back to the default label + */ + self.updateLabel = function (isMatched, announce, reset) { + + // Determine new label from input params + var label = (reset ? 'Unturned' : alt); + if (isMatched) { + label = 'Match found. ' + label; // TODO l10n + } + + // Update the card's label + $wrapper.attr('aria-label', 'Card ' + ($wrapper.index() + 1) + ': ' + label); // TODO l10n + + // Update disabled property + $wrapper.attr('aria-disabled', reset ? null : 'true'); + + // Announce the label change + if (announce) { + $wrapper.blur().focus(); // Announce card label + } + }; + /** * Flip card. */ self.flip = function () { + if (flippedState) { + $wrapper.blur().focus(); // Announce card label again + return; + } + $card.addClass('h5p-flipped'); self.trigger('flip'); flippedState = true; @@ -48,6 +82,7 @@ * Flip card back. */ self.flipBack = function () { + self.updateLabel(null, null, true); // Reset card label $card.removeClass('h5p-flipped'); flippedState = false; }; @@ -55,7 +90,7 @@ /** * Remove. */ - self.remove = function () { + self.remove = function (announce) { $card.addClass('h5p-matched'); removedState = true; }; @@ -64,6 +99,9 @@ * Reset card to natural state */ self.reset = function () { + self.updateLabel(null, null, true); // Reset card label + flippedState = false; + removedState = false; $card[0].classList.remove('h5p-flipped', 'h5p-matched'); }; @@ -91,11 +129,10 @@ * @param {H5P.jQuery} $container */ self.appendTo = function ($container) { - // TODO: Translate alt attr $wrapper = $('
  • ' + '
    ' + (styles && styles.backImage ? '' : '') + '
    ' + '
    ' + - '' + (alt || 'Memory Image') + '' + + '' + alt + '' + '
    ' + '
  • ') .appendTo($container) @@ -103,10 +140,8 @@ switch (event.which) { case 13: // Enter case 32: // Space - if (!flippedState) { - self.flip(); - event.preventDefault(); - } + self.flip(); + event.preventDefault(); return; case 39: // Right case 40: // Down @@ -122,6 +157,7 @@ return; } }); + $wrapper.attr('aria-label', 'Card ' + ($wrapper.index() + 1) + ': Unturned.'); // TODO l10n $card = $wrapper.children('.h5p-memory-card') .children('.h5p-front') .click(function () { @@ -131,7 +167,7 @@ }; /** - * Re-append to parent container + * Re-append to parent container. */ self.reAppend = function () { var parent = $wrapper[0].parentElement; @@ -139,7 +175,7 @@ }; /** - * + * Make the card accessible when tabbing */ self.makeTabbable = function () { if ($wrapper) { @@ -148,7 +184,7 @@ }; /** - * + * Prevent tabbing to the card */ self.makeUntabbable = function () { if ($wrapper) { @@ -157,7 +193,7 @@ }; /** - * + * Make card tabbable and move focus to it */ self.setFocus = function () { self.makeTabbable(); @@ -167,10 +203,11 @@ }; /** - * + * Check if the card has been removed from the game, i.e. if has + * been matched. */ - self.isFlipped = function () { - return flippedState; + self.isRemoved = function () { + return removedState; }; }; diff --git a/memory-game.css b/memory-game.css index 199a07b..4d61392 100644 --- a/memory-game.css +++ b/memory-game.css @@ -1,6 +1,14 @@ .h5p-memory-game { overflow: hidden; } +.h5p-memory-game .h5p-memory-hidden-read { + position: absolute; + top: -1px; + left: -1px; + width: 1px; + height: 1px; + color: transparent; +} .h5p-memory-game > ul { list-style: none !important; padding: 0.25em 0.5em !important; diff --git a/memory-game.js b/memory-game.js index 894f512..a0cb033 100644 --- a/memory-game.js +++ b/memory-game.js @@ -5,6 +5,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { var CARD_STD_SIZE = 116; // PX var STD_FONT_SIZE = 16; // PX var LIST_PADDING = 1; // EMs + var numInstances = 0; /** * Memory Game Constructor @@ -21,11 +22,12 @@ H5P.MemoryGame = (function (EventDispatcher, $) { // Initialize event inheritance EventDispatcher.call(self); - var flipped, timer, counter, popup, $feedback, $wrapper, maxWidth, numCols; + var flipped, timer, counter, popup, $bottom, $feedback, $wrapper, maxWidth, numCols; var cards = []; var flipBacks = []; // Que of cards to be flipped back var numFlipped = 0; var removed = 0; + numInstances++; /** * Check if these two cards belongs together. @@ -49,17 +51,17 @@ H5P.MemoryGame = (function (EventDispatcher, $) { return; } - // Remove them from the game. - card.remove(); - mate.remove(); - // Update counters numFlipped -= 2; removed += 2; var isFinished = (removed === cards.length); - var desc = card.getDescription(); + // Remove them from the game. + card.remove(!isFinished); + mate.remove(); + + var desc = card.getDescription(); if (desc !== undefined) { // Pause timer and show desciption. timer.pause(); @@ -70,6 +72,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { popup.show(desc, imgs, cardStyles ? cardStyles.back : undefined, function () { if (isFinished) { // Game done + card.makeUntabbable(); finished(); } else { @@ -80,6 +83,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { } else if (isFinished) { // Game done + card.makeUntabbable(); finished(); } }; @@ -90,7 +94,8 @@ H5P.MemoryGame = (function (EventDispatcher, $) { */ var finished = function () { timer.stop(); - $feedback.addClass('h5p-show'); + $feedback.addClass('h5p-show'); // Announce + $bottom.focus(); // Create and trigger xAPI event 'completed' var completedEvent = self.createXAPIEventTemplate('completed'); @@ -113,7 +118,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { }); retryButton.classList.add('h5p-memory-transin'); setTimeout(function () { - // Remove class on nextTick to get transition effect + // Remove class on nextTick to get transition effectupd retryButton.classList.remove('h5p-memory-transin'); }, 0); @@ -132,9 +137,6 @@ H5P.MemoryGame = (function (EventDispatcher, $) { // Reset cards removed = 0; - for (var i = 0; i < cards.length; i++) { - cards[i].reset(); - } // Remove feedback $feedback[0].classList.remove('h5p-show'); @@ -151,11 +153,15 @@ H5P.MemoryGame = (function (EventDispatcher, $) { for (var i = 0; i < cards.length; i++) { cards[i].reAppend(); } + for (var j = 0; j < cards.length; j++) { + cards[j].reset(); + } // Scale new layout $wrapper.children('ul').children('.h5p-row-break').removeClass('h5p-row-break'); maxWidth = -1; self.trigger('resize'); + cards[0].setFocus(); }, 600); }; @@ -197,6 +203,11 @@ H5P.MemoryGame = (function (EventDispatcher, $) { // Keep track of the number of flipped cards numFlipped++; + // Announce the card unless it's the last one and it's correct + var isMatched = (flipped === mate); + var isLast = ((removed + 2) === cards.length); + card.updateLabel(isMatched, !(isMatched && isLast)); + if (flipped !== undefined) { var matie = flipped; // Reset the flipped card. @@ -239,7 +250,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { return; // No more cards } } - while (nextCard.isFlipped()); + while (nextCard.isRemoved()); card.makeUntabbable(); nextCard.setFocus(); @@ -342,24 +353,43 @@ H5P.MemoryGame = (function (EventDispatcher, $) { } // Add cards to list - var $list = $('
      '); + var $list = $('
        ', { + role: 'application', + 'aria-labelledby': 'h5p-intro-' + numInstances + }); for (var i = 0; i < cards.length; i++) { cards[i].appendTo($list); } cards[0].makeTabbable(); if ($list.children().length) { + $('
        ', { + id: 'h5p-intro-' + numInstances, + 'class': 'h5p-memory-hidden-read', + html: 'Memory Game. Find the matching cards.', // TODO: l10n + appendTo: $container + }); $list.appendTo($container); - $feedback = $('
        ' + parameters.l10n.feedback + '
        ').appendTo($container); + $bottom = $('
        ', { + tabindex: '-1', + appendTo: $container + }); + $('
        ', { + 'class': 'h5p-memory-hidden-read', + html: 'All of the cards have been found.', // TODO: l10n + appendTo: $bottom + }); + + $feedback = $('
        ' + parameters.l10n.feedback + '
        ').appendTo($bottom); // Add status bar var $status = $('
        ' + '
        ' + parameters.l10n.timeSpent + '
        ' + - '
        0:00
        ' + + '
        0:00
        ' + // TODO: Add hidden dot ? '
        ' + parameters.l10n.cardTurns + '
        ' + '
        0
        ' + - '
        ').appendTo($container); + '').appendTo($bottom); timer = new MemoryGame.Timer($status.find('.h5p-time-spent')[0]); counter = new MemoryGame.Counter($status.find('.h5p-card-turns')); From 4ecc636ab0803de42772a81d079bd9c63c0ad58b Mon Sep 17 00:00:00 2001 From: Frode Petterson Date: Mon, 25 Sep 2017 14:38:14 +0200 Subject: [PATCH 04/11] HFP-1266 Add accessibility support to dialog and timer Improved keyboard support. Made labels translatable. --- card.js | 22 +++++++++--- language/ar.json | 74 ++++++++++++++++++++++++++------------ language/bs.json | 63 +++++++++++++++++++++----------- language/de.json | 65 ++++++++++++++++++++++----------- language/fr.json | 65 ++++++++++++++++++++++----------- language/it.json | 74 ++++++++++++++++++++++++++------------ language/nb.json | 70 ++++++++++++++++++------------------ memory-game.css | 6 ++-- memory-game.js | 94 ++++++++++++++++++++++++++++++++++++++++-------- popup.js | 14 +++++--- semantics.json | 37 ++++++++++++++++++- timer.js | 5 +++ 12 files changed, 420 insertions(+), 169 deletions(-) diff --git a/card.js b/card.js index 38d1ffe..28718f7 100644 --- a/card.js +++ b/card.js @@ -8,10 +8,11 @@ * @param {Object} image * @param {number} id * @param {string} alt + * @param {Object} l10n Localization * @param {string} [description] * @param {Object} [styles] */ - MemoryGame.Card = function (image, id, alt, description, styles) { + MemoryGame.Card = function (image, id, alt, l10n, description, styles) { /** @alias H5P.MemoryGame.Card# */ var self = this; @@ -47,13 +48,13 @@ self.updateLabel = function (isMatched, announce, reset) { // Determine new label from input params - var label = (reset ? 'Unturned' : alt); + var label = (reset ? l10n.cardUnturned : alt); if (isMatched) { - label = 'Match found. ' + label; // TODO l10n + label = l10n.cardMatched + ' ' + label; } // Update the card's label - $wrapper.attr('aria-label', 'Card ' + ($wrapper.index() + 1) + ': ' + label); // TODO l10n + $wrapper.attr('aria-label', l10n.cardPrefix.replace('%num', $wrapper.index() + 1) + ' ' + label); // Update disabled property $wrapper.attr('aria-disabled', reset ? null : 'true'); @@ -155,9 +156,20 @@ self.trigger('prev'); event.preventDefault(); return; + case 35: + // Move to last card + self.trigger('last'); + event.preventDefault(); + return; + case 36: + // Move to first card + self.trigger('first'); + event.preventDefault(); + return; } }); - $wrapper.attr('aria-label', 'Card ' + ($wrapper.index() + 1) + ': Unturned.'); // TODO l10n + + $wrapper.attr('aria-label', l10n.cardPrefix.replace('%num', $wrapper.index() + 1) + ' ' + l10n.cardUnturned); $card = $wrapper.children('.h5p-memory-card') .children('.h5p-front') .click(function () { diff --git a/language/ar.json b/language/ar.json index 0f2a1fa..b1c7fd2 100644 --- a/language/ar.json +++ b/language/ar.json @@ -1,6 +1,11 @@ { "semantics": [ { + "widgets": [ + { + "label": "Default" + } + ], "label": "البطاقات", "entity": "بطاقة", "field": { @@ -10,53 +15,53 @@ "label": "الصورة" }, { - "englishLabel": "Matching Image", "label": "Matching 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": "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": "Description", + "description": "An optional short text that will pop up once the two matching cards are found." } ] } }, { - "englishLabel": "Behavioural settings", "label": "Behavioural settings", - "englishDescription": "These options will let you control how the game behaves.", "description": "These options will let you control how the game behaves.", "fields": [ { - "englishLabel": "Position the cards in a square", "label": "Position the cards in a square", - "englishDescription": "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.", "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", - "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" } ] }, { - "englishLabel": "Look and feel", - "englishDescription": "Control the visuals of the game.", + "label": "Look and feel", + "description": "Control the visuals of the game.", "fields": [ { - "englishLabel": "Theme Color", - "englishDescription": "Choose a color to create a theme for your card game." + "label": "Theme Color", + "description": "Choose a color to create a theme for your card game.", + "default": "#909090" }, { - "englishLabel": "Card Back", - "englishDescription": "Use a custom back for your cards." + "label": "Card Back", + "description": "Use a custom back for your cards." } ] }, @@ -64,23 +69,46 @@ "label": "الأقلمة", "fields": [ { - "label": "نص تدوير البطاقة" + "label": "نص تدوير البطاقة", + "default": "Card turns" }, { - "label": "نص التوقيت الزمني" + "label": "نص التوقيت الزمني", + "default": "Time spent" }, { - "label": "نص الملاحظات" + "label": "نص الملاحظات", + "default": "Good work!" }, { - "englishLabel": "Try again button text", - "englishDefault": "Try again?" + "label": "Try again button text", + "default": "Reset" }, { - "englishLabel": "Close button label", - "englishDefault": "Close" + "label": "Close button label", + "default": "Close" + }, + { + "label": "Game label", + "default": "Memory Game. Find the matching cards." + }, + { + "label": "Game finished label", + "default": "All of the cards have been found." + }, + { + "label": "Card indexing label", + "default": "Card %num:" + }, + { + "label": "Card unturned label", + "default": "Unturned." + }, + { + "label": "Card matched label", + "default": "Match found." } ] } ] -} +} \ No newline at end of file diff --git a/language/bs.json b/language/bs.json index c97e6ca..780bbed 100644 --- a/language/bs.json +++ b/language/bs.json @@ -1,6 +1,11 @@ { "semantics": [ { + "widgets": [ + { + "label": "Default" + } + ], "label": "Karte", "entity": "karte", "field": { @@ -10,53 +15,53 @@ "label": "Slika" }, { - "englishLabel": "Matching Image", "label": "Ista slika", - "englishDescription": "An optional image to match against instead of using two cards with the same image.", "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": "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": "Description", + "description": "An optional short text that will pop up once the two matching cards are found." } ] } }, { - "englishLabel": "Behavioural settings", "label": "Podešavanje ponašanja", - "englishDescription": "These options will let you control how the game behaves.", "description": "These options will let you control how the game behaves.", "fields": [ { - "englishLabel": "Position the cards in a square", "label": "Poredaj karte u redove ", - "englishDescription": "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.", "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": "Broj karata za upotrebu", - "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" } ] }, { - "englishLabel": "Look and feel", - "englishDescription": "Control the visuals of the game.", + "label": "Look and feel", + "description": "Control the visuals of the game.", "fields": [ { - "englishLabel": "Theme Color", - "englishDescription": "Choose a color to create a theme for your card game." + "label": "Theme Color", + "description": "Choose a color to create a theme for your card game.", + "default": "#909090" }, { - "englishLabel": "Poleđina karata", - "englishDescription": "Koristi standardnu pozadinu za karte." + "label": "Card Back", + "description": "Use a custom back for your cards." } ] }, @@ -76,16 +81,34 @@ "default": "BRAVO!" }, { - "englishLabel": "Try again button text", "label": "Tekst na dugmetu pokušaj ponovo", - "englishDefault": "Try again?", "default": "Pokušaj ponovo?" }, { - "englishLabel": "Close button label", - "englishDefault": "Close" + "label": "Close button label", + "default": "Close" + }, + { + "label": "Game label", + "default": "Memory Game. Find the matching cards." + }, + { + "label": "Game finished label", + "default": "All of the cards have been found." + }, + { + "label": "Card indexing label", + "default": "Card %num:" + }, + { + "label": "Card unturned label", + "default": "Unturned." + }, + { + "label": "Card matched label", + "default": "Match found." } ] } ] -} +} \ No newline at end of file diff --git a/language/de.json b/language/de.json index 9abf453..68deed0 100644 --- a/language/de.json +++ b/language/de.json @@ -1,6 +1,11 @@ { "semantics": [ { + "widgets": [ + { + "label": "Default" + } + ], "label": "Karten", "entity": "karte", "field": { @@ -10,53 +15,53 @@ "label": "Bild" }, { - "englishLabel": "Matching Image", "label": "Matching 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": "Beschreibung", "description": "Ein kurzer Text, der angezeigt wird, sobald zwei identische Karten gefunden werden." + }, + { + "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": "Description", + "description": "An optional short text that will pop up once the two matching cards are found." } ] } }, { - "englishLabel": "Behavioural settings", "label": "Behavioural settings", - "englishDescription": "These options will let you control how the game behaves.", "description": "These options will let you control how the game behaves.", "fields": [ { - "englishLabel": "Position the cards in a square", "label": "Position the cards in a square", - "englishDescription": "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.", "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", - "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" } ] }, { - "englishLabel": "Look and feel", - "englishDescription": "Control the visuals of the game.", + "label": "Look and feel", + "description": "Control the visuals of the game.", "fields": [ { - "englishLabel": "Theme Color", - "englishDescription": "Choose a color to create a theme for your card game." + "label": "Theme Color", + "description": "Choose a color to create a theme for your card game.", + "default": "#909090" }, { - "englishLabel": "Card Back", - "englishDescription": "Use a custom back for your cards." + "label": "Card Back", + "description": "Use a custom back for your cards." } ] }, @@ -76,14 +81,34 @@ "default": "Gute Arbeit!" }, { - "englishLabel": "Try again button text", - "englishDefault": "Try again?" + "label": "Try again button text", + "default": "Reset" }, { - "englishLabel": "Close button label", - "englishDefault": "Close" + "label": "Close button label", + "default": "Close" + }, + { + "label": "Game label", + "default": "Memory Game. Find the matching cards." + }, + { + "label": "Game finished label", + "default": "All of the cards have been found." + }, + { + "label": "Card indexing label", + "default": "Card %num:" + }, + { + "label": "Card unturned label", + "default": "Unturned." + }, + { + "label": "Card matched label", + "default": "Match found." } ] } ] -} +} \ No newline at end of file diff --git a/language/fr.json b/language/fr.json index 204a6d9..05771c5 100644 --- a/language/fr.json +++ b/language/fr.json @@ -1,6 +1,11 @@ { "semantics": [ { + "widgets": [ + { + "label": "Default" + } + ], "label": "Cartes", "entity": "carte", "field": { @@ -10,53 +15,53 @@ "label": "Image" }, { - "englishLabel": "Matching Image", "label": "Matching 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", "description": "Petit texte affiché quand deux cartes identiques sont trouvées." + }, + { + "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": "Description", + "description": "An optional short text that will pop up once the two matching cards are found." } ] } }, { - "englishLabel": "Behavioural settings", "label": "Behavioural settings", - "englishDescription": "These options will let you control how the game behaves.", "description": "These options will let you control how the game behaves.", "fields": [ { - "englishLabel": "Position the cards in a square", "label": "Position the cards in a square", - "englishDescription": "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.", "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", - "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" } ] }, { - "englishLabel": "Look and feel", - "englishDescription": "Control the visuals of the game.", + "label": "Look and feel", + "description": "Control the visuals of the game.", "fields": [ { - "englishLabel": "Theme Color", - "englishDescription": "Choose a color to create a theme for your card game." + "label": "Theme Color", + "description": "Choose a color to create a theme for your card game.", + "default": "#909090" }, { - "englishLabel": "Card Back", - "englishDescription": "Use a custom back for your cards." + "label": "Card Back", + "description": "Use a custom back for your cards." } ] }, @@ -76,14 +81,34 @@ "default": "Bien joué !" }, { - "englishLabel": "Try again button text", - "englishDefault": "Try again?" + "label": "Try again button text", + "default": "Reset" }, { - "englishLabel": "Close button label", - "englishDefault": "Close" + "label": "Close button label", + "default": "Close" + }, + { + "label": "Game label", + "default": "Memory Game. Find the matching cards." + }, + { + "label": "Game finished label", + "default": "All of the cards have been found." + }, + { + "label": "Card indexing label", + "default": "Card %num:" + }, + { + "label": "Card unturned label", + "default": "Unturned." + }, + { + "label": "Card matched label", + "default": "Match found." } ] } ] -} +} \ No newline at end of file diff --git a/language/it.json b/language/it.json index 1137a03..ccdb254 100644 --- a/language/it.json +++ b/language/it.json @@ -1,6 +1,11 @@ { "semantics": [ { + "widgets": [ + { + "label": "Default" + } + ], "label": "Carte", "entity": "carta", "field": { @@ -10,53 +15,53 @@ "label": "Immagine" }, { - "englishLabel": "Matching Image", "label": "Matching 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", "description": "Breve testo visualizzato quando due carte uguali vengono trovate." + }, + { + "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": "Description", + "description": "An optional short text that will pop up once the two matching cards are found." } ] } }, { - "englishLabel": "Behavioural settings", "label": "Behavioural settings", - "englishDescription": "These options will let you control how the game behaves.", "description": "These options will let you control how the game behaves.", "fields": [ { - "englishLabel": "Position the cards in a square", "label": "Position the cards in a square", - "englishDescription": "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.", "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", - "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" } ] }, { - "englishLabel": "Look and feel", - "englishDescription": "Control the visuals of the game.", + "label": "Look and feel", + "description": "Control the visuals of the game.", "fields": [ { - "englishLabel": "Theme Color", - "englishDescription": "Choose a color to create a theme for your card game." + "label": "Theme Color", + "description": "Choose a color to create a theme for your card game.", + "default": "#909090" }, { - "englishLabel": "Card Back", - "englishDescription": "Use a custom back for your cards." + "label": "Card Back", + "description": "Use a custom back for your cards." } ] }, @@ -64,23 +69,46 @@ "label": "Localizzazione", "fields": [ { - "label": "Testo Gira carta" + "label": "Testo Gira carta", + "default": "Card turns" }, { - "label": "Testo Tempo trascorso" + "label": "Testo Tempo trascorso", + "default": "Time spent" }, { - "label": "Testo Feedback" + "label": "Testo Feedback", + "default": "Good work!" }, { - "englishLabel": "Try again button text", - "englishDefault": "Try again?" + "label": "Try again button text", + "default": "Reset" }, { - "englishLabel": "Close button label", - "englishDefault": "Close" + "label": "Close button label", + "default": "Close" + }, + { + "label": "Game label", + "default": "Memory Game. Find the matching cards." + }, + { + "label": "Game finished label", + "default": "All of the cards have been found." + }, + { + "label": "Card indexing label", + "default": "Card %num:" + }, + { + "label": "Card unturned label", + "default": "Unturned." + }, + { + "label": "Card matched label", + "default": "Match found." } ] } ] -} +} \ No newline at end of file diff --git a/language/nb.json b/language/nb.json index 53e6ccc..29e2a49 100644 --- a/language/nb.json +++ b/language/nb.json @@ -1,112 +1,114 @@ { "semantics": [ { - "englishLabel": "Cards", + "widgets": [ + { + "label": "Default" + } + ], "label": "Kort", - "englishEntity": "card", "entity": "kort", "field": { - "englishLabel": "Card", "label": "Kort", "fields": [ { - "englishLabel": "Image", "label": "Bilde" }, { - "englishLabel": "Matching Image", "label": "Tilhørende 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", - "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." + }, + { + "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": "Description", + "description": "An optional short text that will pop up once the two matching cards are found." } ] } }, { - "englishLabel": "Behavioural settings", "label": "Innstillinger for oppførsel", - "englishDescription": "These options will let you control how the game behaves.", "description": "Disse instillingene lar deg bestemme hvordan spillet skal oppføre seg.", "fields": [ { - "englishLabel": "Position the cards in a square", "label": "Plasser kortene i en firkant", - "englishDescription": "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.", "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", - "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" } ] }, { - "englishLabel": "Look and feel", "label": "Tilpass utseende", - "englishDescription": "Control the visuals of the game.", "description": "Kontroller de visuelle aspektene ved spillet.", "fields": [ { - "englishLabel": "Theme Color", "label": "Temafarge", - "englishDescription": "Choose a color to create a theme for your card game.", - "description": "Velg en farge for å skape et tema over kortspillet ditt." + "description": "Velg en farge for å skape et tema over kortspillet ditt.", + "default": "#909090" }, { - "englishLabel": "Card Back", "label": "Kortbaksiden", - "englishDescription": "Use a custom back for your cards.", "description": "Bruk en tilpasset kortbakside for kortene dine." } ] }, { - "englishLabel": "Localization", "label": "Oversettelser", "fields": [ { - "englishLabel": "Card turns text", "label": "Etikett for antall vendte kort", - "englishDefault": "Card turns", "default": "Kort vendt" }, { - "englishLabel": "Time spent text", "label": "Etikett for tid brukt", - "englishDefault": "Time spent", "default": "Tid brukt" }, { - "englishLabel": "Feedback text", "label": "Tilbakemeldingstekst", - "englishDefault": "Good work!", "default": "Godt jobbet!" }, { - "englishLabel": "Try again button text", "label": "Prøv på nytt-tekst", - "englishDefault": "Try again?", "default": "Prøv på nytt?" }, { - "englishLabel": "Close button label", "label": "Lukk knapp-merkelapp", - "englishDefault": "Close", "default": "Lukk" + }, + { + "label": "Game label", + "default": "Memory Game. Find the matching cards." + }, + { + "label": "Game finished label", + "default": "All of the cards have been found." + }, + { + "label": "Card indexing label", + "default": "Card %num:" + }, + { + "label": "Card unturned label", + "default": "Unturned." + }, + { + "label": "Card matched label", + "default": "Match found." } ] } ] -} +} \ No newline at end of file diff --git a/memory-game.css b/memory-game.css index 4d61392..67e4b9a 100644 --- a/memory-game.css +++ b/memory-game.css @@ -194,9 +194,6 @@ margin: 0 1em 0 0; font-weight: bold; } -.h5p-memory-game .h5p-status > dt:after { - content: ":"; -} .h5p-memory-game .h5p-status > dd { margin: 0; } @@ -314,3 +311,6 @@ transform: translate(-50%,-450%) scale(0) rotate(360deg); opacity: 0; } +.h5p-memory-complete { + display: none; +} diff --git a/memory-game.js b/memory-game.js index a0cb033..7c61076 100644 --- a/memory-game.js +++ b/memory-game.js @@ -22,13 +22,29 @@ H5P.MemoryGame = (function (EventDispatcher, $) { // Initialize event inheritance EventDispatcher.call(self); - var flipped, timer, counter, popup, $bottom, $feedback, $wrapper, maxWidth, numCols; + var flipped, timer, counter, popup, $bottom, $taskComplete, $feedback, $wrapper, maxWidth, numCols; var cards = []; var flipBacks = []; // Que of cards to be flipped back var numFlipped = 0; var removed = 0; numInstances++; + // Add defaults + parameters = $.extend(true, { + l10n: { + cardTurns: 'Card turns', + timeSpent: 'Time spent', + feedback: 'Good work!', + tryAgain: 'Reset', + closeLabel: 'Close', + label: 'Memory Game. Find the matching cards.', + done: 'All of the cards have been found.', + cardPrefix: 'Card %num: ', + cardUnturned: 'Unturned.', + cardMatched: 'Match found.' + } + }, parameters); + /** * Check if these two cards belongs together. * @@ -69,7 +85,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { if (card.hasTwoImages) { imgs.push(mate.getImage()); } - popup.show(desc, imgs, cardStyles ? cardStyles.back : undefined, function () { + popup.show(desc, imgs, cardStyles ? cardStyles.back : undefined, function (refocus) { if (isFinished) { // Game done card.makeUntabbable(); @@ -78,6 +94,10 @@ H5P.MemoryGame = (function (EventDispatcher, $) { else { // Popup is closed, continue. timer.play(); + + if (refocus) { + card.setFocus(); + } } }); } @@ -94,6 +114,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { */ var finished = function () { timer.stop(); + $taskComplete.show(); $feedback.addClass('h5p-show'); // Announce $bottom.focus(); @@ -140,6 +161,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { // Remove feedback $feedback[0].classList.remove('h5p-show'); + $taskComplete.hide(); // Reset timer and counter timer.reset(); @@ -196,6 +218,14 @@ H5P.MemoryGame = (function (EventDispatcher, $) { */ var addCard = function (card, mate) { card.on('flip', function () { + + // Always return focus to the card last flipped + for (var i = 0; i < cards.length; i++) { + cards[i].makeUntabbable(); + } + card.makeTabbable(); + + popup.close(); self.triggerXAPI('interacted'); // Keep track of time spent timer.play(); @@ -232,8 +262,12 @@ H5P.MemoryGame = (function (EventDispatcher, $) { }); /** + * Create event handler for moving focus to the next or the previous + * card on the table. + * * @private - * @param {number} direction + * @param {number} direction +1/-1 + * @return {function} */ var createCardChangeFocusHandler = function (direction) { return function () { @@ -261,8 +295,38 @@ H5P.MemoryGame = (function (EventDispatcher, $) { }; }; + // Register handlers for moving focus to next and previous card card.on('next', createCardChangeFocusHandler(1)); card.on('prev', createCardChangeFocusHandler(-1)); + + /** + * Create event handler for moving focus to the first or the last card + * on the table. + * + * @private + * @param {number} direction +1/-1 + * @return {function} + */ + var createEndCardFocusHandler = function (direction) { + return function () { + var focusSet = false; + for (var i = 0; i < cards.length; i++) { + var j = (direction === -1 ? cards.length - (i + 1) : i); + if (!focusSet && !cards[j].isRemoved()) { + cards[j].setFocus(); + focusSet = true; + } + else if (cards[j] === card) { + card.makeUntabbable(); + } + } + }; + }; + + // Register handlers for moving focus to first and last card + card.on('first', createEndCardFocusHandler(1)); + card.on('last', createEndCardFocusHandler(-1)); + cards.push(card); }; @@ -320,16 +384,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, cardParams.description, cardStyles); + var cardTwo, cardOne = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, parameters.l10n, cardParams.description, cardStyles); if (MemoryGame.Card.hasTwoImages(cardParams)) { // Use matching image for card two - cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.matchAlt, cardParams.description, cardStyles); + cardTwo = new MemoryGame.Card(cardParams.match, id, cardParams.matchAlt, parameters.l10n, cardParams.description, cardStyles); cardOne.hasTwoImages = cardTwo.hasTwoImages = true; } else { // Add two cards with the same image - cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, cardParams.description, cardStyles); + cardTwo = new MemoryGame.Card(cardParams.image, id, cardParams.imageAlt, parameters.l10n, cardParams.description, cardStyles); } // Add cards to card list for shuffeling @@ -366,7 +430,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { $('
        ', { id: 'h5p-intro-' + numInstances, 'class': 'h5p-memory-hidden-read', - html: 'Memory Game. Find the matching cards.', // TODO: l10n + html: parameters.l10n.label, appendTo: $container }); $list.appendTo($container); @@ -375,9 +439,9 @@ H5P.MemoryGame = (function (EventDispatcher, $) { tabindex: '-1', appendTo: $container }); - $('
        ', { - 'class': 'h5p-memory-hidden-read', - html: 'All of the cards have been found.', // TODO: l10n + $taskComplete = $('
        ', { + 'class': 'h5p-memory-complete h5p-memory-hidden-read', + html: parameters.l10n.done, appendTo: $bottom }); @@ -385,13 +449,13 @@ H5P.MemoryGame = (function (EventDispatcher, $) { // Add status bar var $status = $('
        ' + - '
        ' + parameters.l10n.timeSpent + '
        ' + - '
        0:00
        ' + // TODO: Add hidden dot ? - '
        ' + parameters.l10n.cardTurns + '
        ' + - '
        0
        ' + + '
        ' + parameters.l10n.timeSpent + ':
        ' + + '
        .
        ' + + '
        ' + parameters.l10n.cardTurns + ':
        ' + + '
        0.
        ' + '
        ').appendTo($bottom); - timer = new MemoryGame.Timer($status.find('.h5p-time-spent')[0]); + timer = new MemoryGame.Timer($status.find('time')[0]); counter = new MemoryGame.Counter($status.find('.h5p-card-turns')); popup = new MemoryGame.Popup($container, parameters.l10n); diff --git a/popup.js b/popup.js index 24b2b46..3f07631 100644 --- a/popup.js +++ b/popup.js @@ -13,16 +13,16 @@ var closed; - var $popup = $('
        ').appendTo($container); + var $popup = $('').appendTo($container); var $desc = $popup.find('.h5p-memory-desc'); var $top = $popup.find('.h5p-memory-top'); // Hook up the close button $popup.find('.h5p-memory-close').on('click', function () { - self.close(); + self.close(true); }).on('keypress', function (event) { if (event.which === 13 || event.which === 32) { - self.close(); + self.close(true); event.preventDefault(); } }); @@ -41,22 +41,26 @@ $('
        ').append(imgs[i]).appendTo($top); } $popup.show(); + $desc.focus(); closed = done; }; /** * Close the popup. + * + * @param {boolean} refocus Sets focus after closing the dialog */ - self.close = function () { + self.close = function (refocus) { if (closed !== undefined) { $popup.hide(); - closed(); + closed(refocus); closed = undefined; } }; /** * Sets popup size relative to the card size + * * @param {number} fontSize */ self.setSize = function (fontSize) { diff --git a/semantics.json b/semantics.json index 52a1f10..0333ce0 100644 --- a/semantics.json +++ b/semantics.json @@ -169,7 +169,42 @@ "name": "closeLabel", "type": "text", "default": "Close" + }, + { + "label": "Game label", + "importance": "low", + "name": "label", + "type": "text", + "default": "Memory Game. Find the matching cards." + }, + { + "label": "Game finished label", + "importance": "low", + "name": "done", + "type": "text", + "default": "All of the cards have been found." + }, + { + "label": "Card indexing label", + "importance": "low", + "name": "cardPrefix", + "type": "text", + "default": "Card %num:" + }, + { + "label": "Card unturned label", + "importance": "low", + "name": "cardUnturned", + "type": "text", + "default": "Unturned." + }, + { + "label": "Card matched label", + "importance": "low", + "name": "cardMatched", + "type": "text", + "default": "Match found." } ] } -] +] \ No newline at end of file diff --git a/timer.js b/timer.js index 339392e..4af4caf 100644 --- a/timer.js +++ b/timer.js @@ -28,6 +28,11 @@ var minutes = Timer.extractTimeElement(time, 'minutes'); var seconds = Timer.extractTimeElement(time, 'seconds') % 60; + + // Update duration attribute + element.setAttribute('datetime', 'PT' + minutes + 'M' + seconds + 'S'); + + // Add leading zero if (seconds < 10) { seconds = '0' + seconds; } From 6f62cf9da0c73e64dd0e8767c79e7d0a49e7067a Mon Sep 17 00:00:00 2001 From: Frode Petterson Date: Tue, 26 Sep 2017 11:48:45 +0200 Subject: [PATCH 05/11] Fix broken ar.json language file --- language/ar.json | 86 +++--------------------------------------------- 1 file changed, 5 insertions(+), 81 deletions(-) diff --git a/language/ar.json b/language/ar.json index 6399171..78a9852 100644 --- a/language/ar.json +++ b/language/ar.json @@ -1,7 +1,6 @@ { - "semantics":[ + "semantics": [ { -<<<<<<< HEAD "widgets": [ { "label": "Default" @@ -12,23 +11,10 @@ "field": { "label": "البطاقة", "fields": [ -======= - "widgets":[ - { - "label":"Default" - } - ], - "label":"البطاقات", - "entity":"بطاقة", - "field":{ - "label":"البطاقة", - "fields":[ ->>>>>>> master { - "label":"الصورة" + "label": "الصورة" }, { -<<<<<<< HEAD "label": "Matching Image", "description": "An optional image to match against instead of using two cards with the same image." }, @@ -43,20 +29,11 @@ { "label": "Description", "description": "An optional short text that will pop up once the two matching cards are found." -======= - "label":"Matching Image", - "description":"An optional image to match against instead of using two cards with the same image." - }, - { - "label":"الوصف", - "description":"نص قصير يتم عرضه مرة واحدة علي اثنين من البطاقات متساوية" ->>>>>>> master } ] } }, { -<<<<<<< HEAD "label": "Behavioural settings", "description": "These options will let you control how the game behaves.", "fields": [ @@ -70,26 +47,10 @@ }, { "label": "Add button for retrying when the game is over" -======= - "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" ->>>>>>> master } ] }, { -<<<<<<< HEAD "label": "Look and feel", "description": "Control the visuals of the game.", "fields": [ @@ -101,30 +62,13 @@ { "label": "Card Back", "description": "Use a custom back for your cards." -======= - "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." ->>>>>>> master } ] }, { - "label":"الأقلمة", - "fields":[ + "label": "الأقلمة", + "fields": [ { -<<<<<<< HEAD "label": "نص تدوير البطاقة", "default": "Card turns" }, @@ -163,28 +107,8 @@ { "label": "Card matched label", "default": "Match found." -======= - "label":"نص تدوير البطاقة", - "default":"Card turns" - }, - { - "label":"نص التوقيت الزمني", - "default":"Time spent" - }, - { - "label":"نص الملاحظات", - "default":"Good work!" - }, - { - "label":"Try again button text", - "default":"Try again?" - }, - { - "label":"Close button label", - "default":"Close" ->>>>>>> master } ] } ] -} \ No newline at end of file +} From 46d769ef0ba21caf0f6aaf318ed8e6d2e9d0148c Mon Sep 17 00:00:00 2001 From: Frode Petterson Date: Tue, 26 Sep 2017 11:54:34 +0200 Subject: [PATCH 06/11] Fix broken translations --- language/bs.json | 86 +++++++----------------------------------------- language/de.json | 86 +++++++----------------------------------------- language/fr.json | 86 +++++++----------------------------------------- language/it.json | 86 +++--------------------------------------------- language/nb.json | 84 ++-------------------------------------------- 5 files changed, 40 insertions(+), 388 deletions(-) diff --git a/language/bs.json b/language/bs.json index 047f2cd..125eae6 100644 --- a/language/bs.json +++ b/language/bs.json @@ -1,7 +1,6 @@ { - "semantics":[ + "semantics": [ { -<<<<<<< HEAD "widgets": [ { "label": "Default" @@ -12,23 +11,10 @@ "field": { "label": "Karte", "fields": [ -======= - "widgets":[ - { - "label":"Default" - } - ], - "label":"Karte", - "entity":"karte", - "field":{ - "label":"Karte", - "fields":[ ->>>>>>> master { - "label":"Slika" + "label": "Slika" }, { -<<<<<<< HEAD "label": "Ista slika", "description": "Opcionalna slika koja se koristi umjestodvije iste slike." }, @@ -43,20 +29,11 @@ { "label": "Description", "description": "An optional short text that will pop up once the two matching cards are found." -======= - "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." ->>>>>>> master } ] } }, { -<<<<<<< HEAD "label": "Podešavanje ponašanja", "description": "These options will let you control how the game behaves.", "fields": [ @@ -70,26 +47,10 @@ }, { "label": "Add button for retrying when the game is over" -======= - "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" ->>>>>>> master } ] }, { -<<<<<<< HEAD "label": "Look and feel", "description": "Control the visuals of the game.", "fields": [ @@ -101,42 +62,25 @@ { "label": "Card Back", "description": "Use a custom back for your cards." -======= - "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." ->>>>>>> master } ] }, { - "label":"Prijevod", - "fields":[ + "label": "Prijevod", + "fields": [ { - "label":"Tekst kad se okrene karta ", - "default":"Okrenuta karta" + "label": "Tekst kad se okrene karta ", + "default": "Okrenuta karta" }, { - "label":"Tekst za provedeno vrijeme", - "default":"Provedeno vrijeme" + "label": "Tekst za provedeno vrijeme", + "default": "Provedeno vrijeme" }, { - "label":"Feedback tekst", - "default":"BRAVO!" + "label": "Feedback tekst", + "default": "BRAVO!" }, { -<<<<<<< HEAD "label": "Tekst na dugmetu pokušaj ponovo", "default": "Pokušaj ponovo?" }, @@ -163,16 +107,8 @@ { "label": "Card matched label", "default": "Match found." -======= - "label":"Tekst na dugmetu pokušaj ponovo", - "default":"Pokušaj ponovo?" - }, - { - "label":"Close button label", - "default":"Close" ->>>>>>> master } ] } ] -} \ No newline at end of file +} diff --git a/language/de.json b/language/de.json index 3c3d210..550d6b0 100644 --- a/language/de.json +++ b/language/de.json @@ -1,7 +1,6 @@ { - "semantics":[ + "semantics": [ { -<<<<<<< HEAD "widgets": [ { "label": "Default" @@ -12,23 +11,10 @@ "field": { "label": "Karte", "fields": [ -======= - "widgets":[ - { - "label":"Vorgaben" - } - ], - "label":"Karten", - "entity":"karte", - "field":{ - "label":"Karte", - "fields":[ ->>>>>>> master { - "label":"Bild" + "label": "Bild" }, { -<<<<<<< HEAD "label": "Matching Image", "description": "An optional image to match against instead of using two cards with the same image." }, @@ -43,20 +29,11 @@ { "label": "Description", "description": "An optional short text that will pop up once the two matching cards are found." -======= - "label":"Passendes Bild", - "description":"Ein optionales anderes Bild als Gegenstück statt zwei Karten mit dem selben Bild zu nutzen" - }, - { - "label":"Beschreibung", - "description":"Ein kurzer Text, der angezeigt wird, sobald zwei identische Karten gefunden werden." ->>>>>>> master } ] } }, { -<<<<<<< HEAD "label": "Behavioural settings", "description": "These options will let you control how the game behaves.", "fields": [ @@ -70,26 +47,10 @@ }, { "label": "Add button for retrying when the game is over" -======= - "label":"Interaktionseinstellungen", - "description":"Mit diesen Einstellungen kannst du das Verhalten des Spiels anpassen.", - "fields":[ - { - "label":"Positioniere die Karten in einem Quadrat.", - "description":"Es wird versucht, die Anzahl der Zeilen und Spalten passend zu den Karten einzustellen. Danach werden die Karten passend skaliert." - }, - { - "label":"Anzahl der zu nutzenden Karten", - "description":"Wird hier eine Zahl größer als 2 eingestellt, werden zufällig Karten aus der Kartenliste gezogen." - }, - { - "label":"Füge einen Button hinzu, um das Spiel noch einmal neu zu starten zu können, wenn es vorbei ist." ->>>>>>> master } ] }, { -<<<<<<< HEAD "label": "Look and feel", "description": "Control the visuals of the game.", "fields": [ @@ -101,42 +62,25 @@ { "label": "Card Back", "description": "Use a custom back for your cards." -======= - "label":"Design-Aspekte", - "description":"Beeinflusse die Optik des Spiels", - "fields":[ - { - "label":"Themenfarbe", - "description":"Wähle eine Farbe, um ein Theme für deine Karten zu erstellen.", - "default":"#909090", - "spectrum":{ - - } - }, - { - "label":"Kartenrückseite", - "description":"Nutze eine individuelle Rückseite für deine Karten." ->>>>>>> master } ] }, { - "label":"Übersetzung", - "fields":[ + "label": "Übersetzung", + "fields": [ { - "label":"Text für die Anzahl der Züge", - "default":"Züge" + "label": "Text für die Anzahl der Züge", + "default": "Züge" }, { - "label":"Text für die benötigte Zeit", - "default":"Benötigte Zeit" + "label": "Text für die benötigte Zeit", + "default": "Benötigte Zeit" }, { - "label":"Text als Rückmeldung", - "default":"Gute Arbeit!" + "label": "Text als Rückmeldung", + "default": "Gute Arbeit!" }, { -<<<<<<< HEAD "label": "Try again button text", "default": "Reset" }, @@ -163,16 +107,8 @@ { "label": "Card matched label", "default": "Match found." -======= - "label":"Text des Wiederholen-Buttons", - "default":"Erneut versuchen?" - }, - { - "label":"Beschriftung des \"Abbrechen\"-Buttons", - "default":"Schließen" ->>>>>>> master } ] } ] -} \ No newline at end of file +} diff --git a/language/fr.json b/language/fr.json index 9b93588..32ca798 100644 --- a/language/fr.json +++ b/language/fr.json @@ -1,7 +1,6 @@ { - "semantics":[ + "semantics": [ { -<<<<<<< HEAD "widgets": [ { "label": "Default" @@ -12,23 +11,10 @@ "field": { "label": "Carte", "fields": [ -======= - "widgets":[ - { - "label":"Default" - } - ], - "label":"Cartes", - "entity":"carte", - "field":{ - "label":"Carte", - "fields":[ ->>>>>>> master { - "label":"Image" + "label": "Image" }, { -<<<<<<< HEAD "label": "Matching Image", "description": "An optional image to match against instead of using two cards with the same image." }, @@ -43,20 +29,11 @@ { "label": "Description", "description": "An optional short text that will pop up once the two matching cards are found." -======= - "label":"Matching Image", - "description":"An optional image to match against instead of using two cards with the same image." - }, - { - "label":"Description", - "description":"Petit texte affiché quand deux cartes identiques sont trouvées." ->>>>>>> master } ] } }, { -<<<<<<< HEAD "label": "Behavioural settings", "description": "These options will let you control how the game behaves.", "fields": [ @@ -70,26 +47,10 @@ }, { "label": "Add button for retrying when the game is over" -======= - "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" ->>>>>>> master } ] }, { -<<<<<<< HEAD "label": "Look and feel", "description": "Control the visuals of the game.", "fields": [ @@ -101,42 +62,25 @@ { "label": "Card Back", "description": "Use a custom back for your cards." -======= - "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." ->>>>>>> master } ] }, { - "label":"Interface", - "fields":[ + "label": "Interface", + "fields": [ { - "label":"Texte pour le nombre de cartes retournées", - "default":"Cartes retournées :" + "label": "Texte pour le nombre de cartes retournées", + "default": "Cartes retournées :" }, { - "label":"Texte pour le temps passé", - "default":"Temps écoulé :" + "label": "Texte pour le temps passé", + "default": "Temps écoulé :" }, { - "label":"Texte de l'appréciation finale", - "default":"Bien joué !" + "label": "Texte de l'appréciation finale", + "default": "Bien joué !" }, { -<<<<<<< HEAD "label": "Try again button text", "default": "Reset" }, @@ -163,16 +107,8 @@ { "label": "Card matched label", "default": "Match found." -======= - "label":"Try again button text", - "default":"Try again?" - }, - { - "label":"Close button label", - "default":"Close" ->>>>>>> master } ] } ] -} \ No newline at end of file +} diff --git a/language/it.json b/language/it.json index b8b9fec..6a2e4c3 100644 --- a/language/it.json +++ b/language/it.json @@ -1,7 +1,6 @@ { - "semantics":[ + "semantics": [ { -<<<<<<< HEAD "widgets": [ { "label": "Default" @@ -12,23 +11,10 @@ "field": { "label": "Carta", "fields": [ -======= - "widgets":[ - { - "label":"Default" - } - ], - "label":"Carte", - "entity":"carta", - "field":{ - "label":"Carta", - "fields":[ ->>>>>>> master { - "label":"Immagine" + "label": "Immagine" }, { -<<<<<<< HEAD "label": "Matching Image", "description": "An optional image to match against instead of using two cards with the same image." }, @@ -43,20 +29,11 @@ { "label": "Description", "description": "An optional short text that will pop up once the two matching cards are found." -======= - "label":"Matching Image", - "description":"An optional image to match against instead of using two cards with the same image." - }, - { - "label":"Descrizione", - "description":"Breve testo visualizzato quando due carte uguali vengono trovate." ->>>>>>> master } ] } }, { -<<<<<<< HEAD "label": "Behavioural settings", "description": "These options will let you control how the game behaves.", "fields": [ @@ -70,26 +47,10 @@ }, { "label": "Add button for retrying when the game is over" -======= - "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" ->>>>>>> master } ] }, { -<<<<<<< HEAD "label": "Look and feel", "description": "Control the visuals of the game.", "fields": [ @@ -101,30 +62,13 @@ { "label": "Card Back", "description": "Use a custom back for your cards." -======= - "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." ->>>>>>> master } ] }, { - "label":"Localizzazione", - "fields":[ + "label": "Localizzazione", + "fields": [ { -<<<<<<< HEAD "label": "Testo Gira carta", "default": "Card turns" }, @@ -163,28 +107,8 @@ { "label": "Card matched label", "default": "Match found." -======= - "label":"Testo Gira carta", - "default":"Card turns" - }, - { - "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" ->>>>>>> master } ] } ] -} \ No newline at end of file +} diff --git a/language/nb.json b/language/nb.json index ce5abb5..21218d7 100644 --- a/language/nb.json +++ b/language/nb.json @@ -1,7 +1,6 @@ { - "semantics":[ + "semantics": [ { -<<<<<<< HEAD "widgets": [ { "label": "Default" @@ -30,34 +29,11 @@ { "label": "Description", "description": "An optional short text that will pop up once the two matching cards are found." -======= - "widgets":[ - { - "label":"Default" - } - ], - "label":"Kort", - "entity":"kort", - "field":{ - "label":"Kort", - "fields":[ - { - "label":"Bilde" - }, - { - "label":"Tilhørende bilde", - "description":"Et valgfritt bilde som brukes av kort nummer to istedenfor å bruke to kort med samme bilde." - }, - { - "label":"Beskrivelse", - "description":"En valgfri kort tekst som spretter opp når kort-paret er funnet." ->>>>>>> master } ] } }, { -<<<<<<< HEAD "label": "Innstillinger for oppførsel", "description": "Disse instillingene lar deg bestemme hvordan spillet skal oppføre seg.", "fields": [ @@ -71,26 +47,10 @@ }, { "label": "Legg til knapp for å prøve på nytt når spillet er over" -======= - "label":"Innstillinger for oppførsel", - "description":"Disse instillingene lar deg bestemme hvordan spillet skal oppføre seg.", - "fields":[ - { - "label":"Plasser kortene i en firkant", - "description":"Vil forsøk å samsvare antall kolonner og rader når kortene legges ut. Etterpå vil kortene bli skalert til å passe beholderen." - }, - { - "label":"Antall kort som skal brukes", - "description":"Ved å sette antallet høyere enn 2 vil spillet plukke tilfeldige kort fra listen over kort." - }, - { - "label":"Legg til knapp for å prøve på nytt når spillet er over" ->>>>>>> master } ] }, { -<<<<<<< HEAD "label": "Tilpass utseende", "description": "Kontroller de visuelle aspektene ved spillet.", "fields": [ @@ -102,27 +62,10 @@ { "label": "Kortbaksiden", "description": "Bruk en tilpasset kortbakside for kortene dine." -======= - "label":"Tilpass utseende", - "description":"Kontroller de visuelle aspektene ved spillet.", - "fields":[ - { - "label":"Temafarge", - "description":"Velg en farge for å skape et tema over kortspillet ditt.", - "default":"#909090", - "spectrum":{ - - } - }, - { - "label":"Kortbaksiden", - "description":"Bruk en tilpasset kortbakside for kortene dine." ->>>>>>> master } ] }, { -<<<<<<< HEAD "label": "Oversettelser", "fields": [ { @@ -164,31 +107,8 @@ { "label": "Card matched label", "default": "Match found." -======= - "label":"Oversettelser", - "fields":[ - { - "label":"Etikett for antall vendte kort", - "default":"Kort vendt" - }, - { - "label":"Etikett for tid brukt", - "default":"Tid brukt" - }, - { - "label":"Tilbakemeldingstekst", - "default":"Godt jobbet!" - }, - { - "label":"Prøv på nytt-tekst", - "default":"Prøv på nytt?" - }, - { - "label":"Lukk knapp-merkelapp", - "default":"Lukk" ->>>>>>> master } ] } ] -} \ No newline at end of file +} From 33a73712c04498885a031bad617f5e5e4e23c85a Mon Sep 17 00:00:00 2001 From: Paal Joergensen Date: Tue, 26 Sep 2017 16:34:53 +0200 Subject: [PATCH 07/11] Bump --- library.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/library.json b/library.json index 2437820..312f73f 100644 --- a/library.json +++ b/library.json @@ -3,7 +3,7 @@ "description": "See how many cards you can remember!", "majorVersion": 1, "minorVersion": 2, - "patchVersion": 5, + "patchVersion": 6, "runnable": 1, "author": "Joubel", "license": "MIT", @@ -54,4 +54,4 @@ "minorVersion": 3 } ] -} \ No newline at end of file +} From bff82ed8c207da0453d8bec1223133b36c04794d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Janne=20S=C3=A4rkel=C3=A4?= Date: Fri, 29 Sep 2017 14:40:41 +0300 Subject: [PATCH 08/11] Checked translations (#30) --- language/fi.json | 111 ++++++++++++++++++++++------------------------- 1 file changed, 53 insertions(+), 58 deletions(-) diff --git a/language/fi.json b/language/fi.json index 7101e4c..14232b6 100644 --- a/language/fi.json +++ b/language/fi.json @@ -3,112 +3,107 @@ { "widgets": [ { - "label": "Default" + "label":"Oletus" } ], - "label": "Cards", - "entity": "card", - "field": { - "label": "Card", - "fields": [ + "label":"Kortit", + "entity":"kortti", + "field":{ + "label":"Kortti", + "fields":[ { - "label": "Image" + "label":"Kuva" }, { - "label": "Matching Image", - "description": "An optional image to match against instead of using two cards with the same image." + "label":"Vastattava kuva", + "description":"Valinnainen kuva johon verrata korttia sen sijaan, että kortille etsitään toista samaa kuvaa pariksi." }, { - "label": "Description", - "description": "An optional short text that will pop up once the two matching cards are found." - }, - { - "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": "Description", - "description": "An optional short text that will pop up once the two matching cards are found." + "label":"Selite", + "description":"Valinnainen lyhyt teksti, joka näytetään kun oikea pari on löydetty." } ] } }, { - "label": "Behavioural settings", - "description": "These options will let you control how the game behaves.", - "fields": [ + "label":"Yleisasetukset", + "description":"Näillä valinnoilla voit muokata pelin asetuksia.", + "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":"Aseta kortit säännöllisesti", + "description":"Yrittää sovittaa kortit ruudukkomuotoon rivien sijaan." }, { - "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":"Korttien lukumäärä", + "description":"Kun lukumäärä on suurempi kuin kaksi, annettu määrä kortteja arvotaan kaikista korteista pelattavaksi." }, { - "label": "Add button for retrying when the game is over" + "label":"Salli Yritä uudelleen -painike pelin päätyttyä" } ] }, { - "label": "Look and feel", - "description": "Control the visuals of the game.", - "fields": [ + "label":"Ulkoasu", + "description":"Hallinnoi pelin ulkoasua.", + "fields":[ { - "label": "Theme Color", - "description": "Choose a color to create a theme for your card game.", - "default": "#909090" + "label":"Väriteema", + "description":"Valitse väri luodaksesi teeman pelille.", + "default":"#909090", + "spectrum":{ + + } }, { - "label": "Card Back", - "description": "Use a custom back for your cards." + "label":"Kortin kääntöpuoli", + "description":"Mukauta korttien kääntöpuoli." } ] }, { - "label": "Localization", - "fields": [ + "label":"Tekstit", + "fields":[ { - "label": "Card turns text", - "default": "Card turns" + "label":"Kortteja käännetty", + "default":"Kortteja käännetty" }, { - "label": "Time spent text", - "default": "Time spent" + "label":"Aikaa kulunut", + "default":"Aikaa kulunut" }, { - "label": "Feedback text", - "default": "Good work!" + "label":"Palaute", + "default":"Hyvää työtä!" }, { - "label": "Try again button text", - "default": "Try again?" + "label":"Painikkeen Yritä uudelleen teksti", + "default":"Yritä uudelleen?" }, { - "label": "Close button label", - "default": "Close" + "label":"Painikkeen Sulje teksti", + "default":"Sulje" }, { - "label": "Game label", - "default": "Memory Game. Find the matching cards." + "label": "Pelin kuvaus", + "default": "Muistipeli. Löydä parit." }, { - "label": "Game finished label", - "default": "All of the cards have been found." + "label": "Peli päättynyt", + "default": "Kaikki parit löydetty." }, { - "label": "Card indexing label", - "default": "Card %num:" + "label": "Kortin yksilöllinen järjestysnumero", + "default": "Kortti %num:" }, { - "label": "Card unturned label", - "default": "Unturned." + "label": "Kääntämätön", + "default": "Kääntämätön." }, { - "label": "Card matched label", - "default": "Match found." + "label": "Pari löytynyt", + "default": "Pari löydetty." } ] } ] -} \ No newline at end of file +} From 9b473b035b149621895494e404206aba822b2674 Mon Sep 17 00:00:00 2001 From: Paal Joergensen Date: Fri, 29 Sep 2017 16:57:04 +0200 Subject: [PATCH 09/11] Bumping before release on staging --- library.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/library.json b/library.json index 312f73f..9d0949b 100644 --- a/library.json +++ b/library.json @@ -3,7 +3,7 @@ "description": "See how many cards you can remember!", "majorVersion": 1, "minorVersion": 2, - "patchVersion": 6, + "patchVersion": 7, "runnable": 1, "author": "Joubel", "license": "MIT", @@ -54,4 +54,4 @@ "minorVersion": 3 } ] -} +} \ No newline at end of file From 000cb99912e22aa6cf99cd7a8feb55331d33ca03 Mon Sep 17 00:00:00 2001 From: Paal Joergensen Date: Tue, 17 Oct 2017 16:16:46 +0200 Subject: [PATCH 10/11] Make eslint happy --- card.js | 6 +++--- memory-game.js | 12 ++++++------ popup.js | 2 +- upgrades.js | 4 ++-- 4 files changed, 12 insertions(+), 12 deletions(-) diff --git a/card.js b/card.js index 28718f7..867d405 100644 --- a/card.js +++ b/card.js @@ -20,7 +20,7 @@ EventDispatcher.call(self); var path = H5P.getPath(image.path, id); - var width, height, margin, $card, $wrapper, removedState, flippedState; + var width, height, $card, $wrapper, removedState, flippedState; alt = alt || 'Missing description'; // Default for old games @@ -91,7 +91,7 @@ /** * Remove. */ - self.remove = function (announce) { + self.remove = function () { $card.addClass('h5p-matched'); removedState = true; }; @@ -137,7 +137,7 @@ '
        ' + '
        ') .appendTo($container) - .on('keydown', function (event) { + .on('keydown', function (event) { switch (event.which) { case 13: // Enter case 32: // Space diff --git a/memory-game.js b/memory-game.js index 7c61076..1557e18 100644 --- a/memory-game.js +++ b/memory-game.js @@ -154,7 +154,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { * Shuffle the cards and restart the game! * @private */ - var resetGame = function () { + var resetGame = function () { // Reset cards removed = 0; @@ -197,7 +197,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { buttonElement.innerHTML = label; buttonElement.setAttribute('role', 'button'); buttonElement.tabIndex = 0; - buttonElement.addEventListener('click', function (event) { + buttonElement.addEventListener('click', function () { action.apply(buttonElement); }, false); buttonElement.addEventListener('keypress', function (event) { @@ -437,7 +437,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { $bottom = $('
        ', { tabindex: '-1', - appendTo: $container + appendTo: $container }); $taskComplete = $('
        ', { 'class': 'h5p-memory-complete h5p-memory-hidden-read', @@ -467,10 +467,10 @@ H5P.MemoryGame = (function (EventDispatcher, $) { /** * Will try to scale the game so that it fits within its container. - * Puts the cards into a grid layout to make it as square as possible –  + * Puts the cards into a grid layout to make it as square as possible – * which improves the playability on multiple devices. * - * @private + * @private */ var scaleGameSize = function () { @@ -538,7 +538,7 @@ H5P.MemoryGame = (function (EventDispatcher, $) { /** * Determine color contrast level compared to white(#fff) * - * @private + * @private * @param {string} color hex code * @return {number} From 1 to Infinity. */ diff --git a/popup.js b/popup.js index 3f07631..07c3f64 100644 --- a/popup.js +++ b/popup.js @@ -18,7 +18,7 @@ var $top = $popup.find('.h5p-memory-top'); // Hook up the close button - $popup.find('.h5p-memory-close').on('click', function () { + $popup.find('.h5p-memory-close').on('click', function () { self.close(true); }).on('keypress', function (event) { if (event.which === 13 || event.which === 32) { diff --git a/upgrades.js b/upgrades.js index 42c39bd..ce870bc 100644 --- a/upgrades.js +++ b/upgrades.js @@ -1,6 +1,6 @@ var H5PUpgrades = H5PUpgrades || {}; -H5PUpgrades['H5P.MemoryGame'] = (function ($) { +H5PUpgrades['H5P.MemoryGame'] = (function () { return { 1: { /** @@ -42,4 +42,4 @@ H5PUpgrades['H5P.MemoryGame'] = (function ($) { } } }; -})(H5P.jQuery); +})(); From 375328cb2c64ceaf83454326d7c52158a3bdfbc9 Mon Sep 17 00:00:00 2001 From: Paal Joergensen Date: Tue, 24 Oct 2017 14:50:11 +0200 Subject: [PATCH 11/11] Bump patch version --- library.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/library.json b/library.json index 9d0949b..64a27f7 100644 --- a/library.json +++ b/library.json @@ -3,7 +3,7 @@ "description": "See how many cards you can remember!", "majorVersion": 1, "minorVersion": 2, - "patchVersion": 7, + "patchVersion": 8, "runnable": 1, "author": "Joubel", "license": "MIT",