Finally Abstracting my Code and Making an Ice Rink

-
Today at my internship I worked on abstracting my code. I was finally able to do it. After some help from my internship guy, I was able to abstract out my characters.  These included my bird, the little guy, and the sky. How I did this is pretty complicated, yet very simple when it was explained to me.
   First, you make another js file in your folder that already has your HTML file. In this Js file, you want to put everything that applies to one character in it. For instance, if I was abstracting the little guy, then I would take all of the code that created the guy and puts him on the page. Once you have this in another js file, you want to call that js file in your HTML file. This makes it so the HTML recognizes that you want to use a specific js file in your code. I essentially did this for my bird and my sky. Although when I did this, there was one dilemma that I ran into. The dilemma that I ran into was that I couldn't see my character. I was so confused about what was happening. My internship guy showed me that you have to specify where the little guy is on the z-axis. The z-axis shows if the character would be in front or behind another picture that was already on the page. Once I fixed this, I had my character, the little bird, and the sky in the background. After that, it was time to go back to school. Today was very fun and interesting.

Comments

Post a Comment

Popular posts from this blog

Doing a Little Review

-
     Today, I worked on making a gif move. The work I am doing is a little review from last semester. If y'all can't remember, last semester I worked on making a little character move north, south, east, and west. I enjoyed working on my gif move all of these directions. Although, Instead of a little human character, this time we are using Link (A character from the Legend of Zelda).      First I started with a setInterval function. This function held the if statement, that if the direction is == (== is used to compare and not to assign something) to 'right', + 1px to the character's.left attribute. The 1px means to add 1px to where Link is located on the canvas. For example, if Link is assigned '200px' to the left attribute, which is otherwise the x-axis; then adding 1px makes it so the '200px' will keep increasing by one. This means the character will start to move to the right. To make Link go left, one just needs to add -1px . If one wan...
Read more

Making Classes

-
    Today I went to my internship and I worked on making classes for my code. A class is essentially for cleaning up your code. It stores a bunch of information in that class which can later be called in the main code.  I started reading about this, and I found some text that seemed very complicated. To my surprise, making a class wasn't as complicated as I thought, although implementing a class into my code is a whole different story.     I made a bunch of classes while I was at my internship. The class I worked on first was for movement. So all of the variables assigned to the keys so that the little guy can walk. There was also a class for the character itself. Another class was made for the bird. The bird in the code posed as an obstacle for my character. When my character came into contact with the bird, he would stop. I also made a class for the crash. This had my huge if statement saying that "if the man (the makeshift square) came into contact...
Read more

Using the Arrow Keys

-
Using the Arrow Keys     Today was the third time being at my internship. Exciting right!! I continued on the same project that I have been working on from last week. Last week I worked on making a little giph walk north, east, south, and west, through the use of some functions. I would essentially call a function that I had already created. For instance, if I called walkNorth(). This is telling the console that I have called this variable, and that the computer is going to find this walkNorth() variable and run what this variable is assigned to do. In this case, I assigned this variable to walk north. How I did that is a little more complicated, so for now, all you need to know is that this giph walks north when the variable walkNorth() is called. I also made different variables called walkEast(), walkSouth(), and walkWest, and assigned them to walk in there specific direction. Calling these variables one by one is kind of inconvenient because I would h...
Read more