Category Archives: Code

Breathing Life Into a Dead Mac

Posted by on November 17, 2011 No comments

Okay,

Way back in the day when we started working on THE ORIGINAL XBOX Microsoft sent us XBox Dev Machines – they were Apple Macintosh Pro boxes with Dual Core Power PC chips.  The original XBox was to have 3 cores.
That was in 2000.  After the project was over no one wanted the dev machines back.  We were allowed to keep them despite the fact that each box cost $10,000.  So I took one home and that became my first Mac.
I used it for about 5 years.  THEN IT DIED.  Sad… sad day.
So I bought ANOTHER Mac Pro.  Only this time I got one from Fry’s electronics so I knew it was a late model.  I saved about $700 but I was able to reuse most of the equipment from my Power Mac.
Now that machine – circa 2006 is starting to grind to a halt.  I mean what do you do with a machine that
can’t keep up with your typing or even play audio files?
To replace it?  Budget about… oh… $4,500.  Holy crap.
So – I did a little checking and I found a way to salvage my beloved tower.
#1) More RAM.  Mac’s have ALWAYS been very efficient with RAM.  2GB was enough forever with most apps being a 20-30MB (compared to their Windows counter parts that were 10X as big).  So my 4GB was huge 5 years ago.  BUT… most Mac applications now tilt the scale at 150-300MB.  Some as big as 500MB.  Open up 3 or 4 things and suddenly – you’re low on RAM.  So I was able to scare up another 4GB of ram for $100, doubling my memory.
#2) And this was the biggest.  Move to the boot drive to SSD.  When I bought my macbook air, the hardware specs were less than impressive but the Fanboys raved about it’s performance.  Why?  Because of the SSD Drive.  This is how bad my MacPro had gotten – with the latest software I could not listen to audio.  It was garbled and crappy.  What the heck?  A combination of low memory and slow swap disk
really killed the systems core threads.
But after $100 memory upgrade that doubled my RAM (8GB baby) and a much more expensive $450 upgrade to a $256GB SSD drive – my machine is FASTER THAN IT HAS EVER BEEN.
It’s like I have a brand new machine.  It’s crazy.
Eventully I’m going to get one of those $5000 machines with the dual quad core processors, 16GB or RAM and most important of all a 512GB SSD drive, but for now, I’ve got $4,500 worth of performance for $550.
And now I can listen to my music again.  With enough RAM for the processors to run free, and the super snappy response of the SSD my drivers function correctly.
Wunderbar.
Scott

Coda-Coda-Coda-Chameilian

Posted by on June 12, 2011 No comments

And other bad 1980′s puns.

The real title should be

I wish my websites where this simple

Came across what appeared to be a very nifty IDE. If you are making simple relatively stand alone websites Coda is absolutely genius. It’s available through the App Store, but I bought it via download.

What makes it so slick is that it’s a bit of Komodo, Safari, CSS Edit, FileZilla, SVN and Terminal in one package. It’s super easy to flip between Editing, Previewing, Uploading and working with version control all mixed into one. It has those nice little Mac touches (brace matching doesn’t just change the color of the brace, it hits with with a radar blip animation to really draw your attention).

What’s more it updates as you work, so working with CSS, this feels like a really really solid replacement for CSS Edit.

However, for heavy duty app work – I still find myself going back to Komodo, CornerStone, and Firefox.

Why?

  1. Debugging.

    If I need to debug something, Komodo’s integrated debugger is genius and that saves me more time than anything.

  2. Code Folding.

    Komodo supports folding code in the editor so I can quickly compress classes and functions and get a quick overview of my code.

  3. Better Completion

    Coda does a great job of offering completion suggestions for standard calls, but Komodo actually scans your code and most of the time does a great job of making suggestions from the local variables, or class definitions. that makes it a lot easier to use verbose or self documenting variables names.

  4. Batch Checking, Revert, and Compare

    I might be missing something but I couldn’t find a way to submit all my changes as once. Further, I couldn’t find a way to revert to the latest version of a file and I don’t see a way to do a quick file compare. Of course Komodo doesn’t support that last one either, but Cornerstone really makes these things easy to do.

  5. console.log() isn’t good enough

    There are times you just really need a javascript debugger and the one from Apple and Firebug are both fantastic.

  6. Syntax Highlighting Gets Lost

    For historical reasons we work with large files. Coda often gets lost parsing those files and we lose syntax highlighting. That’s disappointing.

All in all if I had a simple (view php file) website that was basically HTML and CSS then Coda is fantastic. I’ll keep working with it, but it’s interesting the things you can learn working with a new tool. What I really do love about it, is that it keeps all of my Site information in one package – Terminal login (so I can check out changes on the server). FTP so I can move files back and forth.

What would really be great of all these features is if Coda would implement code folding and fix the syntax highlighting. I’ll keep running it for a while, but at $99 it’s one of my more expensive tools.

jQuery and grid960 Edit In Place Table Formatting Problems

Posted by on April 22, 2011 No comments

Because this frustrated me so much, I figured I’d put it out there.

I’m working on an Adobe AIR application using Javascript. Sorry, just can’t get into flash. And AIR is based upon Webkit (Safari).
So I’m using jQuery and I like the 960grid css framework for its simplicity.

So heres what I wanted to do. when a user clicks on a table, I want to be able to edit in place.

The Code “should” be relatively trivial.

Inside my app.js

$("#editTable td").click(editInPlace);

Now all cells, if you click on them are editable. And within the function editInPlace
I have

function editInPlace(e) {
   $(this).html("<input type='text' />");
}

That should do it, except… when I ran that, my TD‘s would DOUBLE in width. No combination of setting the cell width, or the input width would fix this. The cell would always rescale and the input would never correctly fill the table cell.

Turns out, the fix was to remove including reset.css from the style chain at the head of my document:

    <head>
    	<title>Roster Manager 2</title>
		<!-- <link rel="stylesheet" href="css/960grid/reset.css" /> this is screwing up my table formatting! -->
		<link rel="stylesheet" href="css/960grid/text.css" />
		<link rel="stylesheet" href="css/960grid/960.css" />
		<link rel="stylesheet" href="css/south-street/jquery-ui-1.8.11.custom.css" />
		<link rel="stylesheet" href="css/style.css" />
		<script type="text/javascript" src="js/jquery/jquery-1.5.1.min.js"></script>
		<script type="text/javascript" src="js/jquery/jquery-ui-1.8.11.custom.min.js"></script>
		<script type="text/javascript" src="js/app.js"></script>
    </head>

Removing that one file seemed to solve the problem. Now my input elements correctly and completely fill the table cell without causing the table to “pop” or reformat. However, there was one thing I needed from reset.css

table {
  border-collapse: collapse;
  border-spacing: 0;
}

This little bit of css gets rid of white space between the table cells.

It’s entirely possible that there is a strange interaction created by the jquery UI css, but the reset didn’t do what I expected.
Now it works as advertised.

CSS is so weird.

LastPass – and Password Card

Posted by on April 26, 2010 No comments

For quite a while I’ve used 1Password on my Mac to keep the 10,000 passwords I have to manage across all my accounts. This week I came across two tools that I’m very impressed with. The one problem with 1Password is that it doesn’t support google chrome (yet). And there’s no PC or Linux equivalent.

Well, Last Password (http://lastpass.com) is an amazing application that supports EVERY SINGLE browser I use. It stores all the information with one master password and early on I’ve been very impressed with it’s integration and utility.

The other nifty little tool I found via lifehacker.com. It’s a site called Password Card. (http://passwordcard.org). A Password card is quite clever. It’s basically a simple index card you carry in your wallet that allows you to create strong passwords and not have to remember them. How does that work?

Simple, you remember an index into the card, like square blue, or diamond green. Right now I’m playing with a triplet to recall like square white h9 or solidcircle purple v8. What does all that mean? You go to the solid circle symbol, then scan down to the purple row, and start reading off 8 characters vertically.

The reason for the 3rd option is that not all sites agree what makes a “strong” password. Some love the 8 random characters, symboles and digits, others need to see 9 before they thing a password is strong.

The genious of this system is that all you have to remember are simple things like a symbol name and a color, but the password itself is really difficult. You print the card, laminate it, and stick it in your wallet. Even if someone gets your wallet they won’t know what indexes to use to get your passwords. I’ve been using it for a few days, and so far I’ve been slowly upgrading all my passwords to “strong” passwords. It seems to work pretty well, especially with a tool like lastpass to help.

—

Update:  It’s harder than I thought it would be to remember things like color, symbol, direction count for each website.  And as good as last pass is, it can’t cover every situation.  Like desktop apps that need to login.  For example evernote, or iCal, or Mail.  Keeping track of the symbol / colors is trickier than I thought.

Adobe AIR

Posted by on March 15, 2010 No comments

Adobe AIR Getting your Application Version

I couldn’t believe how hard this was to find. If you are programming with Javascript and HTML in Adobe AIR you might want to know what version your application is (the runtime has it’s own version). If you want to get it out of the XML application descriptor then you need to parse the XML file.

Personally I hate XML. Mostly because they made the brain dead decision to allow white space BETWEEN TAGS to count as a node. I don’t know who thought that was a good idea but it makes processing XML files REALLY hard and it encourages creating unreadable files that have no formatting.

But, here’s a simple function modified to allow you to pull the application version:

/**
 * getAppVersion
 * gets the application version from the application descriptor
 * Just for the record, I hate XML.
 * @returns ver {string}    The application version as a string
 */
function getAppVersion() {
    var xmlString = air.NativeApplication.nativeApplication.applicationDescriptor;
    var appXml = new DOMParser();
    var xmlobject = appXml.parseFromString(xmlString, "text/xml");
    var root = xmlobject.getElementsByTagName('application')[0];
    var appId = root.getElementsByTagName("id")[0].firstChild.data;
    var appVersion = root.getElementsByTagName("version")[0].firstChild.data;
    var appName = root.getElementsByTagName("filename")[0].firstChild.data;
    air.trace("appId: " + appId);
    air.trace("version: " + appVersion);
    air.trace("filename: " + appName);
    return appVersion;
}

Why I like AIR

I have become enamored with Adobe AIR (http://www.adobe.com/products/air/) because it lets me leverage my web programming for the desktop.  In college a classmate of mine once postulated his theory for the “Conservation of Stupidity”.  It goes like this, there is a finite amount of ignorance we all must carry around with us for our entire lives.  In order maintain that level every time we learn something new, we have to jettison something old.  The trouble is the brain doesn’t consult with us before it dumps the old to make room for the new.

For me, that theory manifests itself when I’m learning a new programming language.  I just love my children too much to run the risk of forgetting their names so I can learn a new programming language.  In reality, the real issue is that it takes time to get good at a programming language.  And it is really annoying to have to learn a new programming tool change, process, framework just so I can apply it in a new arena (e.g. the desktop).  Enter AIR.  With AIR (in theory) I don’t need to learn anything new.  At least as far as programming languages go.

I’ve started to have some fun with WordPress plugins and my new favorite Javascript API JQuery.  I know Microsoft has some fantastic free tools, but I work on a Mac and all my websites are Linux based so no C-Sharp for me.

As for Apple, while I love my Mac, the overhead of learning CoaCoa doesn’t translate well into the web.  Of course there’s flash, but well… it’s Flash, and that too has it’s features.  But the real reason I like web programming is that modern browsers are so powerful, you can make some really sophisticated user interfaces and skin them with a few lines of Javascript, HTML and CSS.  And AIR lets me do that, but being Adobe they have a heavy preference for all things Flash and Flex.  Me, I like Javascript and PHP.  While they are supported there seems to be more examples of F/F than J/P.

So if I find something useful, I’m hoping the web crawling spider bots pick it up and share it.

– Scott

Joomla

Posted by on February 27, 2010 No comments

Okay, while I love to write about baseball, occasionally I need to write about something technical. And I just can’t seem to find a good tutorial or document for WordPress Developers trying to work with Joomla Templates. They just treat the problem so very differently.  I’m not going to waste time with the basics like CSS and HTML – and I am by no means an WP or Joomla expert. But this is what I learned.

With wordpress, you can use a combination of plugins and templates to do anything you want. Templates hold the layout, and word press php functions call various WordPress functions to load the templates up with Content.

On the plugin side, you have the notion of events you can “hook”. When WP gets so far in rendering a page, it will call one of your functions to do some additional work. A real common technique is to hook the “add_content” event with a custom function and scan the content for a key words embedded in the post or page and replace those keywords with your stuff.

Joomla behaves differently. With Joomla, templates define the layout of MODULES. Modules can appear anywhere on a page, Components can only appear in the content area of a page. Joomla uses custom tags like in the template to indicate where content will be displayed. Then, in the administrative portion of the tool, you can assign modules to the “names” or positions defined in your Template. Typically the JDOC tags are enclosed in DIV’s (overlays) that are formatted with CSS.

This gives Joomla a LOT of flexibility, but can also make it a real pain to track down where something is being rendered when you try to edit an existing template. The HTML / CSS you may need to edit most likely is NOT in the template, but in one of the Module files. But which one?
As an example, I wrote a simple Hello World template. Basically, it printed Hello Sno! whenver it was called. I had to:

  • Install it
  • Activate it.
  • Assign it to a position.

wpid-image-thumb1.w4jhN3HelpIt.jpg
The code for the plugin (1.5) was simple.
There were 6 files in the plugin and two of them were dummy stubs just to keep people from browsing the directory. It’s a nice trick.
Insert a dummy index.html in any directory you don’t want people to browse!
So the key files were:

  1. helper.php — contains helper logic.
  2. mod_sno.php — Implements module interface.
  3. mod_sno.xml — tells joomla how to load it and use it.
  4. tmpl/default.php — how to render the module data

Okay, this is a drag.  I didn’t have a code plugin for wordpress and the filtering software wiped out my original code.  I reinstalled joomla and lost my plugin.  I know I’ll need to do this again soon so I’ll try to repost the source.  But the big thing I want to capture is the idea that WordPress operates off of hooks – in the WordPress “loop”.  Joomla works differently, modules are activated and then need to be placed into an area of the template for display.

It’s amazing the free stuff on the internet

Posted by on February 18, 2010 No comments

Every year I go into this crazy programming mode getting ready for little league.  There’s some thing I see that I think, “Hey I can automate that!”  Three years ago it was the Boundary Checker.  Just enter your address and it would use google maps to tell you if you fell inside the Tempe South Little League Boundary.  Last year it was my draft application.  A stand alone web page that sorted players for the draft.  I loaned it to one coach this year and of course it crashed (sigh), but it was a nifty bit of code.  Based on Tiddlywiki – a stand alone wiki app, the Draft Tool could even save itself to your hard drive.  But to update it for each years draft you needed to be a programmer.  Not very user friendly.
wpid-draft-tool-thumb.0LIpRLax1ehQ.jpg
This year was the biggest project I’ve undertaken yet.  I created a wordpress plugin to allow coaches to log into our website and reserve their fields.  A combination of jQuery based Javascript and wordpress php libraries, it’s a pretty slick application, if I do say so myself.  I just hope it works.  I’ve tested it, but there’s nothing like users to tell you what you did wrong.  If we get through this season without too much heart burn, I’ll turn it loose to the WordPress community.  Usually though these things aren’t all that useful because they are so specific to the league you run.  As soon as you try to make it generic, that’s when it stops being a hobby and it turns into a real job.
But the main reason I wrote, this is I discovered (through one of my favorite websites lifehacker) an extremely cool tool called Jing.  (see jingproject.com).  This little screen capture tool runs on the PC or Mac and it not only lets you grab screens and annotate them – you can also grab Flash movies of you using a program and add audio as well.  This let me create a small video of how to actually use my new reservation tool.  And it only took like 2 minutes.  It’s hard to believe the “free” stuff that’s available these days.  It certainly helps guys like me give back to the communities we love so much.  I could never have done this stuff for Tempe if not for WordPress, jQuery, Google, Jing and I’m sure many other projects and teams I’ve forgotten about.
I can’t wait for the season to start.  This is going to be fun.

Zend Framework

Posted by on August 23, 2009 No comments

Okay, this little bit of  code is my attempt to give back to the Open Source community.

While there are some things I really love about the Zend_Framework.  Their documentation could be much better.  They really do a poor job of giving examples of how the options effect a given piece of code.  CakePHP does a much, much better job of showing how the options effect the outcome with examples.  One very bizarre thing I’ve noticed are people posting the exact same sample code over and over again as if it was their own.  None of it highlighting anything new.  What’s up with that?

Okay, enough whining.  If google finds this I hope it helps you.  It took me long enough to track it down and like most things, it was simple, but just not documented very well.

If you create a set of Radio Buttons with the Zend_Form_Element_Radio() class, you just might want to set a default button checked.  Here’s how you do it.

$myradio = new Zend_Form_Element_Radio(‘foo’);
$myradio->setLabel(‘Foo:’)
->addMultiOptions(array(‘v1′=>’Bar’,
‘v2′=>’Boo’,
‘v3′=>’baz’))
->setAttrib(‘class’,'coolcss’)
->setValue(‘v2′);

When you render this form in your view (maybe with a form->foo ?> call. All your options will be rendered and the radio button ‘Boo’ will be checked. That’s it. It’s that simple.

It’s not exactly obvious, but it’s simple. Why not obvious? Because check boxes in HTML are set with the attributed checked=”checked”. Setting a radio button value sets the value of the input – i.e. the value returned TO the server. It’s not necessarily obvious that setting the value of a radio controller makes it “checked”. Shame Zend didn’t stay consistent with HTML. But there it is and it works.

Happy Coding.
– Sno