MVC: приказывает контроллеру остановиться - PullRequest
0 голосов
/ 13 июля 2011

Я экспериментирую с моделями javascript и MVC.Я хочу (упрощенный пример) переместить объект по экрану на произвольное количество пикселей от 1 до 10, а затем остановить его, когда он достигнет, скажем, 400 пикселей.

Настройка view настроенанаблюдать за model, который имеет функцию notifyObservers().

Когда нажата кнопка запуска на view, он отправляет сообщение startButtonClicked на controller.

controller.startButtonClicked = function () {

    var animate = function () {

        controller.getModel().shift();  // get the model and run the shift() function
        setTimeout(animate, 20);
    };

    animate();
}

При этом запускается model функция shift():

model.shift = function () {

    if(model.x < 400) {
        model.x += Math.floor(Math.random()*11);  // Add up to 10 pixels
    }

    model.notifyObservers();  // Tells view to update, 
};

Это отлично работает, и объект останавливается на расстоянии около 400 пикселей, как и должно быть.Однако цикл setTimeout в controller.startButtonClicked() все еще не работает.

[Редактировать: Насколько я понимаю, традиционная модель MVC не позволяет model напрямую взаимодействовать с controller, поэтомумодель не может просто сказать контроллеру остановить таймер.]

Итак, наконец, вопрос: Как мне сделать цикл в контроллере остановленным?

Возможные решения, о которых я подумал:

  • Получите модель, чтобы сообщить вид, который затем сообщает контроллеру.Но это кажется очень скучным.
  • Заставьте контроллер спросить модель, сделано ли это.Но, похоже, это идет вразрез со структурой MVC.
  • Получите функцию shift(), которая возвращает false в контроллер, когда это будет сделано.

Любой, кто делал MVC дляв то время как знаете, как правильно это сделать?

Спасибо!

Ответы [ 2 ]

0 голосов
/ 13 июля 2011

Примерно так:

var t;  // feel free to make this a non global variable
controller.startButtonClicked = function () {

    var animate = function () {

        controller.getModel().shift();  // get the model and run the shift() function
        t = setTimeout(animate, 20);
    };

    animate();
}


model.shift = function () {

    if(model.x < 400) {
        model.x += Math.floor(Math.random()*11);  // Add up to 10 pixels
    }
    else { 
        clearTimeout(t);
    }

    model.notifyObservers();  // Tells view to update, 
};
0 голосов
/ 13 июля 2011

Вам необходимо использовать clearTimeout(arg), где arg - это возвращаемое значение из вызова setTimeout.

Кроме того, будьте осторожны с низкими (<50) значениями для setTimeout (), то, что вы кодировали, вызывает анимацию 50 раз в секунду. </p>

controller.startButtonClicked = function () {

  var animate = function () {

    var m = controller.getModel();
    m.shift(controller);  // get the model and run the shift() 
    m.timerInterval = setTimeout(animate, 20);
  };

  animate();
}

model.shift = function () {

   if(model.x < 400) {
      model.x += Math.floor(Math.random()*11);  // Add up to 10 pixels
   }
   else if (model.timerInterval)
   {
     clearTimeout(model.timerInterval);
   }
   model.notifyObservers();  // Tells view to update, 
};
...