Mercurial > mozilla-the-big-picture
view mbp.js @ 35:9c34b211740a
added width and height attribute information to images
author | Atul Varma <varmaa@toolness.com> |
---|---|
date | Fri, 11 Dec 2009 14:58:31 -0800 |
parents | 5ef9f73615c1 |
children | 2c5d734e1d2c |
line wrap: on
line source
$(window).ready( function() { var rectRegexp = /rect\((\d+)px,? (\d+)px,? (\d+)px,? (\d+)px\)/; var smallImages = $(".mbp-entry img.small"); var loadsLeft = smallImages.length; $("h1").mouseover( function() { $("#images").empty(); }); $(".mbp-entry img.large").each( function() { if (!$(this).hasClass("small")) $(this).remove(); }); smallImages.each( function() { function onLoaded() { $("#countdown").text(--loadsLeft); var siblings = [this.previousSibling, this.nextSibling]; for (var i = 0; i < siblings.length; i++) if (siblings[i] && siblings[i].isElementContentWhitespace) $(siblings[i]).remove(); var clip = $(this).css("clip"); var parts = clip.match(rectRegexp); var crop = {top: parts[1], right: parts[2], bottom: parts[3], left: parts[4]}; crop.width = crop.right - crop.left; crop.height = crop.bottom - crop.top; var canvas = document.createElement("canvas"); var self = $(this.parentNode).clone(); $(canvas).mouseenter( function() { $("#images").empty(); $("#images").append(self); }); $(canvas).addClass("thumbnail"); $(this).before(canvas); var ctx = canvas.getContext("2d"); ctx.drawImage(this, crop.left, crop.top, crop.width, crop.height, 0, 0, canvas.width, canvas.height); $(this).remove(); if (loadsLeft == 0) { $("#countdown").remove(); $("#container").fadeIn(); } } if (this.complete) onLoaded.call(this); else this.addEventListener("load", onLoaded, false); }); $("#countdown").text(loadsLeft); });