let myURL = "https://" + window.location.host + "/financeapi/kgapi.ashx";
let OnlineSocketLink = "wss://" + window.location.host + "/financeapi/kgapi.ashx";

if (window.location.host.includes("localhost")) {
    myURL = "http://localhost:44359/financeapi/kgapi.ashx";
    OnlineSocketLink = "ws://localhost:44359/financeapi/kgapi.ashx";
}


function socket_connection() {


    OnlineWebSocketInt();


}

const uuidv4 = () => {
    return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, c =>
        (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
    );
}




let online_ws = "";
const OnlineWebSocketInt = () => {

    let GirisKodu = localStorage.getItem("GirisKodu");
    if (isEmpty(GirisKodu)) {
        GirisKodu = uuidv4();
        localStorage.setItem("GirisKodu", GirisKodu);
    }

    if (!isEmpty(GirisKodu)) {

        online_ws = new WebSocket(OnlineSocketLink + "?id=" + GirisKodu);

        online_ws.onerror = function (e) {
            //console.log('Socket Hata: ' + e);
            //console.log(e);
        }

        online_ws.onopen = function () {
            //console.log('Socket : Kullan?c? Ba?land?.');
        }

        online_ws.onmessage = function (e) {

            let data = e.data.toString();

            //console.log(data);

            //console.log("data");

            let prices_data = JSON.parse(data);

            _Update(prices_data);
        }

        online_ws.onclose = function () {
            //console.log('Socket : Kullan?c? Ç?k?? Yapt?.');
            online_ws = "";
            reTry();
        }
    }

}

const reTry = () => {
    setTimeout(() => {
        //console.log('Socket Tekrar Dene !');
        OnlineWebSocketInt();
    }, 1000);
}



var globalPL = 0;




function UpdatePL(SymbolName, LastPrice) {

    var OpenOrderRowCount = $("#OpenOrderRowCount").val();

    for (var i = 0; i < OpenOrderRowCount; i++) {


        $("#" + SymbolName + "_" + i + "").html(LastPrice);
        var SymbolLastPrice = LastPrice;
        var SymbolEntryPrice = $("#PurchasePrice_" + SymbolName + "_" + i + "").html();
        var SymbolTotalAmount = $("#TSymbol_" + i + "").html();
        var Leverage = parseInt($("#hidLeverage").val());
        var OrderPosition = $("#PositionPurchasePrice_" + i + "").val();
        var OrderID = $("#ExRealCalcID_" + i + "").val();

        var BalanceInfo = accounting.toFixed($("#hidBalanceInfo").val(), 2);
        if (BalanceInfo > 0) {
            $("#balanceA").removeClass('red');
            $("#balanceA").addClass('green');
        } else {
            $("#balanceA").addClass('red');
            $("#balanceA").removeClass('green');
        }

        if ($("#PurchasePrice_" + SymbolName + "_" + i + "").length > 0) {
            var CalculatePandL;
            let UsdCheck = true;

            if (SymbolName.includes("USD") && SymbolName.includes("-")) {
                let rData = SymbolName.split("-");
                if (rData.length > 0)
                    if (rData[1] != "USD")
                        UsdCheck = false;
            }


            if (OrderPosition == "2") {
                if (UsdCheck)
                    CalculatePandL = -1 * accounting.toFixed(((SymbolLastPrice - SymbolEntryPrice) * SymbolTotalAmount), 2);
                else
                    CalculatePandL = -1 * accounting.toFixed(((SymbolLastPrice - SymbolEntryPrice) * SymbolTotalAmount) / SymbolLastPrice, 2);
            }
            else {
                if (UsdCheck)
                    CalculatePandL = accounting.toFixed(((SymbolLastPrice - SymbolEntryPrice) * SymbolTotalAmount), 2);
                else
                    CalculatePandL = accounting.toFixed(((SymbolLastPrice - SymbolEntryPrice) * SymbolTotalAmount) / SymbolLastPrice, 2);

            }

            var CalculateMargin = accounting.toFixed(((SymbolEntryPrice / Leverage) * SymbolTotalAmount), 2);
            if (!UsdCheck)
                CalculateMargin = accounting.toFixed(((SymbolEntryPrice / Leverage) * SymbolTotalAmount) / SymbolLastPrice, 2);

            //var CalculateMargin = parseInt((parseFloat(SymbolEntryPrice).toFixed(2) / parseFloat(Leverage)) * parseFloat(SymbolTotalAmount).toFixed(2)).toFixed(2);


            //var OrderID = $("#OrderID_" + i + "").val();
            //if (!isEmpty(OrderID))
            //    UpdateCrmPLMargin(OrderID, CalculateMargin, CalculatePandL);


            $("#Margin_" + SymbolName + "_" + i + "").html(CalculateMargin);
            $("#PandL_" + SymbolName + "_" + i + "").html(CalculatePandL);

            $("#ExIDHidden_" + i + "").val(i + "_" + LastPrice + "_" + CalculatePandL + "_" + CalculateMargin);

            if (CalculatePandL > 0) {
                $("#PandL_" + SymbolName + "_" + i + "").removeClass('red');
                $("#PandL_" + SymbolName + "_" + i + "").addClass('green');
            }
            else {
                $("#PandL_" + SymbolName + "_" + i + "").removeClass('green');
                $("#PandL_" + SymbolName + "_" + i + "").addClass('red');
            }
            if (CalculateMargin > 0) {
                $("#Margin_" + SymbolName + "_" + i + "").removeClass('red');
                $("#Margin_" + SymbolName + "_" + i + "").addClass('green');
            }
            else {
                $("#Margin_" + SymbolName + "_" + i + "").removeClass('green');
                $("#Margin_" + SymbolName + "_" + i + "").addClass('red');
            }

        }

        var sumMarginDt = 0;
        $(".pl2Updated").each(function (index) {
            sumMarginDt += parseFloat($(this).text());
        });
        $("#userMarginA").html("Used Margin : " + accounting.toFixed(sumMarginDt, 2));


        var sumDt = 0;
        $(".pl2RealUpdated").each(function (index) {
            sumDt += parseFloat($(this).text());
        });
        $("#pandlA").html("P&L : " + accounting.toFixed(sumDt, 2));
        if (sumDt > 0) {
            $("#pandlA").removeClass('red');
            $("#pandlA").addClass('green');
        }
        else {
            $("#pandlA").removeClass('green');
            $("#pandlA").addClass('red');
        }

        var SumEq = accounting.toFixed(BalanceInfo + sumDt, 2);

        BalanceInfo = parseFloat(BalanceInfo);

        let TotalPLText = $("#pandlA").html();
        if (!isEmpty(TotalPLText)) {

            let TotalPlTextAr = TotalPLText.split(":");
            let TotalPl = parseFloat(TotalPlTextAr[1]);
            let hesap = (BalanceInfo - sumMarginDt) + TotalPl;


            let Eqhesap = BalanceInfo + TotalPl;


            $("#freeMarginA").html("Free Margin : " + accounting.toFixed(hesap, 2));
            $("#uquityA").html("Equity : " + accounting.toFixed(Eqhesap), 2);

            //$("#marginlevelA").html("Margin Level : " + accounting.toFixed(accounting.toFixed(Eqhesap, 2) / accounting.toFixed(sumMarginDt, 2) * parseInt(Leverage), 2));

            $("#marginlevelA").html("Margin Level : " + accounting.toFixed(accounting.toFixed(Eqhesap, 2) / accounting.toFixed(sumMarginDt, 2) * 100, 2));

        }



    }

}

function UpdateCrmPLMargin(OrderID, CalculateMargin, CalculatePandL) {
    var myFormData = new FormData();
    myFormData.append("reqmethod", "UpdateCrmPLMargin");
    myFormData.append("OrderID", OrderID);
    myFormData.append("CalculateMargin", CalculateMargin);
    myFormData.append("CalculatePandL", CalculatePandL);

    $.ajax({
        dataType: "html",
        type: "POST",
        url: "/handler/Exchange.ashx",
        data: myFormData,
        processData: false,
        contentType: false,
        success: function (data) {


        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {

        }
    });
}



function openTradingViewWidget(symbol, shopSymbol) {

    $("#shopSymbol").val(shopSymbol);

    $("#BuyAmount").val('');
    $("#BuyUSDPrice").val('');
    $("#SellAmount").val('');
    $("#SellUSDPrice").val('');

    updateBuyAndSellAmount();

    new TradingView.widget(
        {
            "width": "100%",
            "height": 690,
            "symbol": symbol,
            "interval": "D",
            "timezone": "Etc/UTC",
            "theme": "Dark",
            "style": "1",
            "locale": "en",
            "toolbar_bg": "#f1f3f6",
            "enable_publishing": false,
            "withdateranges": true,
            "hide_side_toolbar": false,
            "allow_symbol_change": true,
            "show_popup_button": true,
            "popup_width": "1000",
            "popup_height": "650",
            "container_id": "tradingview_e8053"
        }
    );

}

function updateBuyAndSellAmount() {

    let shopSymbol = $("#shopSymbol").val();
    key = shopSymbol.replace("/", "-");

    if ($("#" + key + "_PRICE").length > 0) {

        let _value = parseFloat(document.getElementById(key + "_PRICE").innerHTML);

        let data_ccy = $("#" + key + "_PRICE").data("ccy");

        if (data_ccy == "SAR") {
            _value = parseFloat(document.getElementById(key + "_USD_PRICE").innerHTML);
        }

        $("#shopUSDPrice").val(_value);


        let _dtKey = key.split('-');
        $(".ElementIconText").text(_dtKey[0]);
        let Buy_Upper = etiketler["Buy"].toUpperCase();
        let Sell_Upper = etiketler["Sell"].toUpperCase();

        let buyHtml = `${Buy_Upper} ${_dtKey[0]} <span style="word-break: break-word;">${_value}</span>`;
        let sellHtml = `${Sell_Upper} ${_dtKey[0]} <span style="word-break: break-word;">${_value}</span>`;

        if (_dtKey[0] == "USD") {
            $(".ElementIconText2").text(_dtKey[1]);
            buyHtml = `BUY ${_dtKey[1]} <span style="word-break: break-word;">${_value}</span>`;
            sellHtml = `SELL ${_dtKey[1]} <span style="word-break: break-word;">${_value}</span>`;
        } else {
            $(".ElementIconText2").text("USD");

        }




        $("#reBuyBtn").html(buyHtml);
        $("#reSellBtn").html(sellHtml);
    }

    calculatePrice("BuyUSDPrice");
    calculatePrice("SellAmount");


}


function calculatePrice(t) {

    let shopUSDPrice = parseFloat($("#shopUSDPrice").val());

    if (t == "BuyAmount") {

        let dt = parseFloat($("#BuyAmount").val());

        let lastDt = shopUSDPrice * dt;

        $("#BuyUSDPrice").val(lastDt);


    }
    else if (t == "BuyUSDPrice") {

        let dt = parseFloat($("#BuyUSDPrice").val());

        let lastDt = dt / shopUSDPrice;

        $("#BuyAmount").val(lastDt);

    }
    else if (t == "SellAmount") {

        let dt = parseFloat($("#SellAmount").val());

        let lastDt = shopUSDPrice * dt;

        $("#SellUSDPrice").val(lastDt);

    }
    else if (t == "SellUSDPrice") {

        let dt = parseFloat($("#SellUSDPrice").val());

        let lastDt = dt / shopUSDPrice;

        $("#SellAmount").val(lastDt);

    }

}


function createTables(DivID, MyData) {

    $(DivID).html('');
    let _html = "";
    for (let i = 0; i < MyData.length; i++) {
        let item = MyData[i];

        let SARStatus = false;
        if (item.ccy == "SAR") {
            SARStatus = true;
        }

        _html += `
		<tr id="${item.htmlSymbol}_TABLE_TR" class="list-info sheet-open" data-sheet="#marketSheetModal" onclick="return openTradingViewWidget('${item.tradingViewSymbol}','${item.htmlSymbol}',${SARStatus});">
			<td ${styleAdd(SARStatus)}>
				<i class="icon ion-md-star"></i>
				${nameFind(item, SARStatus)}
			</td>
			<td>
				<div id="${item.htmlSymbol}_PRICE" data-cty="${item.country}" data-exch="${item.exch}" data-ccy="${item.ccy}">
					connecting
				</div>
			</td>

			${usdPriceTD(item, SARStatus)}

			<td id="${item.htmlSymbol}_CHANGEP_TD">
				<div id="${item.htmlSymbol}_CHANGEP">
					connecting
				</div>
			</td>
		</tr>`;
    }
    $(DivID).html(_html);

}







function styleAdd(SARStatus) {
    if (SARStatus) {
        return `style="font-size:11px;"`;
    } else {
        return "";
    }
}


function nameFind(item, SARStatus = false) {
    if (SARStatus)
        //return item.name + ' - ' + item.Symbol;
        return item.name;
    else
        return item.Symbol
}



function usdPriceTD(item, SARStatus) {
    if (SARStatus)
        return `
		     <td>
				<div id="${item.htmlSymbol}_USD_PRICE">
					connecting
				</div>
			</td>
		`;
    else
        return '';
}


let stokOnce = true;
let timer = 0;
function GetApiCryptoCurrency(redGreen = true) {


    fetch(myURL, { cache: "no-cache" })
        .then(response => response.json())
        .then((data) => {


            //console.log(data);
            //let rData = data.response;
            let rData = data;


            for (let i = 0; i < rData.length; i++) {


                let prices_data = rData[i];

                // console.log(prices_data);

                if (!isEmpty(prices_data['s']) && prices_data['s'] != null) {


                    var key = prices_data['s'];
                    key = key.replace("/", "-");

                    UpdatePL(key, prices_data.c);


                    _Update(prices_data);
                }
            }

            socket_connection();

        });

}


function _Update(prices_data) {

    if (!isEmpty(prices_data['s']) && prices_data['s'] != null) {

        //console.log(prices_data);
        var key = prices_data['s']; // get currency key name e.g: EUR-USD
        key = key.replace("/", "-");


        //UpdatePL(key, prices_data.c);

        //console.log(key);

        if (key == "SAR-USD") {
            $("#shopSARPrice").val(prices_data.c);

        }


        if (prices_data.ccy == "SAR") {

            let shopSARPrice = parseFloat($("#shopSARPrice").val());
            let USDPrice = prices_data.c / (1 / shopSARPrice); //1 usd kaç sar eder bul, sonra onu sar fiyatına böl ki usd fiyatı çıksın

            UpdatePL(key, parseFloat(USDPrice).toFixed(2));

        } else {
            UpdatePL(key, prices_data.c);
        }




        if ($("#" + key + "_PRICE").length > 0) {





            //class="red"
            let oldValue = parseFloat(document.getElementById(key + "_PRICE").innerHTML);
            let newValue = parseFloat(prices_data.c);
            if (oldValue > newValue) {
                $("#" + key + "_PRICE").removeClass("green");
                $("#" + key + "_PRICE").addClass("red");
            }

            else {
                $("#" + key + "_PRICE").removeClass("red");
                $("#" + key + "_PRICE").addClass("green");
            }


            // Set prices
            document.getElementById(key + "_PRICE").innerHTML = prices_data.c;


            let valCH = parseFloat(prices_data.ch);
            if (valCH < 0)
                $("#" + key + "_CHANGEP").addClass("red");
            else
                $("#" + key + "_CHANGEP").addClass("green");


            let cpText = prices_data.cp;
            if (cpText == "0%") {
                cpText = "0.00%"
            }

            document.getElementById(key + "_CHANGEP").innerHTML = cpText;



            let data_cty = $("#" + key + "_PRICE").data("cty");
            let data_exch = $("#" + key + "_PRICE").data("exch");
            let data_ccy = $("#" + key + "_PRICE").data("ccy");

            if (prices_data['cty'] == data_cty && prices_data['exch'] == data_exch) {

                if (data_ccy == "SAR") {

                    let shopSARPrice = parseFloat($("#shopSARPrice").val());
                    let USDPrice = prices_data.c / (1 / shopSARPrice); //1 usd kaç sar eder bul, sonra onu sar fiyatına böl ki usd fiyatı çıksın

                    document.getElementById(key + "_USD_PRICE").innerHTML = parseFloat(USDPrice).toFixed(2);
                }

            }







            let shopSymbol = $("#shopSymbol").val();
            if (shopSymbol == prices_data['s']) {
                updateBuyAndSellAmount();
            }







        }



    }

}



function isEmpty(val) {
    if (val === undefined)
        return true;
    else if (val == null)
        return true;
    else if (val == "undefined")
        return true;
    else if (val == "null")
        return true;
    else if (val === NaN)
        return true;
    else if (val == "NaN")
        return true;
    else if (val == NaN)
        return true;
    else if (Number.isNaN(val))
        return true;
    else if (val.length <= 0)
        return true;
    else
        return false;
}


////Search- Bulma
const filterNames = () => {
    //Get value of input
    let filterValue = document.getElementById('filterInput').value.toUpperCase();

    //Get li
    let aa = document.querySelectorAll('.listgroupitem');
    let aaCard = document.querySelectorAll('.listgroupitemcard');



    //Loop through li
    for (let i = 0; i < aa.length; i++) {
        let bb = aa[i].querySelectorAll('.list-info');
        let invisiblecount = 0;
        for (let j = 0; j < bb.length; j++) {

            //If matched
            if (bb[j].innerHTML.toUpperCase().indexOf(filterValue) > -1) {
                bb[j].style.display = '';
            } else {
                bb[j].style.display = 'none';
                invisiblecount++;
            }

        }

        if (invisiblecount == bb.length) {
            aaCard[i].style.display = 'none';
        }
        else {
            aaCard[i].style.display = '';

        }

    }
};


const SymbolListJson = () => {
    const urlParams = new URLSearchParams(window.location.search);
    var DilID = urlParams.get("DilID");
    if (isEmpty(DilID))
        DilID = 1;

    var myFormData = new FormData();
    myFormData.append("method", "SymbolListJson");
    myFormData.append("DilID", DilID);
    $.ajax({
        dataType: "html",
        type: "POST",
        url: "/handler/General.ashx",
        data: myFormData,
        processData: false,
        contentType: false,
        success: function (msg) {

            let SymbolList = JSON.parse(msg);

            //console.log(SymbolList);

            let icons = [
                `<svg style="color: white;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-currency-bitcoin" viewBox="0 0 16 16">
                    <path d="M5.5 13v1.25c0 .138.112.25.25.25h1a.25.25 0 0 0 .25-.25V13h.5v1.25c0 .138.112.25.25.25h1a.25.25 0 0 0 .25-.25V13h.084c1.992 0 3.416-1.033 3.416-2.82 0-1.502-1.007-2.323-2.186-2.44v-.088c.97-.242 1.683-.974 1.683-2.19C11.997 3.93 10.847 3 9.092 3H9V1.75a.25.25 0 0 0-.25-.25h-1a.25.25 0 0 0-.25.25V3h-.573V1.75a.25.25 0 0 0-.25-.25H5.75a.25.25 0 0 0-.25.25V3l-1.998.011a.25.25 0 0 0-.25.25v.989c0 .137.11.25.248.25l.755-.005a.75.75 0 0 1 .745.75v5.505a.75.75 0 0 1-.75.75l-.748.011a.25.25 0 0 0-.25.25v1c0 .138.112.25.25.25L5.5 13zm1.427-8.513h1.719c.906 0 1.438.498 1.438 1.312 0 .871-.575 1.362-1.877 1.362h-1.28V4.487zm0 4.051h1.84c1.137 0 1.756.58 1.756 1.524 0 .953-.626 1.45-2.158 1.45H6.927V8.539z"></path>
                </svg>`,
                `<svg style="color: white;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-currency-dollar" viewBox="0 0 16 16">
                    <path d="M4 10.781c.148 1.667 1.513 2.85 3.591 3.003V15h1.043v-1.216c2.27-.179 3.678-1.438 3.678-3.3 0-1.59-.947-2.51-2.956-3.028l-.722-.187V3.467c1.122.11 1.879.714 2.07 1.616h1.47c-.166-1.6-1.54-2.748-3.54-2.875V1H7.591v1.233c-1.939.23-3.27 1.472-3.27 3.156 0 1.454.966 2.483 2.661 2.917l.61.162v4.031c-1.149-.17-1.94-.8-2.131-1.718H4zm3.391-3.836c-1.043-.263-1.6-.825-1.6-1.616 0-.944.704-1.641 1.8-1.828v3.495l-.2-.05zm1.591 1.872c1.287.323 1.852.859 1.852 1.769 0 1.097-.826 1.828-2.2 1.939V8.73l.348.086z"></path>
                </svg>`,
                `<svg style="color: white;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-activity" viewBox="0 0 16 16">
                    <path fill-rule="evenodd" d="M6 2a.5.5 0 0 1 .47.33L10 12.036l1.53-4.208A.5.5 0 0 1 12 7.5h3.5a.5.5 0 0 1 0 1h-3.15l-1.88 5.17a.5.5 0 0 1-.94 0L6 3.964 4.47 8.171A.5.5 0 0 1 4 8.5H.5a.5.5 0 0 1 0-1h3.15l1.88-5.17A.5.5 0 0 1 6 2Z"></path>
                </svg>`,
                `<svg style="color: white;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-activity" viewBox="0 0 16 16">
                    <path fill-rule="evenodd" d="M6 2a.5.5 0 0 1 .47.33L10 12.036l1.53-4.208A.5.5 0 0 1 12 7.5h3.5a.5.5 0 0 1 0 1h-3.15l-1.88 5.17a.5.5 0 0 1-.94 0L6 3.964 4.47 8.171A.5.5 0 0 1 4 8.5H.5a.5.5 0 0 1 0-1h3.15l1.88-5.17A.5.5 0 0 1 6 2Z"></path>
                </svg>`,
                `<svg style="color: white;" xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-receipt" viewBox="0 0 16 16">
                    <path d="M1.92.506a.5.5 0 0 1 .434.14L3 1.293l.646-.647a.5.5 0 0 1 .708 0L5 1.293l.646-.647a.5.5 0 0 1 .708 0L7 1.293l.646-.647a.5.5 0 0 1 .708 0L9 1.293l.646-.647a.5.5 0 0 1 .708 0l.646.647.646-.647a.5.5 0 0 1 .708 0l.646.647.646-.647a.5.5 0 0 1 .801.13l.5 1A.5.5 0 0 1 15 2v12a.5.5 0 0 1-.053.224l-.5 1a.5.5 0 0 1-.8.13L13 14.707l-.646.647a.5.5 0 0 1-.708 0L11 14.707l-.646.647a.5.5 0 0 1-.708 0L9 14.707l-.646.647a.5.5 0 0 1-.708 0L7 14.707l-.646.647a.5.5 0 0 1-.708 0L5 14.707l-.646.647a.5.5 0 0 1-.708 0L3 14.707l-.646.647a.5.5 0 0 1-.801-.13l-.5-1A.5.5 0 0 1 1 14V2a.5.5 0 0 1 .053-.224l.5-1a.5.5 0 0 1 .367-.27zm.217 1.338L2 2.118v11.764l.137.274.51-.51a.5.5 0 0 1 .707 0l.646.647.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.646.646.646-.646a.5.5 0 0 1 .708 0l.509.509.137-.274V2.118l-.137-.274-.51.51a.5.5 0 0 1-.707 0L12 1.707l-.646.647a.5.5 0 0 1-.708 0L10 1.707l-.646.647a.5.5 0 0 1-.708 0L8 1.707l-.646.647a.5.5 0 0 1-.708 0L6 1.707l-.646.647a.5.5 0 0 1-.708 0L4 1.707l-.646.647a.5.5 0 0 1-.708 0l-.509-.51z"></path>
                    <path d="M3 4.5a.5.5 0 0 1 .5-.5h6a.5.5 0 1 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h6a.5.5 0 1 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h6a.5.5 0 1 1 0 1h-6a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h6a.5.5 0 0 1 0 1h-6a.5.5 0 0 1-.5-.5zm8-6a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h1a.5.5 0 0 1 0 1h-1a.5.5 0 0 1-.5-.5z"></path>
                </svg>`
            ]

            let LiHtml = ``;
            for (let i = 0; i < SymbolList.length; i++) {

                let item = SymbolList[i][0];

                let THhtml = ` 
                      <th>${etiketler['Pairs']}</th>
                      <th>${etiketler['Last Price']}</th>
                      <th>${etiketler['Change']}</th>
                      `;

                if (item.SymbolCategoryID == 5) {
                    THhtml = ` 
                      <th>${etiketler['Pairs']}</th>
                      <th>${etiketler['Last Price(SAR)']}</th>
                      <th>${etiketler['Last Price(USD)']}</th>
                      <th>${etiketler['Change']}</th>
                      `;
                }


                let setIcon = icons[2];
                if (icons.length > i) {
                    setIcon = icons[i];
                }

                let showClass = "";
                if (i == 1) {
                    showClass = "show";
                }


                LiHtml += `
                        <div class="card listgroupitemcard" style="background-color: #000000; border-bottom: 1px solid #242424;">
                            <div class="card-header">

                                <h5 class="mb-0 ml-2">
                                    ${setIcon}
                                    <button class="btn collapsed" style="color: white; font-size: 14px; padding:0;" type="button" data-toggle="collapse" data-target="#Category-${item.SymbolCategoryID}-Heading" aria-expanded="false" aria-controls="Category-${item.SymbolCategoryID}-Heading">
                                       ${item.Category_i18n}
                                    </button>
                                </h5>

                            </div>
                            <div id="Category-${item.SymbolCategoryID}-Heading" class="collapse ${showClass}" aria-labelledby="Category-${item.SymbolCategoryID}-Heading" data-parent="#accordionExample">
                                <div class="card-body">
                                    <table class="table">
                                        <thead>
                                              ${THhtml}
                                        </thead>
                                        <tbody id="Category-${item.SymbolCategoryID}Tbody" class="listgroupitem" style="height: auto;">
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                `;
            }
            $("#accordionExample").html(LiHtml);


            int(SymbolList);

        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            console.log('HATA:SymbolsJson');
        }
    });

}


function int(SymbolList) {

    for (let i = 0; i < SymbolList.length; i++) {
        let item = SymbolList[i][0];

        let TBodyName = `#Category-${item.SymbolCategoryID}Tbody`;
        createTables(TBodyName, SymbolList[i]);

    }

    openTradingViewWidget('BINANCE:BTCUSDT', 'BTC-USD', false);
    let filterInput = document.getElementById('filterInput');
    filterInput.addEventListener('keyup', () => filterNames());


};



$(function () {

    if ($("#filterInput").length>0)
        SymbolListJson();

});