@extends('layouts.front')
@section('content')
      
      <div class="alert alert-block alert-info fade in" style='margin-top:10px;' tabindex="-1">
        <p> Your account is inactive. For activation you need <a href="#">to top up your balance</a>. <br> Attention: Not activated accounts for more than 5 days will be deleted automatically.<br>
    Contact us on telegram: <a href="https://t.me/BrianclubSupport">@briansclubsupport</a></p> </p>
      </div>
      <div class="panel panel-default" style="margin-top: 15px;min-height: 400px;">
        <div class="panel-body">
          <div class="col-sm-16">
            <br />
            <div class="panel-body">
              <tr align="center">
              <tr align="center">
                <td style="vertical-align: middle; text-align:left; border-top: none; font-weight: bold;" colspan="2">
                  <b><span style="color: #2a79bd;">- Minimum amount to deposit:</span> 50 USD <br>
                  <span style="color: #2a79bd;">- Get <span style="color: red;">10%</span> bonus on every deposit over $500 </span>
                  <br>
                  <span style="color: #2a79bd;">- Processing fee:</span> 4% <br>
                  </b>
                </td>
              </tr>
              </tr>
              <br>
              <center>
                <td style="vertical-align: middle; border-top: none; font-weight: bold;" colspan="4">
                  <b><span style="color: #2a79bd;">Never pay twice to the same crypto address.</span> Always get a new address. <span style="color: #2a79bd;">One address - one deposit!</span></b>
                </td>
              </center>
              <br>
              <center>
                <table class="table" style="width:800px;">
                  <tr align="center">
                    <td style="vertical-align: bottom;border-top: none;">
                      <img src="/images/usdt1.png" alt="USDT TRC20">
                      <button class="btn btn-default" style="width: 100%;margin-top: 10px;" onclick="showDepositModal('USDT'); updateAddress('USDT')">Deposit</button>
                    </td>
                    <td style="vertical-align: bottom;border-top: none;">
                      <img src="/images/litecoin.png" alt="Litecoin">
                      <button class="btn btn-default" style="width: 100%;margin-top: 10px;" onclick="updateAddress('Litecoin')">Deposit</button>
                    </td>
                    <td style="vertical-align: bottom;border-top: none;">
                      <img src="/images/dash_logo.png" alt="Dash">
                      <button class="btn btn-default" style="width: 100%;margin-top: 10px;" onclick="updateAddress('Dash')">Deposit</button>
                    </td>
                    <td style="vertical-align: bottom;border-top: none;">
                      <img src="/images/xmr_logo.png" alt="Monero">
                      <button class="btn btn-default" style="width: 100%;margin-top: 10px;" onclick="updateAddress('Monero')">Deposit</button>
                    </td>
                    <td style="vertical-align: bottom;border-top: none;">
                      <img src="/images/bitcoin.gif" alt="Bitcoin">
                      <button class="btn btn-default" style="width: 100%;margin-top: 10px;" onclick="updateAddress('Bitcoin')">Deposit</button>
                    </td>
                  </tr>
                  <tr>
                    <td style="vertical-align: middle;text-align: center; border-top: none;" colspan="4">
                      <div id="divBtcAddresses" style="display: none;">
                        <div style="display: flex; align-items: center; justify-content: center;">
                          <div id="qrCode"></div>
                          <span id="cryptoAddress" style="margin-left: 10px; vertical-align: middle; font-size:1.2em;"></span>
                        </div>
                      </div>
                    </td>
                  </tr>
                </table>
              </center>
              <div class="modal fade" id="modalDepositRequest" tabindex="-1" role="dialog" aria-hidden="true">
                <div class="modal-dialog">
                  <div class="modal-content">
                    <div class="modal-header">
                      <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                        <span class="sr-only">Close</span>
                      </button>
                      <h4 class="modal-title" id="modalDepositRequestTitle">Request an address</h4>
                    </div>
                    <div class="modal-body">
                      <div class="alert alert-danger alert-danger-modal fade in" style='display:none;'>
                        <button type="button" class="close" data-dismiss="alert">×</button>
                        <p class='modalDanger'></p>
                      </div>
                      <div id="divDepositRequestContent"> - only USDT ( <b>TRC20</b>) is accepted. If you send ERC20 or BEP20 It will be lost forever. <br> - minimum amount is $50 <br> - deposits below $50 will not be posted to your account balance and will be lost forever <br>
                        <br> By pressing <b>"I understand"</b> button, you confirm reading these terms and agree with them.
                      </div>
                    </div>
                    <div class="modal-footer">
                      <button class="btn btn-success" onclick="updateAddress('USDT'); $('#modalDepositRequest').modal('hide');">I understand</button>
                      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                  </div>
                </div>
              </div>
              <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>
              <script>
                function showDepositModal(crypto) {
                  if (crypto === 'USDT TRC20') {
                    // Update modal content
                    var modalTitle = document.getElementById('modalDepositRequestTitle');
                    var modalContent = document.getElementById('divDepositRequestContent');
                    modalTitle.innerHTML = 'Deposit ' + crypto;
                    modalContent.innerHTML = `
                
                        <div class="alert alert-danger alert-danger-modal fade in" style='display:none;'>
                          <button type="button" class="close" data-dismiss="alert">×</button>
                          <p class='modalDanger'></p>
                        </div>
                        - only ${crypto} is accepted. If you send ERC20 or BEP20 It will be lost forever.
                        <br>
                        - minimum amount is $50
                        <br>
                        - deposits below $50 will not be posted to your account balance and will be lost forever
                        <br>
                        <br>
                        By pressing 
                        <b>"I understand"</b> button, you confirm reading these terms and agree with them.
                    `;
                    // Show the modal for USDT TRC20
                    $('#modalDepositRequest').modal('show');
                  } else {
                    // Handle other cryptocurrencies
                    // ...
                  }
                }

                function updateAddress(crypto) {
                  var addresses = {
                    'USDT': 'TRDDW19bEH3v2XNMdPN3UeTEzFdhCWSTzy',
                    'Litecoin': 'MGFh5D6uak1qb7YKoQ2RdmcAmkqEyTDx99',
                    'Dash': 'XrTWdA6wyPgbqXhS88hQ83HjMkCna4x4kw',
                    'Monero': '42LRZAs8sFmiWF761zw7XUL3v3ZitKPgX4WnyRsiWFNtQtXxX5iEGctC7wXcXL6uFMG6x5hV5x6BdVctiywU6xSJ3Qxqw',
                    'Bitcoin': '1A311FPMuNw5Lt16NGg9duFJ5WxQK6ahds',
                  };
                  var qrCodeDiv = document.getElementById('qrCode');
                  var cryptoAddress = document.getElementById('cryptoAddress');
                  var divBtcAddresses = document.getElementById('divBtcAddresses');
                  // Clear previous QR code
                  qrCodeDiv.innerHTML = '';
                  // Generate QR code
                  var qr = new QRCode(qrCodeDiv, {
                    text: addresses[crypto],
                    width: 180,
                    height: 180
                  });
                  cryptoAddress.textContent = addresses[crypto];
                  // Show the QR code and address div
                  divBtcAddresses.style.display = 'block';
                  // Update the table with the selected crypto address and current date
                  var tableBody = document.querySelector('#dataTable table tbody');
                  // Clear existing rows except the header
                  tableBody.innerHTML = `
                    <tr>
                      <th>System</th>
                      <th>Amount</th>
                      <th> Status <font color="grey"><i>( Unconfirmed Transaction )</i></font></th>
                      <th>Date</th>
                    </tr>
                  `;
                  // Get current date
                  var currentDate = new Date();
                  var formattedDate = currentDate.toLocaleString('en-US', {
                    month: 'short',
                    year: 'numeric',
                    hour: '2-digit',
                    minute: '2-digit',
                    hour12: true
                  });
                  // Add new row with updated data
                  tableBody.innerHTML += `
                    <tr>
                      <td>${crypto}</td>
                      <td>0 USD</td>
                      <td>${addresses[crypto]}</td>
                      <td>${formattedDate}</td>
                    </tr>
                  `;
                }
              </script>
             
              <span>
                Bitcoin/Litecoin transaction awaiting for 2 confirmations on Bitcoin/Litecoin network. Confirmations on the Bitcoin network can take from 20 minutes up to 1 day if you send it without fee. </span>
              <br>
              <br>
              <div id="dataTable">
                <table class="table table-responsive table-hover">
                  <tbody>
                    <tr>
                      <th>System</th>
                      <th>Amount</th>
                      <th>Status</th>
                      <th>Date</th>
                    </tr>
                  </tbody>
                </table>
                <nav class="pull-right">
                  <ul class="pagination">
                    <li class="disabled">
                      <a href="#">
                        <span aria-hidden="true">«</span>
                        <span class="sr-only">previous</span>
                      </a>
                    </li>
                    <li class="active">
                      <a href="?page=1">1</a>
                    </li>
                    <li>
                      <a href="?page=2">2</a>
                    </li>
                    <li>
                      <a href="?page=2">
                        <span aria-hidden="true">»</span>
                        <span class="sr-only">next</span>
                      </a>
                    </li>
                  </ul>
                </nav>
                <script>
                  var btc_course = 6841.4584;
                  if (window.jQuery) {
                    $('#user_balance').html('0.00');
                    $('.btc_course').html('6841.4584');
                  }
                </script>
              </div>
              <!-- Modal -->
              <div class="modal fade" id="modalDetails" tabindex="-1" role="dialog" aria-hidden="true" style="display: none;">
                <div class="modal-dialog">
                  <div class="modal-content">
                    <div class="modal-header">
                      <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                        <span class="sr-only">Close</span>
                      </button>
                      <h4 class="modal-title" id="modalDepositTitle">Payment Details</h4>
                    </div>
                    <div class="modal-body">
                      <div class="alert alert-danger alert-danger-modal fade in" style="display:none;">
                        <button type="button" class="close" data-dismiss="alert">×</button>
                        <p class="modalDanger"></p>
                      </div>
                      <div id="divDetailsContent">
                        <table class="table table-bordered table-responsive">
                          <tbody>
                            <tr>
                              <th>Payment System</th>
                              <td>Bitcoin Merchant</td>
                            </tr>
                            <tr>
                              <th>Amount</th>
                              <td> 0 USD</td>
                            </tr>
                            <tr>
                              <th>Total Amount</th>
                              <td>0 USD</td>
                            </tr>
                            <tr>
                              <th>Rate</th>
                              <td>0 USD</td>
                            </tr>
                            <tr>
                              <th>Fee</th>
                              <td>0%</td>
                            </tr>
                            <tr>
                              <th>Status</th>
                              <td>
                                <font color="grey">
                                  <i>Unconfirmed Transaction</i>
                                </font>
                              </td>
                            </tr>
                            <tr>
                              <th>Date</th>
                              <td>2024-01-01 19:20</td>
                            </tr>
                            <tr>
                              <th>Changes in the balance</th>
                              <td>0.00 => 0.00</td>
                            </tr>
                          </tbody>
                        </table>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            @endsection