[suggestion/request] Buttons

[bobokox]

Hey!

Just thought that it would be great if you would add the possibility to use buttons in script to open messages or jump to a label.
maybe define the picture at the begin of the script and use it like a condition?

{"Button": {
    "Button": button1;
    },
    "True": "display message Inventory",
}},

would be great for using message based inventory systems or mailboxes, or a movement system with arrows.

for now, does someone know an easy workaround?

thank you!

[bobokox]

Ok, didn't recognize the Data Attributes section in the docs.
i managed to do it with a new screen (like the load or settings screen) in the index. Now my problem is that the variable i want to show does not update. I've tried to do it with some code I found in the internet, but it's not working.
i can't figure out how the data-action="open-menu" thing works. does it only show the menu (generated on the begin of the game and always the same) or does it really open it (the code is always executed when pressing the button)?

here the code I added:

<div data-ui="quick-menu" class="align-right">
<span data-action="open-menu" data-open="inv"><span class="fa fa-inv" data-action="open-menu" data-open="inv"></span><span data-string="Inventory" data-action="open-menu" data-open="inv">Inventory</span></span>
</div>

and:

<!--Inventory Screen -->
<section data-menu="inv" data-background="">
<button class="fa fa-arrow-left top left" data-action="back"></button>
<h2 data-string="Inventory">Inventory</h2>
<div class="align-left padded-1">
<p data-string="Blabla">The Number is: <script type="text/javascript">document.write(storage.var1)</script></p>
</div>
</section>

[Hyuchia]

The whole button idea seems like a nice way of adding more components to screen when something happens, I'll see how that can be used for more things, not just buttons :D Thanks! Now, since you are using the function document.write(storage.var1) you are right in the fact that it will only be run once, and in fact, it will be run as soon as the page is loaded, which is probably not what you want, instead of doing it like that, it may be better to add a listener to the click of the button so it can detect the click and then update the information before showing the inventory screen. I think you'll find this tutorial useful, the concepts are pretty much the same :)

[KazutoSensei]

{ Event: {
    "Condtion": function() {
        // some condition like storgage.player.stats.strength == 10; for beeing shown
    },
    "Success": function() {
        // some code/click events/to forwards
    },
    "Label": "Title, Name, Text",
    "Image": "to/image/direction.png,
    "Position": "(e.g.: top right, middle center, bottom left)"
}}

This is an example of my idea of using the buttons idea by @bobokox

For "Condition" => My idea is that the event should only be displayed and executed under certain conditions. Whether you keep both topics separate or package them under one function is up to the pros :P

[Hyuchia]

Mmm that could work! the "Possition" property would probably be replaced with a "Class" one (since positions are just classes and that way you could also add other classes) I guess the thing here would be to decide whether the game should be locked (as in prevent the user from going forward) when they are displayed or not, or maybe add an option to indicate that.

These could actually be a subset of the new Components introduced in v2.0 allowing people to show any kind of HTML they want, I'm guessing this feature could be used for quite a lot of things so it needs to be as flexible as possible and in a way that stays simple. We would also need to check if its possible to revert whatever it does or not.

@KazutoSensei what does the "Label" property represents?

[KazutoSensei]

@Hyuchia I was thinking of something to display the text. If the event were a button, we must also be able to recognize the button if it has no image.
It could also be done as a mouse-over-event that the text/label is only displayed when you move over the event/button.