var csvToCartLang = {
      tr: {
        title       : "CSV Dosyası İle Sepete Ürün Yükleme",
        btn_upload  : "Dökümanı Yükle",
        btn_csv_file: "Örnek CSV Dosyası",
        product     : "Ürün",
        not_product : "Ürün Bulunamadı",
        status      : "Durum",
        reminders   : 'Hatırlatmalar',
        only_csv    : 'Sadece .csv uzantılı dosya yüklenebilmektedir.',
        csv_info    : 'Csv uzantılı dosyada ilk sütun ürün ekleme kimiği alanı, ikinci sütun ürünün adedi girilmelidir.',
        csv_limit   : 'Aynı anda en fazla 1000 satır dosya yüklemeniz önerilir.',
        select_error: 'Geçerli Bir Dosya Seçiniz!',
        loading     : 'Yükleniyor...',
        done        : 'Tamamlandı',
        product_add_type : "Ürün Ekleme Kimliği",
        barcode_type : "Ürün Barkodu",
        ws_code_type : "Ürün Web Servis Kodu",
      },
      en: {
        title       : "Adding Products to Cart with CSV File",
        btn_upload  : "Upload Document",
        btn_csv_file: "Example CSV File",
        product     : "Product",
        not_product : "Product Not Found",
        status      : "Status",
        reminders   : 'Reminders',
        only_csv    : 'Only .csv file can be uploaded.',
        csv_info    : 'In the csv extension file, the first column product add type field, the second column product quantity must be entered.',
        csv_limit   : 'It is recommended that you upload no more than 1000 lines of files at a time.',
        select_error: 'Choose a Valid File!',
        loading     : 'Loading...',
        done        : 'Completed',
        product_add_type : "Product Add Type",
        barcode_type : "Product Barcode",
        ws_code_type : "Product Code",
      },
    };
var csvLang = window.LANGUAGE == 'en' ? csvToCartLang.en : csvToCartLang.tr;
document.write(`<style>
    table#CsvErrorTable tr:nth-child(2n + 1) {
        background: #f2f2f2;
    }
    #CsvErrorTable tbody, tfoot, thead, tr, th, td {
        padding: 5px !important;
    }
    .csv-alert {
        align-items: center;
        border: 1px solid rgba(0, 0, 0, .25);
        border-radius: 3px;
        display: flex;
        justify-content: space-between;
        margin: 1em 0;
        padding: .45em .7em;
        width: 100%;
    }
    .csv-alert-success {
        background: #dff0d8;
        color: #3c763d;
    }
    .example-csv-button{
       background-color: #F36D24;
       color : #fff;
       margin: 9px 0px 3px 0px;
    }
    </style>
    <h3>` + csvLang.title + `</h3>
    <div class="csv-alert csv-alert-success">
    <span><b>` + csvLang.reminders + `:</b>
    <ul style='margin:5px 0px 0px 16px !important; list-style-type: initial !important;'>
    <li>` + csvLang.only_csv + `</li>
    <li>` + csvLang.csv_info + `</li>
    <li>` + csvLang.csv_limit + `</li>
    </ul>
    <div style="margin-top: 15px;">
    <b>` + csvLang.product_add_type + `:</b>
    <ul>
    <li><input type="radio" id="getProductByBarcodes" value="getProductByBarcodes" name="csvToCartType" checked> <label for="getProductByBarcodes">` + csvLang.barcode_type + `</label></li>
    <li><input type="radio" id="getProductByWSCodes" value="getProductByWSCodes" name="csvToCartType"> <label for="getProductByWSCodes">` + csvLang.ws_code_type + `</label></li>
    </ul>
    </div>
    <a class="btn example-csv-button" href="https://tools.tsoftapps.com/themes/web/site/csvToCart/assets/file/csvtocart.csv" target="_blank" >` + csvLang.btn_csv_file + `</a>
    </span>
  </div>
<input type="file" id="csvFileUpload" style='margin-top: 20px;'>
    <br>
    <button class="btn btn-success" onclick="csvToCart.createCsv()" style="margin-bottom: 10px; margin-top: 10px; height: 40px !important;">` + csvLang.btn_upload + `</button>

<h2 id="csvLoadingCount" style="margin-top: 60px;  display:none;"></h2>


    <table id="CsvErrorTable" style="margin-top: 40px; margin-bottom: 30px; display:none;">
        <tbody>
            <tr>
                <th width="200">` + csvLang.product + `</th>
                <th width="400">` + csvLang.status + `</th>
            </tr>
        </tbody>
    </table>`);
document.getElementById("csvFileUpload").addEventListener(
        "change",
        function (e) {
            csvToCart.csvFile = e.target.files[0];
        },
        false
        );
csvToCart = {
    csvFile: null,
    addedCount: 0,
    csvLineCount: 0,
    csvArray: [],
    notFoundBarcode: [],
    sendLimit : 25,
    productType : 'getProductByBarcodes',
    paramsKey  : 'barcodes',
    paramKey  : 'barcode',
    createCsv: function () {
        csvToCart.productType = document.querySelector('input[name="csvToCartType"]:checked').value;
        csvToCart.paramsKey = csvToCart.productType === 'getProductByBarcodes' ? 'barcodes' : 'ws_codes';
        csvToCart.paramKey = csvToCart.productType === 'getProductByBarcodes' ? 'barcode' : 'ws_code';
        csvToCart.csvArray = [];
        csvToCart.addedCount = 0;
        if (
                csvToCart.csvFile == null ||
                csvToCart.csvFile.name.toLowerCase().indexOf(".csv") == -1
                ) {
            alert(csvLang.select_error);
            return;
        }
        var reader = new FileReader();
        reader.readAsText(csvToCart.csvFile);
        reader.onload = function (event) {
            var lines = this.result.split("\n");
            for (var line = 0; line < lines.length; line++) {
                
                // Detect Delimiter
                var allowed_delimiters = [",",";"];
                var delimiter = ";";
                var max = 0;
                allowed_delimiters.forEach(function(item, index, arr){
                    var count = (lines[line].match(new RegExp(item, "g")) || []).length;
                    if(count > max){
                        max = count;
                        delimiter = item;
                    }
                });
                // Detect Delimiter End
                
                var row = lines[line]
                        .trim()
                        .replace(/(\r\n|\n|\r)/gm, "")
                        .split(delimiter);
                if (lines[line] != "" && lines[line] != delimiter) {
                    csvToCart.csvArray.push(row);
                }
            }
            csvToCart.csvLineCount = csvToCart.csvArray.length;
            csvToCart.post(0, csvToCart.sendLimit);

            var csvLoadingText = document.getElementById("csvLoadingCount");
            csvLoadingText.style.display = "block";
            csvLoadingText.innerText = '0 / ' + csvToCart.csvLineCount + ' ' + csvLang.loading;

        };
        reader.onerror = function () {
            alert("Unable to read");
        };
    },

    post: function (start, end) {
        var data = csvToCart.csvArray.slice(start, end);
        var formData = new FormData();
        for (var i = 0; i < data.length; i++) {
            formData.append( csvToCart.paramsKey +"[]", data[i][0]);
        }
        var xhr = new XMLHttpRequest();
        xhr.withCredentials = true;
        xhr.addEventListener("readystatechange", function () {
            if (this.readyState === 4) {
                start += csvToCart.sendLimit;
                end += csvToCart.sendLimit;
                if (start < csvToCart.csvLineCount) {
                    csvToCart.post(start, end);
                }
                var resp = JSON.parse(this.responseText);
                csvToCart.addTable(resp.not_found, csvLang.not_product, false);

                var respData = resp.data;
                for (var i = 0; i < respData.length; i++) {
                    for (var j = 0; j < data.length; j++) {
                        if (respData[i][csvToCart.paramKey] == data[j][0]) {
                            respData[i]["quantity"] = data[j][1];
                        }
                    }
                }
                csvToCart.addtocart(respData);
            }
        });
        xhr.open("POST", window.location.origin + "/srv/service/product/"+csvToCart.productType);
        xhr.send(formData);
        if (end > csvToCart.csvArray.length) {
            csvToCart.csvArray = [];
        }
    },
    addtocart: function (data) {
        for (var i = 0; i < data.length; i++) {
            var formData = new FormData();
            formData.append("productId", data[i].id);
            formData.append("variantId", data[i].variant_id);
            formData.append("quantity", data[i].quantity);
            formData.append("csrfToken", window.CART_CSRF_TOKEN);
            csvToCart.postCart(formData, data[i][csvToCart.paramKey]);
        }
    },
    postCart: function (formData, barcode) {
        var xhr = new XMLHttpRequest();
        xhr.withCredentials = true;
        xhr.addEventListener("readystatechange", function () {
            if (this.readyState === 4) {
                var resp = JSON.parse(this.responseText);
                csvToCart.addTable([barcode], resp.statusText, resp.status);
                if (resp.status == 3){
                     $('#cartDetail').angularTemplate();
                }
            }
        });
        xhr.open("POST", window.location.origin + "/srv/service/cart/add-to-cart");
        xhr.send(formData);
    },
    addTable: function (data, msg, status) {
        document.getElementById("CsvErrorTable").style.display = "block";
        var table = document.getElementById("CsvErrorTable");
        var rowBgColor = status == true || status == 3 ? 'green' : 'red';
        data.forEach((e) => {
            csvToCart.addedCount++;
            var csvLoadingText = document.getElementById("csvLoadingCount");
            var loadText = csvToCart.addedCount != csvToCart.csvLineCount ? csvLang.loading : csvLang.done;
            csvLoadingText.innerText = csvToCart.addedCount + ' / ' + csvToCart.csvLineCount + ' ' + loadText;
            var row = table.insertRow(1);
            var cell1 = row.insertCell(0);
            var cell2 = row.insertCell(1);
            cell1.innerHTML = e;
            cell2.innerHTML = '<font color="' + rowBgColor + '">' + msg + '</font>';
        });
    },
};