Template:Slideshow

// Slideshow, by neilw, 2009 // Optimized photo slideshow based on the jQuery "cycle" plug-in // // Version History: // 1.02 26-July-2010 neilw Fixed for Mindtouch 2010 // 1.0.1 11-May-2010 neilw Added option for caption on top // 1.0.0 16-Nov-2009 neilw A couple of minor bug fixes // 0.9.3 16-Nov-2009 neilw Added "controls" and "options" options // 0.9.2 13-Nov-2009 neilw Added proper support for effects. Automatically load the appropriate plug-in version // depending on the selected effect. // 0.9.1 13-Nov-2009 neilw Added "effect", "title", "link", and "caption" options // 0.9.0 13-Nov-2009 neilw First beta version installed on dev wiki. Still using "cycle lite" // // Usage: // slideshow{ path:str, width:num, height:num, interval:num, speed:num, order:str, // title:bool or string, link:bool, caption:bool, controls:bool or str } // // path Path to page containing attached slideshow images (default: page.path) // width display width, in pixels, of slideshow images (default: 320) // height display height, in pixels, of slideshow images (default: 240) // interval duration, in milliseconds, of each image (default: 3000) // speed speed of transitions, in milliseconds (default: 500) // order order of images to display; valid options are: // "name" ascending order by name (DEFAULT) // "date" or "+date" ascending order by date (oldest first) // "-date" descending order by date (newest first) // effect transition effect (default:'fade') // title display slideshow title (default:automatic) // link link each image to the original, full-sized (default:FALSE) // caption display each image's description as caption on bottom (default:FALSE). May be set to true, // false, "top", or "bottom". True is equivalent to "bottom". // controls display "prev", "pause/play", and "next" controls (default:FALSE). May be set to true, false, // "top", or "bottom" (to control placement of the controls). True is equivalent to "top". // options other options to be passed directly to the plugin var id = @id; //************** // Process args //************** var errors = []; // path var picpage = wiki.getpage($0 ?? $path ?? page.path); if (picpage is not map) { let errors ..= [ "ERROR: invalid path" ]; let picpage = page; } var this_page = (picpage.id == page.id); // width and height var width = $1 ?? $width; if (width is not num || width <= 0) { if (width is not nil) let errors ..= [ "width must be a positive number" ]; let width = 320; } var height = $2 ?? $height; if (height is not num || height <= 0) { if (height is not nil) let errors ..= [ "height must be a positive number" ]; let height = 240; } var aspect = width/height; // interval var interval = $3 ?? $interval; if (interval is not num || interval <= 0) { if (interval is not nil) let errors ..= [ "interval must be a positive number" ]; let interval = 3000; } // speed var speed = $4 ?? $speed; if (speed is not num || speed < 0) { if (speed is not nil) let errors ..= [ "speed must be a non-negative number" ]; let speed = 500; } // order var order = $5 ?? $order; if (order is str) let order = string.tolower(order); var allowed_orders = [ "name", "date", "+date", "-date" ]; if (order is not str || !list.contains(allowed_orders, order)) { if (order is not nil) let errors ..= [ "order must be one of "..string.serialize(allowed_orders) ]; let order = "name"; } var char1 = string.substr(order,0,1); var descending = (char1 == "-"); let order = string.substr(order, (char1 == "-" || char1 == "+") ? 1 : 0); // effect var effect = $6 ?? $effect; var allowed_effects = [ "fade" ]; if (effect is not str) { // || !list.contains(allowed_effects, effect)) { if (effect is not nil) let errors ..= [ "effect must be one of "..string.serialize(allowed_effects) ]; let effect = 'fade'; } var plugin = (effect == "fade" ? "http://developer.mindtouch.com/@api/...le.lite.min.js" : "http://developer.mindtouch.com/@api/...cle.all.min.js" ); // title var title = $7 ?? $title; // link var link = $8 ?? $link ?? false; // caption var caption = $9 ?? $caption; if (caption is str) let caption = string.tolower(caption); var allowed_caption = [ "top", "bottom" ]; if (caption is not bool && (caption is not str || !list.contains(allowed_caption, caption))) { if (caption is not nil) let errors ..= [ "caption must be one of true, false, "..string.join(allowed_caption,", ")]; let controls = false; } if (caption == true) let caption = "bottom"; // controls var controls = $10 ?? $controls; if (controls is str) let controls = string.tolower(controls); var allowed_controls = [ "top", "bottom" ]; if (controls is not bool && (controls is not str || !list.contains(allowed_controls, controls))) { if (controls is not nil) let errors ..= [ "controls must be one of true, false, "..string.join(allowed_controls,", ")]; let controls = false; } if (controls == true) let controls = "top"; var next_id = id .. "next"; var prev_id = id .. "prev"; var pause_id = id .. "pause"; var controls_div =

; // options var options = $11 ?? $options ?? {}; let options ..= { timeout:interval, speed:speed, fx:effect }; if (link) let options ..= { pause:1 }; if (controls) let options ..= { next:"#"..next_id, prev:"#"..prev_id }; //************************* // Prepare for the scripts //************************* // Create selector for image order in gallery at bottom of page var selector = order .. (order == "date" ? (descending ? "-desc" : "-asc") : "");

//******************** // Output the scripts //********************if (this_page) ; ; ;; //********************** // Output the slideshow //**********************

if (#errors)

; // Output the images