var direction = -1.00;
var oldDirection;
var boxCount = 23;
var boxes = {};
var lastTime = new Date();
var maxWidth;

var timeSpeed = 16;
var rate = 24;

function startMove() {
    var _boxes = $(".note");
    maxWidth = $("#moveContain")[0].offsetWidth;

    _boxes.each(function (idx, e) {
        var id = parseInt($(e).attr('id').replace("box_", ''));
        boxes[id] = { el : e, $el : $(e), offsetLeft : e.offsetLeft };
    });
    boxCount = _boxes.length;
    moveBoxes = setInterval("move()", 1000 / rate);
}

function move() {
    //var diff = new Date() - lastTime;
    //lastTime = new Date();
    var amount = direction;
    //  var amount = direction * (diff / 1000) * timeSpeed;
    //console.log(amount);
  
    if (direction < 0) {
        for (var i = 0; i < boxCount; i++) {
            boxes[i].offsetLeft = boxes[i].offsetLeft + amount;

            if (boxes[i].offsetLeft < 0 - boxes[i].el.offsetWidth) {
                if (i == 0) {
                    var picwidth = boxes[boxCount - 1].el.offsetWidth - 5;
                    boxes[i].offsetLeft = boxes[boxCount - 1].offsetLeft + picwidth;
                }
                else {
                    var picWidth = boxes[i - 1].offsetLeft + boxes[i - 1].el.offsetWidth;
                    boxes[i].offsetLeft = picWidth;
                }
            }
            
            boxes[i].$el.css("left", boxes[i].offsetLeft);
        }
    }
    else {
        for (var i = boxCount - 1; i >= 0; i--) {

            boxes[i].offsetLeft = boxes[i].offsetLeft + amount;
            
            if (boxes[i].offsetLeft > maxWidth) {
                if(i == (boxCount - 1)) {
                    boxes[i].offsetLeft = boxes[0].offsetLeft - boxes[0].el.offsetWidth + 5;
                } else {
                    boxes[i].offsetLeft = boxes[i + 1].offsetLeft - boxes[i + 1].el.offsetWidth + 5; 
                }
            }

            boxes[i].$el.css("left", boxes[i].offsetLeft);
        }
    }
}
function changeDirection(newDirection) {
    oldDirection = direction;
    direction = newDirection;
}

$(document).ready(function () {
  //  startMove();
});