<!doctype html>
<html>
<style>
    span.tags_cl {
    border: 1px solid #001f75;
    padding: 2px;
    margin: 3px;
    line-height: 2;
    display: inline-block;
}  
.ctags {
    width: 90%;
    margin: 0px auto;
}
.col-sm-3{
  width:25%;
  float:left;
}
  @media only screen and (max-width: 600px) {
    .col-sm-3{
  width:50%;
  float:left;
}
  }
pre {
    color:#ffffff !important;
}
.green {
    background: rgb(131,58,180);
    background: radial-gradient(circle, rgba(131,58,180,1) 0%, rgba(79,210,21,1) 0%, rgba(46,136,6,1) 100%, rgba(252,176,69,1) 100%);
    color: #fff;
    padding: 1px;
    font-size: 16px;
    font-weight: 700;
    border-radius: 4px;
    margin: 10px 0;
  width: 60px;
}
.red {
    background: radial-gradient(circle, rgba(131,58,180,1) 0%, rgba(238,30,39,1) 0%, rgba(185,13,21,1) 100%, rgba(252,176,69,1) 100%);
    color: #fff;
    padding: 1px;
    font-size: 16px;
    font-weight: 700;
    border-radius: 4px;
    margin: 10px 0;
  width: 60px;
}
.normal{
  padding: 1px;
  font-size: 16px;
  border-radius: 4px;
  margin: 10px 0;
  width: 60px;
}
</style>
<style>
    #customers {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 82%;
}

#customers td, #customers th {
  border: 1px solid #ddd;
  padding: 2px;
}

#customers tr:nth-child(even){background-color: #f2f2f2;}

#customers tr:hover {background-color: #ddd;}

#customers th {
  padding-top: 8px;
  padding-bottom: 8px;
  text-align: center;
  background-color: #001f75;
  color: white;
}
</style>
<head>
    <title>MCX Socket IO Client</title>
</head>
<body>
    <center>
        <h1>MCX Socket IO Client</h1>
    </center>
    <table border="1" cellspacing="0" cellpadding="0" id="customers" align="center">
        <tbody>
            <tr>
                <th style="width: 12%">Symbol</th>
                <th style="width: 10%">Last Price</th>
                <th style="width: 8%">Buy</th>
                <th style="width: 8%">Sell</th>
                <th style="width: 8%">Low</th>
                <th style="width: 8%">High</th>
                <th style="width: 8%">Open</th>
                <th style="width: 8%">Close</th>
                <th style="width: 9%">Contract</th>
                <th style="width: 9%">Expiry Date</th>
                <th style="width: 12%">TickTime</th>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>GOLD</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Goldlastc" class="normal"><span id="GoldLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="Goldcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="Goldexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>SILVER</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Silverlastc" class="normal"><span id="SILVERLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVEROpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>GOLD MINI</div>
                </td>
                <td align="center" valign="middle">
                    <div id="GoldMlastc" class="normal"><span id="GoldMLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="GoldMTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>SILVER MINI</div>
                </td>
                <td align="center" valign="middle">
                    <div id="SilverMlastc" class="normal"><span id="SILVERMLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="SILVERMTickTime"></span></div>
                </td>
                
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>ALUMINIUM</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Aluminiumlastc" class="normal"><span id="ALUMINIUMLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ALUMINIUMTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>COPPER</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Copperlastc" class="normal"><span id="COPPERLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPEROpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="COPPERTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>CRUDE OIL</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Crudelastc" class="normal"><span id="CRUDELTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDEBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDESell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDELow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDEHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDEOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDEClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDEcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDEexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="CRUDETickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>LEAD</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Leadlastc" class="normal"><span id="LEADLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="LEADTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>NATURAL GAS</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Naturallastc" class="normal"><span id="NATURALLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NATURALTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>NICKEL</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Nickellastc" class="normal"><span id="NICKELLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="NICKELTickTime"></span></div>
                </td>
            </tr>
            <tr>
                <td align="center" valign="middle">
                    <div>ZINC</div>
                </td>
                <td align="center" valign="middle">
                    <div id="Zinklastc" class="normal"><span id="ZINCLTP"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCBuy"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCSell"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCLow"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCHigh"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCOpen"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCClose"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCcontract"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCexpirydate"></span></div>
                </td>
                <td align="center" valign="middle">
                    <div><span id="ZINCTickTime"></span></div>
                </td>
            </tr>
        </tbody>
    </table>
    <div id="printdata"></div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
    <!-- <script src="https://code.jquery.com/jquery-migrate-3.3.2.min.js"></script> -->
    <script src="https://cdn.socket.io/4.4.0/socket.io.min.js"></script>
    <script>
    const socket = io("http://skymcx.in:5001");
    socket.on('connect', function() {
        socket.emit('room', 'rate');
    });
    socket.on('LiveData', function(tick) {
        //document.getElementById("printdata").textContent = JSON.stringify(tick, undefined, 2);
        var objs = JSON.stringify(tick, undefined, 2); // this is how you parse a string into JSON 
        //  document.body.innerHTML = objs;
        var jsons = "";
        for (var i = 0; i < tick.MCX.length; i++) {
            jsons += tick.MCX[i] + ",";
        }
        var json = '[' + jsons.slice(0, -1) + ']';

        $.each(JSON.parse(json), function(idx, obj) {

            if (obj.instrument_symbol == "GOLD") {
				var newgold=obj.ltp;
                var old_gold_last = parseFloat($("#GoldLTP").text());
                if (old_gold_last > obj.ltp) {
                    $("#Goldlastc").addClass("red");
                    setTimeout(function() {
                        $('#Goldlastc').removeClass('red');
						check_new("GOLD",old_gold_last,newgold,100,obj.low,obj.high,obj.open);
                    }, 1000);
                } else if (old_gold_last < obj.ltp) {
                    $("#Goldlastc").addClass("green");
                    setTimeout(function() {
                        $('#Goldlastc').removeClass('green');
						check_new("GOLD",old_gold_last,newgold,100,obj.low,obj.high,obj.open);
                    }, 1000);
                }
                $("#GoldLTP").text(obj.ltp);
                $("#GoldLow").text(obj.low);
                $("#GoldHigh").text(obj.high);
                $("#GoldOpen").text(obj.open);
                $("#GoldClose").text(obj.close);
                $("#GoldBuy").text(obj.buy_price);
                $("#GoldSell").text(obj.sell_price);
                $("#Goldcontract").text((obj.contract).slice(0, -3));
                $("#Goldexpirydate").text(obj.expiry_date);
                $("#GoldTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "SILVER") {
                var old_sliver_last = parseFloat($("#SILVERLTP").text());
                if (old_sliver_last > obj.ltp) {
                    $("#Silverlastc").addClass("red");
                    setTimeout(function() {
                        $('#Silverlastc').removeClass('red')
                    }, 1000);
                } else if (old_sliver_last < obj.ltp) {
                    $("#Silverlastc").addClass("green");
                    setTimeout(function() {
                        $('#Silverlastc').removeClass('green')
                    }, 1000);
                }
                $("#SILVERLTP").text(obj.ltp);
                $("#SILVERLow").text(obj.low);
                $("#SILVERHigh").text(obj.high);
                $("#SILVEROpen").text(obj.open);
                $("#SILVERClose").text(obj.close);
                $("#SILVERBuy").text(obj.buy_price);
                $("#SILVERSell").text(obj.sell_price);
                $("#SILVERcontract").text((obj.contract).slice(0, -3));
                $("#SILVERexpirydate").text(obj.expiry_date);
                $("#SILVERTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "GOLDM") {
                var old_goldm_last = parseFloat($("#GoldMLTP").text());
                if (old_goldm_last > obj.ltp) {
                    $("#GoldMlastc").addClass("red");
                    setTimeout(function() {
                        $('#GoldMlastc').removeClass('red')
                    }, 1000);
                } else if (old_goldm_last < obj.ltp) {
                    $("#GoldMlastc").addClass("green");
                    setTimeout(function() {
                        $('#GoldMlastc').removeClass('green')
                    }, 1000);
                }
                $("#GoldMLTP").text(obj.ltp);
                $("#GoldMLow").text(obj.low);
                $("#GoldMHigh").text(obj.high);
                $("#GoldMOpen").text(obj.open);
                $("#GoldMClose").text(obj.close);
                $("#GoldMBuy").text(obj.buy_price);
                $("#GoldMSell").text(obj.sell_price);
                $("#GoldMcontract").text((obj.contract).slice(0, -3));
                $("#GoldMexpirydate").text(obj.expiry_date);
                $("#GoldMTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "SILVERM") {
                var old_sliverm_last = parseFloat($("#SILVERMLTP").text());
                if (old_sliverm_last > obj.ltp) {
                    $("#SilverMlastc").addClass("red");
                    setTimeout(function() {
                        $('#SilverMlastc').removeClass('red')
                    }, 1000);
                } else if (old_sliverm_last < obj.ltp) {
                    $("#SilverMlastc").addClass("green");
                    setTimeout(function() {
                        $('#SilverMlastc').removeClass('green')
                    }, 1000);
                }
                $("#SILVERMLTP").text(obj.ltp);
                $("#SILVERMLow").text(obj.low);
                $("#SILVERMHigh").text(obj.high);
                $("#SILVERMOpen").text(obj.open);
                $("#SILVERMClose").text(obj.close);
                $("#SILVERMBuy").text(obj.buy_price);
                $("#SILVERMSell").text(obj.sell_price);
                $("#SILVERMcontract").text((obj.contract).slice(0, -3));
                $("#SILVERMexpirydate").text(obj.expiry_date);
                $("#SILVERMTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "ALUMINIUM") {
                var old_alum_last = parseFloat($("#ALUMINIUMLTP").text());
                if (old_alum_last > obj.ltp) {
                    $("#Aluminiumlastc").addClass("red");
                    setTimeout(function() {
                        $('#Aluminiumlastc').removeClass('red')
                    }, 1000);
                } else if (old_alum_last < obj.ltp) {
                    $("#Aluminiumlastc").addClass("green");
                    setTimeout(function() {
                        $('#Aluminiumlastc').removeClass('green')
                    }, 1000);
                }
                $("#ALUMINIUMLTP").text(obj.ltp);
                $("#ALUMINIUMLow").text(obj.low);
                $("#ALUMINIUMHigh").text(obj.high);
                $("#ALUMINIUMOpen").text(obj.open);
                $("#ALUMINIUMClose").text(obj.close);
                $("#ALUMINIUMBuy").text(obj.buy_price);
                $("#ALUMINIUMSell").text(obj.sell_price);
                $("#ALUMINIUMcontract").text((obj.contract).slice(0, -3));
                $("#ALUMINIUMexpirydate").text(obj.expiry_date);
                $("#ALUMINIUMTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "COPPER") {
                var old_copper_last = parseFloat($("#COPPERLTP").text());
                if (old_copper_last > obj.ltp) {
                    $("#Copperlastc").addClass("red");
                    setTimeout(function() {
                        $('#Copperlastc').removeClass('red')
                    }, 1000);
                } else if (old_copper_last < obj.ltp) {
                    $("#Copperlastc").addClass("green");
                    setTimeout(function() {
                        $('#Copperlastc').removeClass('green')
                    }, 1000);
                }
                $("#COPPERLTP").text(obj.ltp);
                $("#COPPERLow").text(obj.low);
                $("#COPPERHigh").text(obj.high);
                $("#COPPEROpen").text(obj.open);
                $("#COPPERClose").text(obj.close);
                $("#COPPERBuy").text(obj.buy_price);
                $("#COPPERSell").text(obj.sell_price);
                $("#COPPERcontract").text((obj.contract).slice(0, -3));
                $("#COPPERexpirydate").text(obj.expiry_date);
                $("#COPPERTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "CRUDEOIL") {
                var old_coil_last = parseFloat($("#CRUDELTP").text());
                if (old_coil_last > obj.ltp) {
                    $("#Crudelastc").addClass("red");
                    setTimeout(function() {
                        $('#Crudelastc').removeClass('red')
                    }, 1000);
                } else if (old_coil_last < obj.ltp) {
                    $("#Crudelastc").addClass("green");
                    setTimeout(function() {
                        $('#Crudelastc').removeClass('green')
                    }, 1000);
                }
                $("#CRUDELTP").text(obj.ltp);
                $("#CRUDELow").text(obj.low);
                $("#CRUDEHigh").text(obj.high);
                $("#CRUDEOpen").text(obj.open);
                $("#CRUDEClose").text(obj.close);
                $("#CRUDEBuy").text(obj.buy_price);
                $("#CRUDESell").text(obj.sell_price);
                $("#CRUDEcontract").text((obj.contract).slice(0, -3));
                $("#CRUDEexpirydate").text(obj.expiry_date);
                $("#CRUDETickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "LEAD") {
                var old_lead_last = parseFloat($("#LEADLTP").text());
                if (old_lead_last > obj.ltp) {
                    $("#Leadlastc").addClass("red");
                    setTimeout(function() {
                        $('#Leadlastc').removeClass('red')
                    }, 1000);
                } else if (old_lead_last < obj.ltp) {
                    $("#Leadlastc").addClass("green");
                    setTimeout(function() {
                        $('#Leadlastc').removeClass('green')
                    }, 1000);
                }
                $("#LEADLTP").text(obj.ltp);
                $("#LEADLow").text(obj.low);
                $("#LEADHigh").text(obj.high);
                $("#LEADOpen").text(obj.open);
                $("#LEADClose").text(obj.close);
                $("#LEADBuy").text(obj.buy_price);
                $("#LEADSell").text(obj.sell_price);
                $("#LEADcontract").text((obj.contract).slice(0, -3));
                $("#LEADexpirydate").text(obj.expiry_date);
                $("#LEADTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "NATURALGAS") {
                var old_ngas_last = parseFloat($("#NATURALLTP").text());
                if (old_ngas_last > obj.ltp) {
                    $("#Naturallastc").addClass("red");
                    setTimeout(function() {
                        $('#Naturallastc').removeClass('red')
                    }, 1000);
                } else if (old_ngas_last < obj.ltp) {
                    $("#Naturallastc").addClass("green");
                    setTimeout(function() {
                        $('#Naturallastc').removeClass('green')
                    }, 1000);
                }
                $("#NATURALLTP").text(obj.ltp);
                $("#NATURALLow").text(obj.low);
                $("#NATURALHigh").text(obj.high);
                $("#NATURALOpen").text(obj.open);
                $("#NATURALClose").text(obj.close);
                $("#NATURALBuy").text(obj.buy_price);
                $("#NATURALSell").text(obj.sell_price);
                $("#NATURALcontract").text((obj.contract).slice(0, -3));
                $("#NATURALexpirydate").text(obj.expiry_date);
                $("#NATURALTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "NICKEL") {
                var old_nickel_last = parseFloat($("#NICKELLTP").text());
                if (old_nickel_last > obj.ltp) {
                    $("#Nickellastc").addClass("red");
                    setTimeout(function() {
                        $('#Nickellastc').removeClass('red')
                    }, 1000);
                } else if (old_nickel_last < obj.ltp) {
                    $("#Nickellastc").addClass("green");
                    setTimeout(function() {
                        $('#Nickellastc').removeClass('green')
                    }, 1000);
                }
                $("#NICKELLTP").text(obj.ltp);
                $("#NICKELLow").text(obj.low);
                $("#NICKELHigh").text(obj.high);
                $("#NICKELOpen").text(obj.open);
                $("#NICKELClose").text(obj.close);
                $("#NICKELBuy").text(obj.buy_price);
                $("#NICKELSell").text(obj.sell_price);
                $("#NICKELcontract").text((obj.contract).slice(0, -3));
                $("#NICKELexpirydate").text(obj.expiry_date);
                $("#NICKELTickTime").text(obj.tick_time);
            } else if (obj.instrument_symbol == "ZINC") {
                var old_zinc_last = parseFloat($("#ZINCLTP").text());
                if (old_zinc_last > obj.ltp) {
                    $("#Zinklastc").addClass("red");
                    setTimeout(function() {
                        $('#Zinklastc').removeClass('red')
                    }, 1000);
                } else if (old_zinc_last < obj.ltp) {
                    $("#Zinklastc").addClass("green");
                    setTimeout(function() {
                        $('#Zinklastc').removeClass('green')
                    }, 1000);
                }
                $("#ZINCLTP").text(obj.ltp);
                $("#ZINCLow").text(obj.low);
                $("#ZINCHigh").text(obj.high);
                $("#ZINCOpen").text(obj.open);
                $("#ZINCClose").text(obj.close);
                $("#ZINCBuy").text(obj.buy_price);
                $("#ZINCSell").text(obj.sell_price);
                $("#ZINCcontract").text((obj.contract).slice(0, -3));
                $("#ZINCexpirydate").text(obj.expiry_date);
                $("#ZINCTickTime").text(obj.tick_time);
            }
        });
		
		function check_new(metal,oldrate,rate,lotsize,openn,highh,loww){
	     console.log(metal);
		 console.log(oldrate);
		 console.log(rate);
		 console.log(lotsize);
		 console.log(openn);
		 console.log(highh);
		 console.log(loww);
		 //socket.emit("tr_emit",{trdata:trdata,trid:metal,color:color,single_val:single_val});
		 //setTimeout(function(){ 
		 //$("tr#"+metal+" td:nth-child(2)").css("background","none"); }, 5000);
		 $.ajax({
				 type: "POST",
				 url: '<?php echo base_url();?>welcome/check_new',
				 data: {metal:metal,rate:rate,lotsize:lotsize,tt:new Date().getTime(),loww:loww,highh:highh,openn:openn},
				 success: function(res){
					 console.log(res);
					 //alert(response);
				//	 console.log(response)
				//	$("#rate_return").html(response);
					}
				 });
		}
    });
    </script>
</body>

</html>