/**
 * @author David Buttar
 * 
 * Handles UI interaction on the cb vizual dashboard
 * 
 *
 */

(function(){

      var dash = function(opts, c){
      var that = {};
      var curPos = 0;
      var chartCount = $('.demo-item').length;
      var itemWidth = $('.demo-item').outerWidth(true);
      var animateChartTimeout;
      
      that.moveTo = function(pos){
            if(pos > chartCount-1 || pos < 0) return false;
            var difference = (curPos - pos);
            var offset = itemWidth;
            var marLeft = 0;
            unselect(curPos);
            var leftPos = -curPos*offset + difference*offset;
            curPos = pos;
            select(curPos);
            if (curPos) leftPos = leftPos - marLeft;

            $('.chart-carousel').css({'left':leftPos+"px"});
            return false;
      }
      
      function select(item_num){
            var el = $('.demo-item')[item_num];
            //cb.scale(el, 1);
            margin_left = (item_num)?'210px':'0px';
            //$(el).css({'opacity':1});
      }
      
      function unselect(item_num){
            var el = $('.demo-item')[item_num];
            //cb.scale(el, 0.5);
            //$(el).css({'opacity':0});
      }
      
      //call to set the state of UI elements correctly
      function updateElements(){
            if(curPos === 0){
                  $('#prev').css({'opacity':0, 'cursor':'default'});
            }else{
                  $('#prev').css({'opacity':1, 'cursor':'pointer'});
                  if($('#prev')[0].style.filter){
                        $('#prev')[0].style.removeAttribute('filter');
                  }
            }
            
            if(curPos >= chartCount-1){
                  $('#next').css({'opacity':0 ,'cursor':'default'});
            }else{
                  $('#next').css({'opacity':1, 'cursor':'pointer'});
                  if($('#next')[0].style.filter){
                        $('#next')[0].style.removeAttribute('filter');
                  }
            }
      }
      
      $('#next').click(function(){
            that.moveTo(curPos+1);
            updateElements();
            return false;
      });
      
      $('#prev').click(function(){
            that.moveTo(curPos-1);
            updateElements();
            return false;
      });
      
      $('.animate').click(function(){
            charts[curPos].animate();
      });
      
      $('.invert').click(function(){
            charts[curPos].invert();
      });
      
      $(document).keydown(function(e){
           if(e.keyCode === 37){ // Go back
              that.moveTo(curPos-1);
              updateElements();
           }
           
           if(e.keyCode === 39){ // Go forward
              that.moveTo(curPos+1);
              updateElements();
           }
      });
      
      updateElements();
      
      that.moveTo(0);

      cb.transition($('#prev, #next, #prev span, #next span, #controls'), 'all', '.4s');

      return that

      };

       cb.dash = dash;
      
})();