function fisherYates ( myArray ) {
  var i = myArray.length;
  if ( i === 0 ) return false;
  while ( --i ) {
     var j = Math.floor( Math.random() * ( i + 1 ) );
     var tempi = myArray[i];
     var tempj = myArray[j];
     myArray[i] = tempj;
     myArray[j] = tempi;
  }
  return true;
}
function html_entity_decode( str ) {
  var ta = document.createElement( "textarea" );
  ta.innerHTML = str.replace(/</g,"&lt;").replace(/>/g,"&gt;");
  return ta.value;
}
function preloadImages ( set ) {
  for ( var i = 0; i < set.length; i++ ) {
    var image = new Image();
    image.src = set[i].url;
    set[i].image = image;
  }
  return true;
}
function setThumbs( set, div, width, thumb_margin ) {
  var thumb_bar = document.createElement( 'div' );
  thumb_bar.style.width = width + 'px';
  thumb_bar.className = "thumb_bar float-right";
  var max_thumbs = div.thumb;
  var num;
  if ( max_thumbs < set.length ) {
    num = max_thumbs;
  } else {
    num = set.length;
  }
  for ( var i = 0; i < num; i++ ) {
    var img = document.createElement( 'img' );
    img.src = set[i].thumb;
    img.slice = set[i];
    img.order = i;
    img.onmouseover = function() {
      div.is_paused = 0;
      if ( div.is_rotating === 1 || div.is_fading === 1 ) {
        fade( this.slice, div, 1 );
      }
      div.current = this.order;
      showImage( this.slice, div );
      div.is_paused = 1;
    };
    img.onmouseout = function() {
      div.is_paused = 0;
    };
    img.style.width = width + 'px'; 
//  This is replaced by the (transparent) border
//    img.style.marginBottom= thumb_margin + 'px';
    img.className = "thumb";
    if ( set[i].href !== "" ) {
      var link = document.createElement( 'a' );
      link.href = set[i].href;
      link.appendChild ( img );
      link.id = "thumb_"+div.n+"_"+i;
      link.img = img;
      thumb_bar.appendChild ( link );
    } else {
      img.id = "thumb_"+div.n+"_"+i;
      img.img = img;
      thumb_bar.appendChild ( img );
    }
    var br = document.createElement( 'br' );
    thumb_bar.appendChild ( br );
  }
  div.insertBefore( thumb_bar, div.firstChild );
}
/* Initialise the caption/credit element to the right height, 
 * so varying heights don't shift elements around.
 * We don't do this later,  in showImage, as it causes flickering.
 * We do this in showImage function in IE6, as clientHeight isn't set yet,
 * and no flickering seems to occur.
 */
function captionResize ( set, div ) {
  var hidden_text = document.createElement("div");
  hidden_text.style.visibility = "hidden";
  div.text_0.appendChild(hidden_text);
  for ( var i = 0; i < set.length; i++ ) {
    if (set[i].credit && set[i].credit !== "") {
      var credit = document.createElement('p');
      credit.className = "credit right";
      credit.style.width = div.text_0.credit_width;
      credit.appendChild(document.createTextNode(html_entity_decode(set[i].credit)));
      hidden_text.appendChild(credit);
      hidden_text.credit = credit;
    }
    if (set[i].caption && set[i].caption !== "") {
      var caption = document.createElement('p');
      caption.className = "caption";
      caption.appendChild(document.createTextNode(html_entity_decode(set[i].caption)));
      if ( more_link && set[i].href && set[i].href !== "" ) {
        var more = document.createElement('span');
        more.className = "more";
        var more_text = ( location.host.match(/fr\.allafrica\.com/) ) ? 'suite' : 'more';
        more.appendChild(document.createTextNode(html_entity_decode(more_text)));
        var arrow = document.createElement('span');
        arrow.className = "arrow";
        arrow.appendChild(document.createTextNode(html_entity_decode("&raquo;")));
        more.appendChild(arrow);
        caption.appendChild(more);
      }
      hidden_text.appendChild(caption);
      hidden_text.caption = caption;
    }
    
    if ( hidden_text.clientHeight > div.text_0.height ) {
      div.text_0.height = hidden_text.clientHeight;
    }
    if ( div.text_0.height )  {
      div.text_0.style.minHeight = div.text_0.height + 'px';
    }
    if ( hidden_text.credit ) {
      hidden_text.removeChild( hidden_text.credit );
      hidden_text.credit = '';
    }
    if ( hidden_text.caption ) {
      hidden_text.removeChild( hidden_text.caption );
      hidden_text.caption = '';
    }
  }
  div.text_0.removeChild(hidden_text);
  return true;
}
function showText ( slice, div ) {
  if ( div.headline ){
    try { div.removeChild( div.headline ); } catch (e) {}
  }
  if (slice.headline && slice.headline !== "") {
    var headline = document.createElement('h1');
    if (slice.href && slice.href !== "") {
      var headline_href = document.createElement('a');
      headline_href.target = "_blank";
      headline_href.href = slice.href;
      headline_href.appendChild(document.createTextNode(html_entity_decode(slice.headline)));
      headline.appendChild(headline_href);
    } else {
      headline.appendChild(document.createTextNode(html_entity_decode(slice.headline)));
    }
    div.insertBefore(headline, div.firstChild);
    div.headline = headline;
  }
  if ( div.text_0.credit ){
    try { div.text_0.removeChild( div.text_0.credit ); } catch (e) {}
  }
  if (slice.credit && slice.credit !== "") {
    var credit = document.createElement('p');
    credit.className = "credit right";
    credit.style.width = div.text_0.credit_width;
    if (slice.credit_href && slice.credit_href !== "") {
      var credit_href = document.createElement('a');
      credit_href.target = "_blank";
      credit_href.href = slice.credit_href;
      credit_href.appendChild(document.createTextNode(html_entity_decode(slice.credit)));
      credit.appendChild(credit_href);
    } else {
      credit.appendChild(document.createTextNode(html_entity_decode(slice.credit)));
    }
    div.text_0.appendChild(credit);
    div.text_0.credit = credit;
  }
  if ( div.text_0.caption ) {
    try { div.text_0.removeChild( div.text_0.caption ); } catch (e) {}
  }
  if (slice.caption && slice.caption !== "") {
    var caption = document.createElement('p');
    caption.className = "caption";
    caption.appendChild(document.createTextNode(html_entity_decode(slice.caption+" ")));
    if ( more_link && slice.href && slice.href !== "" ) {
      var more = document.createElement('span');
      more.className = "more";
      var more_href = document.createElement('a');
      more_href.href = slice.href;
      var more_text = ( location.host.match(/fr\.allafrica\.com/) ) ? 'Suite ' : 'More ';
      more_href.appendChild(document.createTextNode(html_entity_decode(more_text)));
      var arrow = document.createElement('span');
      arrow.className = "arrow";
      arrow.appendChild(document.createTextNode(html_entity_decode("&raquo;")));
      more_href.appendChild(arrow);
      more.appendChild(more_href);
      caption.appendChild(more);
    }
    div.text_0.appendChild(caption);
    div.text_0.caption = caption;
  }
  /* We preload the size on other browsers, see captionResize
   * That doesn't work on IE6, because clientHeight is not set until the page is loaded
   * We can't load it at this point on other browsers, as the page flickers
   */
  if ( BrowserDetect.browser === 'Explorer' && BrowserDetect.version < 7 ) {
    if ( div.text_0.clientHeight > div.text_0.height ) {
      div.text_0.height = div.text_0.clientHeight;
    }
    div.text_0.style.height = div.text_0.height + 'px'; // minHeight not supported, bleh.
  }
  return true;
}
/* Fade in the image, and move it from the front (temporary) layer to the 
 * rear (permanent) layer. */
function fade ( slice, div, cancel ) {
  if ( div.degree === 0 ) {
    div.canvas_1.img.style.visibility = "visible";
  }
  if (div.degree > 10 || cancel ) {
    clearInterval( div.i );
    if ( div.canvas_0.active_thumb ) {
      div.canvas_0.active_thumb.img.className = div.canvas_0.active_thumb.img.className.replace(/ ?thumb_border/,"");
    }
    if ( div.canvas_1.active_thumb ) {
      div.canvas_1.active_thumb.img.className += " thumb_border";
    }
    showText( slice, div );
    if ( div.canvas_1.href && div.canvas_0.href ) {
      div.canvas_0.replaceChild(div.canvas_1.href, div.canvas_0.href);
      div.canvas_0.href = div.canvas_1.href;
      div.canvas_0.img = div.canvas_1.img;
    } else if ( !div.canvas_1.href && !div.canvas_0.href ) {
      div.canvas_0.replaceChild(div.canvas_1.img, div.canvas_0.img);
      div.canvas_0.img = div.canvas_1.img;
    } else if ( !div.canvas_1.href &&  div.canvas_0.href ) {
      div.canvas_0.replaceChild(div.canvas_1.img, div.canvas_0.href);
      div.canvas_0.href = null;
      div.canvas_0.img = div.canvas_1.img;
    } else if (  div.canvas_1.href && !div.canvas_0.href ) {
      div.canvas_0.replaceChild(div.canvas_1.href, div.canvas_0.img);
      div.canvas_0.href = div.canvas_1.href;
      div.canvas_0.img = div.canvas_1.img;
    }
    div.canvas_0.active_thumb = div.canvas_1.active_thumb;
    div.canvas_1.style.zIndex = 0;
    div.is_rotating = 0;
    div.is_fading   = 0;
    return true;
  } else {
    div.canvas_1.style.filter = "alpha(opacity=" + div.degree*10 + ")";
    div.canvas_1.style.opacity = div.degree/10;
    div.degree++;
    return true;
  }
}
function showImage ( slice, div ) {
  if ( div.is_rotating === 1 ) 
    return false;
  if ( div.is_fading === 1 ) 
    return false;
  if ( div.is_paused === 1 )
    return false;
  div.is_rotating = 1;
  div.degree = 0;
  if (slice.url && slice.url !== "") {
    var img = slice.image;
    img.onmouseover = function () {
      div.is_paused = 1;
    };
    img.onmouseout  = function () {
      div.is_paused = 0;
    };
    if (slice.href && slice.href !== "") {
      var href = document.createElement( 'a' );
      href.href = slice.href;
    }
    if ( !div.canvas_0.img ) {
      if ( href ) {
        href.appendChild(img);
        div.canvas_0.appendChild(href);
        div.canvas_0.href = href;
      } else {
        div.canvas_0.appendChild(img);
        div.canvas_0.href = null;
      }
      div.canvas_0.img = img;
      if ( div.thumb > 0 ) {
        div.canvas_0.active_thumb = document.getElementById( "thumb_"+div.n+"_"+div.current );
        div.canvas_0.active_thumb.img.className += " thumb_border";
      }
      showText( slice, div );
      div.is_rotating = 0;
      return true;
    } else {
      if ( div.canvas_0.img === img ) {
        div.is_rotating = 0;
        return false;
      }
      img.style.visibility = "hidden"; // work around browser flashing the image
      div.canvas_1.style.opacity = 0;
      div.canvas_1.style.zIndex = 2;
      if ( href ) {
        href.appendChild(img);
        div.canvas_1.appendChild(href);
        div.canvas_1.href = href;
      } else {
        div.canvas_1.appendChild(img);
        div.canvas_1.href = null;
      }
      if ( div.thumb > 0 ) {
        div.canvas_1.active_thumb = document.getElementById( "thumb_"+div.n+"_"+div.current );
      }
      div.canvas_1.img = img;
      div.is_fading = 1;
      div.i = setInterval( function(){fade(slice,div,0);}, 50 );
    }
  }
  return true;
}
function selectImage ( set, div, timeout ) {
  clearTimeout( div.t );
  if ( div.current+1 < set.length )
    div.current++;
  else
    div.current = 0;
  var slice = set[div.current];
  showImage( slice, div );
  if ( timeout > 0 ) {
    div.t = setTimeout( function(){selectImage( set, div, timeout );}, timeout );
  }
  return true;
}
function chooseImage ( images, n, align, timeout, thumb_margin ) {
  var div = document.getElementById('randomImage_'+n);
  var image_0 = document.createElement("div");
  var canvas_0 = document.createElement("div");
  var canvas_1 = document.createElement("div");
  var text_0 = document.createElement("div");
  var text_height = 0;
  var is_rotating = 0;
  var is_fading   = 0;
  var is_paused   = 0;
  var current     = -1;
  div.current     = current;
  div.n           = n;
  image_0.style.position  = "relative";
  canvas_0.style.zIndex   = 1;
  canvas_1.style.position = "absolute";
  canvas_1.style.zIndex   = 0;
  canvas_1.style.left     = 0;
  canvas_1.style.top      = 0;
  image_0.appendChild(canvas_0);
  image_0.appendChild(canvas_1);
  div.appendChild(image_0);
  div.appendChild(text_0);
  text_0.height      = text_height;
  div.canvas_0 = canvas_0;
  div.canvas_1 = canvas_1;
  div.text_0 = text_0;
  try {
    image_0.style.height = eval ( 'randomImage_'+n+'_height' );
    image_0.style.width  = eval ( 'randomImage_'+n+'_width' );
    text_0.credit_width  = eval ( 'randomImage_'+n+'_width' );
  } catch (e) {}
  div.is_rotating = is_rotating;
  div.is_fading   = is_fading;
  div.is_paused   = is_paused;
  var i; div.i = i;
  var t; div.t = t;
  if (align) {
    div.className += " "+align;
  }
  var set = images[n];
  preloadImages( set );
  if ( timeout === 'static' || timeout === 0 ) {
//  Shuffle images...
//    fisherYates( set );
//  Or just pick a random image to display
    div.current = Math.floor( Math.random() * set.length )
    timeout = 0;
  } else if ( !timeout ) {
    timeout = 3000;
  } else if ( timeout < 500 ) {
    timeout = timeout*1000;
  }
  captionResize( set, div );
  if ( div.thumb > 0 ) {
    try {
      var thumb_width = eval ( 'randomImage_'+n+'_thumbwidth' );
      setThumbs ( set, div, thumb_width, thumb_margin );
    } catch (e) {}
  }
  selectImage( set, div, timeout );
  return true;
}
/* Globals */
var more_link = 1 /* Append a more link to captions */
if ( typeof(imageset) == "undefined" )
  var imageset = new Array();