http://digitalsandbox.net/index.php/site/index/ Blog Entries en kory@digitalsandbox.net Copyright 2009 2009-11-11T18:13:51+00:00 http://digitalsandbox.net/index.php/blog/post/theres_a_new_section_in_town/ http://digitalsandbox.net/index.php/blog/post/theres_a_new_section_in_town/#When:19:13:51Z Some of you may have noticed a new item in the navigation of the site. I added a new section to track my little projects, which should not be confused with freelance/design projects. This is where I’m going to house some downloadable stuff like my jQuery Syntax Mode for Coda and the Form Maker Plugin for Coda. Actually, right now those are the only things in there, but I have some other ideas (for Coda again). The new section will allow me to consolidate all those items and offer a single link to access the latest versions of those projects, while still providing links to the old versions. So if you’ve come here looking for one of those items you’ll want to head over to the Projects section and get what you need there. Site News 2009-11-11T19:13:51+00:00 http://digitalsandbox.net/index.php/blog/post/sorry_for_the_errors/ http://digitalsandbox.net/index.php/blog/post/sorry_for_the_errors/#When:17:48:18Z Just wanted to apologize to anyone who has come to the site in the last few days to find errors or (even worse) missing Coda plugin downloads. The errors should be corrected and the downloads should now work. I had some issues with the latest Expression Engine update (my fault not theirs). Regardless, the issues should be fixed now. Please try the downloads again. Thanks. Site News 2009-10-07T17:48:18+00:00 http://digitalsandbox.net/index.php/blog/post/multiple_itunes_libraries_one_source/ http://digitalsandbox.net/index.php/blog/post/multiple_itunes_libraries_one_source/#When:17:36:06Z When I bought my Mac Pro, the old Mini became a designated Home Theater PC (HTPC). Ever since then I have struggled to figure out how to maintain the libraries in multiple locations. The Mini didn’t have a large drive (only 80 GB) so I focused on using it for movies. The Pro had 250GB so it housed the music, but only some videos since I don’t watch movies on the computer screen anymore. This naturally meant that the two had some overlap but a lot of differences. The goal was always to buy a larger drive and house everything in one location and, if possible, keep the libraries in sync. I recently bought a 1.5TB hard drive for the Pro and am in the process of setting up my media center. Here is the solution that I have come up with so far. It’s not perfect, but it’s pretty good and it works well. This Doesn’t Work The first thing I tried was setting up the iTunes library on the Pro and then telling the Mini to use that same Library as it’s library. This works in some ways, but not in some very annoying ways. It was nice because everything I added to the Pro was available instantly on the Mini. Playlists and Playcounts were always in sync. If this worked better it would be a perfect solution. Alas, there are some significant drawbacks. The biggest one is that you can’t be using iTunes on the Mini and the Pro at the same time. Whichever computer has it opened locks the library file so that no one else can edit it. Since the goal is to basically leave iTunes always running on the Mini, that means that you can’t use iTunes on the Pro. Ever. So a different solution is required. Here’s What I’m Doing The solution that I came up with is to establish the Pro (since it houses the drive and is the main computer in the house) as the official iTunes library. I set it up to copy the files into it’s directory structure and keep the files organized in the Preferences. I also made sure that it never sleeps. Since I am using it as a home server this isn’t an issue, but those wishing to try this should be aware of that point. The Mini has it’s own library but it doesn’t copy files or keep the files organized. Then I added the files in the Pro’s iTunes library folder to Mini’s library. Viola! Now I have both libraries accessing only one set of files. The caveat is that anytime I add new files to the Pro I have to tell the Mini to get them as well. I have found that simply copying the Pro’s library files (everything except the iTunes Music folder) to the Mini works fine and is much faster than adding the iTunes Music folder back to the Mini and letting it process everything. THe downside to this arrangement is that playcounts and playlist don’t stay in sync. But this is far from a deal breaker compared to the issues I had doing it the other way. There are several programs that claim to sync your libraries. Most of them seem to focus on syncing your files however and since that not what I need I continue to look for something to sync playcounts and playlists. I am surprised that Apple hasn’t really addressed this issue. Most homes are getting multiple computers now. I have 3 now in my house. They need to create a specific app to address this situation. An iTunes Server app would be perfect. something that maintains a master library that all iTunes Clients pull from and post to. I would even be willing to pay for an app like that. So there you have it. Not a perfect solution, but one that is certainly usable. Just to demystify the setup a little bit more. The Pro and the Mini are both wired so there aren’t any issues from pulling the content across the network like that. I am ripping most things in Apple TV format, but some of the kids stuff is just iPod Hi-Res using Handbrake. And yes, 1.5Tb is a ridiculous amount of storage. I’m down to 1.38TB available and I have about 85 movies, a ton of TV shows and over 9GB of music. I LOVE IT! Tech 2009-07-28T17:36:06+00:00 http://digitalsandbox.net/index.php/blog/post/facebookin_it/ http://digitalsandbox.net/index.php/blog/post/facebookin_it/#When:18:01:27Z Well, I resisted this as long as I could, but I finally broke down and joined Facebook. No real reason other than I didn’t see much appeal in the whole social networking thing. I was on LinkedIn and could understand the utility in that, but Facebook, MySpace, and the rest seemed like a duplication of effort to me. I have this site and don’t update it as often as I should, how can I find the time to post stuff to Facebook as well. I guess the clincher was the option to track down some old friends that I’ve lost touch with and because my sister was constantly pestering me to join (which now that I have she has yet to friend me <hmmmph>). So if your interested my profile is here: http://www.facebook.com/garner.kory. I plan to use it mostly to connect with old friends and such so please don’t be offended if I don’t add every invite I get. Randomness 2009-07-16T18:01:27+00:00 http://digitalsandbox.net/index.php/blog/post/form_maker_plugin_for_coda/ http://digitalsandbox.net/index.php/blog/post/form_maker_plugin_for_coda/#When:17:03:27Z I have moved this to a new section so that all future updates can be tracked together. The new section is here. You will need to visit the new section to download the files. This post will remain, but if you link to this page, please update your link to the new seciton. Thanks. One of the things I hate doing is creating forms. Sadly, most webapps use them pretty heavily so not doing them isn’t really an option. What I can do is create a plug-in for Coda to do all the heavy lifting for me. Without further foreshadowing, I give you…the Form Maker Plug-in for Coda. Download & Install To get the full effect you will need to download several components. First and foremost, you will need the Form Maker plug-in. This is the main plug-in file and will do all the heavy lifting of creating your form elements. There is also a small clipping group that I use for opening and ending the form tags and starting fieldsets. Why didn’t I include this in the plug-in? Because there are many times that I am working on an existing form and need to add a new field. Having the plug-in create an entire new form isn’t as useful as the ability to create elements quickly. And finally, there is a CSS file that handles some very basic formatting to get the form working okay. You can customize this to your heart’s content, but this helps get things laid out so you don’t have to recreate everything. It also declares a few classes that you can assign to the form to change the lay-out quickly (I’ll explain more later). You’re welcome. Get the entire bundle here: FormMaker.zip Download and unzip that and then put the Form Maker.codaplugin file in your ~/Library/Application Suport/Coda/Plug-ins folder. Open Coda and you will see the Form Maker option in the Plug-ins Menu. While you have Coda open, open the Clips panel and import the clips into it. I’ll outline these further in the instructions. The CSS file you can store wherever you wish. but keep it handy for including in your projects. Usage Instructions So now you are ready to make a form. Open up your HTML document and make sure you include the forms.css file in the <head>. Now go and type form and hit the tab key. You have now started your form with a new fieldset and legend. Your cursor is in the <legend> tag so you can name it whatever you like. You can end your form by typing /form and hitting the tab key. This will insert a submit button and close the form nicely. Your form should look something like this: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Form Maker Plug-in Tutorial</title> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <link href="forms.css" media="screen" rel="stylesheet" type="text/css" /> </head> <body> <form action="" class="form"> <fieldset> <legend><span>Text Fields</span></legend> </fieldset> <dl> <dt><label> </label></dt> <dd><input class="button" type="submit" name="" value="Submit" id="submit" /></dd> </dl> </fieldset> </form> </body> </html>   Now comes the fun part. Start typing the labels of the fields you will need. The only real caveat is that you need to start with no leading tabs. So it will look something like this: <form action="" class="form"> <fieldset> <legend><span>Text Fields</span></legend> First Name Last Name </fieldset> <dl> <dt><label> </label></dt> <dd><input class="button" type="submit" name="" value="Submit" id="submit" /></dd> </dl> </fieldset> </form>   So let’s take a look at the different types of elements and the options the Form Maker plug-in has for them. Text Fields & Textareas These are pretty basic. Type in the label name, select it and hit ⌃T to create text fields or hit ⌃A to create Textareas. The only option is whether or not the filed is required. If it is, add an asterisk to the front like this: First Name *Last Name Select Fields These require a label on the first line and the contents are below preceded by a tab. Select the whole batch and hit ⌃S. These are the special options for <select>s Including an asterisk on the first line marks it as a required field. An asterisk on a content line makes that one selected by default. You can create <optgroup>s by preceding the title with a hyphen. Here’s an example: *Select Label -Optgroup 1 Option 1 Option 2 *Option 3 -Optgroup 2 Option 1 Option 2 Option 3 Another Label Option 1 Option 2 Option 3   Radio Buttons & Checkboxes These are formatted somewhat similarly to <select>s with a label and then tabbed options underneath. Again, an asterisk on the label will make it required and an asterisk on an option makes it checked. Select the block and hit ⌃R for radio buttons and ⌃C for checkboxes. Type it out as follows: *Radio Buttons Yes No *Maybe Checkboxes Option 1 Option 2 Option 3   The Magic Stylesheet So here’s why you care about the included stylesheet. with the change of a class you can alter the layout and flow of the form. The default is class=“form” which produces a vertical flowing layout with the label right-aligned and next to the input field. Changing it to class=“form-h1” makes it flow horizontally with the labels above the input fields. class=“form-h2” is also horizontal but the labels are now next to the input fields. If you like the vertical flow then class=“form-v1” is a vertical flow with the labels above the input fields. class=“form-v2” is like the default layout except the labels are left-aligned. So a simple class change will totally alter the layout without any effort on your part. About the Markup Astute observers will note that the markup is not exactly what you would expect. Each element is wrapped in a <dl> with the <label> inside the <dt> and the <input> inside the <dd>. This method of marking up form elements was not mine. It is the system we use for creating forms here at work. I happen to like it and I wrote the plug-in to help at work so I am releasing it as is. If you have a different method of marking up your forms and know a little PHP you can easily modify the plug-in scripts to mark it up as you like. Just download the Coda Plug-in Creator and open the plug-in. Web Design 2009-06-22T17:03:27+00:00 http://digitalsandbox.net/index.php/blog/post/jquery_syntax_mode_for_coda/ http://digitalsandbox.net/index.php/blog/post/jquery_syntax_mode_for_coda/#When:15:54:03Z I have moved this to a new section so that all future updates can be tracked together. The new section is here. You will need to visit the new section to download the files. This post will remain, but if you link to this page, please update your link to the new seciton. Thanks. I have been using jQuery a lot more now with my new job and the lack of a good syntax mode with autocomplete for Coda was getting on my nerves. I Googled around for one and came up short. The closest I found was a document that you placed inside the standard Javascript syntax mode. I wasn’t crazy about this as I didn’t know what would happen when Coda updated. And the instructions provided didn’t seem to work anymore. So I decided to scratch my own itch and create one. I tried to create a custom syntax mode for jQuery only (and just pull in the existing Javascript stuff), but due to the way that syntax modes work in Coda I had to include everything from the Javascript mode. This allows us to still have access to the regular Javascript functions along with all of our jQuery goodness. I have also included some clips to compliment the syntax mode. I want to stress that this is only a first pass at this and I am already working on an updated version that will handle more functions and keywords. Here’s the file: Coda jQuery Syntax Mode Instructions So here’s what you have to do. Download the .zip file above and place the jQuery.mode folder in your ~/Library/Application Support/Coda/Modes folder. Open up Coda and bring up the Clips palette (⌃⌘C). Right-click the palette and select ‘Import Group…’ Find the jQuery.clips file and import it. Now go to your Preferences in Coda and open up the Editor tab. In the Custom Syntax Modes, click the + and type js for File Extension and select jQuery for the Syntax Mode. Now open up a .js file in Coda and start typing, marvel as jQuery functions appear as suggestions for what you are typing. If you want to use the jQuery mode for inline Javascripting (and who wouldn’t) there is — sadly — a small hack that you have to perform. Find Coda in your Applications folder and right-click it. Select Show Package Contents and navigate to Contents > Resources > Modes. Find the mode that you use when you are doing inline Javascripting (likely PHP-HTML.mode or HTML.mode) and open the Contents > Resources > SyntaxDefinition.xml file. Make a back up of this file before you open it. Do a search ‘Javascript’ and replace it with ‘jQuery’. I wouldn’t recommend a blind find/replace. Instead do the search and replace every instance of Javascript that is associated with a ‘usesymbolsfrom’, ‘useautocompletefrom’, or an import command. Most likely that will be all of them, but better safe than sorry. Save your changes and open Coda (or relaunch it if you had it open during this edit). Now your inline Javascripting will have the same autocomplete goodness as a .js file. SEEStyles If you are using a custom SEEStyle for Javascript you will notice that your new jQuery mode is not looking so hot. This is easily remedied with a few steps. In Coda, open your Preferences and go to the Colors tab. Export the Javascript theme, open that file in Coda, and replace Javascript with jQuery (blind find/replace is okay on this one). If you did the inline customization, export that file as well, but replace only those instances where it looks something like /Javascript/Keywords (e.g. in the PHP-HTML mode there is one reference that says ‘Inline Javascript’ that is okay to leave as is). Save your new SEEStyles and then import them back into Coda. Things should be looking a lot better now. Notes and Plans I had hoped to make the mode behave like the PHP syntax mode. In that mode, when you select the function from the suggestion list, Coda places some suggestions as to what you need to include inside the parentheses. This is all pre-selected for you, so it clears out when you hit delete or start typing your own values, but these are very handy when you don’t remember if you need to pass in a string or an integer. Sadly, after working with Will Cosgrove from Panic (thanks again Will) I learned that PHP is a special case and you can’t do that in other modes. He did say that Coda 2.0 will have enhanced abilities for syntax modes, so there’s something to look forward to. I am thinking of just adding these hints into the autocomplete anyway, even if they aren’t preselected. If you have an opinion on the matter I would love to hear it. As I said before, this is not a comprehensive list of every jQuery function known to man. I plan to add more functions and options in future versions, but I would love your feedback. If there is a particular function you don’t see let me know and I’ll get it into the next release. Any other suggestions as to how to improve this are welcome as well. Clips All the clips that I included in the bundle have tab-triggers. Below is a list of what they are and what they do. ready+tab: $(function() {/*place jQuery actions here*/}); $+tab: $(’‘) this+tab: $(this) func+tab: function() {} Web Design 2009-05-15T15:54:03+00:00 http://digitalsandbox.net/index.php/blog/post/a_much_needed_update/ http://digitalsandbox.net/index.php/blog/post/a_much_needed_update/#When:15:34:55Z So it has been a very long while since my last update. I apologize for that. I have been a bit busy with things in real life and finding time to write a post on here has not been high on my list of priorities. So let me take a minute to fill you in on what has happened. As I mentioned in my last post, I was laid off, but that is no longer true as I now have a new full-time job. I am now an Interaction Designer for the LDS Church. This is really exciting for me as it is something I have wanted to do for a while now. I am loving the experience and am so happy things have worked out. This is a fantastic team to be a part of and I feel like I am finally in the right place. Other than that, it has been pretty standard. Life keeps me busy and things continue to move along. I will try to get back to more regular posting. I have some pretty good stuff to share here soon. Randomness 2009-05-06T15:34:55+00:00 http://digitalsandbox.net/index.php/blog/post/signs_of_the_times/ http://digitalsandbox.net/index.php/blog/post/signs_of_the_times/#When:15:55:06Z Well, I guess the economy has finally caught up to me as well. I was laid off last week. I am now looking for a new job. Now that I am <gulp> unemployed, the waiting is really hard. Well, I better get back to job hunting. If anyone out there is interested, here’s my résumé. Randomness 2009-02-11T15:55:06+00:00 http://digitalsandbox.net/index.php/blog/post/economic_analogy/ http://digitalsandbox.net/index.php/blog/post/economic_analogy/#When:18:13:50Z I was thinking about our current economic situation yesterday and the proposed plans for solving the issue when an analogy of the situation’s absurdity came to mind. Do you remember the old Winnie the Pooh cartoon where he ate too much honey at Rabbit’s house and got stuck trying to leave? Well, our economy is Winnie the Pooh and it is stuck in a bad way. But rather than going on a diet and losing a few components of the economy that are causing problems, we are force-feeding the poor guy in the hopes that he will somehow unstick himself. I know that putting the economy on a diet is a painful choice, but propping up failing industries is only going to hurt us worse in the long run. Sorry for the political post. I just had this thought yesterday and thought it was worth sharing. Randomness 2009-01-29T18:13:50+00:00 http://digitalsandbox.net/index.php/blog/post/the_problem_with_enterprise_software/ http://digitalsandbox.net/index.php/blog/post/the_problem_with_enterprise_software/#When:18:01:41Z At work I have been working on a project where we are attempting to bring our client’s old terminal green screen system into the age of GUI goodness. We have been working on this project now for over a year, if you include all the planning and prototyping. The system is complex and every time we review the functionality with the client there are changes. The programs functionality has become a moving target that changes with each subsequent meeting. A multi-million dollar project and we’re doing it all wrong. This is, sadly, the way too many businesses operate. At one point they adopted a program that met their needs and performed the tasks required. Over time the company’s needs changed and evolved, and so did the program. It has been cobbled together by a collection of technologies that have been cajoled (or coerced) into working together. At some point they realize that the system needs to be updated and they decide to make the change. And here is where they go wrong. They decide that they are going to modernize their old system. That is to say, they are going to convert their old processes into a new interface. The old system is now the master. Frankenstein’s monster is calling the shots. A program that has been adapted to perform tasks it was not intended to do, is now the blueprint for how those tasks are carried out. Rather than evaluate whether their processes can be simplified, streamlined, or even eliminated, they look at how they do it currently and say, “make the new system follow this path.” When you step back and look at it, the idea is shear lunacy. Why not take the opportunity to remove the cruft and junk in the system? The reason is simple. Inertia. There is too much inertia at this point to change the way things are done. They have branches all over the place. Thousands of employees. There is too much invested in the current regime to alter the course. Companies, as a rule, are change-phobic. It scares them and makes them nervous. To accept that kind of change takes guts and vision. Sadly, many companies lack the guts even if they might have the vision. General Design 2009-01-27T18:01:41+00:00