Monday, January 16, 2012

Open Handed Blocks - Lesson Learned

Feels worse than it looks!
Update 2012.01.23 


My wife convinced me to have it checked at the clinic. It's a bit more than a sprain - it's fractured at the knuckle. Other than a longer recovery, there isn't really anything I can do about it.


Managed to sprain my middle finger with a poorly executed open handed block at Friday night's lower Kyū belt grading. It hurt as much as rolling my toe on the old dojo's mats. I could tell my partner didn't much care for me trying to drive my finger through his arm either but we both shook it off and continued. Lesson learned. 


First time I've jammed my finger. It really should not be surprising how hard it is not to use your fingers. Especially when they are on your dominant hand. Fortunately, it's not broken, but try typing and using a computer mouse. 

Computer mouse and Ice rig
I've been applying ice, taking Advil, and using KT tape at night. It helps. I'll buddy-tape it for tonight's karate class.


Once it heals, I'll have to work on those blocks. Obviously I'm not practicing them enough.




Saturday, January 7, 2012

Javascript Frameworks: turing.js

While looking for resources for learning Javascript I ran across a great series by Alex Young at dailyjs.com called "Let's Make a Framework." In it, he creates a framework deliberately designed for learning Javascript and frameworks called turing.js


On the second post, Let's Make a Framework: Classes, Inheritance, Extend he mentions Douglas Crockford's excellent discussion of the classical and prototypal inheritance models. 


These are really great references for someone learning Javascript and why the language is the way it is. There is a long and dramatic history to Javascript. It's been tested by fire and made stronger for it. I think I'm going to really enjoy learning it.



Tuesday, January 3, 2012

New Year Resolutions

It's that time of year again...


What is my quest: To update my software development skills.
What to study: Phone app development
What kind of apps: Eventually games, but let's start with something simple... 
Possible technologies: Native, Web, Cross platform?


Where to start? Well, I started by poking around the web for a few weeks looking at possible development frameworks and stacks. 


I have an iPod Touch and a Macbook so native Xcode was an obvious starting point. Although I still want to develop native apps with Objective-C, I'd also like to update my web development skills.


HTML5 web apps look pretty good. The cross platform issue is solved by using a web based app, but you run into issues with offline use. Client side HTML5 solves this, but how do you market it?


PhoneGap to the rescue. I can wrap client side HTML5 into a native app wrapper that can target iOS, Android, Windows Phone, etc.


There are a lot of frameworks available. SpineJS is still in the running but I think it needs a bit more work on the mobile side. I really like coffeescript, but as a "classically" educated developer (code for "get off my lawn") I feel it's necessary to understand the foundation layers. So, I'm starting with javascript.


To learn javascript, I'm going to follow a great series written by Alan Young at DailyJS.com called "Let's Make a Framework". 


Here's what my preliminary framework looks like. It's subject to change of course.



Sunday, December 4, 2011

iOS App Development with PhoneGap and Spine Mobile: iOS Example App

In my prior post, I made a simple modification to Alex MacCaw's mobile contacts example. Today I'll walk through the steps to wrap it with PhoneGap as an iOS application.

Detailed directions are available for setting up PhoneGap for iOS using Xcode. You'll also want to read Alex MacCaw's documentation on integrating Spine Mobile with PhoneGap. It's in the early stages of development so there is a bit of manual tweaking necessary.

Setup an Initial PhoneGap Project

Open a terminal and change to your spine mobile application directory. 

$ cd ~/Documents/spine.mobile.contacts
Create a subdirectory for your Xcode project. Alex suggests using ./build/ios within your spine project directory (e.g. ~/Documents/spine.mobile.contacts/build/ios).
Start Xcode and select the PhoneGap-based application template.



Enter your Product Name and Company Identifier. I chose MyContacts. Not very original, eh? 



Change the Scheme to iPhone 5.0 Simulator and run the application. You'll get a warning indicating the www folder is missing from your project and the iPhone Simulator will display an error message that index.html was not found.





Quit the iOS Simulator. Drag the www folder created in the project directory onto the project folder in Xcode. This will add a reference to it in your Xcode project. 




In the dialog box that pops up, make sure you check the Create folder references for any added folders option.




Run the project again and you'll get a default sample PhoneGap application with an alert in the iOS Simulator. It works!





Tweak your Spine Mobile Application for PhoneGap

You need to add phonegap.js to your spine mobile application. The current version is named phonegap-1.2.0.js. Make a new directory in the spine project directory called lib (~/Documents/spine.mobile.contacts/lib). Copy phonegap.js from the www directory (~/Documents/spine.mobile.contacts/build/ios/MyContacts/www) into the new lib directory. You also need to add phonegap.js to the libs section of the slug.json file.

{
  "dependencies": [
    "es5-shimify",
    "json2ify",
    "jqueryify",
    "gfx",
    "spine",
    "spine/lib/local",
    "spine/lib/ajax",
    "spine/lib/route",
    "spine/lib/tmpl",
    "spine/lib/manager",
    "spine.mobile"
  ],
  "libs": [
    "./lib/phonegap-1.2.0.js"
  ]
}

I also needed to modify the spine.mobile.contacts index.html page slightly. Change href="/application.css" and src="/application.js" to href="./application.css" and src="./application.js".

<!DOCTYPE html>
<html>
<head>
  <meta charset=utf-8>
  <title>App</title>
  <link rel="stylesheet" href="./application.css" type="text/css" charset="utf-8">
  <script src="./application.js" type="text/javascript" charset="utf-8"></script>
  <script type="text/javascript" charset="utf-8">
    var jQuery  = require("jqueryify");
    var exports = this;
    jQuery(function(){
      var App = require("index");
      exports.app = new App({el: $("body")});
    });
  </script>
  <meta name="viewport" content="width=device-width; initial-scale=1.0; minimum-scale=1; maximum-scale=1.0; user-scalable=0;"/>
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="format-detection" content="telephone=no" />
</head>
<body>
</body>
</html>

Compile your application with hem from the spine project directory.$ hem build
At this point you could test your spine mobile application using a browser. Just run hem server and browse to http://localhost:9294/. You can even use your iPhone/iPod Touch if your computer firewall will allow it. Run a command like ifconfig or look in your network preferences for your ip address (e.g. http://192.168.1.112:9294).

$ hem server

You need to copy the contents of the spine mobile project public directory (~/Documents/spine.mobile.contacts/public) to the www directory in the Xcode project (~/Documents/spine.mobile.contacts/build/ios/MyContacts/www). You'll need to do this after each hem build. I added a step to the build phase to automate this. You could also add a command to build your spine mobile project before it's copied. For now, just copy application.css, application.js, cache.manifest, favicon.ico, and index.html manually. 

Run the Xcode project again... Voila!

You now have a working iOS application. Future posts will include setting up icons, syncing data with a server, etc.










Thursday, November 24, 2011

King Arthur Banana Bread

Finally used up our stash of over-ripe frozen bananas. We eat a log of bananas. Ocassionaly, we don't finish them off before they are too ripe so we toss them in the freezer whole - peel and all. When you need them, take them out of the freezer and thaw. Or you can peel them while frozen and nuke to defrost. They're also great for making a smoothie while still frozen (sans peel of course).

Used a recipe from King Arthur Flour and their white whole wheat flour. The crumb is nice and the texture even. It's slightly dry for my taste. Probably should substitute some of the butter with applesauce, use egg substitute, and perhaps use a 50/50 mix of whole wheat and white flour.

Ingredients

1/2 cup unsalted butter, at cool room temperature
2/3 cup brown sugar, light or dark, firmly packed
1 teaspoon vanilla extract
1 teaspoon ground cinnamon
1/4 teaspoon ground nutmeg
1 teaspoon baking soda
1 teaspoon baking powder
1 teaspoon salt
1 1/2 cups mashed ripe bananas (about 3 medium or 2 large bananas)
3 tablespoons apricot jam or orange marmalade, optional but tasty
1/4 cup honey
2 large eggs
2 1/4 cups King Arthur Unbleached All-Purpose Flour
1/2 cup chopped walnuts, optional

Directions

Preheat the oven to 325°F. Lightly grease a 9" x 5" loaf pan.

In a large bowl, combine the butter, sugar, vanilla, cinnamon, nutmeg, baking soda, baking powder, and salt, beating till smooth.

Add the mashed bananas, jam, honey, and eggs, again beating until smooth.

Add the flour, then the walnuts, stirring just until smooth.

Spoon the batter into the prepared loaf pan, smoothing the top. Let it rest at room temperature for 10 minutes.

Bake the bread for 45 minutes, then gently lay a piece of aluminum foil across the top, to prevent over-browning.

Bake for an additional 25 minutes. Remove the bread from the oven; a long toothpick or cake tester inserted into the center should come out clean, with at most a few wet crumbs clinging to it. The tester shouldn't show any sign of uncooked batter. If it does, bake the bread an additional 5 minutes, or until it tests done.

Allow the bread to cool for 10 minutes in the pan. Remove it from the pan, and cool it completely on a rack.



Nutritional Info

Serving Size 1 slice (60g)
Servings Per Batch 18
Amount Per Serving

Calories 170 
Calories from Fat 50 

Total Fat 6g 
Saturated Fat 3.5g 
Trans Fat 0g 
Cholesterol 35mg
Sodium 230mg
Total Carbohydrate 27g
Dietary Fiber 1g
Sugars 14g
Protein 3g