github.com/pdaian/flashboys2@v0.0.0-20190718175736-b101c35361f0/webapp/templates/index.html (about)

     1  {% include 'header.html' %}
     2  
     3  <div id="content">
     4  
     5  <h3 style="text-align:center;"><b>Navigation:</b>Market Insight | <a href="/revenue">Bot Trades</a> | <a href="/global"> Global Market Summary</a> | <a href="/strategies"> Bot Strategies</a></h3></b>
     6  <br><br>
     7  {% if not hide_global_graphs %}
     8  <h1> Global Market Overview </h1>
     9    <div id="bardiv" style="width: 90%; margin-left: auto; margin-right: auto;"><!-- Plotly chart will be drawn inside this DIV --></div>
    10  <script>var data = [];
    11  var xs = ["10th percentile", "50th percentile", "75th percentile", "90th percentile", "99th percentile"];
    12  {% for slot in range(slots|length) %}
    13  var slotbar{{slot}} = {
    14    x: xs,
    15    y: [{% for item in slots[slot] %} {{ item }}, {% endfor %}],
    16    type: 'bar',
    17    name: 'Slot {{slot}}'
    18  };
    19  data.push(slotbar{{slot}});
    20  {% endfor %}
    21  
    22  var layout = {barmode: 'group',  
    23    title: 'Priority Pricing Market for Gas Slots',
    24    yaxis : {
    25      title: 'Gas Price (gwei)',
    26      titlefont: {
    27        family: 'Courier New, monospace',
    28        size: 18,
    29        color: '#7f7f7f'
    30      },
    31      autorange : true,
    32    }, xaxis: {
    33      title: 'Price percentile (since block ~5M)',
    34      titlefont: {
    35        family: 'Courier New, monospace',
    36        size: 18,
    37        color: '#7f7f7f'
    38      }
    39    }};
    40  Plotly.newPlot('bardiv', data, layout);
    41  </script>
    42  <br>
    43  {% endif %}
    44  <h1> Individual Real-Time Auction Data </h1><br>  
    45  {% include 'paginate.html' %}
    46  <div id="globalauctions" style="width: 90%; margin-left: auto; margin-right: auto;"><!-- Plotly chart will be drawn inside this DIV --></div>
    47  <script>
    48  var globalauctions = [];
    49  {% for auction_id in range(start, end, -1) %}
    50  
    51  var time_delta_s_users{{auction_id}} = {}; // dictionaries mapping senders in a particular auction to their bid lists
    52  var gas_prices_users{{auction_id}} = {};
    53  var all_senders{{auction_id}} = {}; // keep a list of all senders for iterating later
    54  {% for bid in auctions[auction_id] %}
    55  gas_prices_users{{auction_id}}.user{{bid['sender']}} = [];
    56  time_delta_s_users{{auction_id}}.user{{bid['sender']}} = [];
    57  all_senders{{auction_id}}.user{{bid['sender']}}  = true;
    58  {% endfor %}
    59  {% for bid in auctions[auction_id] %}
    60  gas_prices_users{{auction_id}}.user{{bid['sender']}}.push({{bid['gas_price'] / (10 ** 9)}});
    61  time_delta_s_users{{auction_id}}.user{{bid['sender']}}.push({{bid['time_delta'] / (10 ** 9)}});
    62  {% endfor %}
    63  
    64  // per auction statistics / gas prices breakdown
    65  var gas_prices{{auction_id}} = [{% for bid in auctions[auction_id] %} {{ bid['gas_price'] / (10 ** 9)  }}, {% endfor %}];
    66  var time_delta_s{{auction_id}} = [{% for bid in auctions[auction_id] %} {{ bid['time_delta'] / (10 ** 9)  }}, {% endfor %}];
    67  var win_prices{{auction_id}} = [{% for bid in auctions[auction_id] %} {%  if bid['block_number'] != None and (bid['num_logs'] > 0) %} {{ bid['gas_price'] / (10 ** 9)  }}, {% endif %} {% endfor %}];
    68  var win_delta_s{{auction_id}} = [{% for bid in auctions[auction_id] %} {% if bid['block_number'] != None and (bid['num_logs'] > 0) %} {{ bid['time_delta'] / (10 ** 9)  }}, {% endif %} {% endfor %}];
    69  var lose_prices{{auction_id}} = [{% for bid in auctions[auction_id] %} {% if bid['block_number'] != None and (not bid['num_logs'] > 0) %} {{ bid['gas_price'] / (10 ** 9)  }}, {% endif %} {% endfor %}];
    70  var lose_delta_s{{auction_id}} = [{% for bid in auctions[auction_id] %} {% if bid['block_number'] != None and (not bid['num_logs'] > 0) %} {{ bid['time_delta'] / (10 ** 9)  }}, {% endif %} {% endfor %}];
    71  
    72  var trace1{{auction_id}} = {
    73    x: time_delta_s{{auction_id}},
    74    y: gas_prices{{auction_id}},
    75    mode: 'lines+markers',
    76    type: 'scatter',
    77    name: 'Auction #{{auction_id}}'
    78  };
    79  
    80  var trace1win{{auction_id}} = {
    81    x: win_delta_s{{auction_id}},
    82    y: win_prices{{auction_id}},
    83    mode: 'markers',
    84    type: 'scatter',
    85    name: '#{{auction_id}} Winners',
    86    marker: { size: 20, color: 'rgba(10, 130, 10,0.25)' }
    87  };
    88  
    89  var trace1lose{{auction_id}} = {
    90    x: lose_delta_s{{auction_id}},
    91    y: lose_prices{{auction_id}},
    92    mode: 'markers',
    93    type: 'scatter',
    94    name: '#{{auction_id}} Losers / Payers',
    95    marker: { size: 20, color: 'rgba(130, 10, 10,0.25)' }
    96  };
    97  
    98  if (win_delta_s{{auction_id}}.length < 2) {
    99  globalauctions.push(trace1{{auction_id}});
   100  globalauctions.push(trace1win{{auction_id}});
   101  globalauctions.push(trace1lose{{auction_id}});
   102  }
   103  var trace2{{auction_id}} = {
   104    x: gas_prices{{auction_id}},
   105    type: 'histogram'
   106  };
   107  
   108  {% endfor %}
   109  var layout = {
   110    title: 'Consolidated Gas Price Bids over Time: Auctions {{end+1}} to {{start}}',
   111    xaxis: {
   112      title: 'Observed Time since Auction Start (s)',
   113      titlefont: {
   114        family: 'Courier New, monospace',
   115        size: 18,
   116        color: '#7f7f7f'
   117      }
   118    },
   119    yaxis: {
   120      title: 'Gas Price (gwei)',
   121      titlefont: {
   122        family: 'Courier New, monospace',
   123        size: 18,
   124        color: '#7f7f7f'
   125      },
   126      type: 'log'
   127    }
   128  };
   129  {% if not hide_global_graphs %}
   130  Plotly.newPlot('globalauctions', globalauctions, layout);
   131  {%endif %}
   132  </script>
   133  {% if not hide_global_graphs %}
   134  <div style="text-align: center">Note: only auctions with a single detected "winner" (mined with 2+ log events) are displayed in this view.  Other auctions may contain multiple sub-auctions, as the split is heuristic.</div>
   135  {% endif %}
   136  <br>
   137  
   138  {% for auction_id in range(start, end, -1) %}
   139  
   140      <h2 style="padding-top:60px;"> Gas Auction #{{ auction_id }} - {{ auctions[auction_id][0]['date'].strftime('%Y-%m-%d %H:%M:%S') }} to {{ auctions[auction_id][-1]['date'].strftime('%H:%M:%S') }}; Start Time {{ auctions[auction_id][0]['time_seen'] / 10 ** 9 }} </h2>
   141  
   142  
   143    <div id="auction-{{ auction_id }}" style="width: 90%; margin-left: auto; margin-right: auto;"><!-- Plotly chart will be drawn inside this DIV --></div>
   144    <div id="auction-hist-{{ auction_id }}" style="width: 90%; margin-left: auto; margin-right: auto;"><!-- Plotly chart will be drawn inside this DIV --></div>
   145    <script>
   146  var user_plots =  [trace1win{{auction_id}}, trace1lose{{auction_id}}];
   147  
   148  
   149  for (var user in all_senders{{auction_id}}) {
   150  var trace = {
   151    x: time_delta_s_users{{auction_id}}[user],
   152    y: gas_prices_users{{auction_id}}[user],
   153    mode: 'lines+markers',
   154    type: 'scatter',
   155    name: 'Auction #{{auction_id}} ' + user
   156  };
   157      user_plots.push(trace);
   158  }
   159  
   160  var layout = {
   161    title: 'Gas Price Bids over Time',
   162    xaxis: {
   163      title: 'Observed Time since Auction Start (s)',
   164      titlefont: {
   165        family: 'Courier New, monospace',
   166        size: 18,
   167        color: '#7f7f7f'
   168      }
   169    },
   170    yaxis: {
   171      title: 'Gas Price (gwei)',
   172      titlefont: {
   173        family: 'Courier New, monospace',
   174        size: 18,
   175        color: '#7f7f7f'
   176      },
   177      range: [0, Math.max.apply(Math, gas_prices{{auction_id}}) + 200]
   178    }
   179  };
   180  Plotly.newPlot('auction-{{ auction_id }}', user_plots, layout);
   181  //Plotly.newPlot('auction-hist-{{ auction_id }}', [trace2]);
   182  
   183    </script>
   184  
   185      <div class="limiter">
   186          <div class="container-table100">
   187              <div class="wrap-table100">
   188                  <div class="table100">
   189                      <table>
   190                          <thead>
   191                              <tr class="table100-head">
   192                                  <th class="column1">Seconds Elapsed</th>
   193                                  <th class="column2">Gas Price (<small>gwei</small>)</th>
   194                                  <th class="column3">Bidder (Sender Address/Nonce)</th>
   195                                  <th class="column5">Gas Limit</th>
   196                                  <th class="column6">Transaction Hash</th>
   197                                  <th class="column7">Gas Paid</th>
   198                                  <th class="column8">Block/Index Mined</th>
   199                              </tr>
   200                          </thead>
   201                          <tbody>
   202                              {% for bid in auctions[auction_id] %}
   203                                  <tr>
   204                                      <td class="column1">{{ '%.3f' | format(bid['time_delta'] / 10 ** 9) }}</td>
   205                                      <td class="column2">{{ '%4.9f' | format(bid['gas_price'] / 10 ** 9) }} ({{ bid['price_percent_delta'] }})</td>
   206                                      <td class="column3"><a href="https://etherscan.io/address/{{ bid['sender'] }}"> {{ bid['sender'] }}</a>/<b>{{ bid['account_nonce'] }}</b></td>
   207                                      <td class="column5">{{ bid['gas_limit'] }}</td>
   208                                      <td class="column6"><small><a href="https://etherscan.io/tx/{{ bid['hash'] }}"> {{ bid['hash'] }}</a></small>{% if bid['drawn'] %}<img style="padding:10px;" src="/static/profit/{{bid['hash']}}.png">{% endif %}</td>
   209                                      <td class="column7">{% if bid['block_number'] != None %} {{bid['block_number'] }} {% endif %}</td>
   210                                      <td class="column8">{% if bid['block_number'] != None %} {{ bid['block_number'] }} / {{ bid['transaction_index'] }} {% endif %}</td>
   211                                  </tr>
   212                                  
   213                                  {% endfor %}
   214                          </tbody>
   215                      </table>
   216                  </div>
   217              </div>
   218          </div>
   219      </div>
   220  
   221  {% endfor %}
   222  {% include 'paginate.html' %}
   223  
   224  </div>
   225  
   226  {% include 'footer.html' %}