Until they get the Wiki problems sorted out, you can try this code, it's working for me.
/*============================*/
/*== Bulk Zoom thumbnail v2.4 ==*/
/*============================*/
var thumbnailArray = new Array();
var thumbnailCount;
var thumbnailItem;
var thumbnailEXIFArray = new Array();
var reqIncrement = 0;
addEvent(window, "load", addBulkThumbnail);
function addBulkThumbnail()
{
if (isClass("galleryPage"))
{
if ((isClass("traditional")) || (isClass("allthumbs")) || (isClass("smugmug_small")) || (isClass("smugmug")))
{
if (isClass("loggedIn"))
{
onStartBulk();
divTag = document.getElementById("photoTools");
document.getElementById("bulkSave").disabled = true;
objSpan = document.createElement("span");
objSpan.className = "foreground";
divTag.appendChild(objSpan);
objButton = document.createElement("input");
objButton.type = "checkbox";
objButton.id = "bulkzoom";
objSpan.appendChild(objButton);
addEvent(objButton, "click", toggleBulkZoom);
objText = document.createTextNode(' bulk zoom thumbnail');
objSpan.appendChild(objText);
}
}
}
}
function toggleBulkZoom()
{
if (document.getElementById('bulkzoom').checked)
processThumbnails();
else
window.location = window.location;
}
function processThumbnails()
{
document.getElementById("ajaxWorking").innerHTML = "<strong><strong>Loading...</strong></strong>"
toggleDIV('ajaxWorking','','block');
document.getElementById("bulkzoom_toolbox").style.display = "";
thumbnailEXIFArray = imageIDs.slice(0);
getThumbnailEXIF();
}
function maskThumbnails(objThumbnail, j)
{
re1 = /\/gallery\/\d+\/\d+\/(\d+)/
re2 = /javascript\:openLB\(([0-9]+),/;
divTag = document.getElementById("thumbnails") ? document.getElementById("thumbnails") : document.getElementById("photos");
if (divTag)
{
divTags = divTag.getElementsByTagName("div");
for (i=0; i<divTags.length; i++)
{
if (divTags[i].className == "photo")
{
if (re1.test(divTags[i].innerHTML))
re1.exec(divTags[i].innerHTML);
else
{
if (re2.test(divTags[i].innerHTML))
re2.exec(divTags[i].innerHTML);
else
continue;
}
thumbnailId = RegExp.$1;
aTags = divTags[i].getElementsByTagName("a");
imgTags = aTags[0].getElementsByTagName("img");
if (objThumbnail.thumbnailId == thumbnailId)
{
maskedDiv = document.createElement("div");
maskedDiv.id = thumbnailId + "_masked";
maskedDiv.className = j;
maskedDiv.style.cssText = "position: relative; background: transparent url('" + webServer+"/photos/toolthumbs.mg?tool=cropmask&Size=Small&ImageID="+ thumbnailId + "') no-repeat; width: " + objThumbnail.imgWidth + "px; height: " + objThumbnail.imgHeight + "px; z-index: 1; margin:0px auto; text-align:left;";
clearedDiv = document.createElement("div");
clearedDiv.id = thumbnailId + "_cleared";
clearedDiv.className = j;
clearedDiv.style.cssText = "position: absolute; background: url('" + webServer+"/photos/"+ thumbnailId + "-S" + objThumbnail.modifier + ".jpg') no-repeat; width: " + objThumbnail.imgWidth + "px; height: " + objThumbnail.imgHeight + "px; z-index: 2; clip:rect(0px," + objThumbnail.imgWidth + "px," + objThumbnail.imgHeight + "px,0px);";
maskedDiv.appendChild(clearedDiv);
cropboxDiv = document.createElement("div");
cropboxDiv.id = thumbnailId + "_cropbox";
cropboxDiv.className = j;
cropboxDiv.style.cssText = "position: absolute; left: 0px; top: 0px; width: " + (objThumbnail.imgWidth-4) + "px; height: " + (objThumbnail.imgHeight-4) + "px; border: solid 2px blue; z-index: 3; cursor: move";
addEvent(cropboxDiv, "mousedown", testMouseBulk);
clearedDiv.appendChild(cropboxDiv);
ratioboxDiv = document.createElement("div");
ratioboxDiv.id = thumbnailId + "_ratiobox";
ratioboxDiv.className = j;
ratioboxDiv.style.cssText = "position: absolute; bottom: 0px; right: 0px; width: 25px; height: 25px; border-top: solid 2px blue; border-left: solid 2px blue; cursor: pointer; cursor: hand; z-index: 4;";
addEvent(ratioboxDiv, "mousedown", testZoomBulk);
cropboxDiv.appendChild(ratioboxDiv);
divTags[i].replaceChild(maskedDiv, aTags[0]);
divTags[i].style.width = objThumbnail.imgWidth + "px";
divTags[i].style.height = objThumbnail.imgHeight + "px";
}
}
}
}
}
function getThumbnailEXIF()
{
var thumbnail = thumbnailEXIFArray.pop();
if (thumbnail)
{
postArray = new Array();
postArray['tool'] = 'lightBoxImage';
postArray['ImageID'] = thumbnail;
postArray['size'] = 'Original';
postArray['pageType'] = pageType;
postArray['pageTypeDetails'] = pageTypeDetails;
postArray['siteUser'] = siteUser;
ajax_query(processThumbnailEXIF, webServer+'/hack/RPC/gallery.mg', postArray, true);
window.setTimeout(getThumbnailEXIF, 100);
}
else
{
toggleDIV('','ajaxWorking','block');
if (isClass("loggedIn"))
document.getElementById("bulkSave").disabled = false;
}
}
function processThumbnailEXIF(response)
{
re = /\/photos\/(\d+)\-(O|L|M|S)(\-\d+)?\.jpg[\s\S]+,(\d+),(\d+),(false|true)/;
response = URLDecode(response);
re.exec(response);
if (RegExp.$2 != "O")
{
toggleDIV('','ajaxWorking','block');
alert("Error: bulk zoom thumbnail requires access to originals.\n\"" + RegExp.$1 + "\" \"" + RegExp.$2 + "\" \"" + RegExp.$4 + "\" \"" + RegExp.$5 + "\"");
return;
}
sThumbnailId = RegExp.$1;
sThumbnailModifier = RegExp.$3;
imgWidth = parseInt(RegExp.$4);
imgHeight = parseInt(RegExp.$5);
temp = new Array();
thumbnailArray[thumbnailArray.length] = temp;
thumbnailArray[thumbnailArray.length-1].thumbnailId = sThumbnailId;
thumbnailArray[thumbnailArray.length-1].modifier = sThumbnailModifier;
if (imgWidth < imgHeight)
{
thumbnailArray[thumbnailArray.length-1].imgHeight = 300;
thumbnailArray[thumbnailArray.length-1].imgWidth = Math.round((imgWidth / imgHeight) * 300);
}
else
{
thumbnailArray[thumbnailArray.length-1].imgWidth = 400;
thumbnailArray[thumbnailArray.length-1].imgHeight = Math.round((imgHeight / imgWidth) * 400);
}
thumbnailArray[thumbnailArray.length-1].ratio = 0;
thumbnailArray[thumbnailArray.length-1].invRatio = 0;
thumbnailArray[thumbnailArray.length-1].marginTop = 0;
thumbnailArray[thumbnailArray.length-1].marginLeft = 0;
thumbnailArray[thumbnailArray.length-1].cropHeight = thumbnailArray[thumbnailArray.length-1].imgHeight;
thumbnailArray[thumbnailArray.length-1].cropWidth = thumbnailArray[thumbnailArray.length-1].imgWidth;
thumbnailArray[thumbnailArray.length-1].oRatio = (imgWidth / thumbnailArray[thumbnailArray.length-1].imgWidth);
thumbnailArray[thumbnailArray.length-1].cropDiff = 0;
maskThumbnails(thumbnailArray[thumbnailArray.length-1], thumbnailArray.length-1);
//getThumbnailEXIF();
}
function zoomThumbnails()
{
if (!thumbnailItem)
{
thumbnailItem = 0;
thumbnailCount = thumbnailArray.length;
}
var thumbnail = thumbnailArray.pop();
if (thumbnail)
{
thumbnailItem++;
postArray = new Array();
postArray['tool'] = 'newthumb';
postArray['ImageID'] = thumbnail.thumbnailId;
postArray['action'] = "doit";
postArray['crop_h'] = Math.round(parseInt(thumbnail.cropHeight) * parseFloat(thumbnail.oRatio));
postArray['crop_w'] = Math.round(parseInt(thumbnail.cropWidth) * parseFloat(thumbnail.oRatio));
postArray['crop_x'] = Math.round(parseInt(thumbnail.marginLeft) * parseFloat(thumbnail.oRatio));
postArray['crop_y'] = Math.round(parseInt(thumbnail.marginTop) * parseFloat(thumbnail.oRatio));
reqIncrement ++;
updateAjaxStatus();
window.setTimeout('ajax_query(thumbReqHandler, webServer+\'\/photos\/tools.mg\', postArray, true, true);', 10);
window.setTimeout(zoomThumbnails, 50);
}
}
function thumbReqHandler() {
updateAjaxStatus();
reqIncrement--;
if (thumbnailArray.length == 0 && reqIncrement == 0) {
window.location = window.location;
}
}
function updateAjaxStatus(sStr) {
var ajx = document.getElementById("ajaxWorking");
if (thumbnailArray.length == 0)
ajx.innerHTML = 'Processing thumbnail ' + (thumbnailCount - reqIncrement + 1) + ' of ' + thumbnailCount;
else
ajx.innerHTML = 'Sending request ' + reqIncrement + ' of ' + thumbnailCount;
if (sStr) {
ajx.innerHTML = ajx.innerHTML + sStr;
}
toggleDIV('ajaxWorking','','block');
}
var smallestBulk = 75;
var mouseXBulk = 0;
var mouseYBulk = 0;
var mouseToolBulk = "move";
var hideRatioBulk = false;
var scaleBulk = 1;
var pageLoadedBulk = false;
function onStartBulk()
{
pageLoadedBulk = true;
}
function moveBulk(X,Y,e)
{
if (pageLoadedBulk == true)
{
try
{
var objClass;
if (e.srcElement)
objClass = e.srcElement.className
else
objClass = e.target.className
X = X*scaleBulk;
Y = Y*scaleBulk;
newLeft = thumbnailArray[objClass].marginLeft+X;
newTop = thumbnailArray[objClass].marginTop+Y;
stopX = thumbnailArray[objClass].imgWidth-thumbnailArray[objClass].cropWidth;
stopY = thumbnailArray[objClass].imgHeight-thumbnailArray[objClass].cropHeight;
if (newLeft < 0)
newLeft = 0;
if (newLeft > stopX)
newLeft = stopX;
if (newTop < 0)
newTop = 0;
if (newTop > stopY)
newTop = stopY;
thumbnailArray[objClass].marginLeft = newLeft;
thumbnailArray[objClass].marginTop = newTop;
if (e.srcElement)
objNode = e.srcElement;
else
objNode = e.target;
while (objNode.id != thumbnailArray[objClass].thumbnailId + "_cropbox")
objNode = objNode.parentNode;
updateCropBulk(objNode);
}
catch(e) {}
}
else
{
window.alert("Page loading, please wait.");
}
}
function zoomBulk(X,Y,e)
{
if (pageLoadedBulk == true)
{
try
{
var objClass;
if (e.srcElement)
objClass = e.srcElement.className
else
objClass = e.target.className
if (thumbnailArray[objClass].ratio == 0)
{
Xadj = thumbnailArray[objClass].cropWidth+(X*scaleBulk);
Yadj = thumbnailArray[objClass].cropHeight+(Y*scaleBulk);
}
else
{
Xadj = 0;
Yadj = 0;
}
newWidth = thumbnailArray[objClass].cropWidth+(X*scaleBulk);
newHeight = Math.round(newWidth*thumbnailArray[objClass].ratio)+Yadj;
if (newWidth < smallestBulk)
{
newWidth = smallestBulk;
newHeight = Math.round(newWidth*thumbnailArray[objClass].ratio)+Yadj;
}
if (newHeight < smallestBulk)
{
newHeight = smallestBulk;
newWidth = Math.round(newHeight*thumbnailArray[objClass].invRatio)+Xadj;
}
if (newWidth+thumbnailArray[objClass].marginLeft > thumbnailArray[objClass].imgWidth)
{
newWidth = thumbnailArray[objClass].imgWidth-thumbnailArray[objClass].marginLeft;
newHeight = Math.round(newWidth*thumbnailArray[objClass].ratio)+Yadj;
}
if (newHeight+thumbnailArray[objClass].marginTop > thumbnailArray[objClass].imgHeight)
{
newHeight = thumbnailArray[objClass].imgHeight-thumbnailArray[objClass].marginTop;
newWidth = Math.round(newHeight*thumbnailArray[objClass].invRatio)+Xadj;
}
thumbnailArray[objClass].cropWidth = newWidth;
thumbnailArray[objClass].cropHeight = newHeight;
if (e.srcElement)
objNode = e.srcElement;
else
objNode = e.target;
while (objNode.id != thumbnailArray[objClass].thumbnailId + "_cropbox")
objNode = objNode.parentNode;
updateCropBulk(objNode);
}
catch(e) {}
}
else
{
window.alert("Page loading, please wait.");
}
}
function changeRatioBulk(newRatios)
{
if (pageLoadedBulk == true)
{
newRatio = newRatios.split(",");
for (i=0; i<thumbnailArray.length; i++)
{
if (thumbnailArray[i].imgHeight > thumbnailArray[i].imgWidth)
{
thumbnailArray[i].ratio = newRatio[1];
thumbnailArray[i].invRatio = newRatio[0];
}
else
{
thumbnailArray[i].ratio = newRatio[0];
thumbnailArray[i].invRatio = newRatio[1];
}
if (thumbnailArray[i].ratio == 0)
{
document.getElementById('customRatio').style.display = "none";
thumbnailArray[i].marginTop = 0;
thumbnailArray[i].marginLeft = 0;
thumbnailArray[i].cropHeight = thumbnailArray[i].imgHeight;
thumbnailArray[i].cropWidth = thumbnailArray[i].imgWidth;
}
else
{
if (newRatios == "custom")
{
thumbnailArray[i].ratio = document.cropTool.ratioH.value/document.cropTool.ratioW.value;
thumbnailArray[i].invRatio = document.cropTool.ratioW.value/document.cropTool.ratioH.value;
document.getElementById('customRatio').style.display = "block";
}
else
document.getElementById('customRatio').style.display = "none";
thumbnailArray[i].cropWidth = Math.round(1*thumbnailArray[i].imgWidth);
thumbnailArray[i].cropHeight = Math.round(thumbnailArray[i].cropWidth*thumbnailArray[i].ratio);
if ((thumbnailArray[i].cropHeight > thumbnailArray[i].imgHeight)||(thumbnailArray[i].cropWidth > thumbnailArray[i].imgWidth))
{
thumbnailArray[i].cropHeight = thumbnailArray[i].imgHeight;
thumbnailArray[i].cropWidth = Math.round(thumbnailArray[i].cropHeight*thumbnailArray[i].invRatio);
}
thumbnailArray[i].marginTop = ((thumbnailArray[i].imgHeight-thumbnailArray[i].cropHeight)/2);
thumbnailArray[i].marginLeft = ((thumbnailArray[i].imgWidth-thumbnailArray[i].cropWidth)/2);
}
updateCropBulk(document.getElementById(thumbnailArray[i].thumbnailId + "_cropbox"));
}
}
else
{
window.alert("Page loading, please wait.");
}
}
function rotateBulk()
{
if (pageLoadedBulk == true)
{
for (i=0; i<thumbnailArray.length; i++)
{
if (thumbnailArray[objClass].ratio == 0)
{
Xadj = thumbnailArray[i].cropHeight;
Yadj = thumbnailArray[i].cropWidth;
}
else
{
Xadj = 0;
Yadj = 0;
}
temp = thumbnailArray[objClass].invRatio;
thumbnailArray[objClass].invRatio = thumbnailArray[objClass].ratio;
thumbnailArray[objClass].ratio = temp;
temp = thumbnailArray[i].cropWidth;
thumbnailArray[i].cropWidth = thumbnailArray[i].cropHeight;
thumbnailArray[i].cropHeight = temp;
if (thumbnailArray[i].cropWidth+thumbnailArray[i].marginLeft > thumbnailArray[i].imgWidth)
{
thumbnailArray[i].marginLeft = thumbnailArray[i].imgWidth-thumbnailArray[i].cropWidth;
if (thumbnailArray[i].marginLeft < 0)
{
thumbnailArray[i].marginLeft = 0;
thumbnailArray[i].cropWidth = thumbnailArray[i].imgWidth-thumbnailArray[i].marginLeft;
thumbnailArray[i].cropHeight = Math.round(thumbnailArray[i].cropWidth*thumbnailArray[objClass].ratio)+Yadj;
}
}
if (thumbnailArray[i].cropHeight+thumbnailArray[i].marginTop > thumbnailArray[i].imgHeight)
{
thumbnailArray[i].marginTop = thumbnailArray[i].imgHeight-thumbnailArray[i].cropHeight;
if (thumbnailArray[i].marginTop < 0)
{
thumbnailArray[i].marginTop = 0;
thumbnailArray[i].cropHeight = thumbnailArray[i].imgHeight-thumbnailArray[i].marginTop;
thumbnailArray[i].cropWidth = Math.round(thumbnailArray[i].cropHeight*thumbnailArray[objClass].invRatio)+Xadj;
}
}
if (hideRatioBulk != true)
{
//temp = document.cropTool.ratioH.value
//document.cropTool.ratioH.value = document.cropTool.ratioW.value;
//document.cropTool.ratioW.value = temp;
}
updateCropBulk(document.getElementById(thumbnailArray[i].thumbnailId + "_cropbox"));
}
}
else
window.alert("Page loading, please wait.");
}
function updateCropBulk(e)
{
objClass = e.className;
e.parentNode.style.clip = "rect("+thumbnailArray[objClass].marginTop+"px "+(thumbnailArray[objClass].marginLeft+thumbnailArray[objClass].cropWidth)+"px "+(thumbnailArray[objClass].marginTop+thumbnailArray[objClass].cropHeight)+"px "+thumbnailArray[objClass].marginLeft+"px)";
e.style.top = thumbnailArray[objClass].marginTop+"px";
e.style.left = thumbnailArray[objClass].marginLeft+"px";
e.style.width = thumbnailArray[objClass].cropWidth-thumbnailArray[objClass].cropDiff+"px";
e.style.height = thumbnailArray[objClass].cropHeight-thumbnailArray[objClass].cropDiff+"px";
}
function mouseMoveBulk(e)
{
if (!e) var e = window.event;
var objClass
if (e.srcElement)
objClass = e.srcElement.className;
else
objClass = e.target.className;
if (lookMouse)
{
tempX = mouseXBulk;
tempY = mouseYBulk;
mouseXBulk = e.clientX;
mouseYBulk = e.clientY;
x = mouseXBulk-tempX;
y = mouseYBulk-tempY;
if (mouseToolBulk == "zoom")
{
if (thumbnailArray[objClass].ratio == 0)
zoomBulk(x,y,e);
else
zoomBulk(x,0,e);
}
else
moveBulk(x,y,e)
}
}
function testMouseBulk(e)
{
state = true;
if (!e) var e = window.event;
if (mouseToolBulk != "zoom")
{
lookMouse = state;
if (state == true)
{
mouseToolBulk = "move";
mouseXBulk = e.clientX;
mouseYBulk = e.clientY;
document.onmousemove = mouseMoveBulk;
}
}
}
function testZoomBulk(e)
{
state=true;
if (!e) var e = window.event;
lookMouse = state;
if (state == true)
{
mouseToolBulk = "zoom"
mouseXBulk = e.clientX;
mouseYBulk = e.clientY;
document.onmousemove = mouseMoveBulk;
}
}
function cancelMouse()
{
mouseToolBulk = "move";
lookMouse = false;
}
document.onmouseup = cancelMouse;
function isClass(sClass) {
sClassName = document.body.className;
re = new RegExp(sClass + "( |$)")
if (!sClassName)
return false;
return re.test(sClassName);
}