import { Blob } from "blob-polyfill";

/* eslint-disable prefer-const */

// Function for cell on going activity

function cellActivity(type, message) {

if (type === "loading") {

document.getElementById("play").style.display = "none";

document.getElementById("activity-loader").style.display = "block";

document.getElementById(`out_${window.current_cell}`).innerHTML = "";

} else if (type === "success") {

document.getElementById("play").style.display = "block";

document.getElementById("activity-loader").style.display = "none";

document.getElementById(`out_${window.current_cell}`).innerHTML = message;

document.getElementById(`out_${window.current_cell}`).style.color = "white";

} else {

document.getElementById("play").style.display = "block";

document.getElementById("activity-loader").style.display = "none";

document.getElementById(`out_${window.current_cell}`).innerHTML = message;

document.getElementById(`out_${window.current_cell}`).style.color = "red";

}

}

/* eslint-disable no-eval */

/* eslint-disable no-multi-assign */

/* eslint-disable no-plusplus */

export function print_val(val) {

/// Neeed refactoring. Lot of duplicated line of code

if (Array.isArray(val[0])) {

const row_length = val.length;

let data_string = "[";

if (row_length > 10) {

for (let i = 0; i < 10; i++) {

const row_val = val[i];

const col_length = row_val.length;

data_string += "[";

if (col_length > 10) {

for (let j = 0; j < 10; j++) {

data_string += j === 9 ? `${row_val[j]}` : `${row_val[j]},`;

}

data_string += `.......${col_length - 10} more],`;

} else {

for (let j = 0; j < col_length; j++) {

data_string +=

j === col_length - 1 ? `${row_val[j]}` : `${row_val[j]},`;

}

data_string += i === row_length - 1 ? "]" : "],";

}

}

data_string += `...${row_length - 10} more]`;

} else {

for (let i = 0; i < row_length; i++) {

const row_val = val[i];

const col_length = row_val.length;

data_string += "[";

if (col_length > 10) {

for (let j = 0; j < 10; j++) {

data_string += j === 9 ? `${row_val[j]}` : `${row_val[j]},`;

}

data_string += `.......${col_length - 10} more],`;

} else {

for (let j = 0; j < col_length; j++) {

data_string +=

j === col_length - 1 ? `${row_val[j]}` : `${row_val[j]},`;

}

data_string += i === row_length - 1 ? "]" : "],";

}

}

data_string += "]";

}

return data_string;

}

const row_length = val.length;

let data_string = "[";

const count = row_length > 10 ? 10 : row_length;

for (let i = 0; i < count; i++) {

data_string += i === count - 1 ? `${val[i]}` : `${val[i]},`;

}

const diff = row_length - count;

if (diff > 0) {

data_string += `....${diff} more]`;

} else {

data_string += "]";

}

return data_string;

}

/**

* Displays Danfo DataFrame/Series in a formated table

* @param {DataFrame} df

*/

export function table(df) {

const { col_types, series, columns, index, values } = df;

let head = "";

if (series) {

head += `<th class="${col_types[0]}">${columns}</th>`;

} else {

columns.forEach((name, i) => {

head += `<th class="${col_types[i]}">${name}</th>`;

});

}

let body = "";

values.forEach((row, i) => {

let b_String = `<tr><th>${index[i]}</th>`;

if (series) {

b_String += `<td class="${col_types[0]}">${row}</td>`;

} else {

row.forEach((v, j) => {

b_String += `<td class="${col_types[j]}">${v}</td>`;

});

}

b_String += "</tr>";

body += b_String;

});

// eslint-disable-next-line no-shadow

const table = `

<div style="overflow: auto; max-height: 300px;"><table class="df-table" border="1">

<thead>

<tr>

<th></th>

${head}

</tr>

</thead>

<tbody>

${body}

</tbody>

</table>

</div>

`;

return table;

}

export const downLoad_notebook = (state, name) => {

const data = JSON.stringify(state.cells);

const blob = new Blob([data], { type: "application/json" });

const url = (window.URL || window.webkitURL).createObjectURL(blob);

const link = document.createElement("a");

let fileName = "Dnote-react";

if (name) {

// eslint-disable-next-line prefer-destructuring

fileName = name.split(".")[0];

}

link.download = `${fileName}.json`;

link.href = url;

document.body.appendChild(link);

link.click();

link.remove();

return link;

};

/**

* load package scripts via CDN into scope

* @param {Array} array of package CDNs to load

* @param {*} callback

*/

// eslint-disable-next-line consistent-return

export const load_package = async (array, callback) => {

cellActivity("loading", "");

const loader = function (src, handler) {

const script = document.createElement("script");

script.type = "text/javascript";

script.src = src;

script.onload = script.onreadystatechange = function () {

script.onreadystatechange = script.onload = null;

handler();

cellActivity("success", "Package successfully loaded");

};

script.onerror = function (error) {

cellActivity(

"error",

`Failed to load package ${error.path[0].src}. Check internet connection or package url`

);

};

script.async = true;

document.body.appendChild(script);

eval(script);

};

(function run() {

if (array.length !== 0) {

loader(array.shift(), run);

} else {

// eslint-disable-next-line no-unused-expressions

callback && callback();

}

})();

return "done";

};

export const load_notebook = (dispatch) => {

let fileName = null;

const { files } = document.getElementById("import-notebook-file");

let json_content = null;

if (files.length > 0) {

const content = files[0];

const reader = new FileReader();

reader.onload = function (t) {

json_content = t.target.result;

const json = JSON.parse(json_content);

dispatch({ type: "LOAD_NOTE", payload: json });

};

reader.readAsText(content);

fileName = content.name;

}

return fileName;

};

/**

* Returns the id of the current cell's output div

*/

function this_div() {

const id = `out_${window.current_cell}`;

const rand_div_name = `random_div_${id}`;

const html = `

<div class="col-md-1"></div>

<div class="col-md-9" id=${rand_div_name}>

</div>

<div class="col-md-2"></div>

`;

document.getElementById(id).innerHTML += html;

return rand_div_name;

}

/**

* Creates multiple divs for plotting in an output cell

* @param {String} name of the div to create

* @param {Function} callback

*/

// eslint-disable-next-line no-unused-vars

function viz(name, callback) {

// utility function to enabling ploting

// create the ploting div needed

// eslint-disable-next-line prefer-const

let id = `out_${window.current_cell}`;

const a = (document.getElementById(id).innerHTML += `<div id=${name}></div>`);

// eslint-disable-next-line no-unused-vars

let cb = callback(name);

return a;

// eslint-disable-next-line no-unused-vars

}

/**

* Helper function to load CSV data into Danfo.js Data Structure

* @param {String} path to CSV data.

*/

// eslint-disable-next-line consistent-return

export async function load_csv(path) {

cellActivity("loading", "");

try {

// eslint-disable-next-line no-undef

const df = await dfd.read_csv(path);

cellActivity("success", "Successfully loaded csv");

return df;

} catch (error) {

return cellActivity(

"error",

"Failed to load csv. Check your internet connection or your csv path"

);

}

}

/**

* Helper function to easily log output from for loops in Dom

* @param {*} args

*/

function forLoop_log(args) {

let id = `out_${window.current_cell}`;

let logs = document.createElement("p");

logs.append(`${args}`);

document.getElementById(id).append(logs);

}

console.forlog = forLoop_log;

export const makeGlobal = () => {

window.print_val = print_val;

window.table = table;

window.load_package = load_package;

window.load_csv = load_csv;

window.this_div = this_div;

window.viz = viz;

};