CH Raid Reward

by Bateman

HTML

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.5/js/materialize.min.js"></script>
<div class="container">
  <div class="row">
    <div class="col s12">
      <h1>Raid Reward</h1>
    </div>
  </div>

  <div class="row">
    <div class="col s12">

      <div class="row">
        <div class="input-field col s4">
          <input type="text" id="raidLevel">
          <label for="raidLevel" id="raidLevelLbl">Raid level</label>
        </div>
        <div class="input-field col s4">
          <input type="text" id="percent">
          <label for="percent" id="percentLbl">Percent</label>
        </div>
        <div class="input-field col s4">
          <input type="text" id="hs">
          <label for="hs" id="hsLbl">Hero souls</label>
        </div>
      </div>

      <div class="row">
        <div class="col s4">
          Reward:
          <span id="reward"></span>
        </div>
      </div>

    </div>
  </div>



</div>

CSS

.over-tenth {
  color: red;
}

JavaScript

function calc() {
  "use strict";
  const lvl = parseInt(raidLevel.value, 10);
  const p = parseInt(percent.value, 10);
  const souls = parseInt(hs.value, 10);

  if (isFinite(lvl) && isFinite(p)) {
    let r, base, overTenth = false;
    if (lvl <= 12) {
      base = lvl;
    } else {
      base = Math.ceil(Math.pow(2, lvl - 1) / (100 + lvl * 10));
    }
    r = Math.ceil(5 * base * (0.1 + 0.01 * p));
    if (isFinite(souls)) {
      const tenth = souls * 0.1;
      if (r > tenth) {
        overTenth = true;
        r = Math.ceil(tenth);
      }
    }

    const persist = {
      level: lvl,
      percent: p,
      hs: souls
    };
    localStorage.setItem('CH_data', JSON.stringify(persist));

    reward.textContent = r.toExponential(2);
    if (overTenth) {
      reward.classList.add('over-tenth');
    } else {
      reward.classList.remove('over-tenth');
    }
  } else {
    reward.textContent = '';
    reward.classList.remove('over-tenth');
  }
}
raidLevel.addEventListener('keyup', calc);
percent.addEventListener('keyup', calc);
hs.addEventListener('keyup', calc);

(function() {
  const persist = localStorage.getItem('CH_data');
  if (persist) {
    const data = JSON.parse(persist);
    raidLevel.value = data.level;
    percent.value = data.percent;
    raidLevelLbl.classList.add('active');
    percentLbl.classList.add('active');
    if (data.hs) {
      hs.value = data.hs;
      hsLbl.classList.add('active');
    }

    calc();
  }
})();