// scroller for timeline
// custom built - not suitable for reuse!
                var myScroller;
                var MaxWidth;
                var ItemWidth;
                
                var currMoveDirectionRequest = 0;
                var TargetPosition = 0;
                
                function InitialiseTimeLine()
                {
                    myScroller = document.getElementById("timeline");
                    MaxWidth = 3678;
                    ItemWidth = 613;
                }
                
                function MoveLeft()
                {
                    currMoveDirectionRequest=currMoveDirectionRequest+1;
                    TargetPosition = ((Math.round(myScroller.scrollLeft/ItemWidth) - 1) * ItemWidth);
                    //check our start point is one of our predefined end points!
                    
                    if (TargetPosition < 0){TargetPosition=0;}
                    ScrollTo(currMoveDirectionRequest);
                }
            
               function MoveRight(){
                    currMoveDirectionRequest=currMoveDirectionRequest+1;
                    TargetPosition = ((Math.round(myScroller.scrollLeft/ItemWidth) + 1) * ItemWidth);
                    if (TargetPosition >= (MaxWidth-ItemWidth)){TargetPosition=MaxWidth-ItemWidth;}
                    //alert(TargetPosition);
                    ScrollTo(currMoveDirectionRequest);
               }    
               
                
                function ScrollTo(RequestID){
                    // get the current position
                    var currPosition = myScroller.scrollLeft;
                    var totalMoveSize = TargetPosition - currPosition;
                    var StepSize=40;
                    var loop = true;
                    //alert(TargetPosition);
                    if(totalMoveSize==0){StepSize=0; loop=false;return;}
                    if(totalMoveSize<0){StepSize=-StepSize;}
                    
                    // work out if one step will get us to the final position
                    if (totalMoveSize <= StepSize && totalMoveSize>0 ||  totalMoveSize >= StepSize && totalMoveSize<0)
                    {
                        StepSize = totalMoveSize;
                        loop = false;
                        //alert('Current: ' + currPosition + '. Target: ' + TargetPosition + '. StepSize: ' + StepSize + '. Will stop at: ' + parseInt(currPosition + StepSize));
                    }
                    
                    // before we do this, check we haven't been interupted by a request the other way!
                    if (RequestID!=currMoveDirectionRequest) {StepSize=0; loop=false;}
                    
                    
                    StepTo(currPosition + StepSize);
                    // if not, we need to call this again!
                    if (loop){
                    
                    setTimeout("ScrollTo(" + RequestID + ")", 50)
                    
                    }
                }
                
               function StepTo(newPosition){
                    myScroller.scrollLeft=newPosition;
                   // document.getElementById("reporting").value=newPosition;
               }