My goal this weekend was to implement the concept of flags and state into the game.

I was using a system of flags for keeping track of which chests were opened, but nothing else. I decided to scrap that system, and migrate it and other pieces of state over to a new system.

I’ve included the indecipherable scribblings of a madman for your reference:

We have three tables, one for NPC (non player characters), one for Dialog, and one for Flag. NPCs carry an array of NPCDialogs, each of which hold a reference to an id in the Dialog table. The NPCDialog has an array of Flag ids, which are tied to flags in the Flag table. The NPC, when interacted with, will then say the dialog that is appropriate to the game state, as dictated by the flags that have their flagged property set to True. The cool thing is that NPCDialogs aren’t just tied to a single flag, they can also rely on multiple flags being flagged. We reduce to find the dialog that best corresponds to the current game state:

  private getCurrentDialog() {
    const sm = State.getInstance()
    const dialog = this.dialog.reduce((acc, dialog) => {
      if (sm.allAreFlagged(dialog.flags)) {
        acc = dialog;
      }
      return acc;
    });
    return dialog.message;
  }

So for example, when the game starts, Lo doesn’t have her hearing aids. When she talks to Ryan, she can’t hear him. But when she gets the hearing aids on the table the flag for getting hearing aids is flipped to true, and the Ryan NPC object now knows what dialog to say in response. Here it is in action:

The potential that this opens up for the game is actually pretty grand. Now we can dictate game state with a really granular system of flags. I hope to expand this system to apply to item presence, NPC position and other things. This is one of the key parts of the game I needed in place in order to complete the loop.

Key items were also introduced this weekend. Collecting the key item will flip a flag, and as seen above, cause other NPCs to change their dialog in the world. Pretty cool!

I also implemented an item preview functionality that adds a panel for seeing a small preview of the focused item in the UI.

This week, I think I want to start building out the first dungeon. It’ll be a simple affair. I want to implement a few floors, some treasure, and a final boss. I think it’s doable!

I was feeling a little defeated after not making much progress this weekend on things like game state. However, I was able to create a very basic game loop, and surprisingly found myself getting lost in it for a few minutes. I would encounter enemies, take them down, acquire coin and experience points and items, use the items to recover my lost HP, and repeat until I was growing strong enough to one-shot the enemies.

I was surprised to find that I was enjoying the very simple loop I made. It felt very bare-bones to be sure, but there is something magical about seeing code you’d written just come together into something cohesive.

I spent most of my time working on fixing bugs or implementing small visual changes here and there. Here’s what I did this weekend:

Fix XP Bug that would break XP bars and the toNextLevel calculation.

For some reason, the way I’d written the code to handle leveling up was not taking into consideration the scenario in which the character beat an enemy that caused them to level up more than once. The calculation was causing some strange numbers to appear in the toNextLevel calculation. Eventually I landed on a solution that used recursion:

  public gainExperience(experiencePoints: number) {
    let leveledUp = false;
    const total = this.currentExperience + experiencePoints;
    const overFlow = total - (this.toNextLevel * this.level);
    while (total > this.getExperienceToNextLevel()) {
      this.levelUp();
      leveledUp = true;
      this.currentExperience = 0;
      this.gainExperience(overFlow);
    }
    this.currentExperience = total;
    return leveledUp;
  }

Recursively call gainExperience, passing in the overflow experience from each previous call, until there is no more overflow experience. I was delighted to see that it worked like a charm.

Add some animations for attacking and healing.

Added some sparkles and sound effects for hitting and healing. Here is the healing animation in action.

Implement a class and leveling system

I made a database of classes and associated each party member with a class. In the image above, you can see that Tuzi is a Bunmage. I wrote a series of getters in the PartyMember class, one for each stat, that takes into account the stat modifiers of the class associated with them, as well as a modifier based on their level. So it looks like this:

STR = partyMember.baseSTR * class.baseSTRModifier * partyMember.currentLevelModifier

So warriors with slightly higher STA and STR modifiers will see a linear trend upward in that stat, all driven by level increases. I spent a little bit of time thinking about this problem, and even asked a question on Quora about it, but eventually went with this method as it’s easy to tweak later on.

I found something interesting — with this, the basic game loop was complete. I was able to do a rudimentary form of grinding on monsters, gaining levels, gaining items, gaining coin, and using items to replenish HP. And with the leveling system in place, I was able to feel my characters getting stronger as they took less damage from enemy monsters, and defeated them more easily.

I noticed that I was falling into this comfortable gameplay loop, and once I realized that I’d made something that captured my attention like that, it was a very nice feeling indeed. It made me want to do even more to polish and expand the game.

Though I haven’t had as much time as I would have liked to work on this game, I am still making some progress. I’ve been mainly working on the battle system in my free time after work.

You can see in this gif that we’ve got attacking, battle messaging, loot messages and win messages all working.

I made an easy, compose-able tweening system for animating the characters attacking and damage numbers streaming. I also converted the setTimeout‘s and Promise‘s to use ES8’s Async/Await syntax, so the async code is a lot cleaner.

Even though I really like the asyncAction y–>then do x syntax:

        this.playCombatText(text).then(() => {
          return resolve(results);
        });

It really is no match for how clean this is:

await this.playFadeUp(text)
      return resolve(results)

You may also notice that the resolution of the font is improved. The previous version was made with a much smaller aspect ratio, blown up four times. I recently made a very large change that bumped up the resolution on all my assets and text, which improves the quality of the visuals and also the frame-rate somewhat.

I was also able to create a short video for my wife’s birthday using the game’s credit sequence.

I want to continue to flesh out the battle system, eventually moving to display health bars, actually distribute coins, experience and items, and adding in a couple of spells for Tuzi the rabbit to cast.

About two months ago I started work at a dream job.

Working at Quora has been one of the greatest experiences of my professional life. There isn’t a day that goes by that I don’t think to myself how blessed I am. Five years ago I was reading books about arrays in PHP and trying to wrap my head around JavaScript objects. Now I’m working at an amazing company solving incredibly cool problems in Silicon Valley. It’s still hard for me to accept it as a reality.

This week was Offroad. It’s essentially a week-long hackathon where employees pitch ideas to the company and then take a week to implement solutions or new features. There were incredibly cool ideas, like improved embedded links in Quora answers, making asking other users for answers a more social experience, identifying ‘trending’ answers and sharing them with even more users etc.

I joined a group centered around the concept of debate and discussion on Quora. Basically, give users better tools to see different sides of an argument or discussion, allowing them to filter through answers that are tagged with certain viewpoints, and enabling the reader to select certain quotes in an answer to directly comment on.

The whole thing was very ambitious, and I think a few people doubted that what we were pitching could be done. But during the first couple of days of the Hackathon, we took some time to pare down the idea into a scope that was doable and sped off. It was four interns and four full time engineers.

Collaborating on the idea and seeing it come to fruition was such an awesome experience. We spent five days in various meeting rooms just shooting ideas back and forth, asking people to write some code we needed in some other place, mocking up interfaces quickly, drawing diagrams on whiteboards… I had an absolute blast.

When it came time to present our project to the company in a closed beta, we found adoption of the features was rapid and enthusiastic. People were commenting on quotes and starting side discussions based on specific points, tagging their answers and taking sides. It was really really cool to see.

After a company-wide vote among ~90 projects, we were actually voted the best idea of all of them, which just made me even happier.

It’s been a great couple of months. I can’t wait to see what else we can do to make Quora great.