<?php 
include('view/new_header_file.php');
include_once("classes/database.class.php");
include_once("classes/oanda.php");
include_once('classes/phpToPDF.php');
?>

<link rel="stylesheet" type="text/css" href="node_modules/css-toggle-switch/dist/toggle-switch.css">




  <style type="text/css">

    .tabs-left, .tabs-right {

      border-bottom: none;

      padding-top: 2px;

  }

  .tabs-left {

    border-right: 1px solid #ddd;

  }

  .tabs-right {

    border-left: 1px solid #ddd;

  }

  .tabs-left>li, .tabs-right>li {

    float: none;

    margin-bottom: 2px;

  }

  .tabs-left>li {

    margin-right: -1px;

  }

  .tabs-right>li {

    margin-left: -1px;

  }

  .tabs-left>li.active>a,

  .tabs-left>li.active>a:hover,

  .tabs-left>li.active>a:focus {

    border-bottom-color: #ddd;

    border-right-color: transparent;

  }



  .tabs-right>li.active>a,

  .tabs-right>li.active>a:hover,

  .tabs-right>li.active>a:focus {

    border-bottom: 1px solid #ddd;

    border-left-color: transparent;

  }

  .tabs-left>li>a {

    border-radius: 4px 0 0 4px;

    margin-right: 0;

    display:block;

  }

  .tabs-right>li>a {

    border-radius: 0 4px 4px 0;

    margin-right: 0;

  }

  .vertical-text {

    margin-top:50px;

    border: none;

    position: relative;

  }

  .vertical-text>li {

    height: 20px;

    width: 120px !!important;

    margin-bottom: 100px;

  }

  .vertical-text>li>a {

    border-bottom: 1px solid #ddd;

    border-right-color: transparent;

    text-align: center;

    border-radius: 4px 4px 0px 0px;

  }

  .vertical-text>li.active>a,

  .vertical-text>li.active>a:hover,

  .vertical-text>li.active>a:focus {

    border-bottom-color: transparent;

    border-right-color: #ddd;

    border-left-color: #ddd;

  }

  .vertical-text.tabs-left {

    left: -50px;

  }

  .vertical-text.tabs-right {

    right: -50px;

  }

  .vertical-text.tabs-right>li {

    -webkit-transform: rotate(90deg);

    -moz-transform: rotate(90deg);

    -ms-transform: rotate(90deg);

    -o-transform: rotate(90deg);

    transform: rotate(90deg);

  }

  .vertical-text.tabs-left>li {

    -webkit-transform: rotate(-90deg);

    -moz-transform: rotate(-90deg);

    -ms-transform: rotate(-90deg);

    -o-transform: rotate(-90deg);

    transform: rotate(-90deg);

  }

  .tabs-left > li 

  {

    padding-top: 5px !important;

    padding-bottom: 5px !important;

  }

  .panel-heading

  {

    background-color: #F7614E !important;

    text-align: center;

    padding: 7px !important;

    font-size: 18px !important;

    font-weight: 500;

  }

  .panel-body

  {

    background-color: #0E162D !important;

    text-align: center;

    padding-top: 40px;

    padding-bottom: 40px;

    font-size: 48px !important;

  }

  .swal-modal

  {

    background-color: #202943;

  }

  .swal-title

  {

    color: #F7614E;

  }

  .swal-text

  {

    color: #fff;

  }

  .swal-icon--success:before, .swal-icon--success:after

  {

    background-color: #202943;  

  }

  .swal-icon--success__hide-corners {



    background-color: #202943;  

  }

  .lightTabs

  {

    background: #fff !important;

  }

  .lightTabs > li > a

  {

    color: #F7614E !important; 

  }

  #home

  {

    color: white;

    background: #1F2638 !important;

  }

  #rightTab, #rightTab > .crypt-tab-content

  {

    background-color: #1F2638;

  }

  .lightRightTab, .lightRightTab > div, .lightRightTab > div > #home, .lightRightTab >  .crypt-tab-content 

  {

    background-color: #fff !important;

  }

  .light-panel-body

  {

    background: #eee !important;

    color: #1F2638 !important;

  }

  .lightTableVersion, .lightTableVersion > thead, .lightTableVersion > thead > tr, .lightTableVersion > thead > tr > th, .lightTableVersion > tbody, .lightTableVersion > tbody > tr, .lightTableVersion > tbody > tr > td

  {

    background-color: #fff;

    color: #1F2638 !important;

    border: 1px solid #1F2638 !important;

  }

  .lightRightTab > div > #profile > form > div > label, .lightRightTab > div > #messages > form > div > div > label, .lightRightTab > div > #targets > form > div > div > label, .lightRightTab > div > #userSettings > #acc_type_row > form > div > label, .lightRightTab > div > #userSettings > #logRules > form > div > label

  {

    color: #1F2638 !important;

  }

  .lightRightTab > div > #profile > form > div > input, .lightRightTab > div > #profile > form > div > select, .lightRightTab > div > #messages > form > div > div > input, .lightRightTab > div > #targets > form > div > div > input, .lightRightTab > div > #userSettings > #acc_type_row > form > div > input, .lightRightTab > div > #userSettings > #logRules > form > div > input, .lightRightTab > div > #userSettings > #logRules > form > div > select

  {

    color: #1F2638 !important;

    background-color: #eee !important;  

  }

  .round {

  position: relative;

}



.round label {

  background-color: #fff;

  border: 1px solid #ccc;

  border-radius: 50%;

  cursor: pointer;

  height: 28px;

  left: 0;

  position: absolute;

  top: 0;

  width: 28px;

}



.round label:after {

  border: 2px solid #fff;

  border-top: none;

  border-right: none;

  content: "";

  height: 6px;

  left: 7px;

  opacity: 0;

  position: absolute;

  top: 8px;

  transform: rotate(-45deg);

  width: 12px;

}



.round input[type="checkbox"] {

  visibility: hidden;

}



.round input[type="checkbox"]:checked + label {

  background-color: #66bb6a;

  border-color: #66bb6a;

}



.round input[type="checkbox"]:checked + label:after {

  opacity: 1;

}




  </style>

  <?php 

    if(isset($_COOKIE['id']) && isset($_COOKIE['uid'])){

    $userId = filter_input(INPUT_COOKIE, 'id');

    $userUId = filter_input(INPUT_COOKIE, 'uid');


    $db = new database();

    $stmt = $db->db->prepare("SELECT * FROM users WHERE id = :id and uid = :uid");

    $stmt->execute(array(':id' => $userId, ':uid' => $userUId));

    $userDetails = $stmt->fetch(PDO::FETCH_OBJ);


    $loggedIn = true;

        $firstname = $splitname[0];

    $lastname = $splitname[1];

    $accType = $userDetails->acctype;

    $starting_money = $userDetails->starting_money;


    $account = new oandaAPI();

    $account->retrieveAccount($userUId);


  }

  ?>


      <div class="container">
         <div class="row sm-gutters">


                    <div class="col-xs-3 col-sm-3 col-lg-3">

                          <?php 

                          include_once('menu.php');

                          ?>

                      </div>

                      <div class="col-xs-9 col-sm-9 col-lg-9" id="rightTab">


                          <div class="tab-content crypt-tab-content" style="width: 100%;">

                              <div class="tab-pane active" id="home">




                        <div class="row">



                                  <div class="col-md-12 col-lg-12">

                                    <p style="color: #F7614E;">Welcome <?=$fullN; ?>!</p>

                                  </div>

                                  

                                </div>



                                <div class="row">



                                  <div class="col-md-12 col-lg-12 col-sm-12" style="margin-bottom: 20px !important;">

                                    <canvas id="myChart" style="width: 100%;height: 300px;background-color: #0E162D !important;padding: 10px !important;"></canvas>

                                  </div>

                                  

                                </div>

                                <div class="row">



                                  <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading">Account Balance</div>

                                <div class="panel-body" id="accbalance"><?=$account->balance; ?></div>

                              </div>



                                  </div>

                                  <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading" <?php if($account->marginUsed / $account->marginAvail > 0.55) { echo "style=background-color:orange !important;;"; }else{echo "style=\"background-color: #49C279 !important;\"";} ?> >Current Margin</div>

                                <div class="panel-body"><?=$account->marginUsed; ?></div>

                              </div>



                                  </div>

                                    <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading">Available Margin</div>

                                <div class="panel-body" id="availMargin"><?=$account->marginAvail; ?></div>

                              </div>



                                  </div>

                                  

                                  

                                </div>








                                  <div class="row" style="margin-top: 20px !important">



                                  <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading">Unrealized Earning</div>

                                <div class="panel-body" id="unrealizedEarning"><?php echo round($account->unrealizedPl, 2); ?></div>

                              </div>



                                  </div>

                                  <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading">Open Trades</div>

                                <div class="panel-body" id="openTrades"><?=$account->openTrades; ?></div>

                              </div>



                                  </div>

                                    <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading">Open Orders</div>

                                <div class="panel-body" id="openOrders"><?=$account->openOrders; ?></div>

                              </div>



                                  </div>

                                  

                                  

                                </div>



                                <div class="row"  style="margin-top: 20px !important;">



                                  <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading">Daily Target</div>

                                <div class="panel-body" id="dgGoal"><?=$userDetails->daily_goal; ?></div>

                              </div>



                                  </div>

                                    <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading" style="background-color: #49C279 !important;">Monthly Target</div>

                                <div class="panel-body" id="mgGoal"><?=$userDetails->monthly_goal; ?></div>

                              </div>



                                  </div>

                                    <div class="col-md-4 col-sm-4 col-xs-12">

                                    

                                      <div class="panel panel-default">

                                <div class="panel-heading">Annual Target</div>

                                <div class="panel-body" id="agGoal"><?=$userDetails->annual_goal; ?></div>

                              </div>



                                  </div>

                                  

                                </div>



                                <div class="row" style="margin-top: 20px;">

                                  

                                  <div class="col-md-12 col-lg-12">



                                    <h5 style="color: #F7614E !important;">Trade Details</h5>

                                    

                                      <?php

                    $account->retrieveTrades($account->accountId);

                    ?>

                    <table class="table table-hover table-stripped table-rowed" id="pairTable">

                      <thead>

                      <th>Pair</th>

                      <th>Type</th>

                      <th>Units</th>

                      <th>Price</th>

                      <th>Date</th>

                      <th>Profit</th>

                      <th>Action</th>

                      </thead>

                    <tbody>





                        <?php 





                        foreach ($tradeShow as $get_trades) {

                          # code...

                          $showside = "";

                          if($get_trades['initialUnits'] < 0){ $get_trades['side'] = "SELL";$showside = "SELL"; }

                        else { $get_trades['side'] = "BUY";$showside = "BUY"; }

                        if($get_trades['unrealizedPL'] < 0) { $colorPL = "red"; }

                        else { $colorPL = 'lime'; }



                          ?>

                          <tr id="<?=$get_trades['id']; ?>">

                            <td><?=$get_trades['instrument']; ?></td>

                            <td><?=$get_trades['side']; ?></td>

                            <td><?=$get_trades['initialUnits']; ?></td>

                            <td><?=$get_trades['price']; ?></td>

                            <td><?php echo substr($get_trades['openTime'], 0, 10); ?></td>

                            <td style="color: <?=$colorPL; ?>"><?php echo round($get_trades['unrealizedPL'], 2); ?></td>

                            <td><button data-toggle="modal" onclick="showTradeValues('<?=$get_trades['id']; ?>', '<?=$showside ?>', 'Limit Order', '<?=$get_trades['price']; ?>')" data-target="#editTrade" class="btn btn-sm btn-warning"><i class="fa fa-wrench"></i></button><button class="btn btn-sm btn-danger" onclick="removeTrade('<?=$get_trades['id']; ?>')" style="margin-left: 5px;"><i class="fa fa-trash"></i></button></td>

                          </tr>

                          <?php 

                        }



                        ?>

                    





                      </tbody>

                    </table>



                                  </div>



                                </div>



                              </div>
                            </div>



                      </div>                      



        </div>
    </div>


<?php
include('view/new_footer_file.php');
?>


	  <script type="text/javascript">
	  	var getCar = '<?=$userDetails->pcarrier; ?>';
	  	$("#pcar").val(getCar).change();
	</script>
  <script type="text/javascript">
      
      $(function() {

            var firstcharsale = '<?=$firstSaleChar; ?>';
            var firstcharbuy = '<?=$firstBuyChar; ?>';
            var firstcharclose = '<?=$firstCloseChar ?>';

            $("#saleskey1").val(firstcharsale).change();
            $("#buykey1").val(firstcharbuy).change();
            $("#closekey1").val(firstcharclose).change();

      });

  </script>


  <script src="https://cdn.jsdelivr.net/npm/chart.js@2.8.0"></script>


  <script type="text/javascript">

    var ctx = document.getElementById('myChart').getContext('2d');

    var data1 = "<?=round($account->unrealizedPl, 2); ?>";

    var data2 = "<?=$account->openTrades; ?>";

    var data3 = "<?=$account->openOrders; ?>";



    var fulldata = [data1, data2, data3];

  var chart = new Chart(ctx, {

      // The type of chart we want to create

      type: 'bar',



      // The data for our dataset

      data: {

          labels: ['Unrealized Earning', 'Open Trades', 'Open Orders'],

          datasets: [{

            label:'Account Details',

              backgroundColor: 'rgb(255, 99, 132)',

              borderColor: 'rgb(255, 99, 132)',

              data: fulldata

          }]

      },



      // Configuration options go here

      options: {}

  });

  </script>
