Hotspot action (imagemap)

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
sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Hotspot action (imagemap)

#1 Post by sculpteur »

What i'am trying to do is really simple. It's just that i didn't find the code synthax online to change a boolean from a hotspot action.


In the default code for the default navigation menu I've added this line :

Code: Select all

screen navigation():
    vbox:
        style_prefix "navigation"

        BLABLABLA

        textbutton _("Langage") action ShowMenu("langage") # Here, the added line.
Then, i've created the new langage menu which is accessible from the navigation menu :

Code: Select all

screen langage():
    tag menu
    if renpy.mobile:
        $ cols = 2
    else:
        $ cols = 4
    use game_menu(_("Langage"), scroll="viewport"):
        imagemap:
            ground "0-0_Langage_menu"
            hover "0-0_Langage_menu_hover"
            hotspot (32, 218, 418, 268) clicked NullAction
            hotspot (474, 216, 416, 270) clicked NullAction
            hotspot (918, 214, 412, 266) clicked NullAction
            hotspot (34, 498, 410, 268) clicked NullAction
            hotspot (474, 498, 418, 268) clicked NullAction
            hotspot (912, 500, 414, 264) clicked NullAction
There is some pics to show you how it look :

https://ibb.co/is6V0G => When the american flag is hovered by the mouse

https://ibb.co/midzub => When the french flag is hovered by the mouse

https://ibb.co/iR8A0G => When the chinese flag is hovered by the mouse



Now the problem I have is about the action which follow a click.

I want the following action when the American flag is cliked :
$ langage_english = True
$ langage_french = False
I want the following action when the French flag is cliked :
$ langage_english = False
$ langage_french = True

I don't want any action when an other flag is cliked.
But for now i didn't find a way to make it working properly.


2nd problem (minor) :
Moreover, this code is in my "screen" file window (not in script), so the game had not started yet and variables which are initiated in the begining of the 'script' file
I think i could remedy that by only displaying the "langage" button in the navigation menu when the game as been lunch (when accessing the navigation screen menu by hiting 'esc' key during the game.

Anyway, thank you in advance for your help
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Re: Hotspot action (imagemap)

#2 Post by sculpteur »

I've done this :
by using only one variable (english)

Code: Select all

           hotspot (32, 218, 418, 268) clicked SetVariable("english", "True")
           hotspot (474, 216, 416, 270) clicked SetVariable("english", "False")
It's fine by me.
But it isn't working, even if I put a return in the end like this

Code: Select all

[SetVariable("english", "False"), Return()]
What's happens :
The window screen where my text (in english or in french) is supposed to be has disapeared.
Moreover, the game still progress throught 2 or 3 images then freeze whitout any error or anything.
I can't rollback or anything, just press "esc" and quit the game.

I've also change the main navigation screen to propose the langage button only once the game has been lunched, not at the first screen with the start button.

Code: Select all

screen navigation():

    vbox:
        style_prefix "navigation"

        xpos gui.navigation_xpos
        yalign 0.5

        spacing gui.navigation_spacing

        if main_menu:

            textbutton _("Start") action Start()

        else:
            textbutton _("Langage") action ShowMenu("langage")  <---- Here, added the line.
                    
            textbutton _("History") action ShowMenu("history")

            textbutton _("Save") action ShowMenu("save")

        textbutton _("Load") action ShowMenu("load")

        textbutton _("Preferences") action ShowMenu("preferences")
        

        if _in_replay:
        
        Blablabla..........
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Re: Hotspot action (imagemap)

#3 Post by sculpteur »

I'am completly lost, i have no idea where the bug comes from.
Maybe from this line ? ------> use game_menu(_("Langage"), scroll="viewport"):
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Re: Hotspot action (imagemap)

#4 Post by sculpteur »

Anyone ? I havent figure it out yet :(
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

User avatar
Remix
Eileen-Class Veteran
Posts: 1628
Joined: Tue May 30, 2017 6:10 am
Completed: None... yet (as I'm still looking for an artist)
Projects: An un-named anime based trainer game
Contact:

Re: Hotspot action (imagemap)

#5 Post by Remix »

A couple of points to note...

I would hugely recommend using the built in config.language ( which sets _preferences.language which is kind of read-only ) to hold the values as it already integrates with translation and all that malarky

You are setting values as strings... strings are always True if they have length

Code: Select all

a = "false"
if a: print('true really')
>>> true really
SetVariable( "variable_name_in_quotes", value in whatever format it needs )

If you did opt to use the inbuilt language variable, I would advise:

Code: Select all

clicked Function( renpy.change_language, "Chinese" )
Note: default language would use None for the value
Frameworks & Scriptlets:

User avatar
Remix
Eileen-Class Veteran
Posts: 1628
Joined: Tue May 30, 2017 6:10 am
Completed: None... yet (as I'm still looking for an artist)
Projects: An un-named anime based trainer game
Contact:

Re: Hotspot action (imagemap)

#6 Post by Remix »

Addendum...

There is actually a Language class that acts as an action that does the same:

Code: Select all

clicked Language( "english" )
Frameworks & Scriptlets:

sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Re: Hotspot action (imagemap)

#7 Post by sculpteur »

Thanks a lot for answering me.

But just to let you know I have already begun writing my story by using a personal translation system.
Like this (for the characters) :

Code: Select all

$ en = Character(None, condition='english == True')
$ fr = Character(None, condition='english == False')
$ en_j = Character("[jess_name]", color="293ed7", condition='english == True')
$ fr_j = Character("[jess_name]", color="293ed7", condition='english == False')
$ fr_m = Character("[main_name]", condition='english == False')
$ en_m = Character("[main_name]", condition='english == True')
$ fr_mp = Character ("[main_name]", condition='english == False', who_suffix=" {i}{size=-5}(pensées){/size}{/i}", what_prefix="{i}", what_suffix="{/i}")
$ en_mp = Character ("[main_name]", condition='english == True', who_suffix=" {i}{size=-5}(thoughts){/size}{/i}", what_prefix="{i}", what_suffix="{/i}")
And like this (for when the character are speaking) :

Code: Select all

fr "french narrator is speaking : Vous pénétrez dans une pièce sombre.{fast}"
en "english narrator is speaking : You enter a dark room.{fast}"
fr_m "Character 1 is speaking in french : Allo ? Il y a quelqu'un ?"
en_m "Character 1 is speaking in english: Allo ? Is there somebody here ? "
fr_j "Character 2 is speaking in french : Oui, je suis là, derrière la table."
en_j "Character 2 is speaking in english: Yes, I'am here, behind the table."
etc...

So the variable, as you can see, is just 'english' and its a true boolean. If true all the text is display in english, if false, all the text is display in french.
I don't intend to add an other langage (chinese flag was here just for esthetics reasons).

So, the thing you are explaining to me may break what I've already done right ?
I mean, is there a way I can manage it with my actual variable ? Without having to use the default renpy langage fonction.
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Re: Hotspot action (imagemap)

#8 Post by sculpteur »

2nd problem (minor) :
Moreover, this code is in my "screen" file window (not in script), so the game had not started yet and variables which are initiated in the begining of the 'script' file
I think i could remedy that by only displaying the "langage" button in the navigation menu when the game as been lunch (when accessing the navigation screen menu by hiting 'esc' key during the game.
By the way I've solve this problem by doing this in the navigation screen (menu) :

Code: Select all

        if main_menu:

            textbutton _("Start") action Start()

        else:
            textbutton _("Langage") action ShowMenu("langage") 
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Re: Hotspot action (imagemap)

#9 Post by sculpteur »

Moreover, thanks to what you said :
You are setting values as strings... strings are always True if they have length
I've manage to make this part working by replacing SetVariable("english", "True") by SetVariable("english", True)

Code: Select all

## Langage screen ##########################################################

screen langage():
    tag menu
    if renpy.mobile:
        $ cols = 2
    else:
        $ cols = 4
    use game_menu(_("Langage"), scroll="viewport"):
        imagemap:
            ground "0-0_Langage_menu"
            hover "0-0_Langage_menu_hover"
            hotspot (32, 218, 418, 268) clicked SetVariable("english", True)
            hotspot (474, 216, 416, 270) clicked SetVariable("english", False)
            hotspot (918, 214, 412, 266) clicked NullAction
            hotspot (34, 498, 410, 268) clicked NullAction
            hotspot (474, 498, 418, 268) clicked NullAction
            hotspot (912, 500, 414, 264) clicked NullAction
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

User avatar
Remix
Eileen-Class Veteran
Posts: 1628
Joined: Tue May 30, 2017 6:10 am
Completed: None... yet (as I'm still looking for an artist)
Projects: An un-named anime based trainer game
Contact:

Re: Hotspot action (imagemap)

#10 Post by Remix »

A quick test using conditions in Characters seemed to work fine here without causing any bugs or hiccups.
What problems still exist?

As to using the in-built config.language... I would say it depends how far progressed the game is. You could likely get your method working how you want, just it might not be as easy to add more language translation or incorporate easy image or font switching based on language. The Ren'py translation facility has a reasonably easy interface, abstracts dialogue from code and plays nicely with the rest of Ren'py. In my opinion it is worth learning, even if only for the next game you write.
Frameworks & Scriptlets:

sculpteur
Veteran
Posts: 312
Joined: Fri Nov 17, 2017 6:40 pm
Completed: Apocalypse Lovers
Projects: Apocalypse Lovers
Organization: Awake_Production
Location: France
Discord: https://discord.gg/apocalypse-lovers
Contact:

Re: Hotspot action (imagemap)

#11 Post by sculpteur »

I've already written around 4000 lines of pure dialog. Around 2000 are in french, and 2000 are in english.
But I took a break in writting the story and now I'am focusing more on game system like :
> Inventory and drag fonction,
> Event randomness,
> And of course the in game langage screen we are talking about.

So yes, thanks to you, it's working (without any fancy hovering or selecting button but it do the job).
It allow the player to switch between english or french during the course of the game.
This is not the more glamorous stuff i'am doing so I'am not really exited to work on this screen but next step is to put an hovering effect and a selected effect (to let the player know what is the langage he just selected).

But when I will get back to the writting part I will take a closer look to the in-built config.language and try to understand clearly the benefits its have compare to my actual coding method.

Thanks again
Image

“He asked me to calm down, close my eyes and be quiet. He explained to me that if I was afraid, the shadow that ran barefoot in the street would feel it. I got scared seeing Jumanji on TV, so let me tell you, we didn't stay hidden for long and had to start running again.”
Jessica's Diary.

Post Reply

Who is online

Users browsing this forum: No registered users