Javascript 在Rails中创建在后端重置的倒计时计时器
我目前正在创建一个Rails测验应用程序,它带有一个计时器,可以倒计时回答问题剩下的秒数 在我的第一个版本中,我采用了一种简单的方法:为计时器创建一个变量,一个秒的实例,然后将其作为测验Javascript的一部分,如下所示:Javascript 在Rails中创建在后端重置的倒计时计时器,javascript,ruby-on-rails,Javascript,Ruby On Rails,我目前正在创建一个Rails测验应用程序,它带有一个计时器,可以倒计时回答问题剩下的秒数 在我的第一个版本中,我采用了一种简单的方法:为计时器创建一个变量,一个秒的实例,然后将其作为测验Javascript的一部分,如下所示: Quiz = function() { this.quizCurrent = 0; this.score = 0; this.seconds = 10; this.timing = this.seconds; this.container = $('#
Quiz = function() {
this.quizCurrent = 0;
this.score = 0;
this.seconds = 10;
this.timing = this.seconds;
this.container = $('#trivia');
this.participationId = null;
}
Quiz.prototype.init = function() {
$('#trivia').on('click', '.btn.btn-primary-questions', this.checkAnswer.bind(this));
$('div.timer strong').text(this.seconds)
this.start();
}
我现在想使用Rails将其移动到后端。前面的一个问题提到了,但这似乎提出了两个问题:
1) 我需要反复调用日期/时间,并验证每个问题(我认为我不能用倒计时来验证),以及
2) 理想情况下,我可以将该值作为变量传递到Javascript中
在该gem的文档中,它展示了如何将倒计时时间直接传递到视图中。但是,作为验证的一部分,我使用倒计时值(换句话说,当倒计时值为零时)强制用户进入下一个问题,同时记录错误答案,如下所示:
Quiz.prototype.timer = function() {
var that = this;
this.timing--;
$('div.timer strong').text(this.timing);
if (this.timing <= 0) {
self.stop();
$.getJSON('/api/skip_question/' + this.participationId, function() {
that.nextQuestion();
})
}}
quick.prototype.timer=函数(){
var=这个;
这是时间;
$('div.timer strong').text(this.timing);
如果(this.timing我对倒计时宝石一无所知,但我想到了一个简单的解决方案
假设您在后端保留一个时间戳,当您的js测试开始时,它会让后端知道测试已经开始
$.getJSON('/api/start_quiz/', function() {
//do whatever javascript starts the quiz.
})
在后端,假设您有一个QuizAttempt模型,该模型具有相应的数据库值'trunt\u timestamp':
def start_quiz
QuizAttempt.create(user_id: current_user.id, attempt_timestamp: Time.now)
end
然后,您可以有一个before过滤器,用于确定跳过问题和回答问题端点的时间是否已用完(在我的示例中,有8分钟的时间限制)
before_filter :check_time, only: [:skip_question, :answer_question]
def check_time
#get last attempt
last_attempt = QuizAttempt.where(user_id: current_user.id).last
if (last_attempt.attempt_timestamp + 8.minutes) < Time.now
#time is up
return false
end
end
筛选前:检查时间,仅:[:跳过问题,:回答问题]
def检查时间
#最后一次尝试
last_尝试=QuizAttempt.where(用户id:当前用户id)。last
如果(最后一次尝试尝试时间戳+8分钟)
附带想法:您还可以添加一个端点,该端点使用记录的时间戳进行响应,以便将js时钟与数据库中的时间戳同步
编辑:保存所述时间戳的另一个可能位置可能在会话中,而不是数据库中