Sunday, January 13, 2013

Make an HTML editor like W3schools "Try it yourself" feature

Hey there!  Long time no see right?  I come with gifts!!!

One of the things I love to do is code.  HTML is something that I started playing around with much too long ago to give a date.  I prefer to write my HTML/CSS/Javascript using plain text.  This way I know that I have total control over what I'm getting as opposed to an editor which allows for quick and easy editing but may not always be as flexible as you want it to be.

The problem with coding in plain text via a program like Notepad or Textedit is that you have to save the file, switch to your browser and refresh the page every time you make an edit to see the result.  If any of you have ever visited W3schools and gone through their tutorials you will have come across a rather awesome feature to their pages: the Try it yourself editor.  This is an in-browser tool that lets you write code in a box on the left side of the page and then see the resulting page in a box on the right side.  Every time you edit the code on the left, all you need to do to see the updated change is click the Submit button which refreshes the box on the right.  It's an amazing little tool.

I decided that it would be cool to have one of my own, right on my desktop, that I could use to do my coding without having to run two separate programs and keep going back and forth, saving and refreshing.  It seemed simple enough... but after a lengthy Google-ing spree and combing through many forum pages I came up empty handed.  So I did what any good code-monkey would do.  I wrote it myself.  And now I will share it with you so perhaps your Google-fu wont fail you as mine did.

First, I add a textarea and an iframe. The ids are mycode and display respectively.  I also add the button that will make the magic happen and link it to the function I'm about to show you.



Next, I add a function called "display" in the Head of the page that takes the text from the textarea, converts it to a variable named "x" and then sets the innerHTML of the iframe equal to "x".


Finally (though I won't go into the details of it here), I spice it all up with some CSS styling to make it all look pretty.

Throw in your html, body, head tags and some CSS in the right places and the code will create a page that looks a little like this:

Tuesday, July 31, 2012

Codecademy Update!

I just popped over to Codecademy to continue with my coursework and POW!!!  There is a whole new track of stuff to learn.  They added Python to their courses.  Guess I know what I'm working on next!  I still plan on running through the Udacity courses as they seem to cover quite a bit more ground, but it's nice to see even more cool FREE stuff being offered.  I also really like the format Codecademy has.  Udacity integrates video as the primary mode of teaching and though this does make it much more like a real college lecture based course it also expands the amount of time required to complete the units.  If a unit contains X number of minutes of video you know that it will take you at least that long to go though it all.  But like I said, they take it WAY further than the basics.  By the end of Udacity's programing classes (I think there are three dealing with Python) you have built a search engine, a blogging platform and a freaking web browser!!!

Sunday, July 29, 2012

Get your Code on!

So I've been away... again... for a very long time.  Sorry about that.  But I have returned to bring you awesomeness!!!  Free awesome programming courses!!!

I'm currently doing the Code Year program at Codecademy.  It's super detailed and easy to follow.  It starts you right in with interactive coursework on Javascript and moves you into HTML, CSS and finally Jquery.  It's designed to be like a college course program and is divided into lessons by weeks.  BUT you don't need to wait that long.  I've blasted through the first several weeks in only a few days.

I've had previous (though limited) experience with Javascript but already have found TONS of new stuff out by working through these exercises.  Its really fun.  They also give you "Badges" as you progress to help you feel motivated and to point out when you've accomplished cool stuff.

One of the things that really made this program stand out for me was that many of the lessons feature aspects of creating games.  Some of the lessons focus on creating a dice or blackjack game and this is really cool for someone hoping to one day be a game developer.

Another place to pick up some free programing lessons is over at Udacity.  They have a series of computer science courses that focus on programming with Python.  These courses are LITERALLY set up like college classes and mirror ones taught at Stanford.  Pretty snazzy huh?

Finally, though not as in depth, there is a really neat interactive tutorial on the Ruby programming language called tryruby.org.  The design of the site is super cute and based on a book/comic and features some art from it.  This tutorial leads into a series, but alas, you must pay for those classes.

I plan on working all the way though the Code Year program and then perhaps try my hand at Python. You can feel free to try them all of course.  I'll (try) to keep you posted on my progress and perhaps post a few tutorials of my own based on a couple of simple games I've put together using HTML/CSS/Javascript.  That is, once I've had a chance to go back and clean up the code now that I've found I have been doing it a bit.... shall we say.... less than elegantly.

Sunday, November 27, 2011

Minecraft Pocket Edition

Minecraft has become a phenomenon. If you haven't heard of it yet, you have been seriously missing out. Minecraft is a sandbox style game where you have the ability to shape the game world around you and construct anything your imagination can come up with. Oh, and when the sun sets, you get attacked by zombies. It is the only game I know of that started selling butt loads of copies while it was still in Alpha. It has multiplayer modes and the ability to save and share worlds you have created.

The Pocket Edition is the new mobile device version available for Android and iOS devices. It lacks most of the full versions features and scales back the number of block types you can use to build with but with that being said, it is still one of the best games I've played on a mobile device and I'll tell you why.

The game starts and you are in a vast open world that has been randomly generated just for you. You are all alone and your goals are not defined. Most would wonder what fun you could possibly have playing a game that seems to have no purpose. The appeal is in exploring, seeing what is out there and building cool stuff. The goals are really set by you. You decide what to build and take pride in building something truly impressive. It would be worth noting that building impressive stuff is disgustingly difficult and time consuming.

There is something profoundly old-school about Minecraft PE. Something that is lost in most modern games. When the original Legend of Zelda was released the game simply started. You were standing in the middle of a vast world and had no weapons or direction as to where to go. It was hard. Very hard. You had to FIND the objectives. You didn't need to complete the dungeons in any specific order. You didn't even need to get the first sword if you didn't want to. You could skip it and still finish the game by getting a different sword later on and doing so was a badge of honor amongst gamers. Back then, gamers did things BECAUSE they were hard. It took dedication, time and skill. It wasn't enough to beat the game itself, gamers would invent new challenges like beating it without dying or doing it in a small amount of time or doing it without the primary weapon. Why would they do this? Simply to say they did.

For a game with no objectives Minecraft PE has absorbed a great deal of my time since I got it. I started by tunneling deep into the ground and hollowing out a series of chambers. My own personal dungeon to lord over. Then I spent a few hours making all the rooms aesthetically pleasing to me with uniform floors walls and trim. Then I built a stairway back to the surface world (which took a considerable amount of time). Then I added a second level to my dungeon. Then I decided to build a massive sculpture of the 3D-ized 8bit Darknut I had once made. It now stands, a colossus, at the edge of my lands as a testament to my glory. Then it dawned on me that I haven't yet explored the vastness of the world I posses.

So, long story short, I'm in love. This old-school gamer gives it two-thumbs-up.


Sunday, November 20, 2011

Zelda turns 25

A quarter of a century ago a game was released that changed everything. It was the first of its kind and it started a franchise that continues to this day and is perhaps one of the most celebrated series of games of all time. To show just how special it was, the cartridge itself was made to look as if it had been crafted out of pure gold. No matter how many games you had you could always spot the gold cartridge glinting. That game, of course, was The Legend of Zelda.

A series of such legendary proportions is bound to spawn dedicated fans and fan projects. I have just discovered one that I feel MUST be shared. A while back on a previous season of America's Got Tallent there was a young woman who played "Hip-Hop Violin". Her name is Lindsay Stirling and chances are, unless you watched the show, you haven't heard of her.

WELL, that needs to change right now. She was just featured in a Youtube video dressed in Link cosplay and playing a medley-mashup of many of the fan favorite Zelda tunes. It may not sound it from my description, but this video and the music featured in it are beyond beautiful. It literally brought tears to my eyes. Check it out:




Amazing right!!! Heres hoping she does more. I'm gonna keep an eye on her homepage/youtube channel/Facebook fan page for more awesomeness and I urge you to do the same. I've already watched the video a few hundred million times and plan on buying the track from iTunes on payday.

Saturday, April 9, 2011

Sony VS Geohot

First off, I know it has been WAY too long since I posted anything but life has a funny way of getting in the way of stuff. That being said, when I read about what was going on with this issue I felt I needed to say something no matter how many or few read what I have to say.

For those who don't know who Geohot is or what is going on between him and Sony here is a quick rundown:

When Sony released the PS3 one of the built in features was something called "Other OS" which allowed the user to install another operating system (ex: Linux) on the PS3 essentially making it a fully functional personal computer. They later blocked that feature with firmware updates and later models had it removed. Geohot started working on a way to hack the PS3 to reenable this feature (among others) and distributed video tutorials showing how his progress was coming along. Sony sued him for doing so and wanted the IP addresses of all the people who had watched his videos. Then, a hacker group attacked Sony claiming to defend Geohot. They attacked some of Sony's websites and shut them down. That is the story so far in a nutshell.

My views on this subject are rather controversial. I agree with the hackers and Geohot in a way. Their argument, and mine, is that the PS3 is a piece of equipment that the user buys and thus owns. Whatever a person does with their own things is their own business. If I tried to modify a product and voided the warranty I would not be able to get coverage in the event I ruined my product in the process. That is the risk I take and is my choice to do so.

Sony's argument is that hacking the system enables software piracy and thus should be stopped. Though this is indeed a valid point I don't feel is matters. There will always be piracy. The number of people willing to risk ruining an extremely overpriced gaming system in an attempt to play games without paying for them is small. Sony has the right if not the obligation to try to block piracy via software and hardware protections in their game system but I don't feel they have the right to sue someone for modifying a product they paid for the same way that Dell or HP has no right to keep a person from buying and installing upgraded parts for PCs they buy from them. They have the right to void said users warranty! Thats about it.

At this point I would like to point out that though my opinions may not reflect the current laws that deal with subject, my point IS that they may not reflect them. I feel that the laws are ill advised and unethical.

When Nintendo released the original Gameboy Advance it lacked a backlit screen. The mod community set to work at once and quickly started posting Youtube videos of how to install one. Recognizing the demand for such an upgrade Nintendo added a backlit screen to the Gameboy Advance SP. Instead of lawyering up Sony should have recognized that the consumers wanted the "Other OS" feature and simply found a way of implementing it themselves with the security that would prevent the piracy aspect they so fear.

On a side note, I would like to state that from the very beginning the PS3 has been far below expectations and quickly after launch began shedding the features that made it a good buy. Before its launch the list of its selling points included; full backwards compatibility with ALL PS One and PS2 software titles, DVD and Blu-Ray playback, being the cheapest Blu-Ray player on the market and the ability to install an operating system allowing it to act as a full-feature home PC. Nearly all of these features are gone now. Long gone in fact. With its initial price being upward of $600 in some cases I feel that these were some of the ONLY reasons to buy one.

It was supposed to be the only thing you would ever need; a computer, a high definition home theater system and a game system that played three different libraries of games! The PS3 never played all the old Playstation and Playstation 2 games and the feature was quietly removed entirely from later models. Within months of its release it was nowhere near the cheapest Blu-Ray player and is still the most expensive home console on the market. With the removal of the "Other OS" feature it has become nothing more than an extremely expensive game system. And with two other major competing game systems, both of which are cheeper, I really see no reason to spend money on one.

I personally feel that massive companies like Sony step over moral lines on a daily basis but only start worrying about the fine details about what is right and wrong when they think they may lose some of their profits. If a consumers product dies the day after the warrantee runs out they are expected to suck it up and deal. But the moment a consumer finds a way of getting their product to do more than what the company intended it to do they run to mommy and daddy (the courts) because they think they deserve more money and it isn't fair. It actually makes me sick thinking about it. Just like when pro sports players complain about how many millions a year they are going to get while educators are constantly threatened by budget cuts and Walmart associates are encouraged to apply for Medicaid since they can't afford the company insurance.

As for the hacker attacks, you go guys!

-Ev-

Sunday, May 23, 2010

Q-Block 3D Pixel Art Creator



With the advent of 3D Dot Game Heroes I was in the mood to make some of my favorite old game sprites into retro style 3D creations. It just so happens that there is a sick FREE online tool that lets you do just that. Its called Q-Block and its a blast to play with. There are tons of user created pieces that you can view in 3D space and edit at will. The editor is crazy easy to use. You basically just have to build your stuff like you would in 2D with a program like MS Paint or Pixen but it has layers allowing you to build objects with depth. You can also just click in 3D space to attach new blocks or take some away. Here is a Darknut from the original The Legend of Zelda that I threw together.

As fun as building the stuff is, the real kicker is that you can have your creations printed on stuff for you like T-Shirts, mugs or even dog sweaters... if your THAT kind of person. You can also download them as wallpapers or animated GIFs.

So seriously, go check it out.