name=fi_oulu_Imagers
title=Imager overview
description=An overview of imager load
admin_only=no
version=1
height=1
width=1
url=/api/imager
---- Below this line is deemed to be HTML content if url above is empty, Javascript otherwise. If Javascript, you MUST define an object BRICKNAME_functions containing at least a function onSuccess(transport,box){}, transport contains a responseJSON object, box is the homepage brick itself.
document.fi_oulu_Imagers_functions={
	onSuccess:function(transport,box){
		var statusColors={
			activenormal: "#0c0",
			activealert:  "#cc0",
			activewarn:   "#c00",
			expirednormal:"#070",
			expiredalert: "#770",
			expiredwarn:  "#700",
		};
		var imagers=transport.responseJSON.rows;
		box.down(".boxbody").innerHTML="";
		imagers.each(function(im){
			if(im.platecapacity*1<10 || "Unknown"==im.manufacturer){ return; } //from this iteration
			var activePercent=(100*im.platesactive/im.platecapacity);
			var expiredPercent=(100*im.platesexpired/im.platecapacity);
			var alertState="normal";
			if((1*im.platesactive)+(1*im.platesexpired)>=1*im.alertlevel){ alertState='alert'; }
			if((1*im.platesactive)+(1*im.platesexpired)>=1*im.warninglevel){ alertState='warn'; }
			var title=im.platesactive+' active, '+im.platesexpired+' expired, '+(1*im.platecapacity-((1*im.platesactive)+(1*im.platesexpired)))+' free';
			var imagerDiv=document.createElement("div");
			var link=document.createElement("a");
			link.href="/imager/"+im.id;
			link.innerHTML=im.friendlyname+" ("+im.name+")";
			if("Rigaku"==im.manufacturer){ 
				title="Cannot determine imager loading from its database";
				link.innerHTML+=" - cannot determine loading"
			} 
			imagerDiv.title=title;
			imagerDiv.appendChild(link);
			var capacityBar=document.createElement("div");
			imagerDiv.appendChild(capacityBar);
			var activeBar=document.createElement("div");
			capacityBar.appendChild(activeBar);
			var expiredBar=document.createElement("div");
			capacityBar.appendChild(expiredBar);
			box.down(".boxbody").appendChild(imagerDiv);
			$(capacityBar).setStyle({
				margin:"0.25em 0 0.5em 0",
				minHeight:"1em",
				backgroundColor:"#ccc",
				borderRadius:"3px",
				boxShadow:"2px 2px 2px #666 inset",
				fontSize:"80%", 
				height:"1em", 
				overflow:"hidden",
				position:"relative", 
				top:0
			});
			$(activeBar).setStyle({
				position:"absolute", 
				top:0, 
				left:0, 
				bottom:0, 
				width:activePercent+"%", 
				backgroundColor:statusColors['active'+alertState], 
				boxShadow:"1px 1px 1px #333 inset",
			});
			$(expiredBar).setStyle({
				position:"absolute", 
				top:0, 
				left:activePercent+"%", 
				bottom:0, 
				width:expiredPercent+"%", 
				backgroundColor:statusColors['expired'+alertState], 
				boxShadow:"1px 1px 1px #333 inset"
			});
			$(imagerDiv).setStyle({
				padding:"0.25em 0", 
				borderBottom:"1px solid #999"
			});
		});
	}
}