User Tools

Site Tools


public:quotacalculator

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

public:quotacalculator [2019/11/01 21:14] (current)
Line 1: Line 1:
 +Quota Calculator
 +
 +<html>
 +<script type="text/javascript">/*<![CDATA[*/
 +
 +var param = {}
 +
 +param['SERVER'     = window.location.hostname
 +param['HREF'       = window.location.href
 +
 +var args = ['BERTHING',
 +            'TOTBW_TOSHORE',
 +            'TOTBW_TOSHIP',
 +            'INETALLOC_TOSHORE_PERCENT',
 +            'INETALLOC_TOSHIP_PERCENT']
 +
 +var default_toshore = 256
 +var default_toship  = 512
 +
 +// Setting URL Args
 +for (a in args) {
 +  if (param.hasOwnProperty(args[a])) {
 +    document.getElementById(String(args[a]).toLowerCase()).value = param[args[a]]
 +    if(args[a].match(/^INETALLOC_/)) {
 +      document.getElementById(String(args[a].toLowerCase()).replace(/percent/, 'sciops')).value = param[args[a]]
 +      document.getElementById(String(args[a].toLowerCase()).replace(/percent/, 'capport')).value = 100 - Number(param[args[a]])
 +    }
 +  }
 +}
 +
 +
 +// Initial Values
 +update_bw('totbw_toshore', default_toshore)
 +update_bw('totbw_toship', default_toship)
 +//update_bw('inetalloc_toshore_percent', 25)
 +//update_bw('inetalloc_toship_percent', 25)
 +//update_bw('berthing', 40)
 +
 +
 +function update_up(val) {
 +  document.getElementById('kbps_up').value = val
 +  document.getElementById('kbps_up_slider').value = val
 +  document.getElementById('daily_up').innerHTML = val * 3600 * 24 / 8 / 1000
 +}
 +
 +function update_down(val) {
 +  document.getElementById('kbps_down').value = val
 +  document.getElementById('kbps_down_slider').value = val
 +  document.getElementById('daily_down').innerHTML = val * 3600 * 24 / 8 / 1000
 +}
 +
 +function update_bw(id, val) {
 +  //console.log("UPDATE: " + id + ' : ' + val)
 +
 +  // Update Input Values
 +  if(id.match(/_slider$/)) {
 +    var textbox_id = id.replace(/_slider$/, '')
 +    //console.log("SLIDER " + textbox_id)
 +    document.getElementById(textbox_id).value = document.getElementById(id).value
 +  } else if(id.match(/^totbw_/)) {
 +    //console.log("TOTBW " + id)
 +    //console.log("SLIDER ID: " + document.getElementById(id + '_slider').id + ' val: ' + document.getElementById(id + '_slider').value)
 +    document.getElementById(id + '_slider').value = document.getElementById(id).value
 +
 +  } else if(id.match(/^inetalloc_\S+_percent$/)) {
 +    var textbox_id = id.replace(/_percent$/, '')
 +    textbox_id = textbox_id.replace(/^inetalloc_/, '')
 +
 +    document.getElementById('inetalloc_' + textbox_id + '_sciops').value = document.getElementById(id).value
 +    document.getElementById('inetalloc_' + textbox_id + '_capport').value = (100 - document.getElementById(id).value)
 +
 +  } else if(id.match(/^inetalloc_/)) {
 +
 +    var textbox_id = id.replace(/^inetalloc_/, '')
 +    textbox_id = textbox_id.replace(/_\S+$/, '')
 +
 +    document.getElementById('inetalloc_' + textbox_id + '_percent').value = document.getElementById(id).value
 +    document.getElementById('inetalloc_' + textbox_id + '_sciops').value = document.getElementById(id).value
 +    document.getElementById('inetalloc_' + textbox_id + '_capport').value = (100 - document.getElementById(id).value)
 +
 +  } else  {
 +    console.log("WARNING: No Action")
 +  }
 +
 +  // Get Inputs
 +  var input = {}
 +  var inputs = ['berthing',
 +                'totbw_toshore',
 +                'totbw_toship',
 +                'inetalloc_toshore_percent',
 +                'inetalloc_toship_percent']
 +
 +  for (i in inputs) {
 +    input [ inputs[i] ] = document.getElementById(inputs[i]).value
 +  }
 +
 +  input['daily_mb_toshore'] = input['totbw_toshore'] * 3600 * 24 / 8 / 1000
 +  input['daily_mb_toship'] = input['totbw_toship'] * 3600 * 24 / 8 / 1000
 +
 +  input['totbw_up+down'] = Number(input['totbw_toshore']) + Number(input['totbw_toship'])
 +  input['totbw_toshore_percent'] = 100 * Number(input['totbw_toshore']) / Number(input['totbw_up+down'])
 +  input['totbw_toship_percent'] = 100 * Number(input['totbw_toship']) / Number(input['totbw_up+down'])
 +
 +  input['per_user_daily_quota_mb_toshore'] = (1  - Number(input['inetalloc_toshore_percent']) / 100) * Number(input['daily_mb_toshore']) / input['berthing']
 +  input['per_user_daily_quota_mb_toship' = (1  - Number(input['inetalloc_toship_percent']) / 100) * Number(input['daily_mb_toship']) / input['berthing']
 +
 +  input['inetalloc_toshore_capport_mb'] = (1  - Number(input['inetalloc_toshore_percent']) / 100) * Number(input['daily_mb_toshore'])
 +  input['inetalloc_toship_capport_mb' = (1  - Number(input['inetalloc_toship_percent']) / 100) * Number(input['daily_mb_toship'])
 +
 +
 +  input['per_user_daily_quota_mb_denominator'] = Number(input['per_user_daily_quota_mb_toshore']) + Number(input['per_user_daily_quota_mb_toship'])
 +  input['per_user_daily_quota_mb_toshore_percent'] = 100 * input['per_user_daily_quota_mb_toshore'] / input['per_user_daily_quota_mb_denominator']
 +  input['per_user_daily_quota_mb_toship_percent'] = 100 * input['per_user_daily_quota_mb_toship'] / input['per_user_daily_quota_mb_denominator']
 +
 +  console.log(JSON.stringify(input, null, 2))
 +
 +  // Update Calculated Values
 +  //document.getElementById('daily_up').innerHTML = input['daily_mb_toshore']
 +  //document.getElementById('daily_down').innerHTML = input['daily_mb_toship']
 +
 +  document.getElementById('prog_totbw_toshore').style.width = input['totbw_toshore_percent'] + '%'
 +  document.getElementById('prog_totbw_toshore').innerHTML   = input['totbw_toshore'] + ' kbps'
 +  document.getElementById('prog_totbw_toship').style.width  = input['totbw_toship_percent'] + '%'
 +  document.getElementById('prog_totbw_toship').innerHTML    = input['totbw_toship'] + ' kbps'
 +
 +  document.getElementById('prog_daily_toshore').style.width = input['totbw_toshore_percent'] + '%'
 +  document.getElementById('prog_daily_toshore').innerHTML   = input['daily_mb_toshore'] + ' MB'
 +  document.getElementById('prog_daily_toship').style.width  = input['totbw_toship_percent'] + '%'
 +  document.getElementById('prog_daily_toship').innerHTML    = input['daily_mb_toship'] + ' MB'
 +
 +
 +  document.getElementById('prog_inetalloc_toshore_sciops').style.width = input['inetalloc_toshore_percent'] + '%'
 +  document.getElementById('prog_inetalloc_toshore_sciops').innerHTML = Number(Number(input['inetalloc_toshore_percent']) / 100 * Number(input['daily_mb_toshore'])).toFixed(2) + ' MB'
 +  document.getElementById('prog_inetalloc_toshore_capport').style.width = (100 - Number(input['inetalloc_toshore_percent'])) + '%'
 +  document.getElementById('prog_inetalloc_toshore_capport').innerHTML = Number(input['inetalloc_toshore_capport_mb']).toFixed(2) + ' MB'
 +
 +  document.getElementById('prog_inetalloc_toship_sciops').style.width = input['inetalloc_toship_percent'] + '%'
 +  document.getElementById('prog_inetalloc_toship_sciops').innerHTML = Number(Number(input['inetalloc_toship_percent']) / 100 * Number(input['daily_mb_toship'])).toFixed(2) + ' MB'
 +  document.getElementById('prog_inetalloc_toship_capport').style.width = (100 - Number(input['inetalloc_toship_percent'])) + '%'
 +  document.getElementById('prog_inetalloc_toship_capport').innerHTML = Number(input['inetalloc_toship_capport_mb']).toFixed(2) + ' MB'
 +
 +  document.getElementById('prog_daily_per_user_quota_toshore').style.width = input['per_user_daily_quota_mb_toshore_percent'] + '%'
 +  document.getElementById('prog_daily_per_user_quota_toshore').innerHTML = Number(input['per_user_daily_quota_mb_toshore']).toFixed(2) + ' MB'
 +  document.getElementById('prog_daily_per_user_quota_toship').style.width = input['per_user_daily_quota_mb_toship_percent'] + '%'
 +  document.getElementById('prog_daily_per_user_quota_toship').innerHTML = Number(input['per_user_daily_quota_mb_toship']).toFixed(2) + ' MB'
 +
 +  var sharelink = param['BASE_URL'] + '?PAGE=tools_quotacalc&TYPE=HTML'
 +  for (i in inputs) {
 +    sharelink += '&' + String(inputs[i]).toUpperCase() + '=' + input[ inputs[i] ]
 +  }
 +
 +  document.getElementById('sharelink').innerHTML = '<a href="' + sharelink + '">'+ sharelink + '</a>'
 +
 +
 +
 +}
 +
 +
 +
 +/*!]]>*/</script>
 +<div id="main" class="row">
 +
 +
 +
 +<h1>Captive Portal Daily Quota Calculator</h1>
 +
 +<div class="row" style="padding: 15px;">
 +   <div class="col-sm-10" style="background: #FEFEFE; border-radius: 10px; border: 5px solid #D4D8FF; margin-left: 20px; margin-bottom: 10px;">
 +     <div class="row">
 +
 +       <div class="col-sm-12" style="background: #FEFEFE; color: #052243; border-top-left-radius:10px; border-top-right-radius:10px;">
 +         <span style="font-size: 1.5em; font-weight: bold;">Vessel Max Internet Transfer per Day</span><br>
 +         <label><span class="icon-arrow-up" style="color: #4ABF79;"></span><span style="color: #4ABF79;"> To Shore</span> / <span class="icon-arrow-down" style="color: #4A85BF;"></span><span style="color: #4A85BF;"> To Ship</span></label>
 +         <div class="progress">
 +           <div id="prog_daily_toshore" class="progress-bar progress-bar-success" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="width: 33.3333%;">2764.8 MB</div>
 +           <div id="prog_daily_toship" class="progress-bar progress-bar-primary" style="width: 66.6667%;">5529.6 MB</div>
 +         </div>
 +       </div>
 +
 +       <div class="col-sm-12" style="background: #FEFEFE; color: #052243; ">
 +         <span style="font-size: 1.5em; font-weight: bold;">Captive Portal Internet Quota per User per Day</span><br>
 +         <label style="color: #4ABF79;"><span class="icon-arrow-up"></span> To Shore (upload)</label>
 +         <div class="progress">
 +           <div id="prog_daily_per_user_quota_toshore" class="progress-bar progress-bar-success" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="width: 33.3333%;">51.84 MB</div>
 +         </div>
 +
 +         <label style="color: #4A85BF;"><span class="icon-arrow-down"></span> To Ship (download)</label>
 +         <div class="progress">
 +           <div id="prog_daily_per_user_quota_toship" class="progress-bar progress-bar-primary" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="width: 66.6667%;">103.68 MB</div>
 +         </div>
 +
 +       </div>
 +
 +       <div class="col-sm-12" style="background: #eee; color: #052243; height: 30px; border-top: 5px solid #D4D8FF;">
 +         <span style="font-size: 1.2em; font-weight: bold;"><span class="icon-cog"></span> Settings</span>
 +       </div>
 +
 +      <div class="col-sm-6" style="background: #FEFEFE; color: #052243; border-top: 5px solid #D4D8FF;">
 +        <form class="form-inline">
 +          <div class="form-group">
 +            <label for="berthing">Vessel Berthing</label>
 +            <div class="input-group">
 +              <input id="berthing" type="number" min="0" max="100" value="40" step="1" onchange="update_bw(this.id, this.value)" class="form-control" placeholder="Persons">
 +              <div class="input-group-addon">Persons</div>
 +            </div>
 +            <div class="input-group" style="display: none;">
 +              <input id="berthing_slider" type="range" min="0" max="100" value="40" step="1" onchange="update_bw(this.id, this.value)">
 +            </div>
 +          </div>
 +        </form>
 +      </div>
 +
 +      <div class="col-sm-6" style="background: #FEFEFE; color: #052243; border-bottom: 5px solid #D4D8FF;">
 +      </div>
 +
 +      <div class="col-sm-12" style="background: #FEFEFE; color: #052243; height: 15px; border-bottom: 5px solid #D4D8FF;"></div>
 +
 +      <div class="col-sm-12" style="background: #FEFEFE; color: #052243; padding-top: 10px;">
 +        <label>Total Vessel Internet Bandwidth</label>
 +
 +        <div class="progress">
 +          <div id="prog_totbw_toshore" class="progress-bar progress-bar-success" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="width: 33.3333%;">256 kbps</div>
 +          <div id="prog_totbw_toship" class="progress-bar progress-bar-primary" style="width: 66.6667%;">512 kbps</div>
 +        </div>
 +      </div>
 +
 +      <div class="col-sm-6" style="background: #EDFFF4; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <form class="form-inline">
 +          <div class="form-group">
 +            <div class="input-group">
 +              <div class="input-group-addon" style="background: #fff; color: #4ABF79;"><span class="icon-arrow-up2"></span> To Shore</div>
 +              <input id="totbw_toshore" type="number" min="0" max="20480" value="256" step="128" onchange="update_bw(this.id, this.value)" class="form-control" placeholder="kbps" style="background: #fff; color: #4ABF79;">
 +              <div class="input-group-addon" style="background: #fff; color: #4ABF79;">kbps</div>
 +            </div>
 +            <div class="input-group" style="display: none;">
 +              <input id="totbw_toshore_slider" type="range" min="0" max="20480" step="128" value="256" onchange="update_bw(this.id, this.value)">
 +            </div>
 +          </div>
 +        </form>
 +      </div>
 +
 +      <div class="col-sm-6" style="background: #EDF4FF; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <form class="form-inline">
 +          <div class="form-group">
 +            <div class="input-group">
 +              <div class="input-group-addon" style="background: #fff; color: #4A85BF;"><span class="icon-arrow-down2"></span> To Ship</div>
 +              <input id="totbw_toship" type="number" min="0" max="20480" value="512" step="128" onchange="update_bw(this.id, this.value)" class="form-control" placeholder="kbps" style="background: #fff; color: #4A85BF;">
 +              <div class="input-group-addon" style="background: #fff; color: #4A85BF;">kbps</div>
 +            </div>
 +            <div class="input-group" style="display: none;">
 +              <input id="totbw_toship_slider" type="range" min="0" max="20480" step="128" value="512" onchange="update_bw(this.id, this.value)">
 +            </div>
 +          </div>
 +        </form>
 +      </div>
 +
 +      <div class="col-sm-12" style="background: #FEFEFE; color: #052243; height: 15px; border-top: 5px solid #D4D8FF; border-bottom: 5px solid #D4D8FF;"></div>
 +
 +      <div class="col-sm-12" style="background: #EDFFF4; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <label><span class="icon-arrow-up"></span> Upstream Internet Allocation per Day (To Shore)</label>
 +
 +        <div class="progress">
 +          <div id="prog_inetalloc_toshore_sciops" class="progress-bar progress-bar-info" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="width: 25%;">691.20 MB</div>
 +          <div id="prog_inetalloc_toshore_capport" class="progress-bar progress-bar-warning" style="width: 75%">2073.60 MB</div>
 +        </div>
 +
 +        <div class="input-group" style="display: none;">
 +          <input id="inetalloc_toshore_percent" type="range" min="0" max="100" value="25" step="5" onchange="update_bw(this.id, this.value)">
 +        </div>
 +      </div>
 +
 +      <div class="col-sm-6" style="background: #EDFFF4; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <form class="form-inline">
 +          <div class="form-group">
 +            <div class="input-group">
 +              <div class="input-group-addon" style="background: #D7F6F7; color: #007E82;">Science Ops</div>
 +              <input id="inetalloc_toshore_sciops" type="number" min="0" max="100" value="25" step="5" onchange="update_bw(this.id, this.value)" class="form-control" placeholder="0">
 +              <div class="input-group-addon" style="background: #D7F6F7; color: #007E82;">%</div>
 +            </div>
 +          </div>
 +        </form>
 +      </div>
 +
 +      <div class="col-sm-6" style="background: #EDFFF4; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <form class="form-inline">
 +          <div class="form-group">
 +            <div class="input-group">
 +              <div class="input-group-addon" style="background: #FCD5C2; color: #B33C00;">Captive Portal</div>
 +              <input id="inetalloc_toshore_capport" type="number" min="0" max="100" value="75" step="5" onchange="update_bw(this.id, this.value)" class="form-control" placeholder="0" disabled="">
 +              <div class="input-group-addon" style="background: #FCD5C2; color: #B33C00;">%</div>
 +            </div>
 +          </div>
 +        </form>
 +      </div>
 +
 +      <div class="col-sm-12" style="background: #FEFEFE; color: #052243; height: 15px; border-top: 5px solid #D4D8FF; border-bottom: 5px solid #D4D8FF;"></div>
 +
 +      <div class="col-sm-12" style="background: #EDF4FF; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <label><span class="icon-arrow-down"></span> Downstream Internet Allocation per Day (To Ship)</label>
 +
 +        <div class="progress">
 +          <div id="prog_inetalloc_toship_sciops" class="progress-bar progress-bar-info" role="progressbar" aria-valuemin="0" aria-valuemax="100" style="width: 25%;">1382.40 MB</div>
 +          <div id="prog_inetalloc_toship_capport" class="progress-bar progress-bar-warning" style="width: 75%">4147.20 MB</div>
 +        </div>
 +
 +        <div class="input-group" style="display: none;">
 +          <input id="inetalloc_toship_percent" type="range" min="0" max="100" value="25" step="5" onchange="update_bw(this.id, this.value)">
 +        </div>
 +      </div>
 +
 +      <div class="col-sm-6" style="background: #EDF4FF; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <form class="form-inline">
 +          <div class="form-group">
 +            <div class="input-group">
 +              <div class="input-group-addon" style="background: #D7F6F7; color: #007E82;">Science Ops</div>
 +              <input id="inetalloc_toship_sciops" type="number" min="0" max="100" value="25" step="5" onchange="update_bw(this.id, this.value)" class="form-control" placeholder="0">
 +              <div class="input-group-addon" style="background: #D7F6F7; color: #007E82;">%</div>
 +            </div>
 +          </div>
 +        </form>
 +      </div>
 +
 +      <div class="col-sm-6" style="background: #EDF4FF; color: #052243; padding-top: 10px; padding-bottom: 10px;">
 +        <form class="form-inline">
 +          <div class="form-group">
 +            <div class="input-group">
 +              <div class="input-group-addon" style="background: #FCD5C2; color: #B33C00;">Captive Portal</div>
 +              <input id="inetalloc_toship_capport" type="number" min="0" max="100" value="75" step="5" onchange="update_bw(this.id, this.value)" class="form-control" placeholder="0" disabled="">
 +              <div class="input-group-addon" style="background: #FCD5C2; color: #B33C00;">%</div>
 +            </div>
 +          </div>
 +        </form>
 +      </div>
 +
 +      <div class="col-sm-12" style="background: #FEFEFE; color: #052243; height: 20px; border-top: 5px solid #D4D8FF; border-bottom-left-radius:10px; border-bottom-right-radius:10px;"></div>
 +    </div>
 +  </div>
 +
 +</div>
 +
 +<div class="col-sm-10" style="visibility: hidden;background: #eee; color: #052243; height: 30px; border-top: 5px solid #D4D8FF; margin-left: 20px; border-top-left-radius:10px; border-top-right-radius:10px;">
 +  <span style="font-size: 1.2em; font-weight: bold;"><span class="icon-share2"></span> Share Configuration Link</span>
 +</div>
 +<div class="col-sm-10" style="visibility:hidden; font-size: .7em; background: #FEFEFE; color: #052243; border-top: 5px solid #D4D8FF; margin-left: 20px; border-bottom-left-radius:10px; border-bottom-right-radius:10px;">
 +  <div class="cfos_info" id="sharelink" style="margin-bottom:20px;"><a href="https://satnag.unols.org/satnag/?PAGE=tools_quotacalc&amp;TYPE=HTML&amp;BERTHING=40&amp;TOTBW_TOSHORE=256&amp;TOTBW_TOSHIP=512&amp;INETALLOC_TOSHORE_PERCENT=25&amp;INETALLOC_TOSHIP_PERCENT=25">https://satnag.unols.org/satnag/?PAGE=tools_quotacalc&amp;TYPE=HTML&amp;BERTHING=40&amp;TOTBW_TOSHORE=256&amp;TOTBW_TOSHIP=512&amp;INETALLOC_TOSHORE_PERCENT=25&amp;INETALLOC_TOSHIP_PERCENT=25</a></div>
 +</div>
 +
 +
 +
 +      </div>
 +</html>
  
public/quotacalculator.txt ยท Last modified: 2019/11/01 21:14 (external edit)