Lazy Image Loading in JavaScript with jQuery
By Steph Skardal
March 18, 2011
This week I had a duh moment while working on a little jQuery-driven interface for a side hobby.
I’ve occasionally used or attempted to do image preloading in JavaScript, jQuery, and YUI. Preloading images happens after a page is loaded: follow-up image requests are made for images that may be needed, such as hover images, larger sizes of thumbnail images on the page, or images below the fold that do not need to load at page request time. Adobe Fireworks spits out this code for preloading images, which is a bit gross because the JavaScript is typically inline and it doesn’t take advantage of common JavaScript libraries. But this is probably acceptable for standalone HTML files that get moved between various locations during design iterations.
<body onload="MM_preloadImages('/images/some_image.png','/images/some_other_image.png')">
I found many examples of preloading images with jQuery that look something like this:
jQuery.preloadImages = function()
{
for(var i = 0; i<arguments.length; i++)
{
jQuery("<img>").attr("src", arguments[i]);
}
}
I implemented this method, but in my code the preloading was happening …
javascript jquery
Liquid Galaxy Project in GSoC 2011!
By Benjamin Goldstein
March 18, 2011
We’re very happy to announce The Liquid Galaxy Project has been accepted as a Mentoring Organization for the Google Summer of Code (GSoC) Program!
Talented students interested in Liquid Galaxy, panoramic systems, and the opportunity to be paid a stipend of $5000 by Google to develop and enhance open source code should go to the project’s Ideas Page and make a proposal to the project for review:
http://code.google.com/p/liquid-galaxy/wiki/GSoC2011
We look forward to student submissions on these exciting projects that will make Liquid Galaxy an even more impressive system, including:
- Controlling Liquid Galaxy with novel input devices like a Wiimote, Android phone, or Kinect
- Patching other open-source software enabling multi-system panoramic display
- Production of panoramic video, audio, and photography
- Your own innovative idea!
visionport
Product Personalization for Ecommerce on Interchange with Scene7
By Steph Skardal
March 15, 2011
One of the more challenging yet rewarding projects Richard Templet and I have worked on over the past year has been an ecommerce product personalization project with Paper Source. I haven’t blogged about it much, but wanted to write about the technical challenges of the project in addition to shamelessly self-promote (a bit).
Personalize this and many other products at Paper Source.
Paper Source runs on Interchange and relies heavily on JavaScript and jQuery on the customer-facing side of the site. The “personalization” project allows you to personalize Paper Source products like wedding invitations, holiday cards, stationery, and business cards and displays the dynamic product images with personalized user data on the fly using Adobe’s Scene7. The image requests are made to an external location, so our application does not need to run Java to render these dynamic personalized product images.
Technical Challenge #1: Complex Data Model
To say the data model is complex is a bit of an understatement. Here’s a “blurry” vision of the data model for tables driving this project. The tables from this project have begun to exceed the number of Interchange core tables.
A snapshot of the …
ecommerce interchange
Google 2-factor authentication
By Jon Jensen
March 14, 2011
About a month ago, Google made available to all users their new 2-factor authentication, which they call 2-step authentication. In addition to the customary username and password, this optional new feature requires that you enter a 6-digit number that changes every 30 seconds, generated by the Google Authenticator app on your Android, BlackBerry, or iPhone. The app looks like this:
This was straightforward to set up and has worked well for me in the past month. It would thwart bad guys who intercept your password in most cases. It would also lock you out of your Google account if you lose your phone and your emergency scratch codes. :)
I was happy to see this is all based on some open standards under development, and Google has made this even more useful by releasing an open source PAM module called google-authenticator. With that PAM module, a Linux system administrator can require a Google Authenticator code in addition to password authentication for login.
I tried this out on a CentOS x86_64 system and found it fairly straightforward to set up. I ran into two minor gotchas which were reported by others as well:
-
The Makefile calls sudo directly, which it shouldn’t—I was …
hosting linux mobile open-source redhat security sysadmin
Presenting at PgEast
By David Christensen
March 11, 2011
I’m excited to be going to the upcoming PostgreSQL East Conference. This will be both my first PostgreSQL conference to attend, as well as my first time presenting. I will be giving a talk on Bucardo entitled Bucardo: More than Just Multi-Master. I’ll be in NYC for the conference, so I’ll get to work for a couple days at our company’s main office as well.
I look forward to learning more about PostgreSQL, putting some names and faces with some IRC nicks, and socializing with others in the PostgreSQL community; after all, Postgres’ community is one of its strongest assets.
Hope to see you there!
conference postgres bucardo replication
Liquid Galaxy in The New York Times
By Benjamin Goldstein
March 9, 2011
We got a charge at End Point seeing an article on the front page of The New York Times website this last Sunday about the @america cultural center exhibit the US State Department opened in Indonesia this last December. The article features the Liquid Galaxy that End Point installed on Google’s behalf there. There was no mention of End Point, but heck, we’re only a few clicks away from the Liquid Galaxy link in the article!
The article also appeared on page A6 of the publication’s New York print edition, leading off the International Section of the paper with a big 9" by 6" color photo with the Liquid Galaxy in the background—the same photo that appears on the website and at the top of this blog posting.
Kiel Christofferson made the trip from New York to Jakarta to do the installation. After he installed the Liquid Galaxy in the exhibition space he moved it with local help to a ball room nearby where there was a State Department gala for the opening of @america. Kiel got dressed up in black (not so unusual for him) and staffed the booth to make sure there were no glitches for the event, then he oversaw the move back to home base.
This Liquid Galaxy was a bit different …
clients visionport
jQuery and Long-Running Web App Processes: A Case Study
By Brian Gadoury
March 8, 2011
I was recently approached by a client’s system administrator with a small but interesting training/development project. The sys-admin, named Rod, had built a simple intranet web application that used a few PHP pages, running on an Amazon EC2 instance, to accept some user input and kick off multiple long-running server side QA deployment processes. He wanted to use Ajax to start the process as well as incrementally display its output, line-by-line, on the same web page. However, waiting for the entire process to finish to display its output was a poor user experience, and he wasn’t able to get an Ajax call to return any output incrementally over the lifetime of the request.
Rod asked me to help him get his web app working and train him on what I did to get it working. He admitted that this project was a good excuse for him to learn a bit of jQuery (a good example of keeping your tools sharp) even if it wasn’t necessarily the best solution in this case. I have always enjoy training others, so we fired up Skype, got into an IRC channel, and dove right in.
First, I started with the javascript development basics:
-
Install the Firebug add-on for Firefox
-
Use Firebug’s Console tab to …
javascript jquery php sysadmin
A Ruby on Rails Tag Cloud Tutorial with Spree
By Steph Skardal
March 7, 2011
A tag cloud from a recent End Point blog post.
Tag clouds have become a fairly popular way to present data on the web. One of our Spree clients recently asked End Point to develop a tag cloud reporting user-submitted search terms in his Spree application. The steps described in this article can be applied to a generic Rails application with a few adjustments.
Step 1: Determine Organization
If you are running this as an extension on Spree pre-Rails 3.0 versions, you’ll create an extension to house the custom code. If you are running this as part of a Rails 3.0 application or Spree Rails 3.0 versions, you’ll want to consider creating a custom gem to house the custom code. In my case, I’m writing a Spree extension for an application running on Spree 0.11, so I create an extension with the command script/generate extension SearchTag.
Step 2: Data Model & Migration
First, the desired data model for the tag cloud data should be defined. Here’s what mine will look like in this tutorial:
Next, a model and migration must be created to introduce the class, table and it’s fields. In Spree, I run script/generate extension_model SearchTag SearchRecord and update the migration file to …
ecommerce rails spree