Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Issues Implementing an RPG style Stats Screen (Stat point allocation etc) in Sugarcube 1x

edited October 2015 in Help! with 2.0
So after a little bit of digging I found on the sugar cube wiki a way to increase/decrease a 'stat' value with the following;

Strength: <<click "[-]">><<set $Str-->><<replace "#stats-str">><<print $Str>><</replace>><</click>> <<set $Str to 10>><span id="stats-str"><<print $Str>></span> <<click "[+]">><<set $Str++>><<replace "#stats-str">><<print $Str>><</replace>><</click>>

What I don't yet have however, is a means to implement a minimum/maximum amount for each stat. I also tried to implement a system in which each stat increase or decrease would impact on the number of stat points that could be allocated.

Here is the exact macro I attempted to utilize;

Stat Points: <<set $Skills to 20>><span id="#skills"><<print $Skills>></span>
<<if $Str-->><<replace "#skills">><<set $Skills++>><<print $Skills>><</replace>><</if>>
<<if $Str++>><<replace "#skills">><<set $Skills-->><<print $Skills>><</replace>><</if>>


Instead, the number of points for 'Strength' can increase without changing the number of points for 'Stats' whatsoever, and with no error message.

My plan was to get it working with 'Strength' first, so that thereafter I could do the same with the rest of the stats so that +1 in strength would mean -1 in Stat Points and vice versa. After that, then I could work on doing the same with the rest of the stats.

I also managed to incorporate difficulty settings by altering the number of stat points that would be available.

Anyone about who could offer some insight into this?

Comments

  • You simply need to use an <<if>> macro inside the <<click>> (or, as in the following example, <<button>>). For example:
    Stat Points: <<set $Skills to 20>><span id="skills">$Skills</span>
    
    Strength: <<set $Str to 10>>\
    <<button "-">>
    	<<if $Str gt 0>>
    		<<set $Str--, $Skills++>>
    		<<replace "#stats-str">>$Str<</replace>>
    		<<replace "#skills">>$Skills<</replace>>
    	<</if>>
    <</button>> \
    <span id="stats-str">$Str</span> \
    <<button "+">>
    	<<if $Str lt 20 and $Skills gt 0>>
    		<<set $Str++, $Skills-->>
    		<<replace "#stats-str">>$Str<</replace>>
    		<<replace "#skills">>$Skills<</replace>>
    	<</if>>
    <</button>>
    
    The above will restrict $Str to a range [0, 20]. It will also stop stat increases if $Skills reaches 0.

    Additionally, as long as you keep naming your stat element IDs similar to "stats-str", then you could use the following CSS to make them display a bit nicer:
    .passage span[id|="stats"] {
    	display: inline-block;
    	text-align: center;
    	width: 2em;
    }
    
  • Yikes!! That works like a bloody charm O.O I sincerely doubt I would have got that on my own any time soon, thanks again x)

    It even works with the 'click' macro! Currently I prefer the 'Click' macro as I'm not sure how to alter how buttons are displayed yet on the style sheet (all I really need is to change the color to green). Is there something on the wiki? Haven't checked in a while, been working on making my own music x)

    I have plans down the line for integrating an in-game save system using E.G. going to bed/sleeping as a means of passing time/saving the game and storing it somewhere, but one thing at a time for definite.

    Also, I've seen evidence that people can embed you-tube videos into their projects.. Would it be possible with an animated gif/non you-tube video (such as an MP4 or similar) instead?

    I'm very much still in the midst of trying to understand all the terminology surrounding this, but I'm getting much closer thanks to my own experimentation with it, and of course with helpful people such as yourself providing valuable assistance :) thanks again!
  • Hey does that work with sugercube 2.x?
  • edited October 2015
    Hey Mad Exile, I have one last question which relates to the subject in question:

    When the Value of the Stat reaches maximum or minimum output, is it possible to replace the individual 'Click/Button' related to maximum/minimum output with empty space, or at least a message underneath the appropriate stat?

    ( <<If $Str lt5>>
    <<Print $StrMin>>
    <</if>> )

    Just so as people won't be frantically clicking a button wondering why it won't increase or decrease (to soft proof it to those who are less tech-literate).

    I have tried doing both myself, but to no avail.

    The aforementioned macro does not display an error message, yet nor does it display the text I have associated with '$StrMin'.

    I cannot perceive as to whether the wiki contains information on how to replace a 'Click' macro in this manner. Is it Possible to do so/something similar?






  • You could do something like the following, it disables the relevant button when the stat reaches either the zero or twenty:
    Stat Points: <<set $Skills to 20>><span id="skills">$Skills</span>
    
    Strength: <<set $Str to 10>>\
    <span id="stats-str-minus">\
    <<button "-">>
    	<<if $Str gt 0>>
    		<<if $Str eq 20>>
    			<<run $("#stats-str-plus button").prop("disabled", false);>>
    		<</if>>    
    		<<set $Str--, $Skills++>>
    		<<replace "#stats-str">>$Str<</replace>>
    		<<replace "#skills">>$Skills<</replace>>
    		<<if $Str eq 0>>
    			<<run $("#stats-str-minus button").prop("disabled", true);>>
    		<</if>>
    	<</if>>
    <</button>> \
    </span>\
    <span id="stats-str">$Str</span> \
    <span id="stats-str-plus">\
    <<button "+">>
    	<<if $Str lt 20 and $Skills gt 0>>
    		<<if $Str eq 0>>
    			<<run $("#stats-str-minus button").prop("disabled", false);>>
    		<</if>>
    		<<set $Str++, $Skills-->>
    		<<replace "#stats-str">>$Str<</replace>>
    		<<replace "#skills">>$Skills<</replace>>
    		<<if $Str eq 20>>
    			<<run $("#stats-str-plus button").prop("disabled", true);>>
    		<</if>>
    	<</if>>
    <</button>>
    </span>\
    
    ... and you can use the following CSS to style the disabled button:
    #passages button:disabled {
        background-color: red;
    }
    
  • Thanks grey elf that's exactly the kind of thing I was looking for :) got a bit more room for decoration with buttons too which is nice!! Thank you so much!!
Sign In or Register to comment.