$(document).ready(function(){
  var currentPosition01 = 0;
  var currentPosition02 = 0;
  var currentPosition03 = 0;
  var newsWidth = 210; 
  var maxNews = 15;
  
  // Name of container, number of news, number of pages, Inner Wrap, Control, Left, Right, Point Prefix
  var news_def = new Array(
    new Array(0, 'newsGroup_01', 'newsInner01', 'newsGroup_01_pager', '/index.php?id=wein'),
    new Array(1, 'newsGroup_02', 'newsInner02', 'newsGroup_02_pager', '/index.php?id=gourmet'),
    new Array(2, 'newsGroup_03', 'newsInner03', 'newsGroup_03_pager', '/index.php?id=reisen'),
    new Array(3, 'newsGroup_RE', 'newsInnerRE', 'newsGroup_RE_pager', '')
  );
  var news_state = new Array( 
    new Array(0,0,0), 
    new Array(0,0,0), 
    new Array(0,0,0), 
    new Array(0,0,0) 
  );

  initSlider(news_def[0]);
  initSlider(news_def[1]);
  initSlider(news_def[2]);
  initSlider(news_def[3]);
  
  
    function manageControls(currentID){
        for (i=0; i<Math.ceil(news_state[currentID][1]/3); i++) {
            if (news_state[currentID][0] == i) {
                $('#navpoint0'+currentID+i).attr("src",'fileadmin/templates/activeCar.gif');
            } else {
                $('#navpoint0'+currentID+i).attr("src",'fileadmin/templates/inactiveCar.gif');             
            }
        }
    }   
  
    function initSlider(newsdef) {
        var news = $('#'+newsdef[1]+' .news');
        if (news) {
            news_state[newsdef[0]][1] = news.length;
            news_state[newsdef[0]][2] = Math.ceil (news_state[newsdef[0]][1] / 3);

            $('#'+newsdef[1]).css('overflow', 'hidden');
            news
                .wrapAll('<div id="'+newsdef[2]+'"></div>')
                // Float left to display horizontally, readjust .slides width
                .css({
                    'float' : 'left',
                    'width' : newsWidth - 14,
                    'padding' : '0 7 0 7'
                });
           // Set #slideInner width equal to total width of all slides
           $('#'+newsdef[2]).css('width', (newsWidth)* news_state[newsdef[0]][1]);  
           
           // Insert left and right arrow controls in the DOM
           for (i=0; i< news_state[newsdef[0]][2]; i++) {
                $('#'+newsdef[3]).append('<img src="fileadmin/templates/inactiveCar.gif" id="navpoint0'+newsdef[0]+i+'" class="navcontrol0'+newsdef[0]+'">');
           }
           $('#'+newsdef[3]).append('<img src="fileadmin/templates/backward.gif" id="navleft0'+newsdef[0]+'" class="navcontrol0'+newsdef[0]+'">');
           $('#'+newsdef[3]).append('<img src="fileadmin/templates/forward.gif" id="navright0'+newsdef[0]+'" class="navcontrol0'+newsdef[0]+'">');
           
           manageControls(newsdef[0]);
           
             // Create event listeners for .controls clicks
           $('.navcontrol0'+newsdef[0])
            .bind('click', function(){
                currentID = parseInt($(this).attr('class').substring(11));
                // Determine new position
                if ($(this).attr('id').substring(0,8) == 'navpoint') {
                    news_state[currentID][0] = parseInt($(this).attr('id').substring(10));
                } else {
                    if ($(this).attr('id').substring(0,7)=='navleft') {
                        if (news_state[currentID][0] > 0) { news_state[currentID][0]=news_state[currentID][0]-1; }
                    } else {
                        if (news_state[currentID][0] < (news_state[currentID][2]-1)) { news_state[currentID][0]=news_state[currentID][0]+1; } 
                        else {
                            if ((news_state[currentID][1] >= maxNews) && (news_def[currentID][4] != '')) window.location.href = news_def[currentID][4];
                        }
                    }
                }
            
                // Hide / show controls
                manageControls(currentID);
            
                // Move slideInner using margin-left
                $('#'+news_def[currentID][2]).animate({
                    'marginLeft' : newsWidth*3*(-news_state[currentID][0])
                },800);
            });
        }    
    }
 });