var myLayer, scrollTimer, placeholder;
var scrollingImg = new Array();       // images that are scrolled
var sAnchor, anchorX, anchorY;
var ajax_url = '/random_two.php';

currX  = 0;
scrollerX = 20;
scrollerY = 2;
scrollerWidth = 440;
scrollerHeight = 70;
imageWidth = 110;
imageHeight = 100;
scrollDelta = 0;
scrollSpeed = 1;	
noOfItems = Math.ceil(scrollerWidth/imageWidth) + 1;



function pulldownCreate() {
  // Locate placeholder layer so we can use it to position the scrollers.
  sAnchor = getLayer("scrollAnchor");
	moveLayerTo(getLayer("popupTypeId"), (-85+getPageLeft(sAnchor)),  (254+getPageTop(sAnchor)));
	moveLayerTo(getLayer("popupSeriesId"), (20+getPageLeft(sAnchor)),  (254+getPageTop(sAnchor)));
	moveLayerTo(getLayer("popupBasketId"), (272+getPageLeft(sAnchor)),  (254+getPageTop(sAnchor)));
  }
 

 
function scrollerCreate() {
  // Locate placeholder layer so we can use it to position the scrollers.
    sAnchor = getLayer("scrollAnchor");
    anchorX = scrollerX + getPageLeft(sAnchor);
    anchorY = scrollerY + getPageTop(sAnchor);

    placeholder = new JSFX.Layer(" ");
    placeholder.moveTo(anchorX, anchorY );
    placeholder.resizeTo(scrollerWidth, scrollerHeight);
    placeholder.clip(0, 0, scrollerWidth, scrollerHeight);
    placeholder.show();
        
    loadItems(0);                                       // load items                                       
    }
    
//
// Reposition image in scrollbar, clip left/right side when needed.
//
function placeImg(img, leftEdge) {                      // place image, clip
    rightEdge = leftEdge + scrollDelta;
    if (leftEdge < 0) {                                 // clip left side
      leftClip = -leftEdge;
      if (leftClip > imageWidth) leftClip = imageWidth;
      } else
      leftClip = 0;           
    if (rightEdge > scrollerWidth) {                    // clip right side 
      rightClip = imageWidth - (rightEdge - scrollerWidth);  
      if (rightClip < 0) rightClip = 0;
      } else
      rightClip = imageWidth;
    img.moveTo(leftEdge, 0);
    img.clip(leftClip, 0, rightClip, imageHeight);
    }          


//
// Draw all images at correct position, scroll when requested
//
function drawItems(no_scroll) {
  if (no_scroll !== true) {                            // note: not given = null/undefined
    scrollDelta -= scrollSpeed;                         // shift all images
    if (scrollDelta == (-imageWidth)) {                 // shifted one image width?    
      scrollingImg.shift();                             // remove first image
      scrollDelta = 0;                                  // reset scrollDelta
      loadItems(2000);                                 // load items, start scrolling after a 2s wait      
      return;                   
      }
    }             
  for (i = 0; i < scrollingImg.length; i++) {     
    placeImg(scrollingImg[i], i*imageWidth + scrollDelta);
    scrollingImg[i].show();
    }    
  setTimeout(drawItems, 60);                          // wait a bit, scroll items    
  }    

   
//
// Fill scrollbar (adding images when needed)
//    
function loadItems(timeout) {
    var new_img;   
    if (typeof(this.data) == 'undefined') this.data = [];
    for (i = scrollingImg.length; i < noOfItems; i++) {   // fill-up array
      new_img = this.data.pop();                          // fetch new image 
      if (!new_img) {                                     // no images in storate!
        var _this = this;        
        ajax.AjaxRequest(ajax_url, function(newdata) { _this.data = eval(newdata); loadItems(timeout); });            // fetch more (will call us back on completion)
        return(false);
        }                                                 
      scrollingImg[i] = new JSFX.Layer("<A HREF='" + new_img.href + "' BORDER='0'><IMG SRC='" + new_img.img + "' CLASS='elemFader6'></A>", placeholder);
      scrollingImg[i].setzIndex(1);
      scrollingImg[i].resizeTo(imageWidth, imageHeight);
      }
   setTimeout(drawItems, timeout);                        // wait a bit, draw images      
   return(true);
   }
     	

window.onresize = repositionAll;

function repositionAll() {
  // reposition layers
  sAnchor = getLayer("scrollAnchor");
  placeholder.moveTo(scrollerX + getPageLeft(sAnchor) ,scrollerY + getPageTop(sAnchor) );
  moveLayerTo(getLayer("popupTypeId"), (-85+getPageLeft(sAnchor)),  (254+getPageTop(sAnchor)));
  moveLayerTo(getLayer("popupSeriesId"), (20+getPageLeft(sAnchor)),  (254+getPageTop(sAnchor)));
  moveLayerTo(getLayer("popupBasketId"), (272+getPageLeft(sAnchor)),  (254+getPageTop(sAnchor)));
  }