Add the ability to select rows in a table – TableDragSelect

Screen Shot 2013-07-28 at 3.33.36 PMIn a project that I’m working on I needed to change a dialog box where users selected multiple items to accommodate multiple columns. The original dialog used a select element to display and select the items. At first I thought “Oh, this will be easy. I just add some HTML to the option elements to make them look like multiple columns and we’ll be good”. Of course nothing is ever that simple. The problem being that an option element can not contain HTML, only text. So that left me with replacing the select box with a table. The only problem with that is how do you select the rows in the table. The usual strategy is to insert a column of checkboxes to make the selections. That wasn’t acceptable in this case though as it was possible for the table to contain over 1000 items. Selecting with checkboxes would be a nightmare. What was needed was to be able to do selections in the table as you would in the select element. Dragging and selecting items and using the shift and ctrl/cmd keys to refine the selection. Auto scrolling of the list would also be nice to have. I did a search and couldn’t find any examples of anyone doing this. I did find a post on StackOverflow by August Lilleaas with some example code for selecting the cells in a table. This provided a good start on what I hoped to accomplish.

So I dove in and started chipping away at the required functions and finally got something that seemed to be pretty close to the functionality that I wanted. The shift/cmd/ctrl selection works fine as does the drag select. Auto scrolling is working but needs a little more work but is serviceable for now. So I put this out here in hopes that it will help someone else who might be looking to add this functionality to their project.

Click here to get the code on GitHub.

Automatically Compling SASS / Compass in Eclipse / Zend Studio

Recently I was tasked with figuring out how to use SASS and Compass in a project I was working on. SASS adds all kinds of new capabilities to your CSS files such as variables, nested rules, selector inheritance, and more. Compass builds upon SASS by adding some very useful libraries. To learn more about them go to:

http://sass-lang.com/

http://compass-style.org/

In the project I’m working on we happen to use the Zend Studio which is built on the Eclipse IDE. Normally when working with SASS / Compass you need to open a terminal window and enter a command to “watch” your .scss files. That way when a file changed it would automatically compile it into a .css file. Being lazy by nature I didn’t like the idea of having to open a separate terminal window in addition to launching the IDE to do compile the files so I figured I should be able use Ant to handle this task. It took a bit of research and some fiddling but I finally figured it out. Now every time I change one of my .scss files it is automatically compiled into a .css file. I’m a happy camper! Continue reading

Minecraft: Multiverse Core Plugin Commands

In my last post I talked about how I installed the CraftBukkit server with the Multiverse (core, portal, nether, and sign) and PermissionBukkit plugins. Once all that is up and running you need to know the commands use the features of the new plugins. I’m going go over what I think are the most important Multiverse Core commands you’ll need to know to allow you to add and modify worlds on your new server. All this information is available on the Multiverse Core Wiki. I just wanted to cover it here so I could add my own notes. In the next post I’ll go over the commands for the Multiverse Portal plugin and show how to create portals in your worlds. Continue reading

Minecraft Multi-World Server Setup

I’ve gotten into playing Minecraft a bit lately. It’s a fun little diversion. I tend to like the digging and exploring. My wife how ever is completely hooked. She loves building entire towns and all kinds of elaborate buildings. I don’t really get into the building much myself. She did want to play the game with our grandson so we setup and Minecraft server on her computer. It was kind of fun to be in the world with other people in it. The one thing that bothered me was that they kept changing worlds or the game mode. I like playing the game in peaceful mode so I don’t have to deal with bad guys. What we really needed was to be able to have a server that could serve up multiple worlds so there was something for everyone.

Being a good computer nerd I liked the idea of setting up a server. I looked around figuring that someone had created the software I wanted and sure enough they had. I found the CraftBukkit server with the Multiverse plugins which was just what I was looking for. I’ve been playing with the server setup on my local system to get everything worked out before moving it to my wife’s computer, replacing the standard Minecraft server. It took me a little while to figure out how the server and plugins all work together so I decided to write these instructions to help out others who want to setup a similar system. It will also help me six months from now when I will have completely forgotten how it all works.

I did my work on a Mac OS X system. The steps should be pretty much the same for a Linux system. There will be differences running it under Windows especially in getting Java installed and setup but hopefully these instructions will be of some help there as well.

So without further ado here’s the steps I followed to put this all together.

Continue reading

MagWords – A fun little jQuery exercise

I present to you, MagWords. A fun little diversion based on the magnetic word puzzles that are found sticking to many refrigerators around the world. This started as a little exercise to learn more about Javascript drag & drop functionality. It started out being written using the Scriptaculous / Prototype libraries and then migrated to Yahoo YUI libraries. Recently, for some unknown reason I was inspired to rewrite it using jQuery. I think it’s finally run it’s course so I’m putting it out in the world to so others might have some fun with it. I’ve created a MagWords demo page where you can also download the source code. Have fun with it. If you do anything interesting with it please let me know.

MagWords Demo Page and sourcecode

Obi + Google Voice = Great Inexpensive Phone Service

Obi product imageI was recently watching Techzilla (my lunch time tech fix) and they reviewed the Obi from Obihai. The Obi unit allows you to make calls over the Internet. You connect it to the Internet via your home router and plug in a regular old analog phone and you’re ready to make calls to other Obi users for free. You do need to setup a free account on the Obihai website. Just that functionality alone is pretty cool, but it gets better. You can also connect the Obi unit to your Google Voice account and make and receive calls via your Google Voice number. Plus Google is offering free long distance calls in the US and Canada through the end of 2011. They did this last year as well and the extended it through 2011. I’m hoping that they’ll extend the free calling once again. Even if they don’t I suspect the calls will only be about $.01/minute which is still pretty cheap.

It took me about 15 minutes to setup. Nothing too complicated. They have pretty good step-by-step instructions on the Obihai website. Once done I tried calling my Google voice number which worked fine. I then place a call from the phone attached to the Obi unit and it worked as well. New phone setup in under 30 minutes. One thing to note is that the Obi unit does not support 911 calls.

There are two Obi units available, the 100 and the 110. The only difference is that the 110 adds a port to connect an existing land line if you have one so that calls from Google Voice as well as you land line will ring through to your phone. The price of the Obi 100 on Amazon is $43.99 and the Obi 110 is $49.99. Given that it’s only a $6.00 difference I went with the Obi 110.

So, if you want to get rid of your land line, add a business line, or just add another line in your house, the Obi might be just what you’re looking for.

Post Ender – A Simple WordPress Plugin Framework

Update: When trying to add the Post Footer plugin the WordPress repository I discovered that name was already taken. So Post Footer has now been renamed Post Ender.

Post Ender is now available  at in the WP.org plugin repository

As they say, necessity is the mother of invention. In one of our recent meetings for the SportsDashboards project it was decided that we wanted to add some text at the bottom of each post on the Sports Stories blog with information about SportsDashboards. I knew there I could probably find a plugin to do this out in WordPress land but it seemed easy enough and I’ve been wanting to write a plugin for a while now. So I set out to do just that.

More than just write a plugin, I wanted to create a simple framework for creating other plugins. Nothing too fancy, just a class-based structure that I could use for any plugins I wanted to write. I’ve wanted to do this project for quite a while now but never got around to it. Now I had a real task that needed to be done so it was time to tackle plugins. I’ve looked around at a variety of plugins to see how they were written and there didn’t seem to be any standard way of structuring a plugin. Most seem to be just a bunch of PHP functions in a file. Functional, but not very pretty or maintainable in anything but a very simple plugin. The plugin I need would be a very simple one so I could have just put together a few PHP functions and saved myself a lot of time but I this was the opportunity to create the framework I was thinking about and to learn more about writing plugins.

I did do a search for WP plugin frameworks and found a few interesting ones but they all seemed to add more bells and whistles than I wanted. So the Post Footer plugin was born. Post Footer does one thing. It adds text to the bottom of every post. Oh, I did add a few lines of code for a [post_footer] shortcode in case someone wanted to add the text to individual posts.

The main idea is to separate the code into sections: common code, admin code, and front-end code. I saw this technique in another plug that I ran across but I unfortunately can’t remember which one  it is to be able to give credit where credit is due. The main file looks like this:

if ( !class_exists("PostFooter") ) {
    class PostFooter {

        function PostFooter() {
            <-- constructor code goes here -->
        } end PostFooter

        function init() {
            if ( is_admin () ) {
                // Load the admin page code
                if ( @include ( dirname ( __FILE__ ) . '/inc/admin.php' ) ) {
                    $PostFooterAdmin = new PostFooterAdmin ();
                } else {
                    PostFooter::deactivate_and_die ( dirname ( __FILE__ ) . '/inc/admin.php' );
                }
            } else {
                // Load the frontend code
                if ( @include ( dirname ( __FILE__ ) . '/inc/frontend.php' ) ) {
                    $PostFooterFrontend = new PostFooterFrontend ();
                } else {
                    PostFooter::deactivate_and_die ( dirname ( __FILE__ ) . '/inc/frontend.php' );
                }
            }
        } // end init

    } // end PostFooter class

}

As you can see there is logic in the init function to look at how the plugin is being called and load either the code to display the admin page or the front-end code for adding the text to the posts. The options page, which is mostly HTML is also broken out into a separate file to make it easier to maintain.

The code to add the text to each post was made easier by similar code in the book “Smashing WordPress: Beyond the Blog” by Thord Daniel Hedengren. The plugin example in the book shows code to add text at the end on each post using a template tag. It was pretty simple to change that to either use a shortcode tag or an option on the options page.

So there you have the Post Footer plugin. It was fun to write and hopefully it might be a helpful example to someone else trying to write there first plugin. You can find more information and download the code here. Sometime soon I hope to have this pushed out to the WordPress.org plugins directory so you can install it directly from there.

Happy Coding!

Plays Well With Others

Communicating, sharing and staying organized in the virtual work environment

“You can discover more about a person in an hour of play than in a year of conversation.”

– Plato

Working from home can be a mixed blessing. For the most part it’s great. Your commute is measured in steps rather than miles saving probably an hour a day, not to mention the price of gas and wear and tear on your car.  You can work in your pajamas if you’d like (assuming you don’t use video conferencing in which case you probably should put on a nicer shirt and make sure your hair is combed).

On the down side you’re all alone at home.  It’s easy to get distracted with chores around the house. But most of all, for me at least, is a sense of isolation. You can’t yell across the cubicle wall when you have a question.

These days our work requires new tools to be able to e able to collaborate effectively with others, especially if you’re working from home or working in a distributed environment. We’ll take a look at some of the best tools that I’ve found for communication, sharing and organization and hopefully start a discussion about other great tools. Continue reading

My New Project: RCA Victor New Orthophonic High Fidelity Model SHF-3

For a while now I thought it would be fun to find some sort of old tube amp to work on. I’ve been looking in local thrift shops and estate sales but so far nothing of interest has shown up. Last Friday as I was taking my daily walk I was passing by a house and noticed that they were putting items out on the driveway for a garage sale. I didn’t think to much of this at first as I see this sight almost every Friday but this time one item caught my eye. It was a cabinet that looked like it was from the 1950′s and looked like it might be a stereo system. I went over and took a look and sure enough it was a old RCA Orthophonic HiFi system and it looked to be in very good condition. I asked the fellow selling it how much he wanted to which he replied $50. I offered $30 and we agreed on $40. He said the unit worked the last time he turned it on but had a loud hum. He then started showing my some old records that he had. There were about a dozen records stored each in it own sleeve in contained in a larger album. The album holding the records was falling apart but the records themselves seemed to be in pretty good shape. I didn’t recognize most of the music on them but these were those wonderful old thick vinyl records. I realized that they just had to stay with the cabinet so I offered $50 for the all of it which he agreed to. So I stopped at the market on my way home to pick up a sandwich for lunch and some cash for my purchase and went back after lunch to pick up my new project. It fit nicely in my Subaru Forester which I took as a sign that it was meant to be. Continue reading

Speaker Repair Project

Many years ago I picked up a pair of speakers at a flea market. I don’t remember how much they were but since I probably didn’t have much money back then I’m guessing they had to be under $10. They were good solid cabinets but the drivers were way beyond repair. This seemed like a fun project and a cheap way to get  some new speakers so I proceeded to pickup new 8″ woofers and a couple of piezo tweeters from Radio Shack (back when they still used to sell all kinds of cool electronic parts). I swapped out the old drivers with the new and had a fairly nice sounding pair of speakers. They were my main speakers for quite a while and finally got moved to my surround speakers (replaced with a pair of Bose AM5′s which I’d really like to retire). They’ve severed me well for the past 25 years or so.

A couple of months ago I started hearing strange buzzing noises coming from the surround speakers while watching movies. A few weeks ago I finally got around to investigating the noise and found the foam surrounds on the woofers had completely disintegrated, hence the unsavory sounds. Time to replace the drivers again. I had recently been introduced to Parts Express which has a great selection of parts for building (or re-building) speakers. I found some likely replacement candidates for the existing drivers. I decided to replace the tweeters as well even though they were still working well. I pulled out the old Radio Shack drivers, put in the new ones and once again I have a pretty good sounding pair of speakers. Ready for another 25 years of use.

At some point in the not to distant future I’d like to replace all the speakers in our living room. I’m currently considering the Intimus speakers from Aperion Audio. These look like they’re solidly build (kind of like my flea market boxes), the price is right and they’ve gotten very good reviews. At that point I’m thinking I’ll move the newly re-built speakers into my office where they can live on.

JS1K Contest Winners

This was just too cool. JS1K is a contest to see what Javascript programmers can do with 1K of code (that’s a measly 1024 bytes). I must say that some of these demos are pretty amazing. It reminds of the Apple II days and the Beagle Brothers 1-liners (1 line of Applesoft BASIC) they put in their ads. I used to love typing those in just to see what they would do. The JS1K home page list the top ten winners of the contest but you can check out all the submissions on the demos page.

It’s great to see such creativity and what can be done with a little bit of code and a lot of imagination.

Audio Nirvana

Today I ran a across a couple of interesting articles about audio. The first was on C|Net titled One man, two ears, and $50K worth of headphones. It talks about a guy named Wayne McManus that goes around collecting classic high-end headphones. These days earbud still seem to rule but I’m seeing more and more people using heading phones attached to their iPods. Headphones give a much better musical experience so I’m glad to see more people discovering that.

The other audio related article was in the Press Democrat (our local Sonoma County newspaper) titled Heroes of Hi-Fi. It’s about Mobile Fidelity Sound Lab which happens to be located in Sebastopol. I had thought they went out of business a few years ago so I was glad to see they’re still around. Since the ’70′s they’ve been re-mastering some classic albums from the original tapes and creating records and CD’s that are much better quality than the record companies are putting out. As will earbuds, in these days were compressed MP3 rule it’s nice to see that someone still cares about creating good high-quality records and CD’s. Personally, if I’m going to buy music I will usually purchase the CD so I have the best quality I can get. I can then create MP3 or FLAC tracks if I want or even and have complete control over the resulting quality. Buying the CD usually only costs a dollar or two more than purchasing the album on iTunes so it seems silly not to pay a little extra for the better product.

Getting back to Mobile Fidelity, they are some great albums available on both vinyl and CD. You can check out their catalog here. I was thrilled to see that they are releasing one of my all-time favorite live albums Waiting for Columbus by Little Feat. If you haven’t heard this one do yourself a favor and check it out!

Why do we still have signal bars on cell phones?

In TWiT 255: You’re Holding It Wrong they had an interesting discussion about the antenna issues with the iPhone 4. They pointed out that most all cell phones have issues with reception if you hold the phone certain ways. The iPhone just happens to have made the place not to hold the phone more visible. Cell phones need antennas and unless you want to go back to the days of pull-up antennas this is just a fact of life. Granted Apple probably could have given a bit more thought into the placement of the antenna but frankly given the size of the device they don’t really have many choices of were to put the darn thing.

One thing I found particularly interesting in this podcast was a point that Jerry Pournelle made about why we even have bars to represent signal strength on phones anymore. It made sense back when phones used analog signals and the quality of the call would go down if you had a bad signal. Today with most all phones being digital this doesn’t make sense. With a digital signal it either works or it doesn’t. You can either make a call or you can’t. The signal strength shouldn’t affect the quality of the call. You call may be dropped if the signal gets too low but the quality shouldn’t change. Is this just a hold over from the analog days or is there really some reason for these bar besides the fact that the marketing people like them?