Flip Card Memory Game - Why are 2 Cards Flipping in Unison?

Feb 20, 2020

Hello, Heroes!

I'm looking for help with a flip-card/memory game. I'm sure this is something simple that I'm missing, but it's getting late and I'm not seeing the answer.There are multiple cards and each card has one mate. (For the sake of simplicity, let's say there are only 2 cards, Card "A" & Card "B," which are a match.)

  • I have set up a layer for each pair of cards. Layers are set to show other layers (not hide them).
  • Clicking either Card "A" or Card "B" shows "Layer 2" (this is working).
  • On Layer 2 are the two cards that match (4 images: Card "A" front & back + Card "B" front & back).
  • Flipping a card over is a combination of "change state to hidden" and "change state to normal"

Currently, when I click on either card, they both flip over. I need the card that I clicked on to flip over - not both.

And once I have multiple cards on the slide, how do I get them to flip back over if they're not a match?

I've uploaded a portion of the .story file to you can see better what I'm doing.

Thanks for your help!

8 Replies
Keith Shull

Update: I've been able to flip just 1 card at a time by moving each card onto its own layer - see attachment. (Seems like this is a TON of layers and even more triggers - is there a better way?)

Now I just need to figure out how to flip cards back over if they're not  a match. Seems like a variable is in order.

Erin Sadler

The pairs are numbered A1, A2, B1, B2 etc.

When you click on a card, it changes its state to hidden and shows the corresponding layer.

The card layer animates the turning card, then pauses its own timeline. This is so all cards flip back at the same time (otherwise they'd be offset by how long you waited to click the second).

Variables of note

  • (A/B/C)CardsCount - how many times a card from each pair has been clicked
  • (A/B/C)CardsMatch - T/F - if the corresponding count =2 then we've got a match
  • ThingsClicked - increments when a card is clicked

Layers

  • Base layer - shows the backs of the cards (plus references for troubleshooting)
  • Card layers - one for each card. Shows the back of the card briefly (fade out) and the front animates in with a spin. Pauses at 1s (troubleshooting text 'paused' indicates this)
  • Block Clicks Layer - this currently has a red block on it so you can see it, but it's otherwise just a blank layer that doesn't allow you to click other layers while it's visible. I added this because otherwise it's possible for people to click multiple cards in the moments between pause states, and it would get in a mess. This layer stops the user clicking and breaking things!

 

On each card layer;

  • Add +1 to variable (A)CardsCount
    there is one of these per pair, e.g. ACardsCount, BCardsCount - so if this variable = 2, we know we've got a pair
  • Pause when timeline reaches 1s
    after animation played. You'll see I've added the word 'paused' here so we can see when each layer is sitting paused at 1s
  • Add +1 to variable ThingsClicked when timeline reaches 1s, if ThingsClicked <1
    this records how many cards have been turned over, regardless of whether they're a pair or not. It has to happen once we've reached the pause.
  • Resume the timeline when ThingsClicked changes, if ThingsClicked >1
    so, only when we're clicking the second card, resume this timeline. If it's the first card (ThingsClicked<1), stay paused.
  • Resume timeline on (all the other card layers) when timeline reaches 1.25s
    so, once this timeline has resumed playing and hits 1.2s (because we'd paused it at 1s), resume all the other card timelines as well - allowing them to reach their ends simultaneously, and close.
  • Set (A)CardsMatch to True if (A)CardsCount = 2
    if we've clicked on two cards in a pair (A,B or C) then set (A)CardsMatch=true.
  • Hide this layer when timeline ends
    easy.
  • Hide layer Block Clicks Layer when timeline ends
    let user click things again.
  • Set ThingsClicked =0 when timeline ends
    just resetting this.
  • Set (A)CardsCount =0 when timeline ends
    we're choosing another pair, so want to reset this too.
  • Change state of (corresponding card back on main layer) to visible when timeline ends IF (A)CardsMatch =/= true
    if there's a match, we want the card back on the main layer to say hidden. If there ISN'T a match, we'll show it again - it's still in the game.
  • Change state of YOU WIN to normal if ACardsMatch = True AND BCardsMatch = True AND CCardsMatch = True
    easy - do whatever winning thing you want to happen when all the pairs are matched.
  • Show layer BlockClicksLayer when timeline starts
    I should have moved this to the top for clarity, I only added the block function at the end and forgot to tidy.
  • Hide Block Clicks Layer when timeline reaches 1s IF ThingsClicked <2
    if they've only clicked one card, we want to hide the block layer at 1s (when it pauses) so that they can click another. If they've already selected one and this is their second card, then this doesn't happen - clicks remain blocked until the end of the timeline is reached.

To add further card pairs

Copy a pair. Name them D1 and D2. Add DCardsCount and DCardsMatch variables. Make sure all the internal references are updated to reflect that. Make sure every card layer also has 'resume timeline' behaviours for the new layers. Check the winning behaviour also checks DCardsMatch. Think that's it!

To finalise

Delete the references, 'paused' text on each layer, red rectangle on the block layer. Tell it to do what you like when they win :)

Keith Shull

Erin:

I'm still looking over all the triggers & variables, but it looks like it's doing everything I had hoped for! And thanks for the thorough explanation - I'll be saving it, along with your version of the game, as a template!

I love how the Heroes community is so generous w/ their time, experience, & advice!

Thanks!

Erin Sadler

I've published it here for now, may delete it in time - first page is the breakdown above, second page is the game with debug left in, and third with debug removed.

https://tms.uhmb.nhs.uk/training/Memory/story.html

I should note that I've made the spinning cards start 1/4 of a second sooner (they weren't completing their animation before pausing) and I've put 'please wait' text on the blocky layer - because when it's invisible, it's not obvious why you can't click on anything and it's really frustrating!

Erin Sadler
Keith Shull

Erin:

I'm still looking over all the triggers & variables, but it looks like it's dong everything I had hoped for! Ands thanks for the thorough explanation - I'll be saving it, along with your  version of the game, as a template!

I love how the Heroes community is so generous w/ their time, experience, & advice!

Thanks!

It looked fun! I regretted that slightly... :D

This discussion is closed. You can start a new discussion or contact Articulate Support.