Using Imagemap To Create Mini-Game [SOLVED]

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
User avatar
AsHLeX
Miko-Class Veteran
Posts: 556
Joined: Wed Dec 25, 2013 1:09 pm
Completed: Starlight Dreamers, Mysterious Melody, Town of Memories, Marked, To Fly, The Change, Him From The Past, A Forgotten Memory
Projects: Cafe Mysteria
Location: Malaysia
Contact:

Using Imagemap To Create Mini-Game [SOLVED]

#1 Post by AsHLeX »

So basically I tried to use an imagemap to create a puzzle but I think I went somewhere wrong with the coding halfway because the game just wouldn't continue.

Code: Select all

#BlackKeys
screen BlackKeys:
    key "dismiss" action [[]]
    frame:
        xalign 0.5 yalign 0.5
        vbox:
            text "{b}Black Keys" at centre
            text "Click in the message using the black piano keys."
            text "Tip: There are 28 black keys and 28 letters of the alphabet."
            textbutton "OK" action Hide("BlackKeys") at centre
            null height 20
#put this before call game
    $ a8 = False
    $ d3 = False
    $ d5 = False
    $ d13 = False
    $ e10 = False
    $ e15 = False
    $ h1 = False
    $ h7 = False
    $ i4 = False
    $ i6 = False
    $ i14 = False
    $ o12 = False
    $ t11 = False
    $ v9 = False
    $ w0 = False
    $ y2 = False
screen Piano_Game:
    $ renpy.block_rollback()
    key "dismiss" action [[]]
    imagemap:
        ground "pianobase.png"
        hover "pianobase0.png"
        if a8 == True and d3 == True and d5 == True and d13 == True and e10 == True  and h1 == True and h7 == True and i4 == True and i6 == True and i14 == True and o12 == True and t11 == True and v9 == True and w0 == True and y2 == True and e15 == True:
            hotspot (474, 673, 97, 38) clicked Jump("finishgame")
        else:    
            hotspot (21, 301, 23, 114) clicked Jump("a8")
            hotspot (72, 299, 23, 114) clicked Jump("x")
            hotspot (104, 300, 23, 114) clicked Jump("x")
            hotspot (151, 299, 23, 114) clicked Jump("d3513")
            hotspot (185, 300, 23, 114) clicked Jump("e1015")
            hotspot (215, 298, 23, 114) clicked Jump("x")
            hotspot (267, 298, 23, 114) clicked Jump("x")
            hotspot (296, 298, 23, 114) clicked Jump("h17")
            hotspot (346, 297, 23, 114) clicked Jump("i4614")
            hotspot (377, 297, 23, 114) clicked Jump("x")
            hotspot (411, 299, 23, 114) clicked Jump("x")
            hotspot (458, 297, 23, 114) clicked Jump("x")
            hotspot (491, 299, 23, 114) clicked Jump("x")
            hotspot (541, 300, 23, 114) clicked Jump("x")
            hotspot (571, 300, 23, 114) clicked Jump("o12")
            hotspot (605, 299, 23, 114) clicked Jump("x")
            hotspot (654, 298, 23, 114) clicked Jump("x")
            hotspot (687, 299, 23, 114) clicked Jump("x")
            hotspot (735, 299, 23, 114) clicked Jump("x")
            hotspot (766, 299, 23, 114) clicked Jump("t11")
            hotspot (798, 298, 23, 114) clicked Jump("x")
            hotspot (847, 299, 23, 114) clicked Jump("v9")
            hotspot (879, 299, 23, 114) clicked Jump("w0")
            hotspot (929, 298, 23, 114) clicked Jump("x")
            hotspot (959, 299, 23, 114) clicked Jump("y2")
            hotspot (991, 300, 23, 114) clicked Jump("x")
label w0:
    if a8 == False and d3 == False and d5 == False and d13 == False and e10 == False and e15 == False and h1 == False and h7 == False and i4 == False and i6 == False and i14 == False and o12 == False and t11 == False and v9 == False and y2 == False: #checked
        $ w0 = True
        scene pianobase
        "W"
        call screen Piano_Game
    else:
        scene pianobase
        call screen Piano_Game
label h17:
    if a8 == False and d3 == True and d5 == True and d13 == False and e10 == False and e15 == False and h1 == True and i4 == True and i6 == True and i14 == False and o12 == False and t11 == False and v9 == False and w0 ==True and y2 == True:    #checked
        $ h7 = True
        scene pianobase
        "Why did I h"
        call screen Piano_Game
    else:
        if a8 == False and d3 == False and d5 == False and d13 == False and e10 == False and e15 == False and h7 == False and i4 == False and i6 == False and i14 == False and o12 == False and t11 == False and v9 == False and w0 == True and y2 == False: #checked
            $ h1 = True
            scene pianobase
            "Wh"
            call screen Piano_Game
        else:
            scene pianobase
            call screen Piano_Game
label y2:
     if a8 == False and d3 == False and d5 == False and d13 == False and e10 == False and e15 == False and h1 == True and h7 == False and i4 == False and i6 == False and i14 == False and o12 == False and t11 == False and v9 == False and w0 == True: #checked
         $ y2 = True
         scene pianobase
         "Why"
         call screen Piano_Game
     else:
         scene pianobase
         call screen Piano_Game
label d3513:
    if a8 == True and d3 == True and d5 == True and e10 == True and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and i14 == False and o12 == True and t11 == True and v9 == True and w0 == True and y2 == True: #checked
        $ d13 = True
        scene pianobase
        "Why did I have to d"
        call screen Piano_Game
    else:
        if a8 == False and d3 == True and d13 == False and e10 == False and e15 == False and h1 == True and h7 == False and i4 == True and i6 == False and i14 == True and o12 == False and t11 == False and v9 == False and w0 == True and y2 == True: #checked
            $ d5 = True
            scene pianobase
            "Why did"
            call screen Piano_Game
        else:
            if a8 == False  and d5 == False and d13 == False and e10 == False and e15 == False and h1 == True and h7 == False and i4 == False and i6 == False and i14 == False and o12 == False and t11 == False and v9 == False and w0 == True and y2 == True:   #checked 
                $ d3 = True
                scene pianobase
                "Why d"
                call screen Piano_Game
            else:
                scene pianobase
                call screen Piano_Game
label i4614:
    if a8 == True and d3 == True and d5 == True and d13 == True and e10 == True and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and o12 == True and t11 == True and v9 == True and w0 == True and y2 == True: #checked
        $ i14 = True
        scene pianobase
        "Why did I have to di"
        call screen Piano_Game
    else:
            if a8 == False and d3 == True and d5 == True and d13 == False and e10 == False and e15 == False and h1 == True and h7 == False and i4 == True and i14 == False and o12 == False and t11 == False and v9 == False and w0 == True and y2 == True: #checked
                $ i6 = True
                scene pianobase
                "Why did I"
                call screen Piano_Game
            else:
                if a8 == False and d3 == True and d5 == False and d13 == False and e10 == False and e15 == False and h1 == True and h7 == False and i6 == False and i14 == False and o12 == False and t11 == False and v9 == False and w0 == True and y2 == True:    #checked
                    $ i4 = True
                    scene pianobase
                    "Why di"
                    call screen Piano_Game
                else:
                    scene pianobase
                    call screen Piano_Game
label a8:
    if  d3 == True and d5 == True and d13 == False and e10 == False and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and i14 == False and o12 == False and t11 == False and v9 == False and w0 ==True and y2 == True:
       $ a8 = True
       scene pianobase
       "Why did I ha"
       call screen Piano_Game
label v9:
    if a8 == True and d3 == True and d5 == True and d13 == False and e10 == False and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and i14 == False and o12 == False and t11 == False and w0 ==True and y2 == True:
        $ v9 = True
        scene pianobase
        "Why did I hav"
        call screen Piano_Game
label e1015:
    if a8 == True and d3 == True and d5 == True and d13 == True and e10 == True  and h1 == True and h7 == True and i4 == True and i6 == True and i14 == True and o12 == True and t11 == True and v9 == True and w0 == True and y2 == True: #checked
        $ e15 = True
        scene pianobase
        "Why did I have to die."
        call screen Piano_Game
    else:
           if  a8 == True and d3 == True and d5 == True and d13 == False  and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and i14 == False and o12 == False and t11 == False and w0 ==True and y2 == True and v9 == True:
               $ e10 = True
               scene pianobase
               "Why did I have"
           else:
               scene pianobase
               call screen Piano_Game
label t11:
    if  a8 == True and d3 == True and d5 == True and d13 == False and e10 == True and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and i14 == False and o12 == False  and w0 ==True and y2 == True and v9 == True:
        $ t11 = True
        scene pianobase
        "Why did I have t"
        call screen Piano_Game
    else:
        scene pianobase
        call screen Piano_Game
label o12:
    if  a8 == True and d3 == True and d5 == True and d13 == False and e10 == True and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and i14 == False and w0 ==True and y2 == True and t11 == True and v9 == True:
        $ o12 = True
        scene pianobase
        "Why did I have to"
        call screen Piano_Game
label x:
    scene pianobase
    call screen Piano_Game
label finishgame:
    "YAY FINALLY"
    return
(Yes, I know it's pretty messy and confusing...sorry...It was the only way I could think to make it work.)
Basically, what happens is that it works find until the "d5" part. Am I doing something wrong with the if and else statement? Or am I using it wrongly...? Because it just refuses to go to $ d5 = True...
What i'm trying to do in my game is to have the player press a sequence of piano keys to unlock a code.
(But sometimes the player has to press one key more than once. "eg. Why did..." The player has to press 'd' more than once and I can't seem to get the if and else statement to work...)
Please help and thank you for reading this :)
P.S: Just ignore the #checked sign...It was for my reference, nothing important.
Last edited by AsHLeX on Fri Feb 28, 2014 3:56 am, edited 1 time in total.
Image
New demo out 24/12/23!!

User avatar
Showsni
Miko-Class Veteran
Posts: 563
Joined: Tue Jul 24, 2007 12:58 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#2 Post by Showsni »

I think you probably want to use elif here at some point. Instead of saying

Code: Select all

if (blahblahblah):
    do this 
else:
    if (something):
        do that
    else:
        do the other
Try

Code: Select all

if (blahblahblah):
    do this
elif (something):
    do that
else:
    do the other
Does that fix it?

User avatar
AsHLeX
Miko-Class Veteran
Posts: 556
Joined: Wed Dec 25, 2013 1:09 pm
Completed: Starlight Dreamers, Mysterious Melody, Town of Memories, Marked, To Fly, The Change, Him From The Past, A Forgotten Memory
Projects: Cafe Mysteria
Location: Malaysia
Contact:

Re: Using Imagemap To Create Mini-Game

#3 Post by AsHLeX »

:( Nope...it's still not working. It still gets stuck at d5.

Code: Select all

label d3513:
    if a8 == True and d3 == True and d5 == True and e10 == True and e15 == False and h1 == True and h7 == True and i4 == True and i6 == True and i14 == False and o12 == True and t11 == True and v9 == True and w0 == True and y2 == True: #checked
        $ d13 = True
        scene pianobase
        "Why did I have to d"
        call screen Piano_Game
    elif a8 == False and d3 == True and d13 == False and e10 == False and e15 == False and h1 == True and h7 == False and i4 == True and i6 == False and i14 == True and o12 == False and t11 == False and v9 == False and w0 == True and y2 == True: #checked
        $ d5 = True
        scene pianobase
        "Why did"
        call screen Piano_Game
    elif a8 == False  and d5 == False and d13 == False and e10 == False and e15 == False and h1 == True and h7 == False and i4 == False and i6 == False and i14 == False and o12 == False and t11 == False and v9 == False and w0 == True and y2 == True:   #checked 
         $ d3 = True
         scene pianobase
         "Why d"
         call screen Piano_Game
    else:
         scene pianobase
         call screen Piano_Game
Not sure why it won't work...
Image
New demo out 24/12/23!!

User avatar
Showsni
Miko-Class Veteran
Posts: 563
Joined: Tue Jul 24, 2007 12:58 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#4 Post by Showsni »

Not entirely sure where the problem is, but you could make the coding a lot neater by only checking the key you're pressing and the previous one. So, the w0 key

Code: Select all

if w0 == False:
    $ w0 = True
    (snip)
The h1 key:

Code: Select all

if w0 == True and h1 == False:
    $ h1 = True
    (snip)
the y2 key:

Code: Select all

if h1 == True and y2 == False:
    $ y2 = True
    (snip)
the d key:

Code: Select all

if y2 == True and d3 == False:
    $ d3 = True
    (snip)
elif i4 == True and d5 == False:
    $ d5 = True
    (snip)
elif 012 == True and d13 == False:
    $ d13 = True
    (snip)
and so on.

User avatar
AsHLeX
Miko-Class Veteran
Posts: 556
Joined: Wed Dec 25, 2013 1:09 pm
Completed: Starlight Dreamers, Mysterious Melody, Town of Memories, Marked, To Fly, The Change, Him From The Past, A Forgotten Memory
Projects: Cafe Mysteria
Location: Malaysia
Contact:

Re: Using Imagemap To Create Mini-Game

#5 Post by AsHLeX »

Ahhhh why didn't I think of that @@
Thank you so much!! I'll try it out tomorrow and see how it goes. (It's pretty late here so I was going to sleep ^^")
Thanks again for taking your time to help me out >w<
Image
New demo out 24/12/23!!

User avatar
Alex
Lemma-Class Veteran
Posts: 3094
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#6 Post by Alex »

Do you want something like this?

Code: Select all

# Declare characters used by this game.
define e = Character('Eileen', color="#c8ffc8")


screen piano_1:
    text player_input align (0.5, 0.05)
    
    vbox:
        align (0.5, 0.5)
        grid 13 2:
        
            for letter in "abcdefghijklmnopqrstuvwxyz":
                $ letter = str(letter)
                button:
                    text letter size 15
                    action Return(letter)
                
        textbutton "<" action Return("erase")
        null height 10
        textbutton "done" action Return("done")

screen piano_2:
    hbox:
        xalign 0.5 yalign 0.05
        for every_item in order_to_click:
            text every_item
            null width 10
            
    vbox:
        xalign 0.5 yalign 0.2
        textbutton "a" action Return("a") #[Play("sound.wav", Return("a")]
        textbutton "b" action Return("b")
        textbutton "c" action Return("c")
        

# The game starts here.
label start:

    e "You've created a new Ren'Py game."
    
    $ target_text = "hello"
    $ player_input = ""
    
    call pianogame from call_1
    
    $ order_to_click = ["b", "c", "a", "b"]
    $ max_missclicks = 0
    
    e "And another one - click the buttons in right order to win."
    
    call pianogame_2 from call_2

    e "Once you add a story, pictures, and music, you can release it to the world!"

    return

label pianogame:
    show screen piano_1
    
    label piano_loop_1:
        $ res = ui.interact()
        if res == "erase":
            $ player_input = player_input[:-1]
            jump piano_loop_1
        elif res == "done":
            if player_input == target_text:
                jump win_1
            else:
                "Wrong. You should type in \"[target_text]\".\nTry again."
                $ player_input = ""
                jump piano_loop_1
        else:
            $ player_input += res
            jump piano_loop_1
    
label win_1:
    hide screen piano_1
    "Correct, let's continue..."
    return
    
    
label pianogame_2:
    show screen piano_2
    
    $ press_index = 0
    $ missclick = 0
    
    label piano_loop_2:
        $ pressed = ui.interact()
        if pressed == order_to_click[press_index]:
            "ok"
            $ press_index += 1
            if press_index == len(order_to_click):
                jump win_2
            else:
                jump piano_loop_2
                
        else:
            "wrong"
            $ missclick += 1
            if missclick > max_missclicks:
                "Start again from the very begining..."
                $ missclick = 0
                $ press_index = 0
            jump piano_loop_2

                
label win_2:
    hide screen piano_2
    "Well done, let's continue..."
    return

User avatar
AsHLeX
Miko-Class Veteran
Posts: 556
Joined: Wed Dec 25, 2013 1:09 pm
Completed: Starlight Dreamers, Mysterious Melody, Town of Memories, Marked, To Fly, The Change, Him From The Past, A Forgotten Memory
Projects: Cafe Mysteria
Location: Malaysia
Contact:

Re: Using Imagemap To Create Mini-Game

#7 Post by AsHLeX »

@Showsni:
Thanks! It works...but i'm curious if I can make it do something else now ^^"
@Alex:
Thank you so much! I'll be using that if you don't mind ^^"
I was doing something a little different though...any idea how to do it?
The order that the player has to click the black piano keys(in the picture) is from 1 to 16 (as shown)
What I want it to do is to display the code when the player clicks on the keys:
eg.
1 = X
2 = XX
3 = XXX
4 = XXX X
5 = XXX XX
6 = XXX XXX
7 = XXX XXX X
8 = XXX XXX X X
9 = XXX XXX X XX
10 = XXX XXX X XXX
11 = XXX XXX X XXXX
12 = XXX XXX X XXXX X
13 = XXX XXX X XXXX XX
14 = XXX XXX X XXXX XX X
15 = XXX XXX X XXXX XX XX
16 = XXX XXX X XXXX XX XXX
It can also be that whenever a player clicks on a key, an X appears, but it might not be the right answer. (Similar to the one you showed but instead of showing alphabets it only displays X.)
I made it in the form of an imagemap with the coordinates being:

Code: Select all

 hotspot (21, 301, 23, 114) clicked Jump("a8")
            hotspot (72, 299, 23, 114) clicked Jump("x")
            hotspot (104, 300, 23, 114) clicked Jump("x")
            hotspot (151, 299, 23, 114) clicked Jump("d3513")
            hotspot (185, 300, 23, 114) clicked Jump("e1015")
            hotspot (215, 298, 23, 114) clicked Jump("x")
            hotspot (267, 298, 23, 114) clicked Jump("x")
            hotspot (296, 298, 23, 114) clicked Jump("h17")
            hotspot (346, 297, 23, 114) clicked Jump("i4614")
            hotspot (377, 297, 23, 114) clicked Jump("x")
            hotspot (411, 299, 23, 114) clicked Jump("x")
            hotspot (458, 297, 23, 114) clicked Jump("x")
            hotspot (491, 299, 23, 114) clicked Jump("x")
            hotspot (541, 300, 23, 114) clicked Jump("x")
            hotspot (571, 300, 23, 114) clicked Jump("o12")
            hotspot (605, 299, 23, 114) clicked Jump("x")
            hotspot (654, 298, 23, 114) clicked Jump("x")
            hotspot (687, 299, 23, 114) clicked Jump("x")
            hotspot (735, 299, 23, 114) clicked Jump("x")
            hotspot (766, 299, 23, 114) clicked Jump("t11")
            hotspot (798, 298, 23, 114) clicked Jump("x")
            hotspot (847, 299, 23, 114) clicked Jump("v9")
            hotspot (879, 299, 23, 114) clicked Jump("w0")
            hotspot (929, 298, 23, 114) clicked Jump("x")
            hotspot (959, 299, 23, 114) clicked Jump("y2")
            hotspot (991, 300, 23, 114) clicked Jump("x")
Also, when the game finishes, the screen should hide/ jump to a new label (I'm not sure where to add the jump button).
My current code (it's a little messed up @@ and I can't get the Jump command to work...):

Code: Select all

#BlackKeys
screen BlackKeys:
    key "dismiss" action [[]]
    frame:
        xalign 0.5 yalign 0.5
        vbox:
            text "{b}Black Keys" at centre
            text "Click in the message using the black piano keys."
            text "Tip: There are 28 black keys and 28 letters of the alphabet."
            textbutton "OK" action Hide("BlackKeys") at centre
            null height 20
#put this before call game
    $ LOSE = False                                                                                                                                                                                                                               
    $ a8 = False
    $ d3 = False
    $ d5 = False
    $ d13 = False
    $ e10 = False
    $ e15 = False
    $ h1 = False
    $ h7 = False
    $ i4 = False
    $ i6 = False
    $ i14 = False
    $ o12 = False
    $ t11 = False
    $ v9 = False
    $ w0 = False
    $ y2 = False
screen Piano_Game:
    $ renpy.block_rollback()
    key "dismiss" action [[]]
    imagemap:
        ground "pianobase.png"
        hover "pianobase0.png"
        if a8 == True and d3 == True and d5 == True and d13 == True and e10 == True  and h1 == True and h7 == True and i4 == True and i6 == True and i14 == True and o12 == True and t11 == True and v9 == True and w0 == True and y2 == True and e15 == True:
            hotspot (474, 673, 97, 38) clicked Jump("finishgame")
        else:    
            hotspot (21, 301, 23, 114) clicked Jump("a8")
            hotspot (72, 299, 23, 114) clicked Jump("x")
            hotspot (104, 300, 23, 114) clicked Jump("x")
            hotspot (151, 299, 23, 114) clicked Jump("d3513")
            hotspot (185, 300, 23, 114) clicked Jump("e1015")
            hotspot (215, 298, 23, 114) clicked Jump("x")
            hotspot (267, 298, 23, 114) clicked Jump("x")
            hotspot (296, 298, 23, 114) clicked Jump("h17")
            hotspot (346, 297, 23, 114) clicked Jump("i4614")
            hotspot (377, 297, 23, 114) clicked Jump("x")
            hotspot (411, 299, 23, 114) clicked Jump("x")
            hotspot (458, 297, 23, 114) clicked Jump("x")
            hotspot (491, 299, 23, 114) clicked Jump("x")
            hotspot (541, 300, 23, 114) clicked Jump("x")
            hotspot (571, 300, 23, 114) clicked Jump("o12")
            hotspot (605, 299, 23, 114) clicked Jump("x")
            hotspot (654, 298, 23, 114) clicked Jump("x")
            hotspot (687, 299, 23, 114) clicked Jump("x")
            hotspot (735, 299, 23, 114) clicked Jump("x")
            hotspot (766, 299, 23, 114) clicked Jump("t11")
            hotspot (798, 298, 23, 114) clicked Jump("x")
            hotspot (847, 299, 23, 114) clicked Jump("v9")
            hotspot (879, 299, 23, 114) clicked Jump("w0")
            hotspot (929, 298, 23, 114) clicked Jump("x")
            hotspot (959, 299, 23, 114) clicked Jump("y2")
            hotspot (991, 300, 23, 114) clicked Jump("x")
label w0:
        $ w0 = True
        scene pianobase
        "WXX XXX X XXXX XX XXX" 
        call screen Piano_Game
label h17:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and LOSE == False:
        $ h7 = True
        scene pianobase
        "WHY DID I HXXX XX XXX"
        call screen Piano_Game
    elif w0 == True and LOSE == False:    
        $ h1 = True
        scene pianobase
        "WHX XXX X XXXX XX XXX"
        call screen Piano_Game
    else:
        $ LOSE  = True
        scene pianobase
        call screen Piano_Game
label y2:
    if w0 == True and h1 == True and LOSE == False:
         $ y2 = True
         scene pianobase
         "WHY XXX X XXXX XX XXX"
         call screen Piano_Game
    else:
        $ LOSE  = True
        scene pianobase
        call screen Piano_Game
label d3513:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and a8 == True and v9 == True and e10 == True and t11 == True and o12 == True and LOSE == False:
        $ d13 = True
        scene pianobase
        "WHY DID I HAVE TO DXX"
        call screen Piano_Game
    elif w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and LOSE == False:    
        $ d5 = True
        scene pianobase
        "WHY DID X XXXX XX XXX"
        call screen Piano_Game
    elif w0 == True and h1 == True and y2 == True and LOSE == False:
         $ d3 = True
         scene pianobase
         "WHY DXX X XXXX XX XXX"
         call screen Piano_Game
    else:
        $ LOSE = True
        scene pianobase
        call screen Piano_Game
label i4614:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and a8 == True and v9 == True and e10 == True and t11 == True and o12 == True and d13 == True and LOSE == False:
        $ i14 = True
        scene pianobase
        "WHY DID I HAVE TO DIX"
        call screen Piano_Game
    elif w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and LOSE == False:    
         $ i6 = True
         scene pianobase
         "WHY DID I XXXX XX XXX"
         call screen Piano_Game
    elif w0 == True and h1 == True and y2 == True and d3 == True and LOSE == False:
         $ i4 = True
         scene pianobase
         "WHY DIX X XXXX XX XXX"
         call screen Piano_Game
    else:
        $ LOSE = True
        scene pianobase
        call screen Piano_Game
label a8:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and LOSE == False:
       $ a8 = True
       scene pianobase
       "WHY DID I HAXX XX XXX"
       call screen Piano_Game
    else:
        $ LOSE = True
        scene pianobase
        call screen Piano_Game   
label v9:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and a8 == True and LOSE == False:
        $ v9 = True
        scene pianobase
        "WHY DID I HAVX XX XXX"
        call screen Piano_Game
    else:
        $ LOSE = True
        scene pianobase
        call screen Piano_Game    
label e1015:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and a8 == True and v9 == True and e10 == True and t11 == True and o12 == True and d13 == True and i14 == True and LOSE  == False:
        $ e15 = True
        scene pianobase
        "WHY DID I HAVE TO DIE"
        call screen Piano_Game
    elif w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and a8 == True and v9 == True and LOSE == False:    
        $ e10 = True
        scene pianobase
        "WHY DID I HAVE XX XXX"
    else:
        $ LOSE = True
        scene pianobase
        call screen Piano_Game
label t11:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and a8 == True and v9 == True and e10 == True and LOSE == False:
        $ t11 = True
        scene pianobase
        "WHY DID I HAVE TX XXX"
        call screen Piano_Game
    else:
        $ LOSE = True
        scene pianobase
        call screen Piano_Game
label o12:
    if w0 == True and h1 == True and y2 == True and d3 == True and i4 == True and d5 == True and i6 == True and h7 == True and a8 == True and v9 == True and e10 == True and t11 == True and LOSE == False:
        $ o12 = True
        scene pianobase
        "WHY DID I HAVE TO XXX"
        call screen Piano_Game
    else:
        $ LOSE = True
        scene pianobase
        call screen Piano_Game    
label x:
    $ LOSE = True
    scene pianobase
    call screen Piano_Game
label finishgame:
    "YAY FINALLY"
    return
Thank you so much for reading this and I hope that i'm not asking for too much Q_Q
P.S: If there is any way to add a space in the code that you showed me (eg. the blank in between "Hello World" and not "HelloWorld") I would be immensely grateful :'D
Attachments
pianobase0.png
How the hotspots look like
(9.42 KiB) Not downloaded yet
How the game is supposed to look like and the sequence the player is supposed to press.
How the game is supposed to look like and the sequence the player is supposed to press.
Image
New demo out 24/12/23!!

User avatar
Alex
Lemma-Class Veteran
Posts: 3094
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#8 Post by Alex »

Not quite sure how you want it to work. Does every key represent a specific letter, does player need to hit keys in right order, what's gonna happened if player hit wrong key? If you'll have answers - you'll be able to get rid of all those if-conditions and check the result in a game loop.

When player hit some keys, you could show the amount of Xs equal to the length of inputed text

As for adding space to key's values, try

Code: Select all

textbutton "space" action Return(" ") 

Code: Select all

screen piano_1:
    #text player_input align (0.5, 0.05)
    
    #text ("X"*len(player_input)) align (0.5, 0.05)
    #or
    $ text_to_show = ""
    for l in player_input:
        if l == " ":
            $ text_to_show += " "
        else:
            $ text_to_show += "X"
    text text_to_show align (0.5, 0.05)
    
    vbox:
        align (0.5, 0.5)
        grid 13 2:
        
            for letter in "abcdefghijklmnopqrstuvwxyz":
                $ letter = str(letter)
                button:
                    text letter size 15
                    action Return(letter)
                
        textbutton "space" action Return(" ")
        textbutton "<" action Return("erase")
        null height 10
        textbutton "done" action Return("done")

User avatar
Showsni
Miko-Class Veteran
Posts: 563
Joined: Tue Jul 24, 2007 12:58 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#9 Post by Showsni »

Alex wrote:Not quite sure how you want it to work. Does every key represent a specific letter, does player need to hit keys in right order, what's gonna happened if player hit wrong key? If you'll have answers - you'll be able to get rid of all those if-conditions and check the result in a game loop.
From what I gather, each black key on the piano keyboard corresponds to a letter. When the player clicks on the keyboard, if they click on the key that's next in the sequence the next letter appears in the message; clicking any other key does nothing. So, if they player starts by clicking the W, h and then y corresponding piano keys, the word "Why" appears at the start of the message. If they clicked the d, y, then W key, they'd just have "W" in the message. And so on. Once the full message is known clicking anywhere ends the game.

philat
Eileen-Class Veteran
Posts: 1912
Joined: Wed Dec 04, 2013 12:33 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#10 Post by philat »

Well, from looking at the code posted ("WHY DID I HAVE TX XXX" going to "WHY DID I HAVE TO XXX" and so on), the effect you're going for seems needlessly complicated compared to simply showing WHY DID I HAVE T and then WHY DID I HAVE TO, the way Alex drew up, because it requires a check on every letter rather than a check at the end of the whole string. Then again, I guess we all have the details we like to sweat out ;)

But anyway, my instinct would be to use lists and a counter. (This uses Alex's screen piano_1)

Code: Select all

label game:
    $ answer = ["x", "x", "x", "x", "x", " ", "x", "x", "x", "x", "x"]
    $ check = ["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]
    $ counter = 0
    $ player_input = "".join(answer)

    show screen piano_1

    label loop:
        $ res = ui.interact()
        $ counter += 1
        if res == check[counter-1]:
            $ answer[counter-1] = res
            $ player_input = "".join(answer)
            if counter == len(check): # check for end of phrase
                jump done
            elif check[counter] == " ": # check for spaces
                $ counter += 1            
            jump loop
        else:
            "try again from the beginning"
            jump game

label done:
    hide screen piano_1
    "you won!"

User avatar
AsHLeX
Miko-Class Veteran
Posts: 556
Joined: Wed Dec 25, 2013 1:09 pm
Completed: Starlight Dreamers, Mysterious Melody, Town of Memories, Marked, To Fly, The Change, Him From The Past, A Forgotten Memory
Projects: Cafe Mysteria
Location: Malaysia
Contact:

Re: Using Imagemap To Create Mini-Game

#11 Post by AsHLeX »

Thank you so much for your replies!
I'm so sorry that I didn't make it very clear... :(
Not quite sure how you want it to work. Does every key represent a specific letter, does player need to hit keys in right order, what's gonna happened if player hit wrong key? If you'll have answers - you'll be able to get rid of all those if-conditions and check the result in a game loop.
1. From left to right: 1st black key = A
2nd black key = B
3rd black key = C and so on... (Each black key corresponds to a letter of the alphabet in order.)
2. Yes, the player has to hit the keys in the right order. If the player hits the keys in the wrong order, the game will restart.
3. I'm not sure how to make a game loop using an image map. It's similar to the way the code you showed me, except that instead of clicking on 'buttons labelled a,b,c and so on' , the player has to click on the black keys that are in the image map. The letters that I want the player to click(in order) are "why did i have to die".
P.S: Thank you philat and Alex for the codes, i'll be using it in another part of the game if you don't mind :)
Image
New demo out 24/12/23!!

philat
Eileen-Class Veteran
Posts: 1912
Joined: Wed Dec 04, 2013 12:33 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#12 Post by philat »

Just change the action of your imagemap screen to return letters as strings. If you want to have a conditional "finish game" button, you can change the done label I put above to have a flag instead of hide screen.

Code: Select all

imagemap:
        ground "pianobase.png"
        hover "pianobase0.png"
        if flag:
            hotspot (474, 673, 97, 38) action Jump("finishgame")
        else:   
            hotspot (21, 301, 23, 114) action Return("a")
            hotspot (72, 299, 23, 114) action Return("b")
            etc...

User avatar
AsHLeX
Miko-Class Veteran
Posts: 556
Joined: Wed Dec 25, 2013 1:09 pm
Completed: Starlight Dreamers, Mysterious Melody, Town of Memories, Marked, To Fly, The Change, Him From The Past, A Forgotten Memory
Projects: Cafe Mysteria
Location: Malaysia
Contact:

Re: Using Imagemap To Create Mini-Game

#13 Post by AsHLeX »

Thank you again for your help! :')
So I used this code:

Code: Select all

label mamababy:
    $ answer = ["x", "x", "x", "x", "x"]
    $ check = ["h", "e", "l", "l", "o"]
    $ counter = 0
    $ player_input = "".join(answer)

    show screen piano_2

    label loop:
        $ res = ui.interact()
        $ counter += 1
        if res == check[counter-1]:
            $ answer[counter-1] = res
            $ player_input = "".join(answer)
            if counter == len(check): # check for end of phrase
                jump done
            elif check[counter] == " ": # check for spaces
                $ counter += 1            
            jump loop
        else:
            "try again from the beginning"
            jump mamababy

label done:
    $ flag = True
    "you won! Click done at the bottom of the screen"
    jump mamababy
screen piano_2:
    #text player_input align (0.5, 0.05)
    
    #text ("X"*len(player_input)) align (0.5, 0.05)
    #or
    $ text_to_show = ""
    for l in player_input:
        if l == " ":
            $ text_to_show += " "
        else:
            $ text_to_show += "X"
    text text_to_show align (0.5, 0.05)
    
    imagemap :
            ground "pianobase.png"
            hover "pianobase0.png"
            if flag:
                hotspot (474, 673, 97, 38) action Jump("finishgame")
            else:   
                hotspot (21, 301, 23, 114) action Return("a")
                hotspot (72, 299, 23, 114) action Return("b")
                hotspot (104, 300, 23, 114) action Return("c")
                hotspot (151, 299, 23, 114) action Return("d")
                hotspot (185, 300, 23, 114) action Return("e")
                hotspot (215, 298, 23, 114) action Return("f")
                hotspot (267, 298, 23, 114) action Return("g")
                hotspot (296, 298, 23, 114) action Return("h")
                hotspot (346, 297, 23, 114) action Return("i")
                hotspot (377, 297, 23, 114) action Return("j")
                hotspot (411, 299, 23, 114) action Return("k")
                hotspot (458, 297, 23, 114) action Return("l")
                hotspot (491, 299, 23, 114) action Return("m")
                hotspot (541, 300, 23, 114) action Return("n")
                hotspot (571, 300, 23, 114) action Return("o")
                hotspot (605, 299, 23, 114) action Return("p")
                hotspot (654, 298, 23, 114) action Return("q")
                hotspot (687, 299, 23, 114) action Return("r")
                hotspot (735, 299, 23, 114) action Return("s")
                hotspot (766, 299, 23, 114) action Return("t")
                hotspot (798, 298, 23, 114) action Return("u")
                hotspot (847, 299, 23, 114) action Return("v")
                hotspot (879, 299, 23, 114) action Return("w")
                hotspot (929, 298, 23, 114) action Return("x")
                hotspot (959, 299, 23, 114) action Return("y")
                hotspot (991, 300, 23, 114) action Return("z")
            
    
and it works perfectly fine except that the words won't show.
Like, it's supposed to show "X" when the player types "h" but its not showing.
I guess it has something to do with the image map? D: I'm not too sure...

PS: @ Alex How do you make it such that two answers are accepted? I tried

Code: Select all

$ target_text = "flower" or "flowers"
but only "flower" is accepted. If I try "flowers" the game jumps to 'lose'.
Image
New demo out 24/12/23!!

User avatar
Alex
Lemma-Class Veteran
Posts: 3094
Joined: Fri Dec 11, 2009 5:25 pm
Contact:

Re: Using Imagemap To Create Mini-Game

#14 Post by Alex »

I guess it has something to do with the image map?
Looks like text is hiding behind an imagemap - change the order of elements in screen (show imagemap first and then - text)

Code: Select all

screen piano_2:
    imagemap :
            ground "pianobase.png"
            hover "pianobase0.png"
            if flag:
                hotspot (474, 673, 97, 38) action Jump("finishgame")
            else:   
                hotspot (21, 301, 23, 114) action Return("a")
                hotspot (72, 299, 23, 114) action Return("b")

    $ text_to_show = ""
    for l in player_input:
        if l == " ":
            $ text_to_show += " "
        else:
            $ text_to_show += "X"
    text text_to_show align (0.5, 0.05)

As for multiple answers, try

Code: Select all

screen piano_3:
    vbox:
        align (0.5, 0.5)
        grid 13 2:
        
            for letter in "abcdefghijklmnopqrstuvwxyz":
                $ letter = str(letter)
                button:
                    text letter size 15
                    action Return(letter)
                
        textbutton "space" action Return(" ")
        textbutton "<" action Return("erase")
        null height 10
        textbutton "done" action Return("done")
        
    $ text_to_show = ""
    for l in player_input:
        if l == " ":
            $ text_to_show += " "
        else:
            $ text_to_show += "X"
    text text_to_show align (0.5, 0.05)


# The game starts here.
label start:
    
    $ words_pool = ["red flower", "red flowers", "asphalt"]
    $ player_input = ""
    
    f "What associations do you have with the \"beautiful garden\"?"
    
    call pianogame_3 from call_3

    "...end..."
    return

label pianogame_3:
    show screen piano_3
    $ press_index = 0
    
    label piano_loop_3:
        $ res = ui.interact()
        if res == "erase":
            $ player_input = player_input[:-1]
            $ press_index = max(0, press_index-1)
            jump piano_loop_3
        elif res == "done":
            if player_input in words_pool:
                jump win_3
            else:
                f "Wrong. You should type in one of \"[words_pool]\".\nTry again."
                $ player_input = ""
                $ press_index = 0
                jump piano_loop_3
        else:
            $ press_index += 1
            python:
                for word in words_pool:
                    if word.startswith(player_input) and len(word) >= press_index:
                        if res == word[(press_index-1)]:
                            player_input += res
                            renpy.jump("piano_loop_3")
            f "Wrong. You should type in one of \"[words_pool]\".\nTry again."
            $ player_input = ""
            $ press_index = 0
            jump piano_loop_3
            
label win_3:
    hide screen piano_3
    f "...\{[player_input]\}... Hm, interesting, let's continue..."
    return

User avatar
AsHLeX
Miko-Class Veteran
Posts: 556
Joined: Wed Dec 25, 2013 1:09 pm
Completed: Starlight Dreamers, Mysterious Melody, Town of Memories, Marked, To Fly, The Change, Him From The Past, A Forgotten Memory
Projects: Cafe Mysteria
Location: Malaysia
Contact:

Re: Using Imagemap To Create Mini-Game

#15 Post by AsHLeX »

Thank you so much, all of you!
I finally got it to work. *overjoyed now* I wouldn't have been able to do it without your help!
I'll definitely credit you in the credit section, if you don't mind. I'm really grateful that you spent your time to help me. :D
Image
New demo out 24/12/23!!

Post Reply

Who is online

Users browsing this forum: Bing [Bot], Ocelot, Toma