It looks like you're new here. If you want to get involved, click one of these buttons!
::PassageHeader <div class="section-stats btcf"> <div class="stats-wrapper energy-bar" data-status="energy-bar"> <span>Energy</span> <div class="stats-bar"> <div class="bar"> <div class="hit"></div> </div> </div> </div> <div class="stats-wrapper hunger-bar" data-status="hunger-bar"> <span>Hunger</span> <div class="stats-bar"> <div class="bar"> <div class="hit"></div> </div> </div> </div> </div>
::Passage <<script>> $('.section-stats .stats-wrapper').each(function(index, el) { var dataStats = $(this).data('status'); var eBar = $('.'+ dataStats +' .stats-bar'), bar = eBar.find('.bar'); var varTotal = (dataStats = "energy-bar")?energyTotal:hungerTotal; var varName = (dataStats = "energy-bar")?energy:hunger; var varLoss = (dataStats = "energy-bar")?energyLoss:hungerLoss; var total = State.variables.varTotal, value = State.variables.varName, damage = State.variables.varLoss, barWidth = (value / total) * 100, delayReset = false; if (damage != 0) { value -= damage; barWidth = (value / total) * 100; State.variables.varName = value; State.variables.varLoss = 0; delayReset = true; } eBar.data('total', total); eBar.data('value', value); if (State.variables.varName <= State.variables.varTotal){ if(State.variables.varName>0){ bar.css('width', barWidth + "%"); }else{ bar.css('width', '0'); State.variables.varName = 0 } }else{ bar.css('width', "100%"); State.variables.varName = 100 } }); <</script>>
Comments
As in, you have not declared those variables anywhere so the error message is being very literal.
The code (dataStats = "energy-bar") is setting dataStats to have the value "energy-bar", overwriting whatever was there before.
After that point, dataStats definitely exists and has a value assigned to it ("energy-bar"), and so that code will always return true.
E.g. variables().varTotal instead of State.variables.varTotal
I must admit I'm having trouble figuring out how your code is intended to work. The above list is not intended to be exhaustive, I'm just trying to specifically address your concerns around ternary operators and story variables.
There's absolutely nothing wrong with using State.variables. Technically, State.variables should be preferred over the varaibles() function, since all the latter does is return State.variables. By accessing State.variables directly, you save yourself an extra function call on each access of the story variable store—that isn't a huge deal, however, so I don't want to oversell it. An additional reason to possibly prefer State.variables is because of its sibling State.temporary, for which there is no function equivalent.
The real variable store issue here is not caching the access to the store. If you're going to access either the story or temporary variable stores multiple times within a chuck of pure JavaScript, then you're better off caching the store—this is also not a huge deal, so I don't want to oversell it either. For example: And using the cached store:
ok so im edit a little based on your suggestion, but how to make this thing works ? its still show same error. (energyTotal is not defined)
here's some little code that i have trouble with
i'm little know about javascript and i'm quite understand the energyTotal is not defined, but what should i do then to make this State.variables become dynamic ? or im wrong ?
thx for the quick reply @TheMadExile and @Rokiyo
the main problem is energyTotal is not defined, what i want by using ternary operator is below
if element is energy-bar
if element is hunger-bar
i hope this more clear to understand whats my problem and what i want, thx very much for any help, sorry for my bad english.