JSFiddle - React, Tailwind, and code Playground

by Travis Harris

HTML

<table id='form'>
<tr>
  <th>Total Winnings:</th>
  <td><input type='text' id='total_winnings' value='0' disabled='disabled' /></td>
</tr>
<tr>
  <th>Bankroll:</th>
  <td><input type='text' id='bankroll' value='12'/></td>
</tr>
<tr>
  <th>Bank Above:</th>
  <td><input type='text' id='bank_above' value='12'/></td>
</tr>
<tr>
  <th>Min Bet:</th>
  <td><input type='text' id='min_bet' value='.01'/></td>
</tr>
<tr>
  <th>Max Bet:</th>
  <td><input type='text' id='max_bet' value='50'/></td>
</tr>
<tr>
  <th>Line:</th>
  <td><select id='line'>
<option value='blue'>Blue</option>
<option value='green'>Green</option>
<option value='yellow'>Yellow</option>
<option value='red'>Red</option>
<option value='promo'>Promo</option>
</select></td>
</tr>
<tr>
  <th>Positive Progression:</th>
  <td><input type='text' id='p_progression' value='.25'/></td>
</tr>
<tr>
  <th>Negative Progression:</th>
  <td><input type='text' id='n_progression' value='9.3'/></td>
</tr>
<tr>
  <th>Fee to luckyb.it:</th>
  <td><input type='text' id='fee_to' value='.001'/></td>
</tr>
<tr>
  <th>Fee from luckyb.it:</th>
  <td><input type='text' id='fee_from' value='.001'/></td>
</tr>
<tr>
  <td colspan='2' align='right'><button id='roll' onclick='simulate();'>Run Simulation</button></td>
</tr>
</table>
<table id='promo'>
<tr>
  <th colspan='2'>Promo Line (Left to middle):</th>
</tr>
<tr>
  <td colspan='2'><input type='text' id='promo0' value='9999' />
<input type='text' id='promo1' value='333' />
<input type='text' id='promo2' value='11' />
<input type='text' id='promo3' value='2' />
<input type='text' id='promo4' value='0.4' />
<input type='text' id='promo5' value='0.3' />
<input type='text' id='promo6' value='0.2' />
<input type='text' id='promo7' value='0.1' />
<input type='text' id='promo8' value='1.5' /></td>
</tr>
</table>
<div id='tables'>
<table id='summary'>
    <thead>
    <tr>
      <th># of bets</th>
      <th>Total Bet</th>
      <th>Balance</th>
      <th>Bank</th>
      <th>Fees Paid</th>
   ...

CSS

body{
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  font-size:10px;  
}
#promo0,#promo1,#promo2,#promo3,#promo4,#promo5,#promo6,#promo7,#promo8{
  width:27px;
}
#tables table td{
  text-align:center;
}
td{
    border:1px solid black;
}
table{
  margin-bottom:5px;
  border-collapse:collapse;
}
th{
  color:white;
  background-color:black;
  font-weight:bold;
  border-right:1px solid white;
  border-top:1px solid white;
}
th:last-child{
  border-right:1px solid black;
}
thead th{
  border-top:1px solid black;
}
input,select{
  font-size:inherit;
}
#promo{
  display:none;
}

JavaScript

var lines = {
  blue:{
    row:[3,1.4,1.3,1.2,1.1,.2,1.1,1.1,1.1],
    min:.01,
    max:25
  },
  green:{
    row:[22,5,3,2,1.4,1.2,1.1,1,0.4],
    min:.01,
    max:2.5
  },
  yellow:{
    row:[111,38,12,5,3,1.4,1,0.5,0.3],
    min:.01,
    max:0.5
  },
  red:{
    row:[999,130,24,9,4,2,.2,.2,.2],
    min:.01,
    max:.05
  },
  red:{
    row:[999,130,24,9,4,2,.2,.2,.2],
    min:.01,
    max:.05
  }
};
simulate = function(){
  //Config area
  var bankroll = $('#bankroll').val();
  var total_winnings = $('#total_winnings').val();
  var bank_above = $('#bank_above').val();
  var min_bet = $('#min_bet').val();
  var max_bet = $('#max_bet').val();
  var p_progression = $('#p_progression').val();
  var n_progression = $('#n_progression').val();
  var line = $('#line').val();
  var fee_to = $('#fee_to').val();
  var fee_from = $('#fee_from').val();
  var promo = {
    row:[
    $('#promo0').val(),
    $('#promo1').val(),
    $('#promo2').val(),
    $('#promo3').val(),
    $('#promo4').val(),
    $('#promo5').val(),
    $('#promo6').val(),
    $('#promo7').val(),
    $('#promo8').val()
    ],
    min:.01
  };
  promo.max = Math.floor(100/Math.max.apply(null, promo['row'])*100)/100;
  total_winnings -= bankroll;
  var to_delete = document.querySelectorAll('#tables table tbody,#bets thead');
  for(var k=0;k<to_delete.length;k++){
    to_delete[k].parentNode.removeChild(to_delete[k]);
  }
  if(typeof lines[line.toLowerCase()] === 'undefined'){
    throw "Invalid Line Specified";
  }
  line = lines[line.toLowerCase()];
  var row = line.row;
  if(line.min > min_bet)min_bet = line.min;
  if(line.max < max_bet)max_bet = line.max;
  var transfer_fee = (fee_to * 1) + (fee_from * 1);
  var min_unit = 0.00000001;
  var max_bets = 100000;
  var r = row.concat(row.slice(0,-1).reverse());
  var _r = Array.apply(null, Array(r.length)).map(Number.prototype.valueOf,0);
  var m = 1/min_unit;
  function to_units(val){
    return Math.floor(val*m);
  }
  function from_units(val){
   ...