DEV Community: Alek Westover

the worst of js: %

Alek Westover — Sat, 22 Aug 2020 03:45:28 +0000

Javascript has a lot of weird features.

Non-transitivity of equality is one pretty weird thing about js, see this meme:

But I have to say, for me the most infuriating thing about js is that it has a fake modulus operator.

In literally every other language: python, C/C++, Julia, Java, whatever, x%y >= 0 is always true. This is just so useful, because for me the biggest use case of the modulus operator is cycling through elements of a list, in which case I really want

0 <= (x-1)%n < n
0 <= (x+1)%n < n

I dunno I find it really annoying that js says things like -1 % 5 = -1.

It's typical in math to denote the set Z\nZ by {0,1,\ldots, n-1}.

Of course it's true that -1 = n-1 \mod n but I want the reasonable value, not the negative one!

-Aelk

enchantedForest[8]

Alek Westover — Sat, 15 Aug 2020 01:04:34 +0000

Today we did

mob dropping items
made 2 fun new rooms!

something interesting we found out, is that we have two different fields in our Entity class, one called type and one called species. Interesetingly enough, item.type="item" whereas item.species=itemType, e.g. "gem".

wow, great names !Alek.

enchantedForest[7]

Alek Westover — Mon, 10 Aug 2020 01:30:46 +0000

today, we wrote 3 lines of code.

def logout():
    if session.get("username"):
        del session["username"]
    return redirect(url_for("index"))

ok not really,
@kaisucode actually did some stuff.

I'll probably do some stuff and maybe update this blog post.

But we did find a lot of bugs. So that's something!

enchantedForest[5]

Alek Westover — Sat, 18 Jul 2020 03:13:45 +0000

SAVING SYSTEM

Today we wrote a saving system for our game.
It's really starting to feel like a real game now!
Once we add real quests, and you can save your quests and level up and stuff it's going to be super epic!

In writing the saving system we had some adventures.

Most notably our .git file got corrupted somehow, resulting in massive panic, and cp -ring and scp -ring. In the end we found a pro solution though: rm -rf .git, and then cp -r .git from a different clone of the project. As they say "high quality".

Anyways, as expressed I'm super hyped about the checkpoints saving your progress.

For the curious people out there here's what our createAccount function looks like:

    mongo.db.users.insert_one({"username": username, "pwd_hash": pwd_hash, "data": {
        "checkpoint_room" : "llamaPlains", 
        "health" : 50,
        "coins" : 100,
        "mana" : 100, 
        "completedQuests" : [ ], 
        "level" : 1, 
        "xp" : 10, 
        "items" : [ ] 
        }
    })

Also, another really nice thing that we did is we kind of messed around with the stats and stuff. Like we made the mana generation rate more reasonable.

Also, @kaisucode made an absolutely epic health bar, that is way better than hearts imo.

Also a little comic strip for your enjoyment:

Alek: yo how do you update something in MongoDB?
Kevin: let me look it up
Alek: wait no I can just drop the database
Alek: how do you insert something into a database?
presses up arrow 100 times
Alek: found it!
Alek: Aw crap we're hashing the pwds
Alek: loolllll creates account with same pwd, copies hash
Alek: drops database again
Alek: wait should I drop the database again? ok
Alek: hmmm.
Alek: db.dropDatabase()
Alek: db.dropDatabase()
Alek: db.dropDatabase()
Alek: db.dropDatabase()
Alek: Why can't I press tab to autocomplete filenames when I'm scping. oh wait. lolll.
Alek: db.dropDatabase()
Alek: db.dropDatabase()
Alek: db.dropDatabase()
Alek: db.dropDatabase()
Alek: ayy it works! ok we're never allowed to modify the database btw.

Next time we're gonna be making the game more legit. In particular, we will be

adding the first boss
adding some more rooms
making the quests real
making the npcs real
making the merchants real

It's going to feel like a real game!
Get ready!!!!!

Finally, I would like to close with an inspirational thought.
When testing the game saving stuff, we made it save health first. In order to get the test to pass we had to lose health, and then reload the page and have the low health. Getting to a checkpoint took a while though. This prompted the following brilliant realization: if the player died, it respawned close to the checkpoint.

You would kill yourself to get to the checkpoint faster?
Some things are worth dying for.

pretty much.

Ah, what an enchanting forest.

enchantedForest[3]

Alek Westover — Tue, 30 Jun 2020 23:45:11 +0000

Today we did some more work on the enchanted forest

Pretty much are just setting up the database stuff.

So we made a little login / create account page,
and it sends a post request to python
hashes your password checks if there are users with the same username, etc etc.

And eventually you get redirected to the game site with all your user data

Then our idea is, in the game there will be these things called checkpoints.

They are physical locations that you can go to

And save your game state.

So yeah, there you go.

When working with a new library I find it's really helpful to use ipdb, for me its a nice complement to reading the docs, cuz I can play around with the objects and get a feel for them.

Unfortunately I had some problems with ipdb, like cancelling stuff after it got a bunch of requests. ¯_(ツ)_/¯ . not really sure what that was about @kaisucode 's server

enchantedForest[2]

Alek Westover — Wed, 24 Jun 2020 02:18:20 +0000

Today we added Vue to our project!

We felt like this was going to be better than integrating something like React or Angular with Flask.

Vue is pretty cool.

Basically what you do is something like this:

<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
 <style type="text/css" media="screen">
#blah2 {
  background-color:red;
  color:white;
}
 </style> 
</head>


<body>

  <div id="hmmm">
    <h1 v-for="i in asdf" :id="'blah'+i">
      <i>
      blah {{ i }}
      </i>
    </h1>
  </div>

<div id="app">
  <h1 v-for="item in items" :key="item.message">
    <b>
    {{ item.message }}
    </b>
  </h1>
</div>

<script>
var myObject = new Vue({
  el: '#app',
  data: {
    items: [
        { message: 'Hello Vue!', isComplete: true},
        { message: 'Hello Vue!', isComplete: true},
        { message: 'Hello Vue!' },
        { message: 'Hello Vue!' },
        { message: 'Hello Vue!' },
        { message: "Bar"}
      ]
  }
});


var blah = new Vue({
  el: '#hmmm',
  data: {
    asdf: [0,1,2,3,4]
  }
});

</script>

</body>
</html>

Pretty cool! (to run it, just do python3 -m http.sever, we're using CDNs so no installs necessary)

One thing that we ran into while doing this was
how to integrate Vue with Flask.
In particular, jinja template stuff collides with Vue (both use "mustaches" i.e. {{ }} for stuff).

So the way we fixed this, was we just loaded the js thing as a static page. Vue is a tool for making static pages, so this works fine!
Here's the code:

return app.send_static_file('index.html')

And, something that I found kind of surprising is that we were still able to do jquery requests even though the page is static!

So yay! probably next time we can integrate mongodb with our game.

copolla

enchantedForest[0]

Alek Westover — Fri, 12 Jun 2020 07:41:42 +0000

Hey!
Me and Kevin are making a cool game called "The Enchanted Forest"

It's a single-player RPG.
We're writing pretty much the entire game from scratch, using the really minimal p5.js graphics library.

So far my favorite features are the weather particle effects (especially lightning) and the boar path finding algorithm!
The collision detection for the player staying on blocks is pretty nice too.
I also really like how we are able to import our maps directly from the Tiled map editor.

In addition to coding this game, we're also going to be writing the plot for the RPG!

The project is a WIP. Our code so far can be found on github and we have a static version of the game up here.

This blog post series will be about our adventures in making this adventure.
It's going to be a fun time!

digital yearbook

Alek Westover — Wed, 20 May 2020 06:31:45 +0000

Project

code for the project

Me, and a bunch of my highschool friends (see the list of contributers on GitHub) made a vritual yearbook!

features

register for an account (we have some cool "security stuff" like sending verification codes via email, and hashing passwords, and not letting people do script injections)
modify account (password reset, update photo or quote)
see where people are going to go to college
see the main yearbook, which displays everyone's pictures and quotes
send people messages
view your messages

tools

We used python (Flask) for the backend. Basically we had to create accounts for users with name, email, college they're going to go to, senior quote, and a yearbook picture.
We used bootstrap to help out with the front-end web development.

We set up our project on a little digital ocean droplet, and actually got our school to use it!

cool stuff

I learned a lot of really cool stuff from working on this project. Here are some of the highlights:

It's really easy to set up a digital ocean server. Except you have to have a credit card even though it's going to be free. (Dang.)
Flask's sessions are super cool! My understanding of them is that you can cache user data on their computer. So like you can keep someone logged in even if they visit separate pages.
Flex-boxes are pretty awesome.