gistfile1.js

// homemint/assets/js/models/model.ProductImage.js
mint.model.register({
	name:"ProductImage",
	inherits:"ProductImage", // inherits functionality from the mintjs product image model
	Class:{
		defaults:{
			// the image name that represents which properties
			// the contstructor the main image attribute. this
			// can be passed into the constructor from whichever
			// view/collection uses this model
			mainImageName:'about'

		}
		initialize:function(attrs){
			var raw = this.get("raw")
			  , images = this.get
			  , name = attrs.mainImageName || this.get("mainImageName")
			  , image =
			  	{
			  		src:"" // the main image src,
					height: 0 // image height
					width: 0 // image width
				};
			if (name == "about") {
				var tmp = raw.image_attributes;
				if (tmp && tmp.hm_about_image) {
					image.height = 20;
					image.width = 20;
					image.src = tmp.hm_about_image.replace("{width}",image.width).replace("{height}",image.height);
				}
			}

			if (image.src.length) {
				// change the image object to use the default image
			}
		}
});

// use case in showroom : view
var product = new ConfigurableProductModel({mainImageName:'about'});
this.render({product:product});

// use case in showroom : template
<image src="${product.image.src}" height="${product.image.height}" src="${product.image.width}" />