FireSprite! Simple TexturePacker integration to html5/javascript!

I was SOOOO tired of doing sprite sheets manually. So i got fed up and wrote this library. It's neat. I'll do a full/better guide in the coming days, but this is here now to help the Ludum Dare dev's who might need some extra help!

12 Steps to setup FireSprite, make a sprite atlas, and have it pop out a sprite

1. Download FireSprite.js from FireSprite on github

2. Put FireSprite.js somewhere in your HTML5 app/websites directory

3. Add FireSprite.js to your index.html file
     <script type="text/javascript" charset="UTF-8" src="FireSprite.js"></script>
     Use that line if FireSprite is in the same folder as index.html, if not adjust the
     src="path/FireSprite.js" part

4. Use Texture Packer to make a spritesheet, make sure to set your Output Data Format
     to "JSON(Array)"

5. Move your spritesheet and json file into your HTML5 app/websites directory

6. Add the json file to your index.html in a very similar way to the FireSprite.js file
     <script type="text/javascript" charset="UTF-8" src="SpriteSheet.json"></script>

7. Open up your SpriteSheet.json file, the first line looks like this
     {"frames": [
     You need to make it look like this
     var spriteSheetName= {"frames": [
     where "spriteSheetName" is a UNIQUE identifier for this specific sprite sheet (if its just
     enemies, name it "enemy", ect)

8. SAVE it.

9. Make a variable to hold the atlas in your games JS file, where "SpriteSheetAtlas" is a
     unique name for the atlas
     var SpriteSheetAtlas;

10. Initialize the atlas (yours might have "SpriteSheetAtlas" or "spriteSheetName"
     named different things)
     SpriteSheetAtlas= new FireSpriteAtlas(spriteSheetName);

11. Make a sprite! "thisSprite" will be any variable name you want for that specific sprite,
     and keyname.png is whatever name the sprite had before it was packed. You can
     open your SpriteSheet.json file to find out the keynames if you forget!
     var thisSprite = SpriteSheetAtlas.createSprite("keyname.png");

12. Draw it! YourCanvasContext is the context you want it drawn to, and you just pass in
     the X and Y values to draw it at (drawX, and drawY)
     thisSprite.draw(YourCanvasContext, drawX, drawY);

If you need to scale the sprite, just call
thisSprite.scale(2.0);
That sets the scale to whatever number you pass in, instead of 2.0! And you only need to call it once!

That's about it. Like I said, check it out on GitHub!
Also check out TexturePacker if you haven't!

The elusive beast named "Programming"

Programming, coding, scripting. Saying these words brings to mind images of long crazy lines of green text on a black screen, or men with ridiculously long beards. But programming is something that everyone can do, and should at least try for a little bit if they use a computer at all.

Seriously.

Let me say that again. Programming is something EVERYONE who uses a computer can do. The fact that you're reading this blog, on a computer, is enough proof anyone needs to show that they have the ability to code.

But sadly, programming might not be something everyone enjoys. Programming is all about problem solving, and I won't lie to you, it can sometimes be frustrating. Missing simple errors can cause crazy problems, like forgetting to put a lug nut on your car's wheel. You might not notice it immediately, but good lord when it crashes it's going to be elegantly disastrous.

So, what is programming like? Programming is a great mix of many things, some describe it as an art form, while others would say its a technical skill to get something done. Without actually showing you how to program the closest thing I can find is cooking. Yup, cooking. When you program, you're writing extremely specific instructions for the computer to follow, like a cooking recipe, and the ingredients for your "recipe" is the data! The computer will follow every valid instruction you give it, exactly as you tell it to. This is where the trouble comes in for beginner programmers. They think that the computer will just "know" what to do if they don't put every instruction. Not true. Computers are not smart, if you tell it to delete your entire hard drive, guess what? You've just lost all your pictures of kittens. It's a hard truth to accept about computers, but when you're programming, if it's not working, 99.9% of the time it's the programmers fault. BUT, if you learn WHY something isn't working, you'll be on the fast track to becoming a great programmer.

Also, Google search is your friend. Your BEST friend. You should know almost everything about Google's advanced search by the time you're making your own applications!

Don't worry guys, the actual programming is coming! But having some background is going to help a ton. Understanding whats going on in programs is extremely important, and understanding the underlying principles and ideas of programming is what will make you an amazing programmer/engineer/hobbyist/ninja!

(I can't promise that if you DO become a ninja we won't be rivals!)

Me, this blog, and other junk!

Hello there internet,

My name is Nicholas Wrenn, and I'm the programmer for Golden Vault Games (GVG). I'm coming from mainly a 2D Java/Android developer background using LibGdx from BadlogicGames, which is sweet! (Check it out if you use Java) with a little bit of experience in C/C#/C++. I've recently had some side projects and urgings to start with 3D, non-mobile development, but that's another story!

My main adventure recently has been deciding how to make our first commercial game, Mutant Mole Mayhem, available on both Android AND iOS. I searched around and saw cross-compilers, scripting languages like LUA, but nothing seemed to be an exact fit for what i wanted.

That is, until I saw the power of HTML 5! (power that it didn't have just a year ago!)

Html 5 is actually a collection of 3 things, (more on this later) that blend together allowing almost any computer and web browser combination (including phones!) to be a target for developing! KA-KOW, I knew instantly I had found exactly what I needed. Combined with the extra performance offered by CocoonJS (a way to package HTML5 apps into a downloadable file on each phone's respective marketplace, specifically for games), I wouldn't have any extra concerns about performance and portability.

But making games/apps isn't the only thing that I enjoy. I want to help spread my knowledge of programming and video game development. It's something that so many people pass up, but is EXTREMELY rewarding making your own software and games.

This blog will mostly have 4 types of posts on it, they are

1. Advetures: these posts will follow my adventures into learning a language/framework. They will follow that path I took to learn the topic, while trying to minimize any setbacks/problems I experience.
2. Dive-ins: these posts will have specialized information on a specific topic, (eg: JavaScript game development, platformer physics/development). But these will not cover every aspect of Html 5 and javascript, just what is needed to make a game, though I will explain everything we use in the examples.
3. In-Depths: In-Depths are going to be the big posts. These posts will try to cover topics in such a broad way that get you familiar will many different aspects of a subject. (eg: the Html and JavaScript language posts will try to go over as much of the language as possible)
4. Randoms: Admittedly, I might post updates to things going on with Golden Vault Games, cool technology/programming/game industry things, and possibly some random photos of super cool stuff. (but it'll be AWEEEEEESOME)

Hopefully over the length of this blog I'll be able to get everyone as pumped as I am about programming and video game development!

C'ya soon!

-Nicholas Wrenn