// Manifesto: $Id: slideshow.js,v 1.10 2007/11/19 01:06:49 spud Exp $ // license: GNU LGPL // copyright 2001-2006: dada typo and contributors // milliseconds between 10% changes in opacity var fadeinterval = 60; // milliseconds between slide changes var changeinterval = 6000; var ssct = 0; var ssinited = false; var ssplaying = false; var blacked = false; function blackout() { var b = document.body; var ss = getObjectRef("slideshow"); var bg = dtDOM.buildElement("DIV","blackout",{ "class":"m_media"}); dtDOM.setStyle(bg,"background","transparent url(/images/whiteout.png) top left repeat"); dtDOM.setStyle(bg,"position","absolute"); dtDOM.setStyle(bg,"top","0"); dtDOM.setStyle(bg,"left","0"); dtDOM.setStyle(bg,"height","100%"); dtDOM.setStyle(bg,"width","100%"); dtDOM.setStyle(bg,"textAlign","center"); dtDOM.setStyle(bg,"verticalAlign","middle"); dtDOM.setStyle(bg,"zIndex","200"); // grab the existing nav bar and replace it in the blackout div var ssnav = getObjectRef("slideshownav"); var bgnav = ss.removeChild(ssnav); dtDOM.removeClass(bgnav,"hidden"); bg.appendChild(bgnav); var ssframe = dtDOM.buildElement("DIV","ssframe"); dtDOM.setStyle(ssframe,"backgroundColor","#ffffff"); dtDOM.setStyle(ssframe,"margin","20px auto"); dtDOM.setStyle(ssframe,"height",(sscache[1].height + 40)+"px"); dtDOM.setStyle(ssframe,"width",(sscache[1].width + 20)+"px"); dtDOM.setStyle(ssframe,"textAlign","center"); dtDOM.setStyle(ssframe,"verticalAlign","middle"); var sstitle = getObjectRef("slidetitle"); var bgtitle = ss.removeChild(sstitle); ssframe.appendChild(bgtitle); var ssbox = getObjectRef("slidebox"); var bgbox = ss.removeChild(ssbox); ssframe.appendChild(bgbox); bg.appendChild(ssframe); b.appendChild(bg); blacked = true; } function restore() { var b = document.body; var bg = getObjectRef("blackout"); var ss = getObjectRef("slideshow"); var ssframe = getObjectRef("ssframe"); var ssnav = getObjectRef("slideshownav"); var rnav = bg.removeChild(ssnav); dtDOM.addClass(rnav,"hidden"); ss.appendChild(rnav); var sstitle = getObjectRef("slidetitle"); ss.appendChild(ssframe.removeChild(sstitle)); var ssbox = getObjectRef("slidebox"); ss.appendChild(ssframe.removeChild(ssbox)); b.removeChild(bg); blacked = false; } function clearIntervals() { if (typeof inID != "undefined") clearInterval(inID); if (typeof outID != "undefined") clearInterval(outID); if (typeof ssID != "undefined") clearInterval(ssID); } function getNextImage() { if (ssct == sslength) alert("Trying to get a non-existant next image"); ss_http = new AJAXobj(dtDOM.g_url+"rpc_reference.php"); ss_http.rHandler = preloadSScacheForward; ss_http.dosend("module=media&t=slideshow&start="+ssct,"array"); } function preloadSScacheForward() { if (ss_http.error != "") { alert(ss_http.error); } else { if (ss_http.responseCount) { // move current image to "previous" slot sscache[0] = sscache[1]; var arr = ss_http.response[0]; sscache[1] = { "id": arr[0], "src": arr[1], "caption": arr[2], "width": parseInt(arr[3]), "height": parseInt(arr[4]) }; if (ss_http.responseCount > 1) { var arr = ss_http.response[1]; sscache[2] = { "id": arr[0], "src": arr[1], "caption": arr[2], "width": parseInt(arr[3]), "height": parseInt(arr[4]) }; if (ss_http.responseCount == 3) { var arr = ss_http.response[2]; nextpreload = new Image(); nextpreload.src = arr[1]; } } else { sscache[2] = null; } } //if (ssct == sslength - 1) alert("getNextImage leaves us with "+sscache[0]["caption"]+";"+sscache[1]["caption"]+";"+sscache[2]["caption"]); } } function getPrevImage() { if (ssct < 0) alert("Trying to get a non-existant prev image"); ss_http = new AJAXobj(dtDOM.g_url+"rpc_reference.php"); ss_http.rHandler = preloadSScacheBackward; ss_http.dosend("module=media&t=media&start="+(ssct - 1),"array"); } function preloadSScacheBackward() { if (ss_http.error != "") { alert(ss_http.error); } else { if (ss_http.responseCount) { // move current image to "next" slot sscache[2] = sscache[1]; // move new image to "prev" slot var arr = ss_http.response[0]; sscache[0] = { "id": arr[0], "src": arr[1], "caption": arr[2], "width": parseInt(arr[3]), "height": parseInt(arr[4]) }; // move second new image to "current" slot (or null if not present) var arr = ss_http.response[1]; sscache[1] = { "id": arr[0], "src": arr[1], "caption": arr[2], "width": parseInt(arr[3]), "height": parseInt(arr[4]) }; } //if (ssct < 1) alert("getPrevImage leaves us with "+sscache[0]["caption"]+";"+sscache[1]["caption"]+";"+sscache[2]["caption"]); } } function fadeIn() { // slowly increase the opacity of the new image until 1.0 var opac = dtDOM.getStyle(imgblock,"opacity"); if (parseFloat(opac) < 1) { dtDOM.setStyle(imgblock,"opacity",parseFloat(opac) + .1); } else { clearInterval(inID); } } function swapDataForward() { // swap old data with new dta var ssframe = getObjectRef("ssframe"); dtDOM.setStyle(ssframe,"height",(sscache[2].height + 40)+"px"); dtDOM.setStyle(ssframe,"width",(sscache[2].width + 20)+"px"); imgblock.src = sscache[2]["src"]; imgtitle.innerHTML = sscache[2]["caption"]; //imgtitle.replaceChild(document.createTextNode(sscache[2]["caption"]),imgtitle.firstChild); imgct.replaceChild(document.createTextNode((ssct + 1) + " of "+sslength),imgct.firstChild); } function fadeOutForward() { // slowly reduce the opacity of the current image until it is 0, then stop repeating and start running fadeIn() if (ssct > 0) dtDOM.setStyle(ssrwbutton.firstChild,"opacity","1.0"); var opac = dtDOM.getStyle(imgblock,"opacity"); if (opac > 0) { dtDOM.setStyle(imgblock,"opacity",parseFloat(opac) - .1); } else { clearInterval(outID); swapDataForward(); // fade in the new image inID = setInterval("fadeIn()",fadeinterval); if (ssct + 1 < sslength) { // grab the next batch getNextImage(); } else { sscache[0] = sscache[1]; sscache[1] = sscache[2]; sscache[2] = null; } } } function imgForward() { if ((ssct + 1) < sslength) { ssct++; // preload the next image nextpreload = new Image(); nextpreload.src = sscache[2]["src"]; outID = setInterval("fadeOutForward()",fadeinterval); // if this is the last image, fade the FF button if (ssct + 1 == sslength) dtDOM.setStyle(ssffbutton.firstChild,"opacity","0.5"); } else if (ssplaying) { clearIntervals(); ssplaying = false; dtDOM.showHide(ssplaybutton); dtDOM.showHide(sspausebutton); } return false; } function swapDataBackward() { // swap old data with new dta imgblock.src = sscache[0]["src"]; imgtitle.innerHTML = sscache[0]["caption"]; //imgtitle.replaceChild(document.createTextNode(sscache[0]["caption"]),imgtitle.firstChild); imgct.replaceChild(document.createTextNode((ssct + 1) + " of "+sslength),imgct.firstChild); } function fadeOutBackward() { // slowly reduce the opacity of the current image until it is 0, then start running fadeIn() var opac = dtDOM.getStyle(imgblock,"opacity"); if (opac > 0) { dtDOM.setStyle(imgblock,"opacity",parseFloat(opac) - .1); } else { clearInterval(outID); swapDataBackward(); // fade in the new image inID = setInterval("fadeIn()",fadeinterval); // grab the next batch if (ssct > 0) { getPrevImage(); } else { sscache[2] = sscache[1]; sscache[1] = sscache[0]; sscache[0] = null; // alert("ssct == 0 leaves us with "+sscache[0]["caption"]+";"+sscache[1]["caption"]+";"+sscache[2]["caption"]); } } } function imgBackward() { if (sscache[0] === null) { alert("You are at the beginning of the slideshow."); return false; } dtDOM.setStyle(ssffbutton.firstChild,"opacity","1.0"); if (ssct > 0) { ssct--; outID = setInterval("fadeOutBackward()",fadeinterval); // if this is the first image, fade the RW button if (ssct == 0) dtDOM.setStyle(ssrwbutton.firstChild,"opacity","0.5"); } else { if (typeof inID != "undefined") clearInterval(inID); if (typeof outID != "undefined") clearInterval(outID); } return false; } function pauseSlideshow() { if (ssplaying) { clearIntervals(); dtDOM.showHide(ssplaybutton); dtDOM.showHide(sspausebutton); ssplaying = false; } return false; } function stopSlideshow() { if (!ssinited) return false; ssct = 0; imgblock.src = firstimg["src"]; imgtitle.innerHTML = "Click on the image to begin the slideshow"; //imgtitle.replaceChild(document.createTextNode(firstimg["caption"]),imgtitle.firstChild); imgct.replaceChild(document.createTextNode("1 of "+sslength),imgct.firstChild); sscache[2] = nextimg; dtDOM.setStyle(ssrwbutton.firstChild,"opacity","0.5"); dtDOM.setStyle(ssffbutton.firstChild,"opacity","1.0"); clearIntervals(); restore(); return false; } function initSlideshow() { imgblock = getObjectRef("slideimg"); imgtitle = getObjectRef("slidetitle"); imgct = getObjectRef("currentct"); ssplaybutton = getObjectRef("ssplay"); sspausebutton = getObjectRef("sspause"); ssrwbutton = getObjectRef("ssrw"); ssffbutton = getObjectRef("ssff"); imgtitle.innerHTML = sscache[1]["caption"]; //imgtitle.replaceChild(document.createTextNode(sscache[1]["caption"]),imgtitle.firstChild); ssinited = true; } function startSlideshow() { if (!ssinited) initSlideshow(); if (!blacked) blackout(); ssplaying = true; // handle restarting from the beginning if slideshow is at the end if (sscache[2] === null) stopSlideshow(); dtDOM.showHide(ssplaybutton,"none"); dtDOM.showHide(sspausebutton,"inline"); ssID = setInterval("imgForward()",changeinterval); return false; } function displayImg() { window.location.href = js_g_url+"media/display/"+sscache[1]["id"]+"/index.php"; }