I Finished the course!/.js is still a-happening.

     I already know that this is late because I'm writing the intro last. What, I can do that. It's called mixing things up. I do that sometimes. The good news is that I finished the HTML/CSS lesson! Olé! The boring news is that I still have a ways to go with the .js. Not really sure that's boring since that just means I'll be learning a lot more new things. Learning new things is always fun. So, I take the back the boring other news is that .js is still going on.  Ye olde(See, I did it again!) grooveShark is still blazing away. No coffee today. Just pure gumption over here! Time to plug in and plug away!

HTML/CSS

     Working away ye olde(I say ye olde too much) HTML/CSS again. Remember that website about an angry puppy from a while back? right around when I started CSS. They had me build it now. Which was weird, because; I knew what they were talking about! Whaaaaat?? That is just weird. The play on words was delightful. I'm working on positioning(still) and I am using it to make a "resumé" and they said how to "position" yourself. I laughed. Good grammar and a funny play on words is always delightful. Today was review. Lots of review.
     And now I know why! I'm done the lesson! Good thing I've got plenty of classes elsewhere that use HTML.

JavaScript

     First up are the notations. I've already gone over them, but today's theme seems to be review.
First there is Literal notation. "Literal notation creates a single object. It uses curly brackets { } and the object's default properties are defined within the brackets using <property:value> notation.
I find this to be the quickest when it applied to a small number of elements.

     Second is the Construction notation. "Constructor notation involves defining an object constructor. And like defining a function, we use the function keyword. You can think of this constructor as a "template" from which you can create multiple objects. To create a new object from a constructor, we use the new keyword."
I use this one when you have multiple elements with same properties.  For example:
//this one is the Construction notation.
var james = {
    job : "programmer",
    married : false
 
};
//This one is the Literal notation.
function Person(job, married) {
    this.job = job;
    this.married = married;
}

var gabby = new Person("student",true);

     See how many lines of code are needed in a Construction notation for one Object?
The Literal notation has more lines of code up front, but then you're able to add more in one line later on. The Construction notation has its uses, but, usually, in a more singular case. I say usually, because; everyone has their own way of doing things, and I'm sure that for some people, the Construction notation is their go-to trigger. My go-to trigger is my laptop. I found my old laptop, which means that I might be talking about a game soon. It's running ElementaryOS. I think I'll try and get Sublime Text or something along those lines and take a crack at it. That's all for today, folks! See y'all Friday!

--Martin

500, What?/Nothing Of Importance.

     It's Monday. Again. It keeps happening, man! No matter what I do, there's Monday! No-one gets away from Monday. I've had my coffee, but I'm still exhausted! I can barely keep my eyes open! I'll try to get this thing going quickly. Sound City is playing from G music. "From Can To Can't" is my favorite song in the album. Now, time to plug in and plug away!

HTML/CSS

      It seems that I've done 500 lessons! That's nifty. The lesson says I'm about 70% complete with HTML/CSS. Again, that's nifty. Really, I need to find out how to make a game with my new-found powers. Right now I'm working on positioning. Working with Margin, Padding, Border, and Content; you get abbreviations like 'TP' 'TM' 'TB' The 'T' stands for 'Top' the other are: 'Padding', 'Margin', and 'Border' respectably. I've already worked with margin somewhat, you have: auto, but you can also do something like:

div { 'margin-top: 5px; margin-right: 10px; margin-bottom: 5px; margin-left: 10px;}

Or, you can do:

div{margin:5px 10px 5px 10px;}

it's the same thing. You would use the first example when you're trying to specify less than all of the aspects of a tag's properties. Maybe just the left and the right, or something similar.
      You also have the same thing with Padding. You can also use negative positioning. Such as: div{margin-left:-20px;} instead of moving the object twenty pixel's worth to the right from the closest border, it would move it 20 pixels closer. Maybe even past it.
      Then there's float. You can move that left or right. Unfortunately, sometimes large floating elements get mixed with non-floating ones, and elements do end up on top of each other. To combat this, you use <clear> you can clear left, right, or both.
      If you don't specify an element's positioning type, it defaults to static. This is when you use <position>. You have absolute, which means that it's going to stay the same distance from its first parent element it has that doesn't have position: static. If there's no such element, the element with position: absolute gets positioned relative to <html>.
      Relative is another term, but also more straightforward: it tells the element to move relative to where it would have landed if it just had the default static positioning.
      Finally, we come to fixed positioning. Fixed anchors an element to the browser window; you can think of it as gluing the element to the screen. If you scroll up and down, the fixed element stays put even as other elements scroll past. Hipster websites loved that trick for while there.

JavaScript

      Nothing of importance to report on this one. I'm working away, but it's just reinforcement. I'll have more on Wednesday. See y'all then!

--Martin

Groovy, Man!/ Friends In Address Books

     Here I am at the coffee shop once again. I've got GrooveShark going. Click the link for the playlist that I'm playing. I've been on this one for a while, and I still like it! Always a solid electronic song going on. I've had a latté, I may get a regular coffee at some point to keep my eyes open. Friday being its usual self, I'd rather get this over quickly, but I need to put some time in. So, time to plug in and plug away!

HTML/CSS

      I'm sorting my friends! It feels a bit like circles in g+. They're even using Google colors. Anyhoo, it's the CSS I'm looking at. they pretty much don't care to teach you how to make a circle border. It's just there. Seriously. Don't just throw things at me, tell me what they are! Good thing ye olde Personal Initiative is still around.
div {
display: inline-block;
margin-left: 5px;
height:100px;
width:100px;
border-radius:100%;
border:2px solid black;
}
And that's how to do a circle border.
Now they teach me something cool. You can have an <id> and a <class> in the same tag. That is definitely nifty! Lots of uses for that. And I finished. That was quick. Looks like we're about to get into this:

I'll continue with that in the next post.

JavaScript

      Isn't it funny how normal it can become that a single letter being incorrectly capitalized eventually is not so stupid any more? It's perfectly logical that the computer would have a binary (heh. I made a play on words) track. It's either right, or it's wrong. There is no such thing as close. That's totally normal for me now! How strange... The Address Book of happening is still happening. I was trying to get it to print out a return on a search and it just wasn't working. It wasn't until I hunkered down and really scrutinized the code that I discovered my error. A lower-case 'l'. How thoughtless of me. I shall endeavour a better attempt at correct grammar today. After smashing my way Neanderthal-style through the lesson I moved on to adding more people in an easier method.
Starting off with this function:

var add = function(firstName,lastName,email,phoneNumber){
    contacts[contacts.length] = {
    firstName: firstName,
    lastName: lastName,
    phoneNumber: phoneNumber,
    email: email
};
It allows for any additions to be done with one line of code like this:

add("Mookie","Chess","example@example.com", 9003006000);

It doesn't print anything, it just adds that person to the address book. In order to see if actually worked, we use this:

list();

If you recall, that was part of the earlier code.
Turns out, it actually has a use.
And project Address Book is complete!

Olé!
Now it is time to bid you adieu. See y'all on Monday!

--Martin

Headway/Nothin much.

     Well, I have a donut, a coffee, some random music, it's time to plug in and plug away.

HTML/CSS

     Nothing of any interest to report on this front.

JavaScript

      Hey, it's the .js time! I actually made some headway!  Olé!
I am still on Objects! What? Yup. Still working on ye olde Objects... BUT the good news, as I said, is that I made some headway! I finished a 33 section chapter today, and in the last section, I did in one try, and knew what I needed to do! So, yay for that! And now onward to the next ones. I am now working on this: var bob = {
    firstName: "Bobi",
    lastName: "Jones",
    phoneNumber: "(650) 777-7777",
    email: "bob.jones@example.com"
};

var mary = {
    firstName: "Mark",
    lastName: "Johnson",
    phoneNumber: "(650) 888-8888",
    email: "mary.johnson@example.com"
};

var contacts = [bob, mary];

function printPerson(person) {
    console.log(person.firstName + " " + person.lastName);
}
var list = function(){};
var contactsLength=contacts.length;
for (var i = 0; i<contacts.length; i++){
    printPerson(contacts[i]);
}
Here's the thing, half of that code isn't needed. Like the array <contacts>, take it out and it still works just the same. Am I missing something here? I feel like I'm missing something here.

Beautiful Weather/ Not A Walk In The Park

     It's a beautiful day here in Texas. I had to take a break from my studies and go for a walk to enjoy this gorgeous weather. One of my friends told me that Katie Herzig was giving all of her music away for free today. So, that's what I was listening to. It was pretty good. I actually got my studies on a roll today. So, this is actually going to go out on time! No coffee today. I'm awake enough from all the amazing weather. So, time to plug in and plug away!

HTML/CSS

      I've been doing HTML just long enough for that picture to make my eye twitch just a little. Ever since I started learning HTML I've been writing these posts in HTML and I'll get little error messages if a tag isn't closed, or something. So, I'm more perceptive to tags lately. Mainly because I don't like the error messages. I'm pretty sure that I don't really care for the <nth-child> tag when it comes to calling a specific element. I mean, what's wrong with class or id? Although, I suppose that maybe some tags can't have those in there. So, maybe that's when they're useful. Hopefully.

I earned a badge! Olé!

JavaScript

      JavaScript. So useful, and yet so daunting. I seriously need to start doing some real world applications to have some real knowledge under ye olde metaphorical belt. I have the most basic ideas of .js, but some of the more esoteric practices can be overtly foreign on such a frequent basis that the only way to retain knowledge is to do the lessons over and over and over and over... As long as it actually helps me attain something in the end, I suppose it's worth it. The code that I'm starting with today is pretty much just simple math. Which should be easy, except that it isn't always easier said than done











 If you want to do cool code snapshots like this, go here.  It's called Marmoset.
      Anyhoo, the age bit was OK. I just had to do an <if/else> statement. Although, I'm sure I could do a ternary operator and have it all done better. I'll try that next time I need an <if/else> statement.

Seriously, remembering the names to these things can be hard! I tried three different ways before I got this. Like I said. remembering things in .js is hard sometimes! Remembering all the operators and objects and whatnot. I'm going to eventually remember them all, but it isn't exactly a walk in the park. Not that anyone said it would be. OK. That's the end for today.

See y'all on Wednesday!

--Martin

Relocating/#smh

      Right now it is 12:11 pm and the internet is out. Again. If it doesn't get fixed soon, I'm going to have to go to the coffee shop. I didn't really want to do that, but I gotta do my studies, man! I was able do get some studies done before, it went out, but not enough to really count for anything. I do know that I found some interesting things in one of the .js lessons, and I'll cover that later. Right now, I'm going to wait thirty minutes. If there's no WiFi by then, I'm outta here!
There is no WiFi. My life is empty and meaningless. Time to go to the coffee shop! For me, that’s twenty minutes. For you, it’s the next character over -> Someone has my chair. I’m not happy about this. The light is all wrong, the pillows are weird, there’s only one armrest, I sound like Sheldon Cooper! haha! I’ll wait until they leave, and then strike!

HTML/CSS

      Psuedo--class selectors; that's what I'm starting with today. Lesson people say: "A pseudo-class selector is a way of accessing HTML items that aren't part of the document tree (remember the tree structure we talked about earlier?). For instance, it's very easy to see where a link is in the tree. But where would you find information about whether a link had been clicked on or not? It isn't there!" Example: You know how when you click on something, it usually changes color like, blue to purple? That's what this is. And then there's the CSS thing where something changes when you hover over it:
a:hover {
color: #cc0000;
font-weight: bold;
text-decoration: none;
}       So, now that we have that weapon in our arsenal, let's take it to the battlefield; the console.
Alright, so now we have something to go with. Here's an e.g:
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title></title>
</head>
<body>
<div>
<a href = "https://www.google.com/">Google</a>
<a href = "https://www.yahoo.com/">Yahoo</a>
<a href = "https://www.bing.com/">Bing</a>
</div>
</body>
</html>
This looks just like regular HTML that has some links to some search engines. But when the CSS comes in, we get something else:
a:link{
    color:#008b45;
    text-decoration:none;
}
a:hover{
    color:#00ff00;
}
a:visited{
    color:#ee9a00;
}
If you want to test this out, go here. Unless you don't use Chrome. In that case go here follow the instructions, and then click the first link and be amazed. And with that, I'll leave this segment, and head over to the next.

JavaScript

      As I mentioned before, I found something interesting in my .js lessons. Yesterday, I was going over some lessons I'd already done. And realized something. I was looking at this code:

var bob = new Object();
bob.age = 30;
// this time we have added a method, setAge
bob.setAge = function (newAge){
  bob.age = newAge;
};

bob.getYearOfBirth = function () {
  return 2013 - bob.age;
};
console.log(bob.getYearOfBirth());

And I realized something. This section:

bob.setAge = function (newAge){
  bob.age = newAge;
};

is completely unnecessary! I took it out, and the lesson still worked! I seriously don't think these peopele really knew what they were doing. Their newer classes look better, but I think this one should still be in beta. Once I got past that I went on to the rest of the lessons. I'm still on the constructors because they're taking their time teaching this, which I'm totally OK with since they are difficult to learn. Here's what they said about constructors: "Constructors are a way to make objects with the keyword <new>. The most basic constructor is the <Object> constructor, which will make an object with no methods or properties."
     Ooooooh my. These people! Seriously shaking my head right now. I just passed my lesson using five different ways!! And most of them were just <undefined > or something similar. Which is just poop. There is no way that undefined is going to be ok in a real world situation. Here's the code:

function Rabbit(adjective) {
    this.adjective = adjective;
    this.describeMyself = function() {
        console.log("I am a " + this.adjective + " rabbit");
    };
}
var rabbit1 = new Rabbit("fluffy");
var rabbit2 = new Rabbit("happy");
var rabbit3 = new Rabbit("sleepy");
rabbit1.describeMyself();

At first, I tried to use <console.log> but apparently I was defining something wasn't there by using that, and then I tried a whole bunch of things, and they all passed, but I wasn't getting the return that I wanted. That's how I ended up with the code you see above. Kind of nifty. You just have to define a rabbit, and the words are already done. You don't have to write out each one, you just do it once! How neat!
Ok, this post is getting a little long here guys, so I'm going to call an end here. Remember to visit the links! Also, huzzah for beards.

--Martin

I Got Glomped!/.js Is Hard!

      
     It's a Wednesday here in my timezone, and that means I gotta pump out some juicy coding goodness. Also, that's the nerdiest thing I've said since.... yesterday. My gf sent me an HTML script that said she loved me. Yup we're nerdy. There should be a nerd pride parade! that would be so cool with blinking lights and whatnot! Maybe make the GPS route that we follow spell out NERD. *Ahem! ANYhoo... I'm actually at the coffee shop today. I know, it's not Friday! You're wasting gas! ACtually, I have to run errends when I'm done, so I thought: why not study at the coffee shop today? And that's what I'm doing. I switched back to the dev channel on my Pixel because the beta channel was getting laggy, so now that I have a smoother UX I'm happier. The music of choice today is "Programming Electric&Alternative" on Grooveshark. It's actually OK as long as they don't hit me with some Drake or similar stuff. Alright, I have my coffee at hand, my music going, it's time to plug in and plug away!

HTML/CSS

      So, on this front, we have Class and ID selectors. I love these guys; they make my day so much easier! I can now call things directly without worrying about disrupting something, and still have differences in something with the same tag as something else. Here's an exapmle:
<h2 id="intro">Introduction</h2>
<h3 class="standout">Classes and IDs in CSS</h3>
<p class="standout">Classes and IDs are super easy in CSS.
                                                  You're using them right now!</p>
<h3>Regular HTML Selectors</h3>


      Notice that there are tags with the same name,but they have <id> or <class> inside the tag, and those equal a name. So, the CSS side to this would look like this:
#intro{
    color:#b83c3a;
}
.standout{
    color:#f7ac5f;
    font-family:Verdana;
}
     Again, notice a few things that are different. There's the <#intro>, but then there's <.standout> tag the <id> tags get the<#> in front of their name, and the <class>  tags  get a period<.> in front of them.  You can have the same name for an <id> and a <class> and they won't interfere with each other. Why have the two different types of ways to call something specifically? I have no idea. They both work the same way. But I suppose I'll figure that out at some point.

JavaScript

      I swear... Every time I'm about to get the .js going stuff happens. It's already 6:02 PM here, and I'm just getting this part going. I got glomped by a friend that I hadn't seen in a while and I regret nothing. We had a great time catching up. I believe I made the right choice. I had a ball and now I'm scrambling to get some .js going. So, if this part of the post is skimpy, you know why. Also, I need to ramp up my .js times of studies. It's getting into the technical part, so I have to study twice as much to get what I'm being taught.
      Alright here we go. Still on constructors, sadly. They're really giving me the run-around. I just can't seem to memorize how to do this. I'm going to get it, it just isn't going to be easy. Right now, I'm working on this:

function Rectangle(height, width) {
  this.height = height;
  this.width = width;
  this.calcArea = function() {
      return this.height * this.width;
  };

  function calcPerimeter(height, width){
      this.height = height;
      this.width = width;
      this.calcperimeter = function(){
          return this.height * 2 + this.width * 2;
      };
  }
}

var rex = new Rectangle(7,3);
var area = rex.calcArea();
var perimeter = rex.calcPerimeter();

I wrote the calcPerimeter Method, but I can't seem to call it right, or it's missing something... I don't know. Turns out I had a lot of fluff in there... Typical me, add too much junk. I need to get that under control! Here's the finished code:
function Rectangle(height, width) {
  this.height = height;
  this.width = width;
  this.calcArea = function() {
      return this.height * this.width;
  };

this.calcPerimeter =function (){
    return this.height * 2 + this.width * 2;
  }
}

var rex = new Rectangle(7,3);
var area = rex.calcArea();
var perimeter = rex.calcPerimeter();

Notice the much smaller addition that I added. Pretty much, I just got carried away and added those two lines that got deleted because they said use the code already there as a model, but they didn't mean everything. Well, now that I got that out of the way, I done! I shall see y'all on Friday! Unless I get glomped again, but I doubt it since I'll be at home. So... bye! 

--Martin