Archive for the year 2009

CeeBox 2.0

Nov 2009 19 – Filed under code

I released version 2.0 of CeeBox earlier this month. On the way to 2.0, I most likely completely rewrote the thing 3–4 times as I learned new and better ways to do things. Numerous times I would be riding on my bike and suddenly have inspiration for a new solution. Other times I would just dive into another javascript tutorial and find the answer laying there.

The development of CeeBox It’s been a long road and has taken a lot more of my time than I originally anticipated, but it’s been a great learning experience. I highly recommend anyone who wants to learn more javascript  to create a plugin for their favorite framework. Personally I recommend jQuery though they all have their strengths. Tripwire magazine has a great writeup on all of the main javascript frameworks.

I just released 2.0.5 today which fixes a bug that was submitted by one of my readers (I am thankful for everyone who submits bugs) and adds the last bit of functionality I wanted to include: namely, the ability to add additional video player support (relatively) easily. This last bit was made possible by some knowledge I gained from John Resig’s awesome and simple Learning Advanced Javascript tutorial and a better grasp of regular expressions.

Anyway, I think I’m finally happy with CeeBox as it stands:

  • It’s pretty small for a script with this much functionality (12KB minimized). There are lightbox style scripts which are smaller but they have less functionality.
  • And there are lightbox style scripts that are bigger and also have less functionality
  • Really, I think it has become is one of the best full functional lightbox clone scripts out there for two main reasons:
    • The only one that tops it for support of various video sites is the mootools based mediabox advanced which is a pretty impressive plugin (though it’s 18KB). But then again additional support can be easily added to CeeBox.
    • There are few that offer galleries for videos and none that I’ve seen that make it so easy to create galleries (there is no need to add gallery names in the class or rel for every damned link, just activate the ceebox function on a parent element)

There are a couple things it can’t do which I may add later, but I don’t need them at the moment, so I’m solidly gonna take a break from adding more functionality:

  • It doesn’t currently support direct links to quicktime, wmv, or mp3 natively but you can use the public function $.fn.ceebox.popup to do that if you want.
  • A number of video players are difficult if not impossible to add native ceebox support for because of the automatic detection method I use for video embeding.
    • Daily Show (and a number of other sites) don’t include a id in the link to their video page, so I can’t automatically create the src link.
    • Flickr video does include the id, but there is no way to differentiate from the link itself which is a page with a photo and which is a page with a video. It would be fairly easy to add support for video but then it would assume every link to flickr was a video link. Clumsy to say the least.

I will continue to issue bug fixes when required, but the feature additions will slow to a trickle. Most likely I I will let it sit at 2.0.x for a while until I’m confident that every bug is squashed, and then I will promote it to 2.1.

With CeeBox wrapping up, I have a number of additional personal web projects that I’d like to get to.

  • CeeTip – a basic small tooltip that works with CeeBox. (I already have a working version of this that I use, but I’d like to rework it and release it officially)
  • CeeBox wordpress plugin – I have a half-assed CeeBox WP plugin that I use for this site, but I need to learn more php to do it right. If anyone with more WordPress plugin knowhow wants to help with this that would be great.
  • Color Animation – I have an inkling to improve the color animation plugin, as it has been sitting there stagnant since 2007. It’s got a few issues that others have submitted and could use a little improvement, but it’s been ignored by it’s creator. Supposedly the jQuery UI has better color animation support, but I don’t need the whole UI library for every project.
  • CatCubed overhaul – In the upcoming months I will be overhauling this site.

Anyways, I’m out. This post turned into something much longer than expected, but then again I’ve been working on this a while so it deserves a solid post to mark the conclusion.

Musical “That Makes Me Think Of”

Oct 2009 28 – Filed under art

Thanks to the internet (namely YouTube) and our household varied massive music libraries, myself and @maledictive were able to play an impromptu game of musical “That Makes Me Think Of” while engaged in a NifNaks felting extravaganza In order of play and marked by who played which song (myself|maledictive) here’s our evening’s set list.

Prior to the impromptu start of our game, maledictive was on an 80′s Jock Rock kick (I don’t know ask her) which led to the first song of our game…

  1. Cypress Hill “Insane in the Membrane”
  2. Cypress Hill feat. Fugees “Boom Biddy Bye Bye”
  3. Cypress Hill “Illusions (remix)”
  4. Dr Dre
  5. Outkast – “Atliens”
  6. Dr Octagon “Halfsharkalligatorhalfman”
  7. Lord of the Rhymes
  8. The Gothsicles “Hey I Got That Font”
  9. Screamin Jay Hawkins “I Put a Spell On You”
  10. Screamin Jay Hawkins “Constipation Blues”
  11. Nick Cave “Mack The Knife”
  12. Cab Calloway “Minnie the Muncher”
  13. Oingo Boingo “Minnie the Muncher” (from the Forbidden Zone)
  14. Max Reebe “Sex Bomb”
  15. Max Reebe “Mambo No. 5″
  16. Max Reebe “Tainted Love”
  17. Coil “Tainted Love”
  18. Coil “Who By Fire”

Hope you enjoy the odd set that resulted. Anyway, it’s a fun game which I highly recommend.

The Semantics of HTML5 Structural Elements

Oct 2009 15 – Filed under code

I’ve recently decided it was time to revamp catcubed.com. The design will be overhauled and it will be developed using new HTML5 structural elements. I’ve begun this process by researching the proper semantics and layout techniques for these new elements. The W3C HTML5 specs are vague in spots and this is all fairly new so there is some disagreement among the supposed “experts.” There are already a couple wordpress HTML5 templates out there, but they also differ in many ways.

What follows is the guidelines I’ve devised based on both the W3C HTML5 specs (I usually refer to the latest draft and then review any differences with the older last published version) and the collective opinions of the various “experts”—not all of whom I agree with. A list of reference links is included at the bottom of this article. I’m fairly new to all this too so I could be wrong about a few things so please let me know if you find any flaws in these guidelines.

[...]

CeeBox is now a jquery plugin

Oct 2009 06 – Filed under code

CeeBox is now a full fledged jQuery plugin. I’m pretty proud as this is the first full fledged jquery plugin I’ve ever coded.

You can download it directly from github: Ceebox 1.4 Make that CeeBox 1.4.1 (I found a small error in the minimized css file and then decided to reorganize the css file a bit to make it easier to change graphics)

Make that

If you are running CeeBox 1.3.4 and it makes you happy feel free to skip this upgrade. There is no additional functionality (though it is slightly more usable as a jquery plugin). I did however do a bit more code optimization reducing the size of the minimized version to 8.4KB which is smaller than a majority of the lightbox-like plugins out there—it’s even slightly smaller than Thickbox which this was originally inspired from.

Screenshot of it in operation (Note the next button which is the right side of the image is rolled over):

ceebox-snapshot

I am also working on making a WordPress plugin out of this. Actually I did create a basic CeeBox wordpress plugin already but it is not ready for release.

CeeBox 1.2 Upgrade

Sep 2009 14 – Filed under Uncategorized

I guess I needed to exercise the geek part of my brain after all that art recently. Last Friday and today I dove into upgrading CeeBox to 1.2. This release includes a bunch of fixes and uses the swfobject jquery plugin instead of the normal swfobject.js which allows it to be much smaller and cleaner. As a result, with the use of the jquery plugin and with the new minified version of ceebox.js it saves 13KB which is huge.

The new version supports vimeo and daily motion along with all the others it did before. Also, it allows for flexible auto sizing of the modules (video or html) based on the browser window or you can set a static base size for either.

There are also a bunch of little bug fixes and code cleanup. CeeBox may be based on a mashup of Thickbox and Videobox but most of the code is radically changed and I feel improved.

You can download the new version and find more details at: CeeBox – Thickbox/videobox mashup for jquery.

My next step with this is that I’d like to make a wordpress plugin version of ceebox. Not any time soon though.