Post by Vixered on Jul 19, 2019 21:31:50 GMT -8
AYYY, so for starters I should say that I'm far from an expert when it comes to Javascript, which is why I'm asking for help with this script in the first place! I've been trying my hand at writing it myself, but so far I've mostly succeeded in frustrating myself and not making a whole lot of progress. I realized trying to teach myself an entire programming language overnight probably isn't very smart, and frankly as much as I'd love to continue learning, I thought I'd opt to ask for some help since I just really want to get this site launched already. Anyways, onto the script itself!
As the subject implies, I want to create a leveling system, similar to how you can level up by gaining experience in a video game - I want the members of my forum to be able to earn experience by doing various things, and to level up when they attain a certain amount of experience. That's the gist of it, and so far I've made a little progress looking at solutions other people have come up with for similar ideas and studying Javascript itself. I almost have something that works, but at the same time I know I'm incredibly out of my depth, as I've already hit quite a few road blocks :')
Here's what I already have:
Anyway, here's a rough breakdown of what I have and how I'd like the script to work:
Aaand that's about all I've got! Like I said, in case it isn't painfully obvious, I'm really inexperienced when it comes to Javascript (and frankly most things aside from HTML and CSS), so any help would be really appreciated - with the script itself or any explanations, because I would love to understand how things work more!
As the subject implies, I want to create a leveling system, similar to how you can level up by gaining experience in a video game - I want the members of my forum to be able to earn experience by doing various things, and to level up when they attain a certain amount of experience. That's the gist of it, and so far I've made a little progress looking at solutions other people have come up with for similar ideas and studying Javascript itself. I almost have something that works, but at the same time I know I'm incredibly out of my depth, as I've already hit quite a few road blocks :')
Here's what I already have:
$(document).ready(function(){
var levels = [0,10, 20, 30, 40, 50, 60, 70,];
var level = 0;
var experience = 0;
var postEXP = $[user.posts];
var likesEXP = $[user.likes];
var customEXP = {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Experience Points"}$[user.mini_custom_field.value]{/if};
experience = postEXP + likesEXP + customEXP;
levels.forEach((v, i) => {
if(experience >= v) {
level = i+1;
}
});
$('.level').html(level);
});
Anyway, here's a rough breakdown of what I have and how I'd like the script to work:
- The total number of experience points would be determined a bit like this:
var postEXP = $[user.posts];
// How many posts a user has made
var likesEXP = $[user.likes];
// How many likes a user has received
/*I know this one doesn't work, but this would be how many experience points a user has been given through a custom field by a member of staff. Still not sure how to accomplish actually retrieving this variable through Javascript though */
var customEXP = {foreach $[user.mini_custom_field]}{if $[user.mini_custom_field.name] == "Experience Points"}$[user.mini_custom_field.value]{/if}{/foreach}
experience = postEXP + likesEXP + customEXP; // The total number of experience points
- Using the user's total number of experience points, the user's level would be determined like this:
/* This would determine the number of experience points it takes to achieve a certain level. I'm sure there's a more efficient way to do this. I would also like to change the values so that they increase exponentially (these values are just placeholders), meaning it takes gradually longer for a user to level up as they attain higher levels - again, similar to how it would work in a video game - but it's not totally necessary. I just think it would be fun */
var levels = [0, 10, 20, 30, 40, 50, 60, 70,];
var level = 0;
var experience = 0;
/* This determines what level a user is based on how many experience points they have */
levels.forEach((v, i) => {
if(experience >= v) {
level = i+1;
}
});
- I also want to figure out a way to retrieve the number of experience points a user has left before they level up again. For instance, if a user is level 1, I want to be able to display how many experience points they have out of the 10 required for them to reach level 2.
- To hopefully give you a better idea of what it would look like, here's essentially what I have in mind - the little bar beneath the Level/Experience would be a gauge to represent how far a user has to go before they level up again (which would also mean I'd need to convert the user's current experience progress into a percentage)
- I also have to figure out (for the mini profiles specifically) how to specifically retrieve each user's level and experience. When I last tried, only the first user's level and experience would display on every user's mini profile.
Aaand that's about all I've got! Like I said, in case it isn't painfully obvious, I'm really inexperienced when it comes to Javascript (and frankly most things aside from HTML and CSS), so any help would be really appreciated - with the script itself or any explanations, because I would love to understand how things work more!