In the first few' weeks of comp sci, we have learned the basics of coding. In simple terms, the sublime text is set up in a way that's easy for us, as people, to comprehend. There is a head and a body to every code. The same thing applies to the graphical interface on a computer. A "desktop" with "folders" is only there to make it easier for peopple to use, they do not actually exist. I have really enjoyed comp sci so far!!
In comp sci this week, we started decorating our website. I am finding it kind of difficult to make the website appealing to look out. I am struggling to come up with creative ideas for my website. It's suprising to me that the actual coding is easier than the decorating aspect.
For today's homework, we were supposed to create our first project which had to incorporate some sort of animation aspect. My idea was to have an apartment building that an elevator would move up and down the building but I want it to be able to stop on a floor when a button is pressed (like a normal elevator). I got to the point where I have a box that moves up and down the screen. I replaced this box with a picture of an elevator door and then changed the background image to be an apartment building. While this is not the full idea of my project, I was able to figure out how to use an animated image.
In this journal entry, we were asked to define a few html terms. If you want to include any phrase in your code, you can replace the entire phrase with a variable. Now whenever you reference that variable, your original phrase will appear. A string, is a sequence of characters that make up the code. A function is the "wrapper" of a code. In order to use it, you have to name and define what the function is. Then, in order to actually have this function appear on the website, you have to actually call the function.
What is an event listener? An event listener is a part of javascript that waits for an "event" to occur. An event is a library that appears in a console that tells you a lot of information about where you click on the screen. In order for it to appear in the console you should write (console.log) then in another paranthesis and then put the name of your event (which could be any name you want).
For this "happy birthday" website, I used javascript for the first time. This was a little difficult because I am very unfamiliar with the language that is used; however, on the basic level I understand how it works. We programmed it so that the code will listen for my mouse to click. It will take the coordinates where I pressed and then my chosen image (the birthday) will move to that place.
In the body section I made a div for each of the squares on my website. Then I gave each of them a class so that all the squares would be the same size, color, position, etc. Then I gave each of the squares their own ID. In the style section I referenced each of the IDs and added the pictures URl from my folder on my desktop.
This journal article is talking about the random gift generator that I created. Using javascript I created a website that when you click an image of a possible gift will appear. To do this i created a div called box and styled that box in the head. Then I made an event listener that would listen for a click. In order for the function to randomly select one of the images that I inserted, I used math random with an *6. Because I had 7 images in my function it would then pick any of them from 0-6. I then made box.style.background image so that the box that the imades would appear inside the box that I created at the beginning.
A function is a part of the code that represents a certain aspect of it. It stands in place of where another value would go. 2.When making a div everytime you click you first have to create a div with an ID so that you can style what would show up when you click. Then, you add an event listener that waits for a click in order to run the function. Then you have to add a console log that will track the x and y coordinates of the website. So now, in the console you should be able to press on any part of the page and it will log the coordinates of that click. Now you have to reference the div name.style so that the div will then appear on where