Ruby on Rails 4.2 - 用于更新进度条的jQuery和JSON

时间:2015-12-04 03:04:29

标签: jquery ruby-on-rails ruby json

*从评论中更新12/15。

我仍然被卡住了。请TL:DR向下滚动查看代码。

我正在为一个项目完成一个骰子滚动Web应用程序。我的导师已经要求请求进度条指示运行状态。 A'跑步'被定义为' roll'的集合,其中包含一个或多个' di(c)e'其中包含一个或多个'结果' - 1与用户选择的每个骰子的边数之间的随机数。

您可能会了解后端数据库的架构是什么样的。

进度条 - 只有两个 - 会跟踪当前正在处理哪个掷骰子,以及与用户提交的最近作业中将有多少骰子进行比较。

这些作业使用ActiveJob和SuckerPunch是异步的。它创建一个执行所有计算和数据写入的作业。问题是,我似乎无法通过AJAX实时获取数据。我对java中当前Rails变量的引用会拉出null或未定义的错误,以及任何尝试放置" respond_to"我的工作中的障碍比我在大学一年级代数中的失败更糟糕。

这是相关的代码。

runs_controller.rb(创建方法)

def create

@job = RollDiceJob.perform_later(run_params)
sleep(1)

respond_to do |format|
  format.js {}
end

roll_dice_job.rb

  class RollDiceJob < ActiveJob::Base
  queue_as :low_priority

  def perform(run_params)
    # Do something later

    # Create the new run record.
    @run = Run.create(run_params)
    # apply the job_id to the job_id field of the run
    @run.job_id = self.job_id
    @run.save

    # Assign local variables for use in the job.
    roll_count = @run.roll_count.to_i # Integer value of roll_count field
    die_count = @run.die_count.to_i # ^^
    die_sides = @run.die_sides.to_i # ^^

    @natural = 0
    @total = 0

    # set counters for iterating through rolls and dice.
    i = 0


    # Start roll iterations

    while i < roll_count do
      #update the current roll field in the run table
      @run.current_roll = i+1
      @run.save

      # Set roll env variable to create a new Roll record passing the new roll_number as value of 'i' with each
      # iteration

      @roll = Roll.create(:run_id => @run.id, :roll_number => i+1)

      # increment to the next roll


      d = 0

      # start result iterations

      while d < die_count do
        #update the current die field in the run table
        @run.current_dice = d+1
        @run.save

        # Generate the random number.
        output = rand(1..die_sides)

        if output == die_sides
          @natural +=1
        end

        # Set results env variable to create a new Result record passing the die_number as the value of current
        # iteration 'd' and the output to the value of the array at 'd'

        @result = Result.create(:roll_id => @roll.id, :die_number => d+1, :output => output)

        @total += output

        d += 1

      end

      i += 1

    end

  end

end

create.js.erb

var max_roll = parseInt('<%= Run.get_roll_count(@job.job_id) %>', 10);
var max_dice = parseInt('<%= Run.get_die_count(@job.job_id) %>', 10);

$('#test').text('test: ' + max_roll + ' ' + max_dice)

if ($('#die_count').val() != '' && $('#roll_count').val() != '') {
  $('#notify').fadeOut('fast', function () {
    $('#submit_success_header').text('Run <%= Run.get_run_submitted(@job.job_id) %> submitted successfully.');
  });

  // $('#roll').attr('aria-valuemax', max_roll)
  // $('#dice').attr('aria-valuemax', max_dice)

  $('#notify').fadeIn();

  $('#die_count').val('');
  $('#roll_count').val('');

} else {
  alert("Please enter a value!")
  if ($('#die_count').val() != '') {
    $('#roll_count').focus();
  } else {
    $('#die_count').focus();
  }
}

$('#notify').html('<%= j render 'runs/submit' %>')

runs_submit.html.erb

<h3 id="submit_success_header"></h3>
<span id="test"></span>
<script>
  var roll_int = setInterval(function() {
    var current_roll = parseInt('<%= Run.get_current_roll(@job.job_id) %>', 10);
    var roll_dec = current_roll / max_roll;
    var roll_per = roll_dec * 100;
    $('#roll').attr({
    'aria-valuenow': current_roll,
    style: 'width:' + roll_per + '%'
  });
    $('#roll_progress_label').text(current_roll + '/' + max_roll);

    if (current_roll == max_roll) {
      clearInterval(roll_int)
    }
  }, 100);

  var dice_int = setInterval(function()  {
    var current_dice = parseInt('<%= Run.get_current_dice(@job.job_id) %>', 10);
    var dice_per = (current_dice / max_dice) * 100;
    $('#dice').attr({
      'aria-valuenow': current_dice,
      style: 'width:' + dice_per + '%'
    });

    $('#dice_progress_label').text(current_dice + '/' + max_dice);

    if (current_dice == max_dice) {
      clearInterval(dice_int)
    }
  }, 100);
</script>
<div class="progress">
  <div id="roll" class="progress-bar progress-bar-striped active" role="progressbar" data-roll_count="" aria-valuenow="70"
       aria-valuemin="0" aria-valuemax="" style="width:100%">
    <span id="roll_progress_label"></span>
  </div>
</div>

<div class="progress">
  <div id="dice" class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="70"
       aria-valuemin="0" aria-valuemax="100" style="width:70%">
    <span id="dice_progress_label"></span>
  </div>
</div>

我似乎无法弄清楚为什么调用模型方法的ERB不会按照间隔进行读取。请帮忙。谢谢!

0 个答案:

没有答案