/*
 * User related JS
 *
 *
 *
 *
 */
window.onload = function () {
  subscribe();

  if (window.location.href.indexOf("=add-website") > 0) {
    //try {
    userOperations.verificationSetStatusByUrl();
    //userOperations.verificationFile();
    //} catch (e) {

    //}
    var file_verify_button = document.querySelector("#file-verify-button");
    if (file_verify_button !== null) {
      file_verify_button.addEventListener("click", function () {
        var loading = document.querySelector("#spinner-element");
        var veirfyTableSection = document.querySelector("#file-verification");

        loading = loading.cloneNode(true);
        loading.classList.remove("d-none");
        veirfyTableSection.innerHTML = loading.outerHTML;
        userOperations.verificationFile();
      });
    }

    var cancel_verify_button = document.querySelector("#cancel-verify-button");
    if (cancel_verify_button !== null) {
      cancel_verify_button.addEventListener("click", function () {
        userOperations.cancelValidationProcess();
      });
    }
  }
};

var userOperations = (function () {
  function _clearColorClasses(element) {
    element.classList.remove("text-success");
    element.classList.remove("text-danger");
    element.classList.remove("failed");
  }

  function _setStatus(element, data) {
    var statusElement = document.querySelector("#" + element + "-verification");
    if (data["status-code"] === 200) {
      statusElement.innerHTML = "OK";
      _clearColorClasses(statusElement);

      statusElement.classList.add("text-success");

      if (element === "file") {
        var button = document.querySelector("#file-verify-button");
        if (button !== null) {
          button.classList.add("d-none");
        }
        var c_link = document.querySelector("#confirm-link");
        if (c_link !== null) {
          c_link.classList.remove("d-none");
        }
        document.querySelector("#verify-text").classList.add("d-none");
      }

      return true;
    }
    statusElement.innerHTML = "Failed";
    _clearColorClasses(statusElement);

    statusElement.classList.add("text-danger");

    return false;
  }

  function _handleCancelAction(data) {
    window.location = "/dashboard?action=website-monitor";
  }

  function verificationSetStatusByUrl() {
    const queryString = window.location.search;
    var urlParams = new URLSearchParams(queryString);
    url = "/user-request?action=check-url&now=1&url=" + urlParams.get("url");
    sendRequest.doGet(url, _setStatus.bind(this, "status"));
  }

  function verificationFile() {
    const queryString = window.location.search;
    var urlParams = new URLSearchParams(queryString);

    var input = document.querySelector("#input_identifier");
    if (input !== null) {
      value = input.value;
    } else {
      value = "none";
    }

    var inputuid = document.querySelector("#uid");
    if (inputuid !== null) {
      uid = inputuid.value;
    } else {
      uid = "none";
    }
    url =
      "/user-request?action=check-file&now=1&id=" +
      value +
      "&url=" +
      urlParams.get("url") +
      "&uid=" +
      uid;
    sendRequest.doGet(url, _setStatus.bind(this, "file"));
  }

  function cancelValidationProcess() {
    const queryString = window.location.search;
    var urlParams = new URLSearchParams(queryString);
    var id = document.querySelector("#uid");

    url =
      "/user-request?action=cancel-verification&now=1&id=" +
      id.value +
      "&url=" +
      urlParams.get("url");
    sendRequest.doGet(url, _handleCancelAction.bind(this, "file"));
  }

  function setEventListenerss() {
    var verifyButton = document.querySelector("#file-verify-button");
    if (verifyButton !== null) {
      verifyButton.addEventListener("click", verificationFile);
    }

    var cancelButton = document.querySelector("#cancel-verify-button");
    if (cancelButton !== null) {
      cancelButton.addEventListener("click", cancelValidationProcess);
    }
  }

  var API = {
    verificationSetStatusByUrl: verificationSetStatusByUrl,
    verificationFile: verificationFile,
    cancelValidationProcess: cancelValidationProcess,
    setEventListenerss: setEventListenerss,
  };

  return API;
})();

function processing(visible, hide_after_done = false) {
  var loading_box = document.getElementById("processing");
  if (loading_box !== null && loading_box !== undefined) {
    if (visible) {
      loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.remove("hidden")
        : null;
      loading_box.parentElement.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.parentElement.classList.remove("hidden")
        : null;
      loading_box.classList.remove("hidden");
      // document.querySelector("#upload_text").setAttribute("hidden", "true");
    } else {
      !loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.add("hidden")
        : null;
      if (hide_after_done) {
        !loading_box.parentElement.parentElement.classList.contains("hidden")
          ? loading_box.parentElement.parentElement.classList.add("hidden")
          : null;
      }
      loading_box.classList.add("hidden");
    }
  }
}
function loading(visible, hide_after_done = false) {
  var loading_box = document.getElementById("loading");
  if (loading_box !== null && loading_box !== undefined) {
    if (visible) {
      loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.remove("hidden")
        : null;
      loading_box.parentElement.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.parentElement.classList.remove("hidden")
        : null;
      loading_box.classList.remove("hidden");
      // document.querySelector("#upload_text").setAttribute("hidden", "true");
    } else {
      !loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.add("hidden")
        : null;
      if (hide_after_done) {
        !loading_box.parentElement.parentElement.classList.contains("hidden")
          ? loading_box.parentElement.parentElement.classList.add("hidden")
          : null;
      }
      loading_box.classList.add("hidden");
    }
  }
}

function validate_email(mail) {
  if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(mail)) {
    return true;
  }
  return false;
}

function subscribe() {
  btn = document.querySelector("#subscribe");
  let counter = 0;
  inpt = btn.parentElement.querySelector("input[name=add-subscribe]");
  btn.addEventListener("click", function (ev) {
    ev.preventDefault();
    if (validate_email(inpt.value)) {
      if (counter == 0) {
        foot = document.querySelector("footer");
        script_tag = document.createElement("script");
        script_tag.setAttribute(
          "src",
          "https://www.google.com/recaptcha/api.js?"
        );
        script_tag.setAttribute("defer", "defer");
        foot.parentNode.insertBefore(script_tag, foot.nextSibling);
        document.querySelector(".g-recaptcha").classList.remove("d-none");
      }

      if (counter >= 1) {
        if (grecaptcha.getResponse().length == 0) {
          set_alert("Please solve the captcha !", "danger");
          return false;
        }
        data = new FormData();
        data.append("add-subscribe", inpt.value);
        sendRequest.doPost("/user-request", data, (call_data) => {
          if (call_data["success"]) {
            set_alert(call_data["success"], "success");
          } else {
            set_alert(call_data["false"], "danger");
          }
        });
      }
      counter++;
    } else {
      set_alert("Please insert a valid email address!", "danger");
    }
  });
}

function remove_alert() {
  alert_modal = document.querySelector(".alert-modal");
  alert_box = alert_modal.querySelector(".tool-alert");
  input_alert_box = alert_modal.querySelector(".input-alert");
  alert_modal.classList.add("d-none");
  if (alert_box.children.length > 1) {
    alert_box.children[0].remove();
  }
  if (input_alert_box !== null && input_alert_box !== undefined) {
    input_alert_box.classList.add("d-none");
    //         if (input_alert_box.children.length > 1){
    //            input_alert_box.children[0].remove();
    //        }
  }
}

async function post_form_request(url, data, callback = false) {
  await sendRequest.doPost(url, data, (call_data) => {
    if (!callback) {
      if (call_data["success"] !== null && call_data["success"] !== undefined) {
        set_alert(call_data["success"], "success");
      } else {
        set_alert(call_data["failure"], "danger");
      }
    } else {
      callback(call_data);
    }
  });
}

async function set_alert(message, text_class) {
  processing(false);
  loading(false);
  message_span = document.createElement("span");
  alert_modal = document.querySelector(".alert-modal");
  alert_modal.children[0].classList.add("text-center");
  if (text_class !== "danger") {
    alert_modal.children[0].classList.remove("alert-danger");
    alert_modal.children[0].classList.add("alert-" + text_class);
  } else {
    alert_modal.children[0].classList.contains("alert-danger")
      ? null
      : alert_modal.children[0].classList.add("alert-danger");
  }
  alert_box = alert_modal.querySelector(".tool-alert");
  alert_modal.classList.remove("d-none");
  text_class == null
    ? message_span.classList.add("text-dark")
    : message_span.classList.add("text-" + text_class);
  message_span.innerHTML = message;
  alert_box.insertBefore(message_span, alert_box.children[0]);
}

function $(selector, all = false) {
  if (!all) {
    return document.querySelector(selector);
  } else {
    return document.querySelectorAll(selector);
  }
}

// GLOBAL VARIABLES
const app = {
  visitor_pages: [],
  conversion_button: document.querySelector(".conversion-button"),
  conversion_type: null,
  allowed_types: [],
  seo_tags: ["description", "title"],
  is_dev: false,
  is_logged: false,
  is_user_page: false,
  allowed_file_size: null,
  file_size: 0,
  init() {
    cookies = this.getCookies();
    cookies.logged !== undefined && cookies.logged !== "false"
      ? (this.is_logged = true)
      : null,
      this.check_if_dev() ? (this.is_dev = true) : null;
    if (
      this.conversion_button !== null &&
      this.conversion_button !== undefined
    ) {
      this.conversion_type = this.conversion_button.id;

      if (this.conversion_type === "ocr") {
        this.allowed_types = ["jpg", "png", "jpeg", "pdf", "tiff"];
        this.max_files = 15;
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }

      if (this.conversion_type === "pdf-to-image") {
        this.allowed_types = ["pdf"];
        this.max_files = 10;
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }

      if (this.conversion_type === "image-to-pdf") {
        this.allowed_types = ["jpg", "jpeg", "png", "tiff"];
        this.is_logged ? (this.max_files = 15) : (this.max_files = 5);
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }
      if (this.conversion_type === "split-pdf") {
        this.allowed_types = ["pdf"];
        this.is_logged ? (this.max_files = 1) : (this.max_files = 1);
        //                    this.is_logged ? this.allowed_file_size = 200 : this.allowed_file_size = 30
      }

      if (this.conversion_type === "kw-check") {
        this.allowed_types = ["txt", "docx"];
        this.max_files = 1;
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }

      if (this.conversion_type == "pdf-add-watermark") {
        this.allowed_types = ["pdf"];
        this.max_files = 1;
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }
      if (this.conversion_type == "merge-pdf") {
        this.allowed_types = ["pdf"];
        this.max_files = 10;
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }
      if (this.conversion_type == "compress-pdf") {
        this.allowed_types = ["pdf"];
        this.max_files = 1;
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }
      if (this.conversion_type == "swap-pdf-pages") {
        this.allowed_types = ["pdf"];
        this.max_files = 1;
        this.is_logged
          ? (this.allowed_file_size = 200)
          : (this.allowed_file_size = 30);
      }
    }
    window.location.href.indexOf("dashboard") >= 0
      ? (this.is_user_page = true)
      : null;

    this.is_dev ? (prefix = "dev.") : (prefix = "");
    this.visitor_pages = [
      "https://" + prefix + "dailyocr.com/",
      "https://" + prefix + "dailyocr.com/tools/",
      "https://" + prefix + "dailyocr.com/tools/ocr",
      "https://" + prefix + "dailyocr.com/tools/pdf-to-image",
      "https://" + prefix + "dailyocr.com/tools/image-to-pdf",
      "https://" + prefix + "dailyocr.com/tools/keyword-density",
      "https://" + prefix + "dailyocr.com/tools/seo-heading-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-description-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-title-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-sitemap-checker",
      "https://" + prefix + "dailyocr.com/tools/sitemap-broken-links",
      "https://" + prefix + "dailyocr.com/tools/sitemap-generator",
      "https://" + prefix + "dailyocr.com/tools/seo-robots-checker",
      "https://" + prefix + "dailyocr.com/tools/write-seo-title",
      "https://" + prefix + "dailyocr.com/tools/write-seo-description",
      "https://" + prefix + "dailyocr.com/tools/split-pdf",
      "https://" + prefix + "dailyocr.com/tools/pdf-add-watermark",
      "https://" + prefix + "dailyocr.com/tools/merge-pdf",
      "https://" + prefix + "dailyocr.com/tools/swap-pdf-pages",
      "https://" + prefix + "dailyocr.com/tools/minified-js-checker",
      "https://" + prefix + "dailyocr.com/tools/minified-css-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-image-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-social-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-canonical-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-page-size-checker",
      "https://" + prefix + "dailyocr.com/tools/seo-gzip-checker",
      "https://" + prefix + "dailyocr.com/tools/whois-lookup",
      "https://" + prefix + "dailyocr.com/tools/check-http-header",
      "https://" + prefix + "dailyocr.com/tools/domain-age-checker",
      "https://" + prefix + "dailyocr.com/tools/website-tree-structure",
      "https://" + prefix + "dailyocr.com/tools/broken-links-checker",
      "https://" + prefix + "dailyocr.com/seo-report",
    ];
    if (!this.is_dev) {
      if (this.visitor_pages.find((elem) => elem === window.location.href)) {
        load_analitics();
      }
    }
  },
  check_if_dev() {
    if (location.hostname.indexOf("dev") !== -1) {
      return true;
    } else {
      return false;
    }
  },
  getCookies() {
    var pairs = document.cookie.split(";");
    var cookies = {};
    for (var i = 0; i < pairs.length; i++) {
      var pair = pairs[i].split("=");
      cookies[(pair[0] + "").trim()] = unescape(pair.slice(1).join("="));
    }
    return cookies;
  },
  input_accept() {
    inpt = document.querySelector("#file");
    if (inpt == null || inpt == undefined) {
      return false;
    }
    replace_inpt = document.querySelector("#replace_file");
    attr_string = "";
    this.allowed_types.forEach(function (tp) {
      if (tp == "pdf") {
        attr_string += "application/" + tp + ", ";
      }
      attr_string += "image/" + tp + ", ";
    });

    inpt.setAttribute("accept", attr_string);
    if (replace_inpt !== undefined && replace_inpt !== null) {
      replace_inpt.setAttribute("accept", attr_string);
    }
  },
};
//console.log( app.is_dev);

function clear_storage() {
  var conv_btn = $(".conversion-button");
  window.addEventListener("beforeunload", clearHandler);
  conv_btn.addEventListener("click", clearHandler);
}

function clearHandler() {
  if (localStorage.getItem("order_id")) {
    var url = "/clear?id=" + localStorage.getItem("order_id");
    sendRequest.doGet(url, null);
    localStorage.removeItem("order_id");
  } else {
    token = document.querySelector("#token");
    if (token) {
      var url = "/clear?token=" + token.value;
      sendRequest.doGet(url, null);
    }
  }
}

async function update_connection_status() {
  window.onbeforeunload = function () {
    token = $("#token").value;
    var url = "/user-request?close-connection&token=" + token;
    sendRequest.doGet(url, null);
  };
}

function user_create() {
  var pass = document.querySelector("[name=password]");
  var re_pass = document.querySelector("[name=retype_password]");
  var sbmt = document.querySelector("[name=create]");
  var user_name = document.querySelector("[name=user_name]");
  var numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
  sbmt.addEventListener("click", function (ev) {
    count = 0;
    Array.from(pass.value).forEach(function (elem) {
      if (numbers.includes(parseInt(elem))) {
        count++;
      }
    });
    if (user_name.value.length < 5) {
      ev.preventDefault();
      set_alert("Username must be at least 5 characters long!", "danger");
    } else if (pass.value.length < 7) {
      ev.preventDefault();
      set_alert(
        "Password too short. Must be at least 7 characters long.",
        "danger"
      );
    } else if (count < 1) {
      ev.preventDefault();
      set_alert(
        "Password must contain at least 2 alpha numeric characters!",
        "danger"
      );
    } else if (pass.value !== re_pass.value) {
      ev.preventDefault();
      set_alert("Passwords must match!", "danger");
    }
  });
}

function display_allowed_types() {
  var file_input = document.querySelector(".upload-span");
  if (file_input !== undefined && file_input !== null) {
    file_input.innerHTML =
      file_input.innerHTML + app.allowed_types.join(", ").toUpperCase();
  }
}

function change_convert_btn(bool, hide = false) {
  var btn = document.querySelector(".conversion-button");
  if (bool) {
    btn.removeAttribute("disabled");
    btn.parentElement.classList.remove("d-none");
  } else {
    if (hide) {
      btn.parentElement.classList.add("d-none");
    }
    btn.setAttribute("disabled", "disabled");
  }
}
function split_pdf_data() {
  var split_type = document.querySelectorAll(".split-type");
  split_type = Array.from(split_type).find((elem) =>
    elem.hasAttribute("checked")
  );
  var total_files = document.querySelector(".total-pdfs").innerHTML;
  var form_data_results = [];
  form_data_results["total_pdfs"] = total_files;
  form_data_results["split_type"] = split_type.id;
  var split_points = [];
  var removes = [];
  switch (split_type.id) {
    case "manual":
      var manual_splits = document.querySelectorAll(".manual-split");
      var manual_removes = document.querySelectorAll(".manual-remove");
      manual_splits.forEach(function (elem) {
        var from = parseInt(
          elem.querySelector(".manual-from-span").innerHTML.split(":")[1]
        );
        var to = parseInt(
          elem.querySelector(".manual-to-span").innerHTML.split(":")[1]
        );
        split_points.push(from + "-" + to);
      });
      form_data_results["splits"] = split_points;
      manual_removes.forEach(function (elem) {
        removes.push(elem.innerHTML);
      });
      removes.length == 0
        ? (form_data_results["removes"] = "none")
        : (form_data_results["removes"] = removes);
      break;
    case "range":
      var range_splits = document.querySelectorAll(".range-split-holder");
      range_splits.forEach(function (elem, idx) {
        var from = parseInt(
          elem
            .querySelector("#start-page-" + (idx + 1))
            .querySelector(".page-number").innerHTML
        );
        var to = parseInt(
          elem
            .querySelector("#end-page-" + (idx + 1))
            .querySelector(".page-number").innerHTML
        );
        split_points.push(from + "-" + to);
      });
      form_data_results["splits"] = split_points;
      form_data_results["removes"] = "none";
      break;
    case "all":
      var all_splits = document.querySelectorAll(".all-split");
      all_splits.forEach(function (elem, idx) {
        var from = parseInt(elem.children[0].innerHTML.split(":")[1]);
        split_points.push(from);
      });
      var all_removes = document.querySelectorAll(".manual-remove");
      all_removes.forEach(function (elem) {
        removes.push(elem.innerHTML.split(":")[1]);
      });
      form_data_results["splits"] = split_points;
      form_data_results["removes"] = removes;
      break;
  }
  document.querySelector("#zip-files").hasAttribute("checked")
    ? (form_data_results["has_zip"] = "true")
    : (form_data_results["has_zip"] = "false");

  //                return false;;
  return form_data_results;
}

function add_swap_pdf_pages_data() {
  var form_data_results = [];
  form_data_results["page-order"] = [];
  pages = document.querySelectorAll(".page-holder");
  pages.forEach(function (page) {
    form_data_results["page-order"].push(page.id);
  });
  removed = document.querySelectorAll(".manual-remove");
  if (removed.length > 0) {
    form_data_results["removed"] = [];
    removed.forEach(function (rm) {
      form_data_results["removed"].push(rm.innerHTML);
    });
  }
  return form_data_results;
}

let hex2rgb = (hex) => {
  if (hex.length === 4) {
    return fullHex(hex);
  }

  const r = parseInt(hex.slice(1, 3), 16);
  const g = parseInt(hex.slice(3, 5), 16);
  const b = parseInt(hex.slice(5, 7), 16);
  // return {r, g, b}
  return { r, g, b };
};

function add_watermark_data() {
  var method = document.querySelectorAll(".method");
  method = Array.from(method).find((elem) => elem.hasAttribute("checked"));
  var form_data_results = [];
  form_data_results["pages"] = [];
  if (method.id == "manual") {
    pages = document.querySelectorAll(".watermarked");
    if (pages.length == 0) {
      set_alert("Select pages to add watermark!", "danger");
      return false;
    }
    to_add = [];
    pages.forEach(function (page) {
      holder = page.parentElement.previousSibling;
      to_add.push(parseInt(holder.querySelector(".page-number").innerHTML) - 1);
    });
    form_data_results["pages"] = to_add;
  }
  if (method.id == "all") {
    form_data_results["pages"] = [1, pdf_renderer.total_pages];
    removed_pages = document
      .querySelector(".removed-pages-list")
      .querySelectorAll(".manual-remove");
    if (removed_pages.length > 0) {
      form_data_results["removed-pages"] = [];
      removed_pages.forEach(function (elem) {
        form_data_results["removed-pages"].push(elem.innerHTML);
      });
    }
  }

  if (method.id == "range") {
    menus = document.querySelectorAll(".range-menu");
    menus.forEach(function (menu) {
      inpts = menu.querySelectorAll(".range-input");
      form_data_results["pages"].push([
        parseInt(inpts[0].value) - 1,
        parseInt(inpts[1].value) - 1,
      ]);
    });
  }

  form_data_results["method"] = method.id;
  form_data_results["wm-type"] = document.querySelector(
    ".selected-watermark"
  ).id;

  if (form_data_results["wm-type"] == "text-wm") {
    form_data_results["input-text"] = document.querySelector(
      "input[name=input-text]"
    ).value;

    if (!form_data_results["input-text"]) {
      set_alert("Insert text before submitting!", "danger");
      return false;
    }

    form_data_results["text-font"] = document.querySelector(
      "select[name=font-text]"
    ).value;
    form_data_results["text-size"] = document.querySelector(
      "input[name=size-text]"
    ).value;
    form_data_results["text-color"] = hex2rgb(
      document.querySelector("input[name=color-text]").value
    );
    form_data_results["text-dimensions"] = get_text_dimensions(
      form_data_results["input-text"],
      form_data_results["text-size"]
    );

    text_buttons = document.querySelectorAll(".text-decoration-input");
    text_buttons.forEach(function (btn) {
      if (btn.hasAttribute("checked")) {
        form_data_results[btn.name] = "yes";
      }
    });
  } else {
    file = document.querySelector("#wm-file");
    if (!file.files) {
      set_alert("Please select an image as watermakr!", "danger");
      return false;
    }
    form_data_results["file-name"] = file.files[0].name;
  }

  positions = [];
  p_boxes = document.querySelectorAll(".position-box");
  p_boxes.forEach(function (bx) {
    if (bx.hasAttribute("checked")) {
      positions.push(bx.value);
    }
  });

  if (positions.length == 0) {
    set_alert("Select a position for the watermark!", "danger");
    return false;
  }
  form_data_results["positions"] = positions;
  form_data_results["opacity"] = document.querySelector(
    "select[name=opacity]"
  ).value;
  form_data_results["orientation"] = document.querySelector(
    "select[name=orientation]"
  ).value;
  return form_data_results;
}

function get_text_dimensions(str = "", size = false) {
  div = document.createElement("div");
  div.style.position = "absolute";
  div.style.visibility = "hidden";
  div.style.height = "auto";
  div.style.width = "auto";
  div.style.whiteSpace = "nowrap";
  div.innerHTML = str;
  document.body.appendChild(div);
  res = [div.clientWidth, div.clientHeight];

  div.remove();
  return res;
}

async function upload_files(convert = true) {
  loading(true);
  change_convert_btn(false);
  remove_download_btn();
  let form_data = new FormData();
  var file_selector = $("#file");
  var selects = $("select", true);
  var boxes = $("input[type=checkbox]", true);
  idx = 0;
  if (file_selector.files.length == 0) {
    message = "Please upload files before converting!";
    set_alert(message, "danger");
    change_convert_btn(true);
    loading(false, true);
    return false;
  }
  if (file_selector.files.length > app.max_files) {
    message =
      "You can upload up to " + app.max_files + " files at the same time!";
    set_alert(message, "danger");
    change_convert_btn(true);
    loading(false, true);
    return false;
  }

  if (app.file_size > app.allowed_file_size) {
    message =
      "Your files have exceeded the allowed size of " +
      app.allowed_file_size +
      "MB!";
    set_alert(message, "danger");
    loading(false, true);
    change_convert_btn(true);
    return false;
  }

  if (
    app.conversion_type === "image-to-pdf" ||
    app.conversion_type == "merge-pdf" ||
    app.conversion == "swap-pdf-pages"
  ) {
    form_data = order_file_list();
  } else {
    for (const value of file_selector.files) {
      form_data.append("files_" + idx, value);
      ++idx;
    }
  }
  if (app.conversion_type === "split-pdf") {
    //        var split_type = document.querySelectorAll(".split-type");
    //        var type = split_type.find(elem => elem.hasAttribtute("checked"))

    //        form_data.append("split_type", type.id)

    var split_data = split_pdf_data();
    if (split_data["splits"].length == 0) {
      set_alert(
        "Please make sure your resulted PDF contains at least 1 page!",
        "danger"
      );
      change_convert_btn(true);
      loading(false, true);
      return false;
    }
    form_data.append("split_type", split_data["split_type"]);
    form_data.append("total_pdfs", split_data["total_pdfs"]);
    form_data.append("ranges", split_data["splits"]);
    form_data.append("removes", split_data["removes"]);
    form_data.append("has_zip", split_data["has_zip"]);

    //        document.querySelector(".input-label").scrollIntoView()
  }

  if (app.conversion_type == "pdf-add-watermark") {
    data = add_watermark_data();
    if (!data) {
      change_convert_btn(true);
      return false;
    }

    if (data["wm-type"] == "img-wm") {
      form_data.append(
        "watermark-image",
        document.querySelector("#wm-file").files[0]
      );
    }
    form_data.append("pdf-options", JSON.stringify(Object.assign({}, data)));
  }
  if (app.conversion_type == "swap-pdf-pages") {
    data = add_swap_pdf_pages_data();
    form_data.append("pdf-options", JSON.stringify(Object.assign({}, data)));
  }

  if (selects.length > 0) {
    selects.forEach(function (elem) {
      form_data.append(elem.id, elem.value);
    });
  }
  if (boxes.length > 0) {
    boxes.forEach(function (elem) {
      form_data.append(elem.id, elem.value);
    });
  }

  form_data.append("conversion", app.conversion_type);
  function failure(error) {
    loading(false);
    console.log("ERROR: " + error);
  }

  function success(response) {
    loading(false);
    if (response["Error"] !== null && response["Error"] !== undefined) {
      set_alert(response["Error"], "danger");
      return false;
    }
    if (response["success"] !== null && response["success"] !== undefined) {
      conversion(response["success"]);
    }
  }
  if (!convert) {
    const upload_response = await fetch("/upload", {
      method: "POST",
      body: form_data,
      success: function (data) {},
    });
    return await upload_response.json();
  } else {
    await fetch("/upload", {
      method: "POST",
      body: form_data,
      success: function (data) {},
    })
      .then((res) => res.json())
      .then((response) => success(response))
      .catch((error) => failure(error));
  }
}

async function conversion(response) {
  processing(true);
  localStorage.setItem("order_id", response);
  function failure(error) {
    change_convert_btn(true);
    processing(false);
    console.log("ERROR: " + error);
  }

  function success(response) {
    change_convert_btn(true);
    processing(false);
    if (response["success"] !== null && response["success"] !== undefined) {
      create_download_btn(response["success"]);
      if (app.conversion_type == "ocr") {
        userOCRRequests.populate_dashboard_table(response["file"]);
      }
    } else if (response["Error"] !== null && response["Error"] !== undefined) {
      set_alert(response["Error"], "danger");
    }
  }

  await fetch(
    "../conversion-api?id=" + response + "&type=" + app.conversion_type,
    {}
  )
    .then((res) => res.json())
    .then((response) => success(response))
    .catch((error) => failure(error));
}

function exploded_name(name) {
  var result = [];
  last_pos = name.lastIndexOf(".");
  result.push(name.slice(0, last_pos));
  result.push(name.slice(last_pos + 1, name.length));
  return result;
}

function check_types(file_input = false, allowed = []) {
  if (!file_input) {
    var file_input = document.querySelector("#file");
  }
  if (allowed.length == 0) {
    allowed = app.allowed_types;
  }
  for (const value of file_input.files) {
    type = exploded_name(value.name)[1];
    found = allowed.find((element) => element === type.toLowerCase());
    if (found === null || found === undefined) {
      file_input.value = "";
      return false;
    }
  }
  return true;
}
function remove_file_handler() {
  parent = this.parentElement.closest("li");
  if (parent == null || parent == undefined) {
    parent = this.parentElement.parentElement;
  }
  var list_div = document.querySelector("#file-list-holder");
  file_count = document.querySelector(".file-counter");
  size_count = document.querySelector(".size-counter");
  id = parent.id;
  parent.remove();
  var file_input = document.querySelector("#file");
  const dt = new DataTransfer();
  app.file_size = 0;
  idx = 1;
  app.file_size = 0;

  for (const value of file_input.files) {
    // console.log(idx);
    if (parseInt(idx) != parseInt(id)) {
      dt.items.add(value);
      app.file_size += parseFloat((value.size / (1024 * 1024)).toFixed(2));
    } else {
    }

    idx++;
  }

  file_input.files = dt.files;

  if (dt.files.length === 0) {
    list_div ? list_div.classList.add("d-none") : null;
  }

  if (
    file_count !== undefined &&
    file_count !== null &&
    size_count !== undefined &&
    size_count !== null
  ) {
    var file_count = document.querySelector(".file-counter");
    var size_count = document.querySelector(".size-counter");
    if (app.file_size <= app.allowed_file_size) {
      size_count.classList.remove("bg-danger");
    }
    if (dt.files.length <= app.max_files) {
      file_count.classList.remove("bg-danger");
    }
    file_count.innerHTML = dt.files.length;
    size_count.innerHTML = app.file_size.toFixed(2) + " MB";
  }

  reset_list_ids();
}

function replace_file_handler() {
  target = this;
  parent = this.parentElement.closest("li");
  holder = target.parentElement.parentElement;
  replace_input = document.querySelector("#replace_file");
  file_input = document.querySelector("#file");

  replace_input.click();
  replace_input.addEventListener("change", function () {
    if (replace_input.files.length > 0) {
      file_count = document.querySelector(".file-counter");
      size_count = document.querySelector(".size-counter");

      const dt = new DataTransfer();
      idx = 0;
      id = holder.id;
      for (const value of file_input.files) {
        if (idx != id) {
          dt.items.add(value);
        } else {
          dt.items.add(replace_input.files[0]);
        }

        idx++;
      }
      file_input.files = dt.files;
      if (parent !== null && parent !== undefined) {
        parent.querySelector(".size-span").innerHTML =
          (replace_input.files[0].size / (1024 * 1024)).toFixed(2) + " MB";
      }

      img = holder.querySelector("img");
      if (img !== undefined && img !== null) {
        holder.querySelector("img").src = URL.createObjectURL(
          replace_input.files[0]
        );
      }
      name_span =
        holder.querySelector(".image-name") ||
        holder.querySelector(".file-name");
      name_span.innerHTML = replace_input.files[0].name;

      obj = holder.querySelector("object");
      if (obj !== undefined && obj !== null) {
        type = exploded_name(replace_input.files[0].name)[1].toLowerCase();
        type == "jpeg" ? (type = "jpg") : null;
        obj.className = "";
        obj.data = "../images/" + type + "-type.svg";
        obj.classList.add(type + "-icon");
        //                obj.classList.add("file-icon", "blue");
      }

      if (
        file_count !== undefined &&
        file_count !== null &&
        size_count !== undefined &&
        size_count !== null
      ) {
        idx = 0;
        app.file_size = 0;
        for (const value of file_input.files) {
          app.file_size += parseFloat((value.size / (1024 * 1024)).toFixed(2));
        }
        var file_count = document.querySelector(".file-counter");
        var size_count = document.querySelector(".size-counter");
        if (app.file_size <= app.allowed_file_size) {
          size_count.classList.remove("bg-danger");
        }
        if (dt.files.length <= app.max_files) {
          file_count.classList.remove("bg-danger");
        }
        file_count.innerHTML = dt.files.length;
        size_count.innerHTML = app.file_size.toFixed(2) + " MB";
      }
    }
  });
}

function remove_file() {
  var close_btns = document.querySelectorAll(".delete");
  close_btns.forEach(function (btn) {
    btn.addEventListener("click", remove_file_handler);
  });
}

function replace_file() {
  replace_btns = document.querySelectorAll(".replace");
  replace_btns.forEach(function (btn) {
    btn.addEventListener("click", replace_file_handler);
  });
}

function reset_list_ids() {
  var lis = document.querySelectorAll(".name-li");
  if (lis.length == 0) {
    lis = document.querySelectorAll(".list-image-holder");
  }
  lis.forEach(function (element, i) {
    element.id = i + 1;
  });
}

function clear_name_list() {
  // var list_div = document.querySelector("#file-list-holder");
  // var image_div = document.querySelector("#image-list");
  document.querySelector("#file-list-holder") !== null
    ? (list_div = document.querySelector("#file-list-holder"))
    : (list_div = document.querySelector("#image-list"));
  if (list_div !== null && list_div.querySelector("#name-list") !== null) {
    list_div.querySelector("#name-list").remove();
    document.querySelector(".file-counter").classList.remove("bg-danger");
    document.querySelector(".size-counter").classList.remove("bg-danger");
  }
}

function names_list() {
  clear_name_list();
  const db_text = $(".db-file-text");
  db_text ? db_text.classList.add("d-none") : null;

  $("#tool-work-area") ? $("#tool-work-area").classList.remove("d-none") : null;
  var list_div = $("#file-list-holder");

  list_div.classList.contains("d-none")
    ? list_div.classList.remove("d-none")
    : null;
  const label = $(".input-label") || $(".dashboard-ocr-label");

  var file_count = $(".file-counter");
  var size_count = $(".size-counter");
  var file_input = $("#file");
  var ul = $create("ul");
  $("#file-list-holder").classList.remove("d-none");
  ul.setAttribute("id", "name-list");
  list_div.appendChild(ul);
  // ul.style.display = "none";
  i = 1;
  app.file_size = 0;
  for (const value of file_input.files) {
    var li = $create("li");
    var name_span = $create("span");
    var icon = $create("object");
    var right_container = $create("div");
    var left_container = $create("div");
    var size_span = $create("span");
    var total_files_span = $create("span");
    size_span.innerHTML = (value.size / (1024 * 1024)).toFixed(2) + " MB";
    app.file_size += parseFloat((value.size / (1024 * 1024)).toFixed(2));
    size_span.classList.add("size-span");
    right_container.classList.add(
      "justify-content-end",
      "align-items-center",
      "d-flex"
    );
    left_container.classList.add(
      "align-items-center",
      "d-flex",
      "overflow-hidden"
    );
    type = exploded_name(value.name)[1].toLowerCase();
    type == "jpeg" ? (type = "jpg") : null;
    icon.data = "../images/" + type + "-type.svg";
    icon.classList.add(type + "-icon");
    //        icon.classList.add("file-icon", "blue");

    li.classList.add(
      "text-start",
      "name-li",
      "list-group-item",
      "align-items-center",
      "d-flex",
      "justify-content-between"
    );
    app.allowed_file_size > (value.size / (1024 * 1024)).toFixed(2)
      ? null
      : li.classList.add("list-group-item-danger");
    li.setAttribute("id", i);
    left_container.appendChild(icon);
    left_container.appendChild(name_span);
    li.appendChild(left_container);
    name_span.classList.add("file-name");
    name_span.innerHTML = value.name;
    var remove_icon = $create("i");
    var replace_icon = $create("i");
    var remove_btn = $create("button");
    var replace_btn = $create("button");
    remove_btn.setAttribute("title", "Remove File");
    replace_btn.setAttribute("title", "Replace File");
    remove_btn.classList.add(
      "btn",
      "btn-sm",
      "btn-danger",
      "p-2",
      "py-1",
      "delete"
    );
    replace_btn.classList.add(
      "btn",
      "btn-sm",
      "btn-primary",
      "p-2",
      "py-1",
      "me-2",
      "replace"
    );
    remove_icon.classList.add("fa-solid", "fa-trash-can");
    replace_icon.classList.add("fa-solid", "fa-file-arrow-up");
    total_files_span.innerHTML = "Pages: 1";
    total_files_span.classList.add("me-2");

    remove_btn.appendChild(remove_icon);
    replace_btn.appendChild(replace_icon);
    //        right_container.appendChild(total_files_span);
    right_container.appendChild(replace_btn);
    right_container.appendChild(size_span);
    right_container.appendChild(remove_btn);
    li.appendChild(right_container);
    ul.appendChild(li);
    i++;
  }
  if (i > 0) {
    file_count.innerHTML = i;
    if (i > app.max_files) {
      file_count.classList.add("text-danger");
    } else {
      file_count.classList.add("text-success");
    }
  }
  if (app.file_size > 0) {
    size_count.innerHTML = app.file_size.toFixed(2) + " MB";
    if (app.file_size > app.allowed_file_size) {
      size_count.classList.add("text-danger");
    } else {
      size_count.classList.add("text-success");
    }
  }
  ul.style.display = "block";
  loading(false);
  change_convert_btn(true);
  remove_file();
  replace_file();
}

function swap_images() {
  function insertAfter(newNode, existingNode) {
    existingNode.parentNode.insertBefore(newNode, existingNode.nextSibling);
  }

  list_div = document.querySelector("#image-list");
  list_div_rect = list_div.getBoundingClientRect();
  right = document.querySelector(".right-arrow").parentElement;
  left = document.querySelector(".left-arrow").parentElement;
  right.addEventListener("click", function () {
    selected = document.querySelector(".selected");
    selected_rect = selected.getBoundingClientRect();
    if (selected !== null && selected !== undefined) {
      parent = selected.parentElement;
      parent_next_sibling = parent.nextSibling;
      if (parent_next_sibling !== null) {
        insertAfter(parent, parent_next_sibling);
        list_div.scrollLeft += selected_rect.width;
      }
    } else {
      return false;
    }
  });

  left.addEventListener("click", function () {
    selected = document.querySelector(".selected");
    selected_rect = selected.getBoundingClientRect();
    if (selected !== null && selected !== undefined) {
      parent = selected.parentElement;
      list = parent.parentElement;
      parent_prev_sibling = parent.previousSibling;
      if (parent_prev_sibling !== null) {
        list.insertBefore(parent, parent_prev_sibling);
        list_div.scrollLeft = list_div.scrollLeft - selected_rect.width;
      }
    } else {
      return false;
    }
  });
}

function select_image() {
  images = document.querySelectorAll(".list-image-holder");
  images.forEach(function (elm) {
    elm.addEventListener("click", function () {
      if (elm.classList.contains("selected")) {
        elm.classList.remove("selected");
      } else {
        found = Array.from(images).find((element) =>
          element.classList.contains("selected")
        );
        if (found) {
          found.classList.remove("selected");
        }
        elm.classList.add("selected");
      }
    });
  });
}

function images_list() {
  clear_name_list();
  var list_div = document.querySelector("#image-list");
  list_div.classList.remove("d-none");
  list_div.innerHTML = "";
  list_div.parentElement.parentElement.classList.remove("d-none");
  var file_count = document.querySelector(".file-counter");
  var file_input = document.querySelector("#file");
  var ul = document.createElement("ul");
  label =
    document.querySelector(".input-label") ||
    document.querySelector(".small-input-label");

  i = 1;
  for (const value of file_input.files) {
    var name_span = $create("span", false, ["image-name"]);
    var list_image_holder = $create("div", false, [
      "list-image-holder",
      "m-2",
      "p-2",
    ]);
    var image_holder = $create("div", false, ["image-holder"]);
    var img = $create("img", false, ["list-image"]);
    var name_holder = $create("div", false, [
      "d-flex",
      "justify-content-center",
    ]);
    img.src = URL.createObjectURL(value);

    var remove_icon = $create("i", false, ["fa-solid", "fa-trash-can"]);
    var replace_icon = $create("i", false, ["fa-solid", "fa-file-arrow-up"]);
    var remove_btn = $create("button", false, [
      "btn",
      "btn-sm",
      "btn-danger",
      "position-absolute",
      "delete",
    ]);
    var replace_btn = $create("button", false, [
      "btn",
      "btn-sm",
      "btn-primary",
      "position-absolute",
      "replace",
    ]);

    remove_btn.setAttribute("title", "Remove File");
    replace_btn.setAttribute("title", "Replace File");

    remove_btn.style.top = "10px";
    remove_btn.style.right = "10px";
    replace_btn.style.top = "10px";
    replace_btn.style.left = "10px";

    remove_btn.appendChild(remove_icon);
    replace_btn.appendChild(replace_icon);
    image_holder.appendChild(remove_btn);
    image_holder.appendChild(replace_btn);
    image_holder.appendChild(img);

    name_span.innerHTML = value.name;
    name_holder.appendChild(name_span);
    list_image_holder.appendChild(name_holder);
    list_image_holder.appendChild(image_holder);
    list_image_holder.setAttribute("id", i);
    list_image_holder.setAttribute("draggable", "false");

    list_div.appendChild(list_image_holder);
    i++;
  }

  holders = document.querySelectorAll(".list-image-holder");
  holders.forEach(function (image_holder) {
    image_holder.addEventListener("dragover", function (e) {
      base_handlers._handleDragover(e, image_holder);
    });

    image_holder.addEventListener("dragleave", function (e) {
      base_handlers._handleDragleave(e, image_holder);
    });

    image_holder.addEventListener("drop", function (e) {
      base_handlers._handleDrop(e, image_holder, true);
    });

    image_holder.addEventListener("dragend", function () {
      image_holder.setAttribute("draggable", "false");
      image_holder.classList.remove("text-dark");
      image_holder.classList.remove("bg-white");
    });

    image_holder.addEventListener("dragstart", function (e) {
      base_handlers._handleDragStart(e, image_holder);
    });

    image_holder.addEventListener("mousedown", function () {
      image_holder.setAttribute("draggable", "true");
      //                pdf.addEventListener("mousemove", pdf_handlers._handleDragMouseDown)
    });
  });

  remove_file();
  replace_file();
  loading(false);
}

function order_file_list() {
  var holders = document.querySelectorAll(".list-image-holder");
  holders.length === 0
    ? (holders = document.querySelectorAll(".page-holder"))
    : null;
  let data = new FormData();
  //    first_id = holders[0].id
  //    var decrementor = 0;
  //    first_id == 0 ? null : decrementor = 1;
  //
  var file_input = document.querySelector("#file");
  for (j = 0; j < holders.length; j++) {
    let idx = parseInt(holders[j].id - 1);
    data.append("files_" + j, file_input.files[idx]);
  }
  return data;
}
function remove_alert() {
  alert_modal = document.querySelector(".alert-modal");
  alert_box = alert_modal.querySelector(".tool-alert");
  input_alert_box = alert_modal.querySelector(".input-alert");
  alert_modal.classList.add("d-none");
  if (alert_box.children.length > 1) {
    alert_box.children[0].remove();
  }
  if (input_alert_box !== null && input_alert_box !== undefined) {
    input_alert_box.classList.add("d-none");
  }
}

function redirect_to_dashboard() {
  if (window.location.href.indexOf("action=ocr") < 0) {
    window.location.href = "/dashboard?action=ocr";
  }
}

function check_file_upload() {
  var file = document.querySelector("#file");
  async function handleEvent(event) {
    if (event.type === "loadstart") {
    }

    if (event.type === "error") {
      set_alert(
        "Some problems encountered while loading the files! Please try again",
        "danger"
      );
    }
    if (event.type === "loadend") {
      if (file.files.length > app.max_files) {
        set_alert(
          "You can upload up to " + app.max_files + " files!",
          "danger"
        );
        const dt = new DataTransfer();
        file.files = dt.files;
        return false;
      }
      if (check_types()) {
        clear_name_list();
        label =
          document.querySelector(".input-label") ||
          document.querySelector(".small-input-label");
        switch (app.conversion_type) {
          case "image-to-pdf":
            images_list();
            break;
          case "kw-check":
            //                        document.querySelector(".file-counter").innerHTML = file.files[0].name;
            break;
          case "split-pdf":
            await pdf_renderer.load_pdf();
            await pdf_display.show();
            await pdf_handlers.toggle_zip();
            //
            break;
          case "pdf-add-watermark":
            await pdf_renderer.load_pdf();
            await pdf_display.show();
            add_manual_events();

            break;
          case "merge-pdf":
            await pdf_display.display_all_first_page();
            await pdf_display.make_replaceable();

            break;
          case "swap-pdf-pages":
            await pdf_display.show_all();
            await pdf_display.add_pdf_icons();
            pdf_display.update_removed();
            await pdf_display.make_replaceable(true);
            break;
          default:
            names_list();
            break;
        }
        change_convert_btn(true);
      } else {
        message =
          "Some files are not compatible! Make sure your files are " +
          app.allowed_types.join(", ").toUpperCase() +
          ".";
        set_alert(message, "danger");
      }
    }
  }

  function addListeners(reader) {
    reader.addEventListener("loadstart", handleEvent);
    reader.addEventListener("load", handleEvent);
    reader.addEventListener("loadend", handleEvent);
    reader.addEventListener("progress", handleEvent);
    reader.addEventListener("error", handleEvent);
    reader.addEventListener("abort", handleEvent);
  }

  function handleSelected(e) {
    // eventLog.textContent = '';
    // for ( const fl of file.files ){
    const reader = new FileReader();
    const input_file = file.files[0];
    if (input_file) {
      reader.readAsDataURL(input_file);
      addListeners(reader);
    }
    // }
  }

  if (file) {
    file.addEventListener("change", handleSelected);
  }
}

function toggle_sm_menu() {
  rotita = document.querySelector("#menu-toggle");
  rotita.addEventListener("click", function () {
    if (rotita.previousElementSibling.classList.contains("closed-menu")) {
      rotita.previousElementSibling.classList.remove("closed-menu");
      rotita.previousElementSibling.children[0].classList.remove("d-none");
      rotita.querySelector("i").style.bottom = "130px";
      rotita.querySelector("span").style.bottom = "105px";
    } else {
      rotita.previousElementSibling.classList.add("closed-menu");
      rotita.previousElementSibling.children[0].classList.add("d-none");
      rotita.querySelector("i").style.bottom = "35px";
      rotita.querySelector("span").style.bottom = "15px";
      containers = document.querySelectorAll(".sm-menu-content-item");
      document
        .querySelector("#small-menu-contents")
        .classList.contains("d-none")
        ? null
        : document
            .querySelector("#small-menu-contents")
            .classList.add("d-none");
      containers.forEach(function (elem) {
        elem.classList.contains("d-none") ? null : elem.classList.add("d-none");
      });
    }
  });
}

function split_pdf_menu() {}

function pdf_watermark_menu() {
  rotita = document.querySelector("#menu-toggle");
  small_menu = document.querySelector("#small-menu");

  wm_option_btns = document.querySelectorAll(".wm-option-btn");
  wm_option_btns.forEach(function (elem) {
    elem.addEventListener("click", _handleWmOptionSelect);
  });

  function _handleWmOptionSelect() {
    opt = this.id.split("-")[1];

    container = document.getElementById("wm-" + opt + "-options");
    containers = document.querySelectorAll(".sm-menu-content-item");

    if (container.classList.contains("d-none")) {
      container.classList.remove("d-none");
      container.parentElement.classList.remove("d-none");
    } else {
      container.classList.add("d-none");
      container.parentElement.classList.add("d-none");
    }

    containers.forEach(function (elem) {
      if (elem !== container) {
        elem.classList.contains("d-none") ? null : elem.classList.add("d-none");
      }
    });
  }
}

function toggle_help() {
  var help_btn = document.querySelector(".help-menu-holder");
  var help_section = document.querySelector(".help-section");
  var close_help = document.querySelector(".close-help-holder");
  help_btn.addEventListener("click", function () {
    help_section.classList.contains("d-none")
      ? help_section.classList.remove("d-none")
      : help_section.classList.add("d-none");
  });
  close_help.addEventListener("click", function () {
    help_section.classList.contains("d-none")
      ? help_section.classList.remove("d-none")
      : help_section.classList.add("d-none");
  });
}

var pdf_renderer = {
  total_pages: 0,
  pdfDoc: null,
  icons: [],
  tool: document.querySelector(".conversion-button")
    ? document.querySelector(".conversion-button").id
    : null,
  //display divs
  pages_div_range: document.querySelector("#pdf-pages-range"),
  pages_div_manual: document.querySelector("#pdf-pages-manual"),
  pages_div_all: document.querySelector("#pdf-pages-all"),
  //result pdf lists
  manual_list: document.querySelector(".manual-list"),
  range_list: document.querySelector(".range-list"),
  all_list: document.querySelector(".all-list"),
  async load_pdf(file = false) {
    if (!file) {
      file_selector = document.querySelector("#file");
      if (file_selector == null || file_selector == undefined) {
        return false;
      }
      file = file_selector.files[0];
    }

    let pdfjsLib = window["pdfjs-dist/build/pdf"];
    pdfjsLib.GlobalWorkerOptions.workerSrc =
      "https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.6.172/pdf.worker.min.js";
    return new Promise(async (resolve, reject) => {
      let object = this;
      let file_reader = new FileReader();
      file_reader.onload = async function () {
        //                infos = JSON.parse(window.localStorage.get("uploaded_pdfs"));

        let total_pages;
        var typedarray = new Uint8Array(this.result);
        object.pdfDoc = pdfjsLib.getDocument(typedarray);
        await object.pdfDoc.promise.then((pdf_obj) => {
          object.total_pages = pdf_obj._pdfInfo.numPages;
        });
        //                localStorage.setItem("pdf_", total_pages);
        resolve();
      };
      await file_reader.readAsArrayBuffer(file);
    });
  },
  async render_all_first_page() {
    file_selector = document.querySelector("#file");
    container = document.querySelector("#pdfs-preview");
    container.innerHTML = "";
    counter = 1;
    infos = [];
    window.localStorage.setItem("uploaded_pdfs", JSON.stringify(infos));
    for (let file of file_selector.files) {
      await this.load_pdf(file);
      page = await this.render_page(1);
      number = page.querySelector(".page-number");
      number.parentElement.classList.add("justify-content-center");
      number.innerHTML = file.name;
      number.nextSibling.remove();
      number.style.fontSize = "12px;";
      page.setAttribute("id", counter);
      container.appendChild(page);
      counter++;
    }
  },
  async render_page(page_nr, range_order = null) {
    var canvas = document.createElement("canvas");
    canvas.classList.add("pdf-page-canvas");
    var container = this.page_container(canvas, page_nr);

    range_order !== null ? container.setAttribute("id", range_order) : null;
    this.pdfDoc.promise
      .then((pdf) => {
        pdf
          .getPage(parseInt(page_nr))
          .then(function (page) {
            var viewport = page.getViewport({ scale: 0.3 });
            var output_scale = window.devicePixelRatio || 1;
            var context = canvas.getContext("2d");
            canvas.width = Math.floor(viewport.width * output_scale);
            canvas.height = Math.floor(viewport.height * output_scale);
            //                canvas.width = 150
            //                canvas.height = 200
            //                canvas.style.width = Math.floor(viewport.width) + "px";
            //                canvas.style.height =  Math.floor(viewport.height) + "px";
            canvas.style.width = "140px";
            canvas.style.height = "200px";
            var transform =
              output_scale !== 1
                ? [output_scale, 0, 0, output_scale, 0, 0]
                : null;
            var renderContext = {
              canvasContext: context,
              transform: transform,
              viewport: viewport,
            };
            page.render(renderContext);
          })
          .catch((e) => {
            {
              throw new Error("no page found");
            }
          });
      })
      .catch(() => {
        throw new Error("problems querying doc");
      });

    return container;
  },
  page_container(contained, page_num, icons) {
    var container = document.createElement("div");
    var icon_holder = document.createElement("div");
    icon_holder.classList.add(
      "d-flex",
      "justify-content-end",
      "w-100",
      "align-items-center"
    );

    var number_span = document.createElement("span");
    number_span.classList.add("page-number");
    number_span.innerHTML = page_num;

    var page_menu = document.createElement("div");
    page_menu.classList.add(
      "pdf-page-menu",
      "d-flex",
      "align-items-center",
      "border-bottom",
      "mb-2"
    );
    page_menu.appendChild(number_span);

    page_menu.appendChild(icon_holder);

    var page_element = document.createElement("div");
    page_element.classList.add(
      "d-flex",
      "justify-content-center",
      "align-items-center",
      "h-100"
    );

    var canvas_holder = document.createElement("div");
    canvas_holder.classList.add("canvas-holder", "position-relative");
    canvas_holder.appendChild(contained);
    page_element.appendChild(canvas_holder);
    container.appendChild(page_menu);

    container.appendChild(page_element);
    container.classList.add(
      "mx-3",
      "my-3",
      "d-flex",
      "flex-column",
      "page-holder"
    );
    if (icons) {
      container.classList.add("col", "col-xl-2");
    }
    container.setAttribute("id", page_num);
    return container;
  },
  async render_range() {
    object = this;
    range_div = document.querySelector("#pdf-pages-range");
    var range_holder = await this.create_range_inputs(1, 1, this.total_pages);
    var pages_holder = document.createElement("div");
    pages_holder.classList.add(
      "range-pages",
      "d-flex",
      "justify-content-center"
    );

    range_div.appendChild(range_holder);
    pages = await this.create_range_page_list(1);
    pages.forEach(function (page) {
      page.classList.remove("mx-3");
      page.classList.remove("my-3");
      page.classList.add("m-2");
      pages_holder.appendChild(page);
    });

    range_holder.appendChild(pages_holder);
  },
  async create_range_page_list(range_index) {
    var result = [];
    var start_range = document.querySelector("#start-" + range_index);
    var end_range = document.querySelector("#end-" + range_index);
    page_1 = await this.render_page(
      start_range.value,
      "start-page-" + range_index
    );
    page_2 = await this.render_page(end_range.value, "end-page-" + range_index);
    result.push(page_1);
    result.push(page_2);
    return result;
  },
  async create_range_inputs(range_index = 0, from = 1, to = 2) {
    var range_holder = document.createElement("div");
    range_holder.classList.add(
      "range-split-holder",
      "col",
      "col-lg-6",
      "col-xl-6",
      "border",
      "p-2",
      "m-2"
    );
    range_holder.setAttribute("id", range_index);
    var range_menu_holder = document.createElement("div");
    range_menu_holder.classList.add(
      "range-menu",
      "d-flex",
      "position-relative",
      "justify-content-center"
    );
    var range_inputs_holder = document.createElement("div");
    range_inputs_holder.classList.add("range-inputs");
    range_holder.appendChild(range_menu_holder);

    var remove_range_icon = document.createElement("i");
    remove_range_icon.classList.add(
      "fa-regular",
      "fa-circle-xmark",
      "range-remove-icon",
      "position-absolute"
    );
    remove_range_icon.style.left = "95%";
    remove_range_icon.addEventListener("click", function () {
      pdf_handlers.removeRangeHandler(range_holder);
    });

    let start_range = document.createElement("input");
    start_range.setAttribute("id", "start-" + range_index);
    start_range.addEventListener("change", function (ev) {
      pdf_handlers.rangeChangeHandler(ev, start_range);
    });
    start_range.classList.add("range-input");
    var to_span = document.createElement("span");
    to_span.classList.add("mx-3");

    to_span.innerHTML = "to";
    let end_range = document.createElement("input");
    end_range.setAttribute("id", "end-" + range_index);
    end_range.classList.add("range-input");
    end_range.addEventListener("change", function (ev) {
      pdf_handlers.rangeChangeHandler(ev, end_range);
    });

    range_menu_holder.appendChild(range_inputs_holder);
    range_inputs_holder.appendChild(start_range);
    range_inputs_holder.appendChild(to_span);
    range_inputs_holder.appendChild(end_range);
    range_menu_holder.appendChild(remove_range_icon);

    start_range.setAttribute("type", "text");
    start_range.value = from;

    end_range.setAttribute("type", "text");
    end_range.value = to;
    return range_holder;
  },
  async render_manually() {
    pages_div_manual = document.querySelector("#pdf-pages-manual");
    for (i = 1; i <= this.total_pages; i++) {
      container = await this.render_page(i);
      await pages_div_manual.appendChild(container);
    }
  },
  async render_all() {
    var pages_div_all = document.querySelector("#pdf-pages-all");
    for (j = 1; j <= this.total_pages; j++) {
      var container = await this.render_page(j);
      pages_div_all.appendChild(container);
    }
  },
  async render_all_methods() {
    await this.render_all();
    await this.render_manually();
    await this.render_range();
  },
};

var pdf_display = {
  method: document.querySelector("#method-selectors")
    ? document
        .querySelector("#method-selectors")
        .querySelector("input[checked]").id
    : "all",
  zip_input: document.querySelector("#zip-files"),
  add_range: document.querySelector("#add-range"),
  async show() {
    await pdf_renderer.load_pdf();
    const bindFunc = pdf_handlers.methodSelectHandler.bind(null, null);
    let radios = document.querySelectorAll("input[name=split-select]");
    radios.forEach(function (rad) {
      //clone the radio buttons to remove event listeners
      var new_rad = rad.cloneNode(true);
      rad.parentElement.replaceChild(new_rad, rad);
      var res_div = document.querySelector("#pdf-pages-" + rad.id);
      res_div.innerHTML = "";
      rad.removeEventListener("click", bindFunc, true);
    });

    await pdf_renderer.render_all_methods();
    this.display_containers();
    //asign the new radios to the "radios" value
    radios = document.querySelectorAll("input[name=split-select]");
    this.method_select();
    this.add_range
      ? this.add_range.addEventListener("click", pdf_handlers.addRangeHandler)
      : null;

    var zip_input = document.querySelector("#zip-files");
    var new_zip = zip_input ? zip_input.cloneNode(true) : null;
    zip_input ? zip_input.parentElement.replaceChild(new_zip, zip_input) : null;

    //        pdf_handlers.toggle_menu();
    this.add_pdf_icons();
    this.update_results(pdf_renderer.tool);
  },
  display_containers(show = true) {
    if (show) {
      document.querySelector(".tool-holder").classList.remove("d-none");
      document.querySelector("#tool-work-area").classList.remove("d-none");
      //            document.querySelector(".pdf-menu").classList.remove("d-none")
      //            document.querySelector(".pdf-menu").previousElementSibling.classList.add("d-none")
    } else {
      tool_holder = document.querySelector(".tool-holder");
      tool_wrapper = document.querySelector("#tool-work-area");
      pdf_menu = document.querySelector(".pdf-menu");
      if (!tool_holder.contains("d-none")) {
        tool_holder.classList.add("d-none");
      }
      if (!tool_wrapper.contains("d-none")) {
        tool_wrapper.classList.add("d-none");
      }
      if (!pdf_menu.contains("d-none")) {
        pdf_menu.classList.add("d-none");
      }
    }
  },
  async show_all() {
    document.querySelector("#pdf-pages-all").innerHTML = "";
    await pdf_renderer.load_pdf();
    await pdf_renderer.render_all();
    this.display_containers();
    //        pdf_handlers.toggle_menu();
    this.update_results(pdf_renderer.tool);
  },
  async display_all_first_page() {
    await pdf_renderer.render_all_first_page();
    this.display_containers();
    //        pdf_handlers.toggle_menu();
  },
  method_select() {
    radios = document.querySelectorAll("input[name=split-select]");
    var pages_info = document.querySelector("#pdf-pages");
    radios.forEach(function (elem) {
      elem.addEventListener("click", function () {
        pdf_handlers.methodSelectHandler(elem);
      });
    });
  },
  update_results(tool) {
    this.update_removed();
    f_name = "this." + tool.replaceAll("-", "_") + "_update";
    eval(f_name + "()");
  },
  pdf_add_watermark_update() {},
  swap_pdf_pages_update() {},
  split_pdf_update() {
    switch (this.method) {
      case "manual":
        this.update_manual();
        break;
      case "range":
        this.update_range();
        break;
      case "all":
        this.update_all();
        break;
    }
  },
  update_manual() {
    // total_span = pdf counter
    let total_span = document.querySelector(".total-pdfs");
    var manual_list = document.querySelector(".manual-list");
    manual_list.classList.remove("d-none");
    let pdf_list = document.querySelector(".pdf-list");
    let manual_splits = document.querySelector(".manual-splits");
    let removed_list = document.querySelector(".removed-pages-list");
    let all_pages =
      pdf_renderer.pages_div_manual.querySelectorAll(".page-holder");
    manual_splits.innerHTML = "";
    // get all "action-points"
    var total_points = document.querySelectorAll(".action-point");
    var totals;
    if (total_points.length == pdf_renderer.total_pages) {
      totals = pdf_renderer.total_pages;
    } else {
      totals = parseInt(total_points.length) + 1;
    }
    var first_split = total_points[0];
    var last_split = total_points[total_points.length - 1];
    if (last_split !== undefined) {
      if (
        parseInt(last_split.parentElement.id) == 1 &&
        total_points.length == 1
      ) {
        totals = 1;
      }
      var found = Array.from(all_pages).find(
        (elem) =>
          parseInt(elem.id) > parseInt(last_split.parentElement.id) &&
          !elem.children[1].classList.contains("remove-point")
      );
      if (!found) {
        totals = total_points.length;
      } else {
        totals = total_points.length + 1;
      }
    }

    total_span.innerHTML = totals;
    //get all "remove-ponits"
    var total_removes = Array.from(
      pdf_renderer.pages_div_manual.querySelectorAll(".remove-point")
    );

    var span_holder = document.createElement("div");
    span_holder.classList.add(
      "d-flex",
      "p-3",
      "result-pdf",
      "manual-split",
      "custom-shadow",
      "border",
      "border-1",
      "border-secondary"
    );
    span_holder.setAttribute("id", "pdf-1");
    //indicator = span containing pdf number
    var pdf_indicator = document.createElement("span");
    pdf_indicator.classList.add("d-block", "split-pdf-label");

    var from_span = document.createElement("span");
    var to_span = document.createElement("span");

    from_span.classList.add("manual-from-span", "range-span");
    to_span.classList.add("manual-to-span", "range-span");

    if (total_removes.length === pdf_renderer.total_pages) {
      manual_list.innerHTML = "";
      return false;
    }
    //if there is no split point display the 1->totalpages(default range)
    if (total_points.length == 0) {
      from_span.innerHTML = "Page: " + 1;
      to_span.innerHTML = "Page: " + pdf_renderer.total_pages;

      pdf_indicator.innerHTML = "PDF - 1:";

      icon = document.createElement("i");
      icon.classList.add("fa-solid", "fa-ellipsis", "mx-2");

      span_holder.appendChild(from_span);
      span_holder.appendChild(icon);

      span_holder.appendChild(to_span);
      manual_splits.appendChild(span_holder);
    } else {
      // for each split point create a from -> to section
      // clone from, to , holder and idincator nodes from above
      for (i = 0; i <= total_points.length; i++) {
        var indicator = pdf_indicator.cloneNode();
        indicator.classList.add("d-block");

        var holder = span_holder.cloneNode();
        holder.classList.add("manual-split");
        holder.setAttribute("id", "pdf-" + (i + 1));

        //page number on current action-point
        var page_num;
        var from = from_span.cloneNode();
        var to = to_span.cloneNode();

        from.classList.add("manual-from-span", "range-span");
        to.classList.add("manual-to-span", "range-span");

        //when i == length there is no split point on that position
        if (i == total_points.length) {
          page_num = total_points[i - 1].parentElement.id;
          // if the last point is not on the last page make another from -> to section
          if (parseInt(page_num) !== pdf_renderer.total_pages) {
            to.innerHTML = "Page: " + pdf_renderer.total_pages;
            //last split point + 1
            from.innerHTML =
              "Page: " + (parseInt(total_points[i - 1].parentElement.id) + 1);
            indicator.innerHTML = "PDF -    " + (i + 1) + ":";
            holder.appendChild(from);

            icon = document.createElement("i");
            icon.classList.add("fa-solid", "fa-ellipsis", "mx-2");
            holder.appendChild(icon);
            holder.appendChild(to);
            manual_splits.appendChild(holder);
          }
        } else {
          page_num = total_points[i].parentElement.id;

          to.innerHTML = "Page: " + page_num;

          if (i > 0) {
            from.innerHTML =
              "Page: " + (parseInt(total_points[i - 1].parentElement.id) + 1);
          } else {
            from.innerHTML = "Page: " + 1;
          }

          var from_point = parseInt(from.innerHTML.split(":")[1]);
          var from_res = from_point;

          indicator.innerHTML = "PDF - " + (i + 1) + ":";

          holder.appendChild(from);

          icon = document.createElement("i");
          icon.classList.add("fa-solid", "fa-ellipsis", "mx-2");
          holder.appendChild(icon);

          holder.appendChild(to);
          manual_splits.appendChild(holder);
        }
      }
    }
    //        check if there is a removed page in bewtween from and to
    var result_pdfs = document.querySelectorAll(".result-pdf");
    var removed = document.querySelectorAll(".remove-point");
    if (total_removes.length > 0) {
      //loop through each range and modify "from" point
      result_pdfs.forEach(function (elem) {
        let first_none_remove = false;
        var from_point = parseInt(elem.children[0].innerHTML.split(":")[1]);
        var to_point = parseInt(elem.children[2].innerHTML.split(":")[1]);
        //loop through each page
        for (j = from_point; j <= to_point; j++) {
          var page = document.getElementById(j);
          // find the first page in range that is not to be removed
          if (
            !page.children[1].classList.contains("remove-point") &&
            !first_none_remove
          ) {
            first_none_remove = true;
            elem.children[0].innerHTML = "Page: " + parseInt(page.id);
          }
        }

        // modify "to" point for last range || default range
        if (elem == result_pdfs[result_pdfs.length - 1]) {
          var aux = 0;
          var page_number = parseInt(
            total_removes[total_removes.length - 1].parentElement.id
          );
          //check if the removed page is last by checking the page number + aux = number of total pages
          while (page_number + aux == pdf_renderer.total_pages) {
            total_removes.pop();
            if (total_removes.length > 0) {
              page_number = parseInt(
                total_removes[total_removes.length - 1].parentElement.id
              );
            } else {
              page_number = pdf_renderer.total_pages + 1;
            }
            aux++;
          }
          // if all pages are marked to be removed, remove the "result_pdf" element from page
          if (
            parseInt(pdf_renderer.total_pages - aux) <
            parseInt(elem.children[0].innerHTML.split(":")[1])
          ) {
            elem.remove();
          } else {
            elem.children[2].innerHTML =
              "Page: " + (pdf_renderer.total_pages - aux);
          }
        }
      });
    }
  },
  update_all() {
    let total_span = document.querySelector(".total-pdfs");
    var all_list = document.querySelector(".all-list");
    all_list.innerHTML = "";
    var all = pdf_renderer.pages_div_all.querySelectorAll(".page-holder");
    var removed = pdf_renderer.pages_div_all.querySelectorAll(".remove-point");

    removed == null ? (aux = 0) : (aux = removed.length);

    total_span.innerHTML = parseInt(all.length) - parseInt(aux);
    var counter = 0;
    for (i = 0; i < all.length; i++) {
      if (all[i].children[1].classList.contains("remove-point")) {
        counter++;
        continue;
      }
      var span_holder = document.createElement("div");
      span_holder.classList.add(
        "d-flex",
        "p-3",
        "custom-shadow",
        "border",
        "border-secondary",
        "result-pdf",
        "all-split"
      );
      span_holder.setAttribute("id", "pdf-" + (i + 1));
      //indicator = span containing pdf number
      var pdf_indicator = document.createElement("span");
      pdf_indicator.classList.add("d-block", "split-pdf-label");
      pdf_indicator.innerHTML = "PDF - " + (i + 1 - counter) + ":";

      var from_span = document.createElement("span");
      var to_span = document.createElement("span");

      from_span.innerHTML = "Page: " + (i + 1);
      to_span.innerHTML = "Page: " + (i + 1);

      from_span.classList.add("all-from-span", "range-span");
      to_span.classList.add("all-to-span", "range-span");

      span_holder.appendChild(from_span);

      icon = document.createElement("i");
      icon.classList.add("fa-solid", "fa-ellipsis", "mx-2");
      span_holder.appendChild(icon);

      span_holder.appendChild(to_span);
      all_list.appendChild(span_holder);
    }
  },
  update_range() {
    let total_span = document.querySelector(".total-pdfs");
    //        document.querySelector(".total-removes").innerHTML = 0;
    var ranges = document.querySelectorAll(".range-split-holder");
    total_span.innerHTML = ranges.length;

    var range_list = document.querySelector(".range-list");
    range_list.innerHTML = "";
    ranges.forEach(function (elem, idx) {
      var range_from = elem.querySelector("#start-" + (idx + 1));
      var range_to = elem.querySelector("#end-" + (idx + 1));
      var span_holder = document.createElement("div");
      span_holder.classList.add(
        "d-flex",
        "p-3",
        "custom-shadow",
        "border",
        "border-secondary",
        "result-pdf",
        "range-split"
      );
      span_holder.setAttribute("id", "pdf-" + (idx + 1));
      //indicator = span containing pdf number
      var pdf_indicator = document.createElement("span");
      pdf_indicator.classList.add("d-block", "split-pdf-label");
      pdf_indicator.innerHTML = "PDF - " + (idx + 1) + ":";

      var from_span = document.createElement("span");
      var to_span = document.createElement("span");

      from_span.innerHTML = "Page: " + range_from.value;
      to_span.innerHTML = "Page: " + range_to.value;

      from_span.classList.add("range-from-span", "range-span");
      to_span.classList.add("range-to-span", "range-span");

      span_holder.appendChild(from_span);
      icon = document.createElement("i");
      icon.classList.add("fa-solid", "fa-ellipsis", "mx-2");
      span_holder.appendChild(icon);
      span_holder.appendChild(to_span);
      range_list.appendChild(span_holder);
    });
  },
  update_removed() {
    var total_removed_span = document.querySelector(".total-removes");
    switch (this.method) {
      case "manual":
        //add a span containing removed page number to the "removed pages" list
        var remove_points =
          pdf_renderer.pages_div_manual.querySelectorAll(".remove-point");
        var removed_list = document.querySelector(".removed-pages-list");
        removed_list.innerHTML = "";
        remove_points.forEach(function (elem) {
          var remove_span = document.createElement("span");
          remove_span.classList.add(
            "form-control",
            "form-control-sm",
            "manual-remove",
            "bg-danger"
          );
          remove_span.setAttribute(
            "id",
            "remove-page-" + elem.parentElement.id
          );
          remove_span.innerHTML = elem.parentElement.id;
          removed_list.appendChild(remove_span);
        });
        total_removed_span.innerHTML = remove_points.length;
        break;
      case "range":
        break;
      case "all":
        //add a span containing removed page number to the "removed pages" list
        var remove_points =
          pdf_renderer.pages_div_all.querySelectorAll(".remove-point");
        var removed_list = document.querySelector(".removed-pages-list");
        var all_list = document.querySelector(".all-list");
        removed_list.innerHTML = "";

        remove_points.forEach(function (elem, idx) {
          var remove_span = document.createElement("span");
          remove_span.classList.add(
            "form-control",
            "form-control-sm",
            "manual-remove",
            "bg-danger"
          );
          remove_span.setAttribute(
            "id",
            "remove-page-" + elem.parentElement.id
          );
          remove_span.innerHTML = elem.parentElement.id;
          removed_list.appendChild(remove_span);
          //remove the result pdf from the list
          var list_item = all_list
            ? all_list.querySelector("#pdf-" + elem.parentElement.id)
            : null;
          list_item !== null ? list_item.remove() : null;
        });
        total_removed_span.innerHTML = remove_points.length;
        break;
    }
  },
  add_pdf_icons() {
    manual_icons = "";
    manual_remove_icon = false;
    switch (pdf_renderer.tool) {
      case "split-pdf":
        manual_icons = ["fa-solid", "fa-flag"];
        manual_remove_icon = true;
        //                icons.push(manual_icons)
        //                icons.push(["fa-regular fa-circle-xmark "]);
        break;
      case "pdf-add-watermark":
        manual_icons = ["fa-solid", "fa-flag"];
        break;
    }
    man_pages = pdf_renderer.pages_div_manual
      ? pdf_renderer.pages_div_manual.querySelectorAll(".page-holder")
      : [];
    all_pages = pdf_renderer.pages_div_all
      ? pdf_renderer.pages_div_all.querySelectorAll(".page-holder")
      : [];
    all_pages.forEach(function (page) {
      icons_container = page.querySelector(".pdf-page-menu").children[1];
      var icon_remove = document.createElement("i");
      icon_remove.classList.add("fa-regular", "fa-circle-xmark", "remove-icon");
      icon_remove.addEventListener("click", function () {
        pdf_handlers.pageIconHandler(icon_remove, "remove");
      });

      var remove_holder = document.createElement("div");
      remove_holder.classList.add("remove-icon-holder", "float-end");
      remove_holder.appendChild(icon_remove, "remove");
      icons_container.appendChild(remove_holder);
    });
    man_pages.forEach(function (page) {
      icons_container = page.querySelector(".pdf-page-menu").children[1];
      var icon_remove = document.createElement("i");
      var action_icon = document.createElement("i");
      action_icon.classList.add(
        manual_icons[0],
        manual_icons[1],
        "split-icon",
        "action-icon"
      );
      action_icon.addEventListener("click", function () {
        pdf_handlers.pageIconHandler(action_icon, "action");
      });

      var action_holder = document.createElement("div");
      action_holder.classList.add("split-icon-holder", "float-end", "me-2");
      action_holder.appendChild(action_icon);
      icons_container.appendChild(action_holder);
      if (manual_remove_icon) {
        icon_remove.classList.add(
          "fa-regular",
          "fa-circle-xmark",
          "remove-icon"
        );
        icon_remove.addEventListener("click", function () {
          pdf_handlers.pageIconHandler(icon_remove, "remove");
        });

        var remove_holder = document.createElement("div");
        remove_holder.classList.add("remove-icon-holder", "float-end");
        remove_holder.appendChild(icon_remove, "remove");
        icons_container.appendChild(remove_holder);
      }
    });
  },
  make_replaceable(replace = false) {
    //based on replace value the dragged objects will push on drop the other elements to the right or left depending
    // on the direction it is dragged. If push == true the dropped objects will replace the elements on drop.

    pdfs = document.querySelectorAll(".page-holder");
    pdfs.length = 0
      ? (pdfs = document.querySelectorAll(".list-image-holder"))
      : null;
    pdfs.forEach(function (pdf) {
      pdf.classList.add("position-relative");
      pdf.querySelector(".page-number").style.userSelect = "none";
      pdf.setAttribute("draggable", "false");
      //            pdf.style.zIndex = "9999"
      pdf_rect = pdf.getBoundingClientRect();
      window.localStorage.setItem("pdf-" + pdf.id, JSON.stringify(pdf_rect));

      pdf.addEventListener("dragover", function (e) {
        pdf_handlers._handlePDFDragover(e, pdf);
      });

      pdf.addEventListener("dragleave", function (e) {
        pdf_handlers._handlePDFDragleave(e, pdf);
      });

      pdf.addEventListener("drop", function (e) {
        pdf_handlers._handlePDFDrop(e, pdf, replace);
      });

      pdf.addEventListener("dragend", function () {
        pdf.setAttribute("draggable", "false");
        pdf.classList.remove("text-dark");
        pdf.classList.remove("bg-white");
      });

      pdf.addEventListener("dragstart", function (e) {
        pdf_handlers._handlePDFStart(e, pdf);
      });

      pdf.addEventListener("mousedown", function () {
        pdf.setAttribute("draggable", "true");
        //                pdf.addEventListener("mousemove", pdf_handlers._handleDragMouseDown)
      });
      pdf.addEventListener("mouseup", () => {
        //                pdf.removeEventListener("mousemove", pdf_handlers._handleDragMouseDown);
      });
    });
  },
};

var pdf_handlers = {
  tool: document.querySelector(".conversion-button")
    ? document.querySelector(".conversion-button").id
    : null,
  _handlePDFDrop(e, pdf, replace) {
    parent = pdf.parentElement;
    pdf.classList.remove("bg-white");
    pdf.classList.remove("text-dark");
    pdf.classList.remove("border-danger");
    dragged = document.getElementById(window.localStorage.getItem("dragged"));
    zone_box = pdf.getBoundingClientRect();
    dragged_box = dragged.getBoundingClientRect();
    //        if( zone_box["top"] > dragged_box["bottom"] ){
    //            if( zone_box["right"] > dragged_box["right"] ){
    //                this.after(dragged)
    //            }else{
    //                parent.insertBefore(dragged, this)
    //            }
    //        }
    //
    //        if( zone_box["top"] > dragged_box["bottom"] ){
    //            if( zone_box["right"] > dragged_box["right"] ){
    //                this.after(dragged)
    //            }else{
    //                parent.insertBefore(dragged, this)
    //            }
    //        }

    //        if( zone_box["top"] == dragged_box["top"] ){
    if (!replace) {
      if (zone_box["right"] > dragged_box["right"]) {
        pdf.after(dragged);
      } else {
        parent.insertBefore(dragged, pdf);
      }
    } else {
      cloned = pdf.cloneNode(true);
      all_holders = document.querySelectorAll(".page-holder");
      dragged_ind = Array.from(all_holders).indexOf(dragged);

      pdf.replaceWith(dragged);
      parent.insertBefore(pdf, parent.children[dragged_ind]);
    }

    //        }

    dragged.classList.remove("text-dark");
    dragged.classList.remove("bg-white");
    dragged.style.borderColor = "white";

    //
  },
  _handleDragMouseDown({ movementX, movementY }) {
    pdf = this;
    original_rect = JSON.parse(window.localStorage.getItem("pdf-" + pdf.id));
    parent = pdf.parentElement;
    pdf_rect = pdf.getBoundingClientRect();
    parent_rect = parent.getBoundingClientRect();
    if (
      pdf_rect["bottom"] > parent_rect["bottom"] ||
      pdf_rect["top"] < parent_rect["top"] ||
      pdf_rect["right"] > parent_rect["right"] ||
      pdf_rect["left"] < parent_rect["left"]
    ) {
      pdf.style.left = 0;
      pdf.style.top = 0;
      pdf.style.transition = "none";
      return false;
    }

    let getContainerStyle = window.getComputedStyle(pdf);
    let leftValue = parseInt(getContainerStyle.left);
    let topValue = parseInt(getContainerStyle.top);
    pdf.style.left = leftValue + movementX + "px";
    pdf.style.top = topValue + movementY + "px";
  },
  _handlePDFStart(e, pdf) {
    window.localStorage.setItem("dragged", pdf.id);
    pdf.style.borderColor = "red";
    pdf.classList.add("text-dark", "bg-white");
  },
  _handlePDFDragleave(e, pdf) {
    if (pdf.getAttribute("draggable") == "false") {
      pdf.classList.remove("border-danger");
      pdf.classList.remove("bg-white");
      pdf.classList.remove("text-dark");
    }
  },
  _handlePDFDragover(e, pdf) {
    e.preventDefault();
    target = e.target;

    if (pdf.getAttribute("draggable") == "false") {
      pdf.classList.add("border-danger", "bg-white", "text-dark");
    }
  },
  closeDragElement() {
    // stop moving when mouse button is released:
    document.onmouseup = null;
    document.onmousemove = null;
  },
  elementDrag(e) {
    e = e || window.event;
    e.preventDefault();
    // calculate the new cursor position:
    pos1 = pos3 - e.clientX;
    pos2 = pos4 - e.clientY;
    pos3 = e.clientX;
    pos4 = e.clientY;
    // set the element's new position:
  },
  methodSelectHandler(elem) {
    let total_span = document.querySelector(".total-pdfs");
    let manual_help = document.querySelector("#help-manual");
    let range_help = document.querySelector("#help-range");
    let all_help = document.querySelector("#help-all");

    var removed_pages_list = document.querySelector(".removed-pages-list");
    if (!elem.hasAttribute("checked")) {
      radios.forEach(function (rd) {
        if (rd.hasAttribute("checked")) {
          rd.removeAttribute("checked");
        }
      });
      elem.setAttribute("checked", "checked");
      pdf_display.method = elem.id;
      methods = ["manual", "range", "all"];
      list = document.querySelector("." + pdf_display.method + "-list");

      list ? list.classList.remove("d-none") : null;
      pages_div = document.querySelector("#pdf-pages-" + elem.id);
      pages_div.classList.remove("d-none");

      if (pdf_display.method !== "range") {
        pdf_display.add_range.classList.add("d-none");
        pdf_display.add_range.setAttribute("disabled", "disabled");
      } else {
        pdf_display.add_range.classList.remove("d-none");
        pdf_display.add_range.removeAttribute("disabled");
      }

      methods.forEach(function (type) {
        if (type !== pdf_display.method) {
          list = document.querySelector("." + type + "-list");
          list
            ? !list.classList.contains("d-none")
              ? list.classList.add("d-none")
              : null
            : null;

          page_div = document.querySelector("#pdf-pages-" + type);
          page_div
            ? !page_div.classList.contains("d-none")
              ? page_div.classList.add("d-none")
              : null
            : null;

          help = document.querySelector("#help-" + type);
          //                    console.log(help)
          help
            ? !help.classList.contains("d-none")
              ? help.classList.add("d-none")
              : null
            : null;
        }
      });
      help = document.querySelector("#help-" + pdf_display.method);
      help
        ? help.classList.contains("d-none")
          ? help.classList.remove("d-none")
          : null
        : null;

      //            removed_pages_list.innerHTML = ""
    }
    pdf_display.update_results(this.tool);
  },
  async addRangeHandler(ev) {
    ev.preventDefault();
    var total_ranges = document.querySelectorAll(".range-split-holder");
    holder = await pdf_renderer.create_range_inputs(
      total_ranges.length + 1,
      1,
      pdf_renderer.total_pages
    );
    pdf_renderer.pages_div_range.appendChild(holder);

    var range_pages = await pdf_renderer.create_range_page_list(
      total_ranges.length + 1
    );
    var pages_holder = document.createElement("div");
    pages_holder.classList.add(
      "range-pages",
      "d-flex",
      "justify-content-center"
    );

    range_pages.forEach(function (page) {
      page.classList.remove("mx-3");
      page.classList.remove("my-3");
      page.classList.add("m-2");
      pages_holder.appendChild(page);
    });

    holder.appendChild(pages_holder);
    pdf_display.update_results(pdf_renderer.tool);
  },
  async rangeChangeHandler(ev, range_input) {
    var old_page;
    var new_page;
    var range_index = parseInt(
      range_input.parentElement.parentElement.parentElement.id
    );

    //check if input is non-numeric
    if (!Number.isInteger(parseInt(range_input.value))) {
      if (range_input.id.includes("start")) {
        range_input.value = 1;
      } else {
        range_input.value = pdf_renderer.total_pages;
      }
      //check if input is negtaive or above total files
    } else {
      if (range_input.id.includes("start") && parseInt(range_input.value) < 1) {
        range_input.value = 1;
      }
      if (
        range_input.id.includes("start") &&
        parseInt(range_input.value) > pdf_renderer.total_pages
      ) {
        range_input.value = 1;
      }
      if (
        range_input.id.includes("end") &&
        parseInt(range_input.value) > pdf_renderer.total_pages
      ) {
        range_input.value = pdf_renderer.total_pages;
      }
      if (range_input.id.includes("end") && parseInt(range_input.value) < 1) {
        range_input.value = pdf_renderer.total_pages;
      }
    }

    if (ev.srcElement.id.includes("start")) {
      old_page = document.querySelector("#start-page-" + range_index);
      try {
        new_page = await pdf_renderer.render_page(
          ev.srcElement.value,
          "start-page-" + range_index
        );
      } catch (e) {
        console.log("yeee");
      }
    } else {
      old_page = document.querySelector("#end-page-" + range_index);
      new_page = await pdf_renderer.render_page(
        ev.srcElement.value,
        "end-page-" + range_index
      );
    }
    new_page.classList.remove("mx-3");
    new_page.classList.remove("my-3");
    new_page.classList.add("m-2");
    old_page.parentElement.replaceChild(new_page, old_page);
    pdf_display.update_results(pdf_renderer.tool);
  },
  toggle_menu() {
    var button = document.querySelector(".toggle-menu");
    var menu = document.querySelector(".main-menu");
    var selectors = document.querySelector("#method-selectors");
    var results = document.querySelector(".split-results");
    var removed = document.querySelector(".removed-pages");
    button.addEventListener("click", function () {
      if (button.classList.contains("fa-chevron-right")) {
        button.parentElement.parentElement.classList.add("hide-menu");
        //                button.parentElement.classList.remove("close-menu-holder")
        //                button.parentElement.classList.add("open-menu-holder")
        menu.classList.add("d-none");
        button.classList.remove("fa-chevron-right");
        button.classList.add("fa-chevron-left");
        document.querySelector(".help-section").classList.add("d-none");
      } else {
        menu.classList.remove("d-none");

        //                button.parentElement.classList.add("close-menu-holder")
        //                button.parentElement.classList.remove("open-menu-holder")
        button.parentElement.parentElement.classList.remove("hide-menu", "p-3");
        button.classList.add("fa-chevron-right");
        button.classList.remove("fa-chevron-left");
      }
    });
    pdf_handlers.toggle_zip();
  },
  toggle_zip() {
    var inpt = document.querySelector("#zip-files");
    if (!inpt) {
      return false;
    }
    inpt.addEventListener("click", function () {
      inpt.hasAttribute("checked")
        ? inpt.removeAttribute("checked")
        : inpt.setAttribute("checked", "checked");
    });
  },
  removeRangeHandler(holder) {
    holder.remove();
    document
      .querySelectorAll(".range-split-holder")
      .forEach(function (elem, idx) {
        elem.setAttribute("id", idx + 1);
        elem.children[1].children[0].setAttribute(
          "id",
          "start-page-" + (idx + 1)
        );
        elem.children[1].children[1].setAttribute(
          "id",
          "end-page-" + (idx + 1)
        );

        elem.children[0].children[0].children[0].setAttribute(
          "id",
          "start-" + (idx + 1)
        );
        elem.children[0].children[0].children[2].setAttribute(
          "id",
          "end-" + (idx + 1)
        );
      });
    pdf_display.update_results(pdf_renderer.tool);
  },
  pageIconHandler(icon, type) {
    var icon_attribute;
    var canvas_div = icon.parentElement.parentElement.parentElement.nextSibling;

    var page_div = icon.parentElement.parentElement.parentElement.parentElement;
    var removed_list = document.querySelector(".removed-pages-list");
    switch (type) {
      case "action":
        icon_attribute = "action";
        canvas_div.classList.remove("remove-point");
        break;
      case "remove":
        icon_attribute = "remove";
        canvas_div.classList.remove("action-point");
        break;
    }

    if (!canvas_div.classList.contains(icon_attribute + "-point")) {
      canvas_div.classList.add(icon_attribute + "-point");
    } else {
      canvas_div.classList.remove(icon_attribute + "-point");
      if (type == "remove") {
        //                document.querySelector("#remove-page-" + page_div.id).remove()
      }
    }
    pdf_display.update_results(pdf_renderer.tool);
  },
};

var base_handlers = {
  _handleDragStart(e, pdf) {
    window.localStorage.setItem("dragged", pdf.id);
    pdf.style.borderColor = "red";
    pdf.classList.add("text-dark", "bg-white");
  },
  _handleDragleave(e, pdf) {
    if (pdf.getAttribute("draggable") == "false") {
      pdf.classList.remove("border-danger");
      pdf.classList.remove("bg-dark");
      pdf.classList.remove("text-dark");
    }
  },
  _handleDragover(e, pdf) {
    e.preventDefault();
    target = e.target;

    if (pdf.getAttribute("draggable") == "false") {
      pdf.classList.add("border-danger", "bg-dark", "text-dark");
    }
  },
  _handleDrop(e, pdf, replace) {
    parent = pdf.parentElement;
    pdf.classList.remove("bg-dark");
    pdf.classList.remove("text-dark");
    pdf.classList.remove("border-danger");
    //        pdf.classList.add("border-dark")
    dragged = document.getElementById(window.localStorage.getItem("dragged"));
    zone_box = pdf.getBoundingClientRect();
    dragged_box = dragged.getBoundingClientRect();

    if (!replace) {
      if (zone_box["right"] > dragged_box["right"]) {
        pdf.after(dragged);
      } else {
        parent.insertBefore(dragged, pdf);
      }
    } else {
      cloned = pdf.cloneNode(true);
      all_holders = document.querySelectorAll(".list-image-holder");
      dragged_ind = Array.from(all_holders).indexOf(dragged);

      pdf.replaceWith(dragged);
      parent.insertBefore(pdf, parent.children[dragged_ind]);
    }

    dragged.classList.remove("text-dark");
    dragged.classList.remove("bg-white");
    dragged.style.borderColor = "white";
  },
};

function add_position_events() {
  boxes = document.querySelectorAll(".position-box");

  boxes.forEach(function (box) {
    box.addEventListener("click", _handleSelectPosition);
  });
}
function add_manual_events() {
  icons = document.querySelectorAll(".action-icon");
  icons.forEach(function (i) {
    new_i = i.cloneNode(true);
    i.parentElement.appendChild(new_i);
    i.remove();
    new_i.addEventListener("click", _handleManualWatermark);
  });

  text_buttons = document.querySelectorAll(".text-decoration-input");
  text_buttons.forEach(function (btn) {
    btn.addEventListener("click", _handleTextDecorationButton);
  });

  watermark_type_selects = document.querySelectorAll(".watermark-type-select");
  watermark_type_selects.forEach(function (elem) {
    elem.addEventListener("click", _handleChangeWmType);
  });

  range = document.querySelector("input[name=range-size]");
  inpt = document.querySelector("input[name=size-text]");
  inpt.addEventListener("input", _handleTextSizeInput);
  range.addEventListener("input", _handleTextSizeRange);
  file = document.querySelector("#wm-file");
  file.addEventListener("change", _handleAddWmImage);
}

function _handleAddWmImage() {
  if (!check_types(this, ["jpg", "jpeg", "png"])) {
    this.value = "";
    set_alert("Please select a JPG, JPEG or PNG image!", "danger");
  }
}

function _handleChangeWmType() {
  if (!this.classList.contains("selected-watermark")) {
    sibling = this.nextElementSibling || this.previousElementSibling;
    sibling.classList.remove("selected-watermark");
    document
      .querySelector("#watermark-" + this.id.split("-")[0] + "-options")
      .classList.remove("d-none");
    document
      .querySelector("#watermark-" + sibling.id.split("-")[0] + "-options")
      .classList.add("d-none");
    this.classList.add("selected-watermark");
  }
}

function _handleTextSizeRange() {
  document.querySelector("input[name=size-text]").value = this.value;
}

function _handleTextSizeInput() {
  if (this.value < 0) {
    this.value = 0;
    return false;
  }
  document.querySelector("input[name=range-size]").value = this.value;
}

function _handleTextDecorationButton() {
  btn = this;
  if (btn.hasAttribute("checked")) {
    btn.removeAttribute("checked");
    btn.classList.remove("btn-secondary");
    btn.classList.add("btn-outline-secondary");
  } else {
    btn.classList.remove("btn-outline-secondary");
    btn.classList.add("btn-secondary");
    btn.setAttribute("checked", "checked");
  }
}

function _handleManualWatermark() {
  icon = this;
  element_holder =
    this.parentElement.parentElement.parentElement.nextSibling.children[0];
  boxes = document.querySelectorAll(".position-box");

  if (element_holder.classList.contains("watermarked")) {
    element_holder.classList.remove("watermarked");
    boxes.forEach(function (box) {
      mark = element_holder.querySelector("." + box.value);
      mark ? mark.remove() : null;
    });
  } else {
    element_holder.classList.add("watermarked");
    boxes.forEach(function (box) {
      if (box.hasAttribute("checked")) {
        display_mark(element_holder, box.value);
      }
    });
  }
}

function _handleSelectPosition() {
  inpt = this;
  pages_container_all = document.querySelector("#pdf-pages-all");
  pages_container_manual = document.querySelector("#pdf-pages-manual");

  all_holders = pages_container_all.querySelectorAll(".canvas-holder");
  manual_holders = pages_container_manual.querySelectorAll(".watermarked");
  holders = Array.from(all_holders).concat(Array.from(manual_holders));
  if (inpt.hasAttribute("checked")) {
    inpt.removeAttribute("checked");
    holders.forEach(function (holder) {
      mark = holder.querySelector("." + inpt.value);
      mark ? mark.remove() : null;
    });
  } else {
    inpt.setAttribute("checked", "checked");
    holders.forEach(function (holder) {
      display_mark(holder, inpt.value);
    });
  }
}

function display_mark(holder, placement) {
  mark = document.createElement("i");
  mark.classList.add(
    "fa-regular",
    "fa-circle-dot",
    "position-absolute",
    placement
  );
  mark.style.height = "20px";
  mark.style.width = "20px";
  mark.style.color = "red";
  copy = holder.cloneNode(true);
  copy.classList.remove("position-relative");
  copy.classList.add("position-absolute");
  copy.style.display = "block";
  copy.style.top = "-100000";
  copy.style.left = "-100000";
  copy.style.visibility = "hidden";
  document.body.appendChild(copy);
  c_height = parseInt(copy.offsetHeight);
  c_width = parseInt(copy.offsetWidth);
  copy.remove();
  switch (placement) {
    case "north-west":
      mark.style.top = "6px";
      mark.style.left = "6px";
      break;
    case "north":
      mark.style.top = "6px";
      mark.style.left = c_width / 2 - 10 + "px";
      break;
    case "north-east":
      mark.style.top = "6px";
      mark.style.right = "6px";
      break;
    case "west":
      mark.style.top = c_height / 2 - 15 + "px";
      mark.style.left = "6px";
      break;
    case "center":
      mark.style.top = c_height / 2 - 15 + "px";
      mark.style.left = c_width / 2 - 10 + "px";
      break;
    case "east":
      mark.style.top = c_height / 2 - 15 + "px";
      mark.style.right = "6px";
      break;
    case "south-west":
      mark.style.left = "6px";
      mark.style.bottom = "16px";
      break;
    case "south":
      mark.style.bottom = "16px";
      mark.style.left = c_width / 2 - 10 + "px";
      break;
    case "south-east":
      mark.style.right = "6px";
      mark.style.bottom = "16px";
      break;
  }
  holder.appendChild(mark);
}

function clear_file_info(file_counter = null, size_counter = null) {
  file_counter === null
    ? (file_counter = document.querySelector(".file-counter"))
    : null;
  size_counter === null
    ? (size_counter = document.querySelector(".size-counter"))
    : null;
  if (file_counter) {
    file_counter.innerHTML = "";
    file_counter.classList.add("d-none");
  }
  if (size_counter) {
    size_counter.innerHTML = "";
    size_counter.classList.add("d-none");
  }
}

function loading(visible, hide_after_done = false) {
  var loading_box = document.getElementById("loading");
  if (loading_box !== null && loading_box !== undefined) {
    if (visible) {
      loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.remove("hidden")
        : null;
      loading_box.parentElement.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.parentElement.classList.remove("hidden")
        : null;
      loading_box.classList.remove("hidden");
      // document.querySelector("#upload_text").setAttribute("hidden", "true");
    } else {
      !loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.add("hidden")
        : null;
      if (hide_after_done) {
        !loading_box.parentElement.parentElement.classList.contains("hidden")
          ? loading_box.parentElement.parentElement.classList.add("hidden")
          : null;
      }
      loading_box.classList.add("hidden");
    }
  }
}

function processing(visible, hide_after_done = false) {
  var loading_box = document.getElementById("processing");
  if (loading_box !== null && loading_box !== undefined) {
    if (visible) {
      loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.remove("hidden")
        : null;
      loading_box.parentElement.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.parentElement.classList.remove("hidden")
        : null;
      loading_box.classList.remove("hidden");
      // document.querySelector("#upload_text").setAttribute("hidden", "true");
    } else {
      !loading_box.parentElement.classList.contains("hidden")
        ? loading_box.parentElement.classList.add("hidden")
        : null;
      if (hide_after_done) {
        !loading_box.parentElement.parentElement.classList.contains("hidden")
          ? loading_box.parentElement.parentElement.classList.add("hidden")
          : null;
      }
      loading_box.classList.add("hidden");
    }
  }
}

function window_close() {
  window.onbeforeunload = function () {
    return "Are you sure";
  };
}

function load_analitics() {
  var include_tag = document.createElement("script");
  include_tag.src = "https://googletagmanager.com/gtag/js?id=G-JMJ9E5GWL9";
  document.getElementsByTagName("head")[0].appendChild(include_tag);
  var script_tag = document.createElement("script");
  script_tag.setAttribute("async", "async");
  script_tag.innerHTML =
    "window.dataLayer = window.dataLayer || [];\n function gtag(){dataLayer.push(arguments);}\n gtag('js', new Date());\n gtag('config', 'G-JMJ9E5GWL9');";
  document.getElementsByTagName("head")[0].appendChild(script_tag);
}

function load_pdfjs() {
  var pdf_min = document.createElement("script");
  var pdf_viewer = document.createElement("link");
  pdf_min.src =
    "https://cdn.jsdelivr.net/npm/pdfjs-dist@3.6.172/build/pdf.min.js";
  pdf_viewer.href =
    "https://cdn.jsdelivr.net/npm/pdfjs-dist@3.6.172/web/pdf_viewer.min.css";
  document.getElementsByTagName("head")[0].appendChild(pdf_min);
  document.getElementsByTagName("head")[0].appendChild(pdf_viewer);
}

function create_download_btn(url = "") {
  var button_holder = $create("div");
  var main_parent =
    $(".conversion-tab") || $("#results") || $("#download-section");
  main_parent.style.display = "none"
    ? (main_parent.style.display = "block")
    : null;
  if (
    app.conversion_type == "split-pdf" ||
    app.conversion_type == "ocr" ||
    app.conversion_type == "pdf-add-watermark" ||
    app.conversion_type == "merge-pdf" ||
    app.conversion_type == "swap-pdf-pages"
  ) {
    main_parent = $("#download-section");
    main_parent.classList.remove("d-none");
  }
  if ($("div[id=button-holder]") !== null) {
    $("div[id=button-holder]").remove();
  }
  var btn = $create("a");
  btn.setAttribute("id", "download");
  var lable = $create("lable");
  button_holder.setAttribute("id", "button-holder");
  if (isValidUrl(url)) {
    fetch(url, {
      method: "get",
      mode: "no-cors",
      referrerPolicy: "no-referrer",
    })
      .then((res) => res.blob())
      .then((res) => {
        btn.setAttribute("download", "dailyocr-file");
        const href = URL.createObjectURL(res);
        btn.href = href;
        btn.setAttribute("target", "_blank");
        //                btn.click();
      });
  } else {
    btn.target = "_blank";
    btn.setAttribute("href", url);
  }

  btn.style.textDecoration = "none";
  if (
    app.conversion_type == "pdf-to-image" ||
    app.conversion_type == "split-pdf"
  ) {
    button_holder.classList.add("form-group", "text-center", "m-auto", "w-100");
    btn.classList.add("btn-sample", "form-control", "text-center", "m-auto");
    btn.innerHTML = "Download";
  } else {
    btn.classList.add("text-center", "m-auto");
    btn.innerHTML = url;
    button_holder.classList.add("text-center", "m-auto", "text-break");
    button_holder.style.maxWidth = "100%";
  }
  button_holder.appendChild(btn);
  main_parent.appendChild(button_holder);
  //    main_parent.scrollIntoView()

  processing(false);
}

async function multiple_download_links(urls) {
  var button_holder = document.createElement("div");
  var main_parent = document.querySelector("#results-wrapper");
  button_holder.classList.add(
    "text-center",
    "m-auto",
    "text-break",
    "w-100",
    "mb-2",
    "basic-download-link"
  );
  counter = 0;
  for (url of urls) {
    var btn = document.createElement("a");
    btn.style.fontSize = "18px";
    btn.classList.add("text-center", "m-auto", "d-block");
    btn.innerHTML = url;
    await fetch(url, {
      method: "get",
      mode: "no-cors",
      referrerPolicy: "no-referrer",
    })
      .then((res) => res.blob())
      .then((res) => {
        btn.setAttribute("download", "dailyocr-file-" + counter);
        const href = URL.createObjectURL(res);
        btn.href = href;
        btn.setAttribute("target", "_blank");
      });
    button_holder.appendChild(btn);
    counter++;
  }
  main_parent.appendChild(button_holder);
}

function remove_download_btn() {
  var btn = document.querySelector("#button-holder");
  if (btn !== null && btn !== undefined) {
    btn.remove();
  }
}

function enable_convert_button() {
  btn = $(".conversion-button");
  btn.hasAttribute("hidden") ? btn.removeAttribute("hidden") : null;
  btn.removeAttribute("disabled");
}
function disable_convert_button() {
  btn = $(".conversion-button");
  btn.setAttribute("disabled", "disabled");
}

function active_link() {
  var links_elements = document.querySelectorAll(".nav-link");
  Array.from(links_elements).find(function (link) {
    //                console.log(  link.href );

    if (link.href === window.location.href) {
      link.classList.add("active", "fw-bold");
    }
  });
}

function isEmpty(obj) {
  return Object.keys(obj).length === 0;
}

// function user_request(){
//     let buttons = document.querySelectorAll("button");
//     buttons.forEach(function(btn){
//         btn.addEventListener("click", function(){
//
//             var inputs = {};
//             if( this.id = "submit_log_in"){
//                 var name = document.querySelector("#user_name").value;
//                 var pwd = document.querySelector("#password").value;
//             }
//

//             let request_type = this.id;
//             let xml = new XMLHttpRequest();
//             xml.onreadystatechange = function(){
//                 if( this.readyState == 4 && this.status == 200){
//                     if(this.response){
//
//                     }
//                 }
//             }
//             xml.open("POST","user_request.php?request_type=" + request_type);
//             xml.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//             xml.send("isus=cristos");
//         })
//     })

// }

function landing_upload() {
  var input = document.querySelector("#file");
  input.addEventListener("change", function () {
    if (check_types()) {
      var upload_span = document.querySelector(".upload-file-name");
      var btn = document.querySelector(".conversion-button");
      upload_span.innerHTML = input.files[0].name;
      var size = parseFloat((input.files[0].size / (1024 * 1024)).toFixed(2));

      btn.removeAttribute("disabled");
      if (size > app.allowed_file_size) {
        set_alert(
          "File size must not exceed " + app.allowed_file_size + " MB!",
          "danger"
        );
        return false;
      }
      redirect_to_ocr(btn, input.files[0].name, size);
    } else {
      set_alert(
        "Bad file type! Make sure your file is " +
          app.allowed_types.join(", ").toUpperCase(),
        "danger"
      );
    }
  });
}

function _handleSitemapBoxClick() {
  clicked = this;
  clicked.setAttribute("value", "true");
  var bxs = document.querySelectorAll("input[type=checkbox]");
  bxs.forEach(function (elem) {
    if (elem !== clicked) {
      elem.removeAttribute("value");
      elem.checked = false;
    }
  });
}
function sitemap_check_select() {
  var boxes = document.querySelectorAll("input[type=checkbox]");
  boxes.forEach(function (box) {
    box.addEventListener("click", _handleSitemapBoxClick);
  });
}

function sitemap_home_click() {
  btn = document.querySelector(".conversion-button");
  btn.addEventListener("click", _handleSitemapHomeRedirect);
}
function _handleSitemapHomeRedirect() {
  check_type = document.querySelector("input[value=true]");
  url = document.querySelector("input[name=url]");
  if (!url.value) {
    set_alert("Please insert a valid ULR.", "danger");
    return false;
  }
  if (!check_type) {
    type = "validate";
  } else {
    type = check_type.name;
  }
  localStorage.setItem("sitemap_home_url", url.value);
  localStorage.setItem("sitemap_home_type", type);
  var url;
  switch (type) {
    case "validate":
      url = "/tools/seo-sitemap-checker";
      break;
    case "broken-links":
      url = "/tools/sitemap-broken-links";
      break;
    case "generate":
      url = "/tools/sitemap-generator";
      break;
  }
  window.location.href = url;
  //    console.log("")
}

function handle_sitemap_home_redirect() {
  type = localStorage.getItem("sitemap_home_type");
  url = localStorage.getItem("sitemap_home_url");
  if (type && url) {
    input = document.querySelector("input[name=url]");
    input.innerHTML = url;
    input.value = url;
    seo_check();
  }

  localStorage.removeItem("sitemap_home_type");
  localStorage.removeItem("sitemap_home_url");
}

function redirect_to_ocr(btn, file_name, size) {
  btn.addEventListener("click", async function (ev) {
    ev.preventDefault();
    var upload_status;
    await upload_files(false)
      .then((data) => (upload_status = data))
      .catch((reason) => console.log("Message:" + reason.message));
    if (
      upload_status["success"] !== null &&
      upload_status["success"] !== undefined
    ) {
      localStorage.setItem("order_id", upload_status["success"]);
      localStorage.setItem("file_name", file_name);
      localStorage.setItem("size", size);
      window.location.replace("/tools/ocr");
    }
    return false;
  });
}

function create_file_list_landing(name, size) {
  document.querySelector("#tool-files").classList.remove("d-none");
  var li = document.createElement("li");
  var file_list_div = document.querySelector("#file-list-holder");
  var file_count = document.querySelector(".file-counter");
  var size_count = document.querySelector(".size-counter");
  var name_span = document.createElement("span");
  var icon = document.createElement("object");
  var remove_span = document.createElement("span");
  var right_container = document.createElement("div");
  var left_container = document.createElement("div");
  var size_span = document.createElement("span");
  var ul = document.createElement("ul");
  ul.setAttribute("id", "name-list");
  ul.style.display = "block";
  size_span.innerHTML = size + " MB";
  app.file_size = size;
  size_span.classList.add("size-span");
  right_container.classList.add(
    "justify-content-end",
    "align-items-center",
    "w-50",
    "d-flex"
  );
  left_container.classList.add(
    "align-items-center",
    "d-flex",
    "overflow-hidden",
    "w-100"
  );
  type = exploded_name(name)[1].toLowerCase();
  type == "jpeg" ? (type = "jpg") : null;
  li.classList.add(
    "text-start",
    "name-li",
    "list-group-item",
    "align-items-center"
  );
  //        app.allowed_file_size > (value.size/(1024*1024)).toFixed(2) ? li.classList.add("list-group-item-success"): li.classList.add("list-group-item-danger")

  icon.data = "../images/" + type + "-type.svg";
  icon.classList.add(type + "-icon");
  icon.classList.add("file-icon", "blue");
  left_container.appendChild(icon);
  left_container.appendChild(name_span);
  li.appendChild(left_container);
  name_span.classList.add("file-name");
  name_span.innerHTML = name;
  remove_span.classList.add("remove-file", "delete");
  remove_span.innerHTML = "&#x2715";
  right_container.appendChild(size_span);
  right_container.appendChild(remove_span);
  li.appendChild(right_container);
  ul.appendChild(li);
  file_count.innerHTML = "Total files: " + 1;
  if (app.file_size > 0) {
    size_count.innerHTML = "Total size: " + size + " MB";
    if (app.file_size > app.allowed_file_size) {
      size_count.classList.add("bg-danger");
    }
  }

  file_list_div.appendChild(ul);
  loading(false);
  change_convert_btn(true);
  remove_file();
}

async function get_landing_file() {
  let order = localStorage.getItem("order_id");
  var host = "https://" + location.hostname + "/";
  if (order && document.referrer == host) {
    let name = localStorage.getItem("file_name");
    let size = localStorage.getItem("size");
    create_file_list_landing(name, size);
    await conversion(order);
    localStorage.removeItem("size");
  }
}
async function preview_image() {
  var images = document.querySelectorAll(".image-content");
  images.forEach(async (img) => {
    url = img.nextElementSibling.children[0].getAttribute("href-a-data");
    await fetch(url, { method: "get" })
      .then((res) => res.blob())
      .then((res) => {
        const src = URL.createObjectURL(res);
        //        var reader = new FileReader();
        //            reader.onload = function(e) {
        //                img.querySelector("img").src = e.target.result;
        //            }
        //            reader.readAsDataURL(res);
        img.querySelector("img").src = src;
      });

    img.addEventListener("click", function () {
      var image = img.children[0];
      var modal = document.querySelector(".modal");
      modal.style.display = "block";
      modal_img = modal.children[1];
      modal_img.src = image.src;
      close_image(modal);
    });
  });
}

function close_image(modal) {
  var close_btn = modal.querySelector(".close");
  close_btn.addEventListener("click", function () {
    modal.style.display = "none";
  });
}

function include_on_click() {
  boxes = document.querySelectorAll(".page-include");
  boxes.forEach(function (box) {
    box.addEventListener("click", function () {
      if (box.value === "") {
        box.value = true;
      } else {
        box.value = "";
      }
    });
  });
}

function source_select() {
  let tabs = document.querySelector("#source-nav").querySelectorAll("span");
  let holders = document.querySelectorAll(".source-input-holder");
  holders[0].style.maxHeight = "500px";
  tabs.forEach(function (elem) {
    elem.addEventListener("click", function (ev) {
      tabs.forEach(function (tb) {
        if (tb.classList.contains("active")) {
          tb.classList.remove("active");
        }
      });

      holders.forEach(function (el) {
        if (el.style.maxHeight !== "0px") {
          el.style.maxHeight = 0;
          el.style.overflow = "hidden";
        }
      });

      elem.classList.add("active");
      document.querySelector(
        "#kw-source-" + elem.dataset.source
      ).style.maxHeight = "500px";
      document.querySelector(
        "#kw-source-" + elem.dataset.source
      ).style.overflow = "auto";
    });
  });
}

function uncheck_method() {
  boxes = document.querySelectorAll(".kw-method");
  boxes.forEach(function (box) {
    box.addEventListener("click", function () {
      if (box.value === "") {
        box.value = true;
      } else {
        box.value = "";
      }
      boxes.forEach(function (elem) {
        if (elem !== box) {
          elem.checked = false;
          elem.value = "";
        }
      });
    });
  });
}

function density_on_key() {
  window.addEventListener("keypress", function (event) {
    if (event.key === "Enter") {
      event.preventDefault();
      density();
    }
  });
}

// async function that fetches response from "find-density.php";
// bound to "Calculate Density" button;
async function density() {
  processing(true);
  // the div where the results and messages will be displayed
  let results_div = document.querySelector("#main-results");
  // create a FormData and append the url and checkboxes values;
  let form_data = new FormData();
  let method = "";
  url_selector = document.querySelector("#main-url");
  competitor_url_selector = document.querySelector("#competitor-url");
  include_boxes = document.querySelectorAll(".page-include");
  method_boxes = document
    .querySelector("#source-nav")
    .querySelectorAll(".nav-link");
  method = Array.from(method_boxes).find((element) =>
    element.classList.contains("active")
  );
  method = method.dataset.source;
  form_data.append("method", method);
  if (method == "link") {
    if (url_selector.value == "") {
      set_alert(
        "Please insert the url to your webpage before proceeding!",
        "danger"
      );
      return false;
    }
    form_data.append("url", url_selector.value);
    if (competitor_url_selector.value.trim()) {
      form_data.append("competitor-url", competitor_url_selector.value);
    }
    include_boxes.forEach(function (box, i) {
      if (box.value === "true") {
        form_data.append(box.name, box.value);
      }
    });
  }
  if (method == "text") {
    text_area = document.querySelector("#kw-text");
    custom_kw = document.querySelector("#kw-input-text").value;
    if (custom_kw.trim() !== "") {
      form_data.append("custom-keywords", custom_kw);
    }
    if (text_area.value == "") {
      set_alert(
        "Please insert text in the input area before proceeding!",
        "danger"
      );
      return false;
    }
    form_data.append("text", text_area.value);
  }
  if (method == "file") {
    var file_selector = document.querySelector("#file");
    if (file_selector.files.length == 0) {
      set_alert("Please select a file before proceeding!", "danger");
      return false;
    }

    var upload_status;
    await upload_files(false)
      .then((data) => (upload_status = data))
      .catch((reason) => console.log("Message:" + reason.message));
    if (upload_status !== false) {
      form_data.append("id", upload_status["success"]);
      custom_kw = document.querySelector("#kw-input-file").value;
      if (custom_kw.trim() !== "") {
        form_data.append("custom-keywords", custom_kw);
      }
    } else {
      set_alert(
        "We encountered some problems. Please try again or try again later!",
        "danger"
      );
    }
    loading(false);
    change_convert_btn(true);
  }

  // function called when the fetch has succeeded
  // @param { json = JSON };
  function success(json) {
    clear_results();
    if (json["status"] !== null && json["status"] !== undefined) {
      set_alert(json["status"], "danger");
    } else {
      for (const type in json) {
        if (method == "link") {
          url = document.querySelector("#" + type + "-url");
          results_div = document.querySelector("#" + type + "-results");
          indicator = document.createElement("span");
          indicator.innerHTML = "Results for: " + url.value;
          hr = document.createElement("hr");
          //                hr.classList.add('mt-0')
          results_div.appendChild(indicator);
          //                results_div.appendChild(hr)
        }

        if (
          method == "link" &&
          json[type]["density"]["keywords"].length === 0
        ) {
          var alert = document.createElement("div");
          alert.classList.add("alert", "alert-danger", "p-2", "mb-2");
          alert.innerHTML = "The Page does not have Meta Keywords!";
          alert.style.fontSize = "15px";
          results_div.appendChild(alert);
          hr = document.createElement("hr");
          //                results_div.appendChild(hr)
        }
        create_tables(json[type]["density"], method, type);
        statistics(json[type]["statistics"], type);
      }
    }
    processing(false);
    results_div.removeAttribute("hidden");
    scrollToTargetAdjusted(results_div);
  }
  function failure(e) {
    console.log(e);
  }
  await fetch("/find-density", {
    method: "POST",
    body: form_data,
    success: function (data) {},
  })
    .then((res) => res.json())
    .then((response) => success(response))
    .catch((error) => failure(error));
}

// cleares the results div
function clear_results() {
  arr = ["main", "competitor"];
  arr.forEach(function (elem) {
    result_div = document.querySelector("#" + elem + "-results");
    result_div.classList.remove("d-none");
    stats_div = document.querySelector(".statistics");
    density_div = document.querySelector(".density");
    if (stats_div !== null && density_div !== null) {
      stats_div.innerHTML = "";
      density_div.innerHTML = "";
    } else {
      result_div.innerHTML = "";
    }
  });
}

function statistics(json, type) {
  main_res = document.querySelector("#" + type + "-results");
  var results_div = main_res.querySelector("#phrases");
  var span_holder = document.createElement("div");
  span_holder.classList.add("p-2", "alert", "alert-primary", "mb-2");
  span_holder.style.fontSize = "15px";
  for (const [stats, vals] of Object.entries(json)) {
    var span = document.createElement("span");
    span.classList.add("me-2");
    span.innerHTML =
      stats + ": " + "<span class='text-success'>" + vals + "</span>";
    span_holder.appendChild(span);
  }
  results_div.insertBefore(span_holder, results_div.children[0]);
}

// creates tables containing the results and adds headers for each table
// @params { json = json recieved from fetch, tables = array with tables ids};
function create_tables(json, method, type) {
  let tables = [
    "keywords",
    "one-word",
    "two-words",
    "three-words",
    "four-words",
  ];
  results_div = document.querySelector("#" + type + "-results");
  if (method == "link") {
    var table_heads = [
      "Keyword",
      "Frequency",
      "Title",
      "Description",
      "H-tags",
      "Density",
    ];
  } else {
    var table_heads = ["Keyword", "Frequency", "Density"];
  }
  buttons_holder = document.createElement("div");
  buttons_holder.classList.add("nav", "nav-tabs");
  //    results_div.classList.add("p-3");
  //    results_div.style.backgroundColor = "#FCFCFB";

  words_table_container = document.createElement("div");
  words_table_container.classList.add("w-100");
  tables_and_menu_holder = document.createElement("div");
  tables_and_menu_holder.setAttribute("id", "phrases");
  tables_and_menu_holder.classList.add("d-flex", "flex-column");
  tables_and_menu_holder.appendChild(buttons_holder);

  tables_and_menu_holder.appendChild(buttons_holder);
  tables_and_menu_holder.appendChild(words_table_container);
  results_div.appendChild(tables_and_menu_holder);

  //    results_div.appendChild(results_div)

  tables.forEach((id, index) => {
    if (json[id].length === 0) {
      return;
    }
    result_table = document.createElement("table");
    result_table.classList.add("word-density-table");
    var heading = document.createElement("h5");
    heading.innerHTML = "Results for " + id.replace("-", " ");
    heading.classList.add("mt-3", "kw-table-name");
    if (id == "keywords") {
      result_table.classList.add(
        "table",
        "table-success",
        "table-striped",
        "m-auto"
      );
    } else {
      result_table.classList.add(
        "table",
        "table-primary",
        "table-striped",
        "m-auto"
      );
    }

    let table_holder = document.createElement("div");
    table_holder.setAttribute("id", id);

    result_table.setAttribute("id", id);
    table_head = document.createElement("thead");
    th_r = document.createElement("tr");
    table_head.appendChild(th_r);
    table_heads.forEach((thead) => {
      head = document.createElement("th");
      head.innerHTML = thead;
      head.classList.add("kw-table-heading");
      th_r.appendChild(head);
    });
    result_table.appendChild(table_head);
    table_body = document.createElement("tbody");
    //        table_body.classList.add("custom-shadow")
    result_table.appendChild(table_body);
    // the keywords table will be the first to be desplayed in a different manner
    hr = document.createElement("hr");
    if (id === "keywords") {
      collapse_btn = document.createElement("button");
      collapse_btn.classList.add(
        "btn",
        "btn-sm",
        "btn-primary",
        "shadow-none",
        "border-0",
        "rounded-0",
        "d-flex",
        "justify-content-between",
        "w-100"
      );
      collapse_btn.style.backgroundColor = "#777";
      collapse_btn.addEventListener("click", _handleKWTableDropDown);
      show_span = document.createElement("span");
      show_span.innerHTML = "Hide Keywords";
      icon = document.createElement("i");
      icon.classList.add("fa-solid", "fa-caret-down");
      collapse_btn.appendChild(show_span);
      collapse_btn.appendChild(icon);

      result_table.classList.add("w-100", "mb-2");
      //            table_holder.appendChild(heading);
      table_holder.appendChild(collapse_btn);
      table_holder.appendChild(result_table);
      //          console.log(results_div)
      if (method == "link") {
        results_div.insertBefore(table_holder, results_div.children[1]);
      } else {
        results_div.insertBefore(table_holder, results_div.children[0]);
      }

      //            results_div.insertBefore(hr, results_div.children[1]);
    } else {
      btn = document.createElement("span");
      btn_name = id.replace("-", " ");
      btn_name = btn_name.charAt(0).toUpperCase() + btn_name.slice(1);
      btn.innerHTML = btn_name;
      btn.style.fontSize = "15px";
      btn.setAttribute("onclick", "_handleShowTable(this)");
      btn.setAttribute("id", id + "-toggle");
      buttons_holder.appendChild(btn);

      result_table.classList.add("w-100");
      if (id !== "one-word") {
        table_holder.classList.add("d-none");
        btn.classList.add("nav-link", "flex-fill");
      } else {
        btn.classList.add("active");
        btn.classList.add("nav-link", "flex-fill");
      }
      //            table_holder.appendChild(heading);
      //                      table_holder.classList.add("mt-3")

      table_holder.appendChild(result_table);
      words_table_container.appendChild(table_holder);
    }
    populate_table(json[id], result_table);
  });
}

function _handleKWTableDropDown() {
  target = this.nextElementSibling;
  if (!target.classList.contains("d-none")) {
    target.classList.add("d-none");
    this.querySelector("i").classList.remove("fa-caret-down");
    this.querySelector("i").classList.add("fa-caret-up");
    this.querySelector("span").innerHTML = "Show Keywords";
    this.classList.add("mb-2");
  } else {
    target.classList.remove("d-none");
    this.querySelector("i").classList.remove("fa-caret-up");
    this.querySelector("i").classList.add("fa-caret-down");
    this.querySelector("span").innerHTML = "Hide Keywords";
    this.classList.remove("mb-2");
  }
}

function _handleShowTable(target) {
  current_btn = target.parentElement.parentElement.querySelector(".active");
  if (current_btn == target) {
    return false;
  }
  target.classList.remove("btn-outline-primary");
  table_name = target.id.split("-");
  table_name = table_name[0] + "-" + table_name[1];
  next_table = target.parentElement.parentElement.querySelector(
    "#" + table_name
  );
  next_table.classList.remove("d-none");

  target.classList.add("active");

  current_btn.classList.remove("active");
  //        current_btn.classList.add("btn-outline-primary")

  prev_table_name = current_btn.id.split("-");
  prev_table_name = prev_table_name[0] + "-" + prev_table_name[1];
  target.parentElement.parentElement
    .querySelector("#" + prev_table_name)
    .classList.add("d-none");
}

// populates created tables with results from json
// @params { result = array of results from first JSON entry; res_table = HTML table element }
function populate_table(result, res_table) {
  for (const [word, vals] of Object.entries(result)) {
    if (result.length === 0) {
      return;
    }

    var row = res_table.querySelector("tbody").insertRow();
    var cell = row.insertCell(0);
    cell.classList.add("kw-table-cell", "kw-table-cell-words");
    cell.innerHTML = word;
    Object.values(vals).forEach(function (val, index) {
      if (res_table.id == "keywords" && index == 0 && val == 0) {
        row.classList.add("table-danger");
      }
      var cell = row.insertCell(index + 1);
      cell.classList.add("kw-table-cell", "align-middle");
      cell.innerHTML = val;
    });
  }
}

function make_token(length) {
  let result = "";
  const characters =
    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
  const charactersLength = characters.length;
  let counter = 0;
  while (counter < length) {
    result += characters.charAt(Math.floor(Math.random() * charactersLength));
    counter += 1;
  }
  return result;
}

function set_progress_token() {
  token_inpt = document.querySelector("#token");
  if (token_inpt) {
    token_inpt.setAttribute("value", make_token(5));
  }
}

function restart_seo_report(target) {
  var form_data = new FormData();

  form_data.append("url", target.dataset.url);
  form_data.append("to-check", "create-seo-report");
  form_data.append("redo-report", "true");
}

function start_seo_report(target) {
  var url = $("#url");
  var prot = $("#prot");

  var form_data = new FormData();

  if (prot) {
    //        url +=  "&prot=" + prot.value
    if (!isValidUrl(url.value) && !isValidUrl(prot.value + "://" + url.value)) {
      set_alert("Please insert a valid URL!", "danger");
      return false;
    }
    form_data.append("prot", prot.value);
  }
  if (target.dataset.url) {
    form_data.append("url", target.dataset.url);
    form_data.append("redo-report", true);
  } else {
    form_data.append("url", url.value);
  }
  form_data.append("to-check", "create-seo-report");

  function success(json) {
    //        clearInterval(request_update);
    if (json["status"] == "success") {
      if (json["results"]["status"] !== "finished") {
        window.localStorage.setItem("start-process-report", true);
      }
      window.location.replace(json["results"]["url"]);
    } else {
      set_alert("Something went wrong. Please try again later.", "danger");
    }
  }

  function failure(e) {
    console.log(e);
    //        clearInterval(request_update);
  }

  api = "/seo-check";
  fetch(api, {
    async: true,
    keepalive: true,
    body: form_data,
    method: "POST",
    success: function (data) {
      //            console.log(data)
    },
  })
    .then((res) => res.json())
    .then((response) => success(response));
}

function get_payload() {
  let payload = {};
  let ids = ["url", "prot", "to-check", "token", "user-agent", "country"];

  ids.forEach(function (id) {
    const elem = $("#" + id);
    if (elem) {
      payload[id] = elem.value;
    }
  });

  return payload;
}

async function update_seo_check(payload) {
  function failure_update(e) {
    clearInterval(request_update);

    console.log(e);
  }
  async function success_update(data) {
    let processed_thresh = 500;
    let interval_multiplier = 0;
    switch (payload["to-check"]) {
      case "sitemap-generator":
        if (data["total-urls"]) {
          if (
            parseInt(Object.values(data["total-urls"])[0]) >= processed_thresh
          ) {
            processed_links_string = Object.values(
              data["total-urls"]
            )[0].toString();
            interval_multiplier += 5;
            if (interval_multiplier >= 10) {
              power =
                parseInt(processed_links_string.length) -
                parseInt(parseInt(interval_multiplier.toString().length) - 1);
            } else {
              power = parseInt(processed_links_string.length);
            }

            power = 3;
            //
            payload["update-interval"] =
              parseInt(interval_multiplier) * 10 ** power;

            processed_thresh = payload["update-interval"];

            clearInterval(request_update);
            //                        payload["update-interval"]  = 5000;
            request_update = setInterval(
              await update_seo_check(payload, request_update),
              payload["update-interval"]
            );
            data["time-update"] = {
              "Updating every:":
                parseInt(payload["update-interval"]) / 1000 + " seconds",
            };
          }
          //                }
          //                debugger;
        }
        data["time-update"] = {
          "Updating every: ":
            parseInt(payload["update-interval"]) / 1000 + " seconds",
        };
        break;
      case "broken-links":
        //                console.log(data)
        break;
    }
    update_data(data, payload["to-check"]);
  }
  fetch(
    "/progress-data?data=" + payload["to-check"] + "&token=" + payload["token"],
    {
      async: true,
      method: "GET",
      keepalive: true,
      success: function (data) {},
    }
  )
    .then((res) => res.json())
    .then((response) => success_update(response))
    .catch((error) => failure_update(error));
}

async function seo_check() {
  clear_storage();
  clear_display_area();
  processing(true);

  //    change_convert_btn(false)
  const payload = get_payload();

  if (payload["prot"]) {
    //        console.log(!isValidUrl(prot.value + "://" + url.value))
    if (!isValidUrl(payload["prot"] + "://" + payload["url"])) {
      set_alert("Please insert a valid URL!", "danger");
      change_convert_btn(true);
      return false;
    }
  } else {
    if (!isValidUrl(payload["url"])) {
      set_alert("Please insert a valid URL!", "danger");
      change_convert_btn(true);
      return false;
    }
  }

  var form_data = new FormData();
  for (const itm in payload) {
    form_data.append(itm, payload[itm]);
  }

  let update_tools = [
    "sitemap",
    "sitemap-urls",
    "sitemap-generator",
    "website-structure",
    "broken-links",
  ];

  if (update_tools.indexOf(payload["to-check"]) > -1) {
    xhr_check(form_data, payload["to-check"]);
    return;
  }

  var result_div = $("#results");
  var result_alert = $("#no-result");
  result_div ? result_div.remove() : null;
  result_alert ? result_alert.remove() : null;

  let request_update;

  let update_holder = $("#update-holder-" + payload["to-check"]);

  if (update_holder !== null && update_holder !== undefined) {
    update_holder.remove();
  }

  function success(json) {
    clearInterval(request_update);
    processing(false, true);
    change_convert_btn(true);
    if (json["failure"] !== undefined) {
      set_alert(json["failure"], "danger");
      return false;
    }
    if (json["status"] == "success") {
      let update_holder = $("#update-holder-" + payload["to-check"]);
      if (update_holder !== null && update_holder !== undefined) {
        update_holder.remove();
      }
      if (json["results"]) {
        if (payload["to-check"] == "seo-report") {
          window.location.replace(json["results"]);
        } else {
          //                    $("#results-wrapper").appendChild(node_from_string(parse_html_tags(json["results"])))
          display_indicator(payload["to-check"], payload["url"]);
          display_tool_results(json["results"], payload["to-check"]);
        }
      } else {
        multiple_download_links(json["links"]);
      }
    } else {
      const alert = document.createElement("div");
      alert.classList.add("alert", "alert-danger", "p-2", "mb-0", "mt-2");
      alert.setAttribute("id", "no-result");
      alert.style.fontSize = "15px";
      alert.innerHTML = json["status"];
      $("#results-wrapper").appendChild(alert);

      //            set_alert(json["status"], "danger")
    }

    if (json["data"] !== undefined) {
      //            console.log(json["data"])
    }
  }

  function failure(e) {
    clearInterval(request_update);

    console.log(e);
  }

  if (payload["to-check"] === "seo-report") {
    clear_report_nav();
  }

  fetch("/seo-check", {
    async: true,
    keepalive: true,
    body: form_data,
    method: "POST",
    success: function (data) {
      //            console.log(data)
    },
  })
    .then((res) => res.json())
    .then((response) => success(response))
    .catch((error) => failure(error));
}

function xhr_check(data, to_check) {
  $(".update-holder").classList.remove("d-none");
  $("#results-wrapper").innerHTML = "";
  disable_convert_button();

  XHR.addCallback(XMLHttpRequest.OPENED, function (data) {});

  XHR.addCallback(XMLHttpRequest.DONE, function (data) {
    processing(false);
    const parsed = parse_commaless_json(data);
    if (parsed[0]["status"] == "failure") {
      set_alert(parsed[0]["message"], "danger");
      return false;
    }
    try {
      const last_item = parsed[parsed.length - 1];

      // update_results(last_item["data"]);

      end_request(last_item, to_check);
    } catch (e) {
      console.log("Not a valid Json!");
      console.log(e);
    }
    enable_convert_button();
  });

  XHR.addCallback(XMLHttpRequest.LOADING, function (data) {
    try {
      const parsed = parse_commaless_json(data);

      const last_item = parsed[parsed.length - 1];
      update_results(last_item, to_check);
    } catch (e) {
      console.log("Not a valid Json!");
      console.log(e);
    }
  });

  XHR.open("POST", "/seo-check", true);

  XHR.send(data);

  function update_results(itm, to_check) {
    if (!itm) {
      return false;
    }
    for (const idx in itm) {
      const elem = $("#" + idx);
      if (elem) {
        elem.innerHTML = itm[idx];
      }
    }
    switch (to_check) {
      case "broken-links":
        for (lnk in itm["blinks"]) {
          spn = document.createElement("span");
          code_spn = document.createElement("span");
          code_spn.innerHTML = " - " + itm["blinks"][lnk]["response_code"];
          spn.innerHTML = lnk;
          spn.appendChild(code_spn);
          spn.classList.add("d-block");
          $("#broken-links-holder").appendChild(spn);
        }
        break;
    }
  }

  function end_request(data, to_check) {
    $(".update-holder").classList.add("d-none");
    display_indicator(to_check, $("#url").value);
    switch (to_check) {
      case "sitemap-generator":
        multiple_download_links(data["links"]);
        break;
      case "website-structure":
        $("#results-wrapper").innerHTML += data["results"];
        break;
      case "sitemap":
        display_tool_results(data["results"], to_check);
        break;
      case "sitemap-urls":
        display_tool_results(data, to_check);
        break;
      case "broken-links":
        display_tool_results(data, to_check);
        break;
    }
  }
}

function clear_display_area() {
  const res_div = $("#tool-results");
  if (res_div) {
    res_div.remove();
  }
  const indicators = $(".tool-indicator", true);
  indicators.forEach(function (elem) {
    elem.remove();
  });
}

function display_indicator(test, url) {
  const indicator = $create("span", false, ["tool-indicator"]);
  let test_name = (test.charAt(0).toUpperCase() + test.slice(1))
    .replace("-", " ")
    .replace("_", " ");
  indicator.innerHTML =
    "<span class='ind-name'>" + test_name + "</span>" + " results";
  if (test !== "page-size") {
    indicator.innerHTML += " for: <span class='ind-url'>" + url + "</span>";
  }
  $("#results-wrapper").appendChild(indicator);
}

function display_tool_results(results, test) {
  const results_wrapper = $("#results-wrapper");
  const data_div = $create("div", "tool-results-data");
  const results_div = $create("div", "tool-results");

  results_wrapper.appendChild(results_div);

  if (test !== "page-size" && test !== "sitemap") {
    results_div.appendChild(display_messages(results));
  }

  results_div.appendChild(data_div);
  if (test !== "heading") {
    display_content(results);
  }

  const display_data = tool_results_data(results, test);
  if (display_data) {
    data_div.appendChild(display_data);
  }

  scrollToTargetAdjusted(results_div);
}

function scrollToTargetAdjusted(element) {
  var headerOffset = 150;
  var elementPosition = element.getBoundingClientRect().top;
  var offsetPosition = elementPosition + window.pageYOffset - headerOffset;

  window.scrollTo({
    top: offsetPosition,
    behavior: "smooth",
  });
}

function display_messages(results) {
  //    debugger
  const messages_div = $create("div", "results-messages");
  const custom_msgs = results["Messages"];
  const alerts = {
    passed: "success",
    failed: "danger",
    warning: "warning",
  };

  //custom messages = messages not stored in db
  if (custom_msgs) {
    for (msg_type in custom_msgs) {
      for (msg in custom_msgs[msg_type]) {
        const message_wrapper = $create("div", false, [
          "alert",
          "alert-" + alerts[msg_type],
          "p-1",
          "mb-1",
        ]);
        const message = $create(
          "span",
          false,
          [msg_type + "-audit"],
          custom_msgs[msg_type][msg]
        );
        message_wrapper.appendChild(message);
        messages_div.appendChild(message_wrapper);
      }
    }
  } else {
    //console.log(results.length);
    if (!results.length) {
      results = [results];
    }
    results.forEach(function (res) {
      if (!res["message"]) {
        return;
      }
      const message_wrapper = $create("div", false, [
        "alert",
        "alert-" + alerts[res["status"]],
        "p-1",
        "mb-1",
      ]);
      const message = $create("span", false, [res["status"] + "-audit"]);
      message.innerHTML = res["message"]
        .replace("[b]", "<b>")
        .replace("[/b]", "</b>");

      message_wrapper.appendChild(message);
      messages_div.appendChild(message_wrapper);
    });

    //data
  }
  //console.log(messages_div);
  return messages_div;
}

function display_content(results) {
  const data_div = $("#tool-results-data"); //
  if (results["data"] && results["data"]["text-content"]) {
    const text_content_wrapper = $create("div", "text-content-wrapper", [
      "my-3",
    ]);
    const text_content_holder = $create("div", "text-content-holder");
    text_content_holder.innerHTML = results["data"]["text-content"];

    text_content_wrapper.appendChild(text_content_holder);
    data_div.appendChild(text_content_wrapper);
    delete results["data"]["text-content"];
  }
}

function tool_results_data(results, test) {
  const data_div = $("#tool-results-data"); //

  const table = $create("table", false, ["table", "mt-1", "mb-0"]);
  const thead = $create("thead");
  const tbody = $create("tbody");
  table.appendChild(thead);
  table.appendChild(tbody);
  switch (test) {
    case "heading":
      return heading_display();
    case "title":
      if (results["prev-data"] && results["prev-data"]["title"]) {
        return meta_display();
      }
      break;
    case "description":
      if (results["prev-data"] && results["prev-data"]["description"]) {
        return meta_display();
      }
      break;
    case "page-size":
      return page_size_display();
    case "website-structure":
      return display_web_structure();
    default:
      return display_data();
  }

  function display_web_structure() {
    return node_from_string(results["data"]);
  }

  function page_size_display() {
    const tr = $create("tr");
    const th_text = $create("th", false, false, "URL");
    const th_type = $create("th", false, ["text-center"], "Page Size");
    tr.appendChild(th_text);
    tr.appendChild(th_type);
    thead.appendChild(tr);

    for (const itm in results["data"]) {
      let tr = $create("tr");
      let td = $create("td");
      td.innerHTML = results["data"][itm]["url"];
      td.style.maxWidth = "400px";
      td.style.wordWrap = "break-word";
      tr.appendChild(td);

      let td_val = $create(
        "td",
        false,
        ["text-center", results["data"][itm]["status"] + "-audit"],
        results["data"][itm]["value"]
      );
      tr.appendChild(td_val);

      tbody.appendChild(tr);
    }
    return table;
  }

  function display_data() {
    if (!results["data"]) {
      return false;
    }
    const tr = $create("tr");
    thead.appendChild(tr);

    let holder = $create("div");
    holder.classList.add("check-results-list");
    let ul = $create("ul");
    ul.classList.add("check-results-list");
    let main_li = $create("li");
    main_li.classList.add("results-content-header");
    data = results["data"];
    if (data[0] && data[0]["check-results"]) {
      //if check results have a url dispaly it
      if (data[0]["url"]) {
        const th_text = $create("th");
        th_text.style.maxWidth = "400px";
        switch (test) {
          case "opengraph":
            th_text.innerHTML = "OG Tag";
            break;
          case "page-objects":
            th_text.innerHTML = "Resource";
            //                span.classList.add("res-name")
            break;
          default:
            th_text.innerHTML = "URL";
            break;
        }
        tr.appendChild(th_text);
      }
      let keys = Object.keys(data[0]["check-results"]);
      keys.forEach(function (k) {
        let name = k.replace("-", " ");
        name = name.charAt(0).toUpperCase() + name.slice(1);
        const th_type = $create("th", false, ["text-center"], name);

        tr.appendChild(th_type);
      });
    }

    ul.appendChild(main_li);
    for (const itm in data) {
      let tr = $create("tr");
      //if the check results have a url display it
      if (data[itm]["url"]) {
        let td = $create("td", false, ["align-middle", "text-break"]);
        tr.appendChild(td);

        const span = $create("span");
        span.innerHTML = data[itm]["url"];
        td.appendChild(span);
        td.style.maxWidth = "400px";

        //if any custom message for this specific url, display them
        const check_messages = data[itm]["Messages"];
        if (check_messages) {
          for (const type in check_messages) {
            for (const msg in check_messages[type]) {
              const span = $create("span", false, ["d-block", "check-message"]);
              if (type == "failed") {
                span.classList.add("alert-danger", "p-1");
              }
              span.innerHTML = check_messages[type][msg];
              td.appendChild(span);
            }
          }
        }
      }

      let td = $create("td", false, ["align-middle", "text-break"]);

      for (const key in data[itm]["check-results"]) {
        let td = $create("td", false, [
          "text-center",
          "align-middle",
          "text-break",
        ]);
        td.innerHTML = data[itm]["check-results"][key];
        if (
          data[itm]["success-check"] &&
          data[itm]["success-check"] !== "yes"
        ) {
          td.classList.add("text-danger");
        }
        tr.appendChild(td);
      }

      tbody.appendChild(tr);
    }
    console.log(ul);
    return table;
  }

  function heading_display() {
    const tr = $create("tr");
    const th_text = $create("th", false, false, "Heading Text");
    const th_type = $create("th", false, ["text-center"], "Heading Type");
    tr.appendChild(th_text);
    tr.appendChild(th_type);

    thead.appendChild(tr);

    const headings = results[results.length - 1]["data"];
    headings.forEach(function (elem) {
      const tr = $create("tr");
      const td_text = $create("td");
      const td_type = $create("td", false, ["text-center"]);

      td_text.innerHTML = elem.text;
      td_type.innerHTML = elem.type;
      tr.appendChild(td_text);
      tr.appendChild(td_type);
      tbody.appendChild(tr);
    });

    return table;
  }

  function meta_display() {
    const preview = google_preview(results["prev-data"]);
    return preview;
  }
}

function update_data(data, to_check) {
  //    console.log(data);
  first_update = true;
  //        var result_div = document.querySelector("#results");
  //            result_div.classList.remove("d-none");
  data_types = [];
  main_content_holder = document.querySelector("#results-wrapper");
  main_content_holder.querySelector("#update-holder-" + to_check) == null ||
  main_content_holder.querySelector("#update-holder-" + to_check) == undefined
    ? (first_update = true)
    : (first_update = false);
  if (first_update) {
    update_holder = document.createElement("div");
    update_holder.setAttribute("id", "update-holder-" + to_check);
    update_holder.classList.add("m-auto", "p-2", "custom-shadow", "mb-2");
    update_holder.style.backgroundColor = "#FCFCFB";
    for (type in data) {
      if (data[type] === null || data[type] === undefined) {
        continue;
      }

      var prop_names = Object.keys(data[type]);
      data_holder = document.createElement("div");
      data_holder.classList.add("data-holder-" + to_check);
      if (type == "processed-pages") {
        //                        console.log(data)
        links = Object.values(data[type])[0];
        h_span = document.createElement("span");
        h_span.innerHTML = "Broken links found: ";
        data_holder.appendChild(h_span);
        h_span.classList.add("d-block");
        data_holder.appendChild(document.createElement("hr"));
        for (lnk in links) {
          spn = document.createElement("span");
          code_spn = document.createElement("span");
          code_spn.innerHTML = " - " + links[lnk]["response_code"];
          spn.innerHTML = lnk;
          spn.appendChild(code_spn);
          spn.classList.add("d-block");
          data_holder.appendChild(spn);
        }
        update_holder.appendChild(data_holder);

        continue;
      }

      data_message_span = document.createElement("span");
      data_message_span.innerHTML = prop_names[0];
      data_span = document.createElement("span");
      data_message_span.setAttribute("id", type);
      data_span.innerHTML = Object.values(data[type])[0];

      data_holder.appendChild(data_message_span);
      data_holder.appendChild(data_span);
      update_holder.appendChild(data_holder);
    }
    if (to_check == "sitemap-urls") {
      spinner = node_from_string(spinners["primary"]);
      update_holder.appendChild(spinner);
      percent = Math.floor(
        (parseInt(Object.values(data["total-processed"])[0]) /
          parseInt(Object.values(data["total-urls"])[0])) *
          100
      );
      spinner.querySelector(".progress-bar").innerHTML = percent + "%";
      spinner.querySelector(".progress-bar").style.width = percent + "%";
    }
  } else {
    update_holder = document.querySelector("#update-holder-" + to_check);
    count = 0;
    for (type in data) {
      if (data[type] === null || data[type] === undefined) {
        continue;
      }
      var prop_names = Object.keys(data[type]);
      data_holder = update_holder.querySelectorAll(".data-holder-" + to_check)[
        count
      ];
      if (type == "processed-pages") {
        links = Object.values(data[type])[0];
        for (lnk in links) {
          spn = document.createElement("span");
          code_spn = document.createElement("span");
          code_spn.innerHTML = " - " + links[lnk]["response_code"];
          spn.innerHTML = lnk;
          spn.appendChild(code_spn);
          spn.classList.add("d-block");
          data_holder.appendChild(spn);
        }
        continue;
      }
      data_span = data_holder.querySelector("#" + type);
      if (data_span) {
        data_span.nextSibling.innerHTML = Object.values(data[type])[0];
        data_holder.children[0].innerHTML = prop_names[0];
        count++;
      }
    }

    if (to_check == "sitemap-urls") {
      spinner = document.querySelector(".progress");
      update_holder.appendChild(spinner);
      if (
        data["total-processed"] !== undefined &&
        data["total-processed"] !== null
      ) {
        percent = Math.floor(
          (parseInt(Object.values(data["total-processed"])[0]) /
            parseInt(Object.values(data["total-urls"])[0])) *
            100
        );
        spinner.querySelector(".progress-bar").innerHTML = percent + "%";
        spinner.querySelector(".progress-bar").style.width = percent + "%";
      }
    }
  }
  if (first_update) {
    main_content_holder.appendChild(update_holder);
  }
  if (data["added"] !== undefined) {
    span = document.createElement("span");
    span.innerHTML = data["added"];
    span.classList.add("d-block");
    main_content_holder.appendChild(span);
  }
}

function tool_link_btn(to_check) {
  if (app.seo_tags.includes(to_check)) {
    var tool_link = document.createElement("a");
    tool_link.classList.add("btn", "btn-sample", "btn-sm");
    tool_link.innerHTML =
      "Create SEO " + to_check.charAt(0).toUpperCase() + to_check.slice(1);
    tool_link.href = "/tools/write-seo-" + to_check;
  } else {
    if (to_check === "sitemap") {
      var tool_link = document.createElement("button");
      tool_link.classList.add("btn", "btn-sample", "btn-sm");
      tool_link.innerHTML = "Test Sitemap URLs";
      //            tool_link.href = "/tools/sitemap-url-checker"
      tool_link.addEventListener("click", sitemapToolLinkHandler(link));
    }
  }
  return tool_link;
}

function sitemapToolLinkHandler(link) {
  var source = event.target || event.srcElement;
  event.preventDefault();
  localStorage.setItem(
    "sitemap",
    source.parentElement.parentElement.children[0].textContent
  );
  //    console.log(source.parentElement.children[0].textContent)
  //    window.location.replace("/tools/sitemap-broken-links");
  window.open("/tools/sitemap-broken-links", "_blank");
}

function sitemap_redirect_check() {
  let storage_sitemap = localStorage.getItem("sitemap");
  var host = "https://" + location.hostname + "/tools/seo-sitemap-checker";
  if (storage_sitemap && document.referrer == host) {
    document.querySelector("#url").value = storage_sitemap;
    set_progress_token();
    seo_check();

    localStorage.removeItem("sitemap");
  }
}

function isValidUrl(string) {
  try {
    const url = new URL(string);
    //console.log(url);
    return true;
  } catch (err) {
    return false;
  }
}

function escape_html(unsafe) {
  return unsafe
    .replace(/&/g, "&amp;")
    .replace(/</g, "&lt;")
    .replace(/>/g, "&gt;")
    .replace(/"/g, "&quot;")
    .replace(/'/g, "&#039;");
}

function parse_html_tags(unsafe) {
  unsafe = unsafe.replaceAll("&amp;", "&");
  unsafe = unsafe.replaceAll("&amp;", "&");
  unsafe = unsafe.replaceAll("&lt;", "<");
  unsafe = unsafe.replaceAll("&gt;", ">");
  //    unsafe = unsafe.replaceAll("nbsp;", " ")
  return unsafe;

  //         .replace(/"/g, "&quot;" )
  //         .replace(/'/g, "&#039;");
}

function node_from_string(string) {
  if (!string) {
    return false;
  }
  var div = document.createElement("div");
  div.innerHTML = string.trim();
  return div.firstChild;
}
function messages_rows(json, to_check) {
  container = document.querySelector(".results-container");

  msg_count = Object.keys(json["Messages"]).length;
  if (
    json["Messages"]["failed-audits"] == null ||
    json["Messages"]["failed-audits"] == undefined
  ) {
    container.querySelector("#failed-audits").remove();
  } else {
    container.querySelector("#failed-audits").style.width =
      100 / msg_count + "%";
  }

  if (
    json["Messages"]["passed-audits"] == null ||
    json["Messages"]["passed-audits"] == undefined
  ) {
    container.querySelector("#passed-audits").remove();
  } else {
    container.querySelector("#passed-audits").style.width =
      100 / msg_count + "%";
  }

  if (
    json["Messages"]["warnings"] == null ||
    json["Messages"]["warnings"] == undefined
  ) {
    container.querySelector("#warnings").remove();
  } else {
    container.querySelector("#warnings").style.width = 100 / msg_count + "%";
  }

  for (message_type in json["Messages"]) {
    message_div = container.querySelector("#" + message_type);
    json["Messages"][message_type].forEach(function (elem) {
      msg_container = document.createElement("div");
      var msg_span = document.createElement("span");
      //            var mark_span = document.createElement("span")
      var mark_span = node_from_string(spans["mark-" + message_type]);
      msg_span.innerHTML = elem;
      msg_container.appendChild(mark_span);
      msg_container.appendChild(msg_span);
      message_div.appendChild(msg_container);
    });
  }
}

function general_row(json, to_check) {
  //    app.seo_tags.includes(to_check) ? table = document.querySelector("#seo-tag-table") : table = document.querySelector("#base-table")
  table = document.querySelector("." + to_check + "-table-results");

  if (json["general"] == null || json["general"] == undefined) {
    table.querySelector("#general-row").remove();
    return false;
  }
  if (app.seo_tags.includes(to_check)) {
    //Legnth, remaining, limit
    for (stat_type in json["general"]) {
      //pixel, char
      for (stat in json["general"][stat_type]) {
        table.querySelector("." + stat).innerHTML =
          json["general"][stat_type][stat];
      }
    }
    table.querySelector("#tool-link").href = "/tools/write-seo-" + to_check;
    table.querySelector("#tool-link").innerHTML =
      "Create SEO " + to_check.charAt(0).toUpperCase() + to_check.slice(1);
    stats_text();
  } else {
    if (table.querySelector("#general-row") !== null) {
      cell = table.querySelector("#general-row").insertCell();
      cell.setAttribute("id", "general-message");

      //            if( to_check == "sitemap"){
      //                 if( json["total-sitemaps"] !== null &&  json["total-sitemaps"] !== undefined ){
      //                    var span = node_from_string(spans.message_span);
      //                    span.innerHTML = "Found sitemaps: ";
      //                    span.classList.remove("p-2")
      //                    cell.appendChild(span)
      //                    for( sitemap of json["total-sitemaps"] ){
      //                        var div = document.createElement("div");
      //                        div.classList.add("d-block", "border-bottom", "border-light", "m-0", "p-1", "d-flex", "justify-content-between")
      //                        var span = document.createElement("span")
      //                        var link = node_from_string(links.sitemap_url_redirect)
      //                        div.appendChild(span)
      //                        div.appendChild(link)
      ////                        span.classList.add( "border-bottom", "border-light")
      //                        span.classList.add("text-info")
      //                        span.innerHTML = sitemap
      //                        cell.appendChild(div)
      //                    }
      //                 }
      //            }

      for (gen_mess in json["general"]["messages"]) {
        var msg_span = document.createElement("span");
        msg_span.innerHTML = json["general"]["messages"][gen_mess];
        msg_span.classList.add("text-info", "d-block");
        cell.appendChild(msg_span);
      }

      var to_check_indicator = document.createElement("span");
      to_check_indicator.classList.add("d-block");
      to_check_indicator.innerHTML =
        "Analysed " + to_check + ": " + json[to_check];
      cell.appendChild(to_check_indicator);
    }
  }
}

function results_table(table, json, to_check) {
  var result_div = document.querySelector("#results");
  json_entries = ["Messages", "Result Content"];
  json_entries.forEach((elem) => {
    if (elem == "Result Content") {
      table = document.createElement("table");
      table.classList.add("table", "seo-table", "table-dark");
      //                result_div.appendChild(table);
    }
    for (type in json[elem]) {
      var row = table.insertRow();
      var type_cell = row.insertCell();
      var message_cell = row.insertCell();
      type_cell.setAttribute("colspan", 1);
      type_cell.innerHTML = type;
      var type_class = type.replace(" ", "-");
      type_class = type_class.toLowerCase();
      type_cell.classList.add("seo-table-head", "p-2");
      var check_span = document.createElement("span");
      if (type == "Passed Audits") {
        row.classList.add("table-success");
        check_span.classList.add("seo-check-mark");
        check_span.innerHTML = " &#x2714;";
      } else if (type == "Failed Audits") {
        row.classList.add("table-danger");
        check_span.classList.add("seo-uncheck-mark");
        check_span.innerHTML = " &#10008;";
      } else if (type == "Warnings") {
        row.classList.add("table-warning");
        check_span.classList.add("seo-warning-mark", "text-warning");
        check_span.innerHTML = " &#9888;";
      } else {
        row.classList.add("table-warning");
      }
      message_cell.setAttribute("colspan", 4);
      message_cell.classList.add("seo-message-cell");
      if (typeof json[elem][type] === "object") {
        Array.from(json[elem][type]).forEach(function (content) {
          var message_span = document.createElement("span");
          message_span.innerHTML = content;
          message_span.classList.add("d-block", "my-2");
          if (elem == "Messages") {
            message_span.appendChild(check_span.cloneNode(true));
          }
          message_cell.appendChild(message_span);
        });
      } else {
        var message_span = document.createElement("span");
        message_span.innerHTML = json[elem][type];
        message_span.classList.add("d-block", "my-2");
        if (elem == "Messages") {
          message_span.appendChild(check_span.cloneNode(true));
        }
        message_cell.appendChild(message_span);
      }
    }

    if (
      json[elem] !== undefined &&
      parseInt(Object.keys(json[elem]).length) > 0
    ) {
      var header = table.createTHead();
      var h_row = header.insertRow();
      var h_desc_cell = h_row.insertCell();
      h_desc_cell.classList.add("text-center", "align-middle");
      if (elem == "Messages") {
        h_desc_cell.innerHTML =
          to_check.charAt(0).toUpperCase() + to_check.slice(1) + " Status";
        h_desc_cell.setAttribute("colspan", "5");
      } else {
        var h_code_cell = h_row.insertCell(0);
        h_code_cell.classList.add("text-center", "align-middle");
        if (to_check === "sitemap-urls") {
          h_desc_cell.innerHTML = "Found URLS";
          h_code_cell.innerHTML = "HTTP Code";
        }
        if (to_check === "h-tag") {
          h_code_cell.innerHTML = "Tag Type";
          h_desc_cell.innerHTML = "Tag Text";
        }
      }
    }
  });
  if (
    json["Contents"] !== undefined &&
    parseInt(Object.keys(json["Contents"]).length) > 0
  ) {
    var content_div = document.createElement("div");
    content_div.classList.add("mb-3");
    var content_span = document.createElement("span");
    var content_holder = document.createElement("span");
    content_holder.classList.add(
      "border",
      "p-2",
      "border-2",
      "seo-content",
      "text-center"
    );
    content_holder.innerHTML = json["Contents"];
    content_span.innerHTML = "Your " + to_check + " contents: ";
    content_span.classList.add("text-center", "d-block");
    content_div.appendChild(content_span);
    content_div.appendChild(content_holder);
    result_div.appendChild(content_div);
  }
}

function stats_text() {
  var pix_length = document.querySelector(".pixel-length");
  var char_count = document.querySelector(".character-count");
  //    var remaining_pix = document.querySelector(".remaining-pixels");
  //    var remaining_char = document.querySelector(".remaining-characters");
  //
  //    if( remaining_pix.innerHTML < 0 ){
  //        remaining_pix.classList.add("text-danger")
  //    }else{
  //        remaining_pix.classList.add("text-success")
  //    }
  //    if( remaining_char.innerHTML < 0 ){
  //        remaining_char.classList.add("text-danger")
  //    }else{
  //        remaining_char.classList.add("text-success")
  //    }

  var pix_lim = document.querySelector(".recomended-pixels-limit");
  var char_lim = document.querySelector(".recomended-characters-limit");
  pix_lim.classList.add("text-info");
  char_lim.classList.add("text-info");
  if (
    parseInt(pix_length.innerHTML) >
      parseInt(pix_lim.innerHTML.split(",")[0]) &&
    parseInt(pix_length.innerHTML) < parseInt(pix_lim.innerHTML.split(",")[1])
  ) {
    pix_length.classList.add("text-success");
  } else {
    pix_length.classList.add("text-danger");
  }

  if (
    parseInt(char_count.innerHTML) >
      parseInt(char_lim.innerHTML.split(",")[0]) &&
    parseInt(char_count.innerHTML) < parseInt(char_lim.innerHTML.split(",")[1])
  ) {
    char_count.classList.add("text-success");
  } else {
    char_count.classList.add("text-danger");
  }
}
// --- end functions for create_seo_tables

function seo_tag_create() {
  var content_input = document.querySelector("#seo-tag");
  var result_div = document.querySelector("#results");
  var char_count = document.querySelector(".char-count");
  var pix_length = document.querySelector(".pix-length");
  var result_text = document.querySelector("#result-text");
  var canvas = document.createElement("canvas");
  var remaining_char = document.querySelector(".remaining-char");
  var remaining_pix = document.querySelector(".remaining-pix");
  var char_limit = document
    .querySelector(".char-limit")
    .innerHTML.replaceAll(" ", "")
    .split("-");
  var pix_limit = document
    .querySelector(".pix-limit")
    .innerHTML.replaceAll(" ", "")
    .split("-");
  let f = new FontFace("fnt", "url(/arial.ttf)", {});
  f.load().then(function (font) {
    document.fonts.add(font);
  });
  var font_size = 0;
  canvas.height = window.innerHeight;
  canvas.width = window.innerWidth;
  var ctx = canvas.getContext("2d");
  if (content_input.name == "title") {
    font_size = 15;
    ctx.wordSpacing = "0.65px";
  } else {
    font_size = 10.5;
    ctx.wordSpacing = "-0.2px";
  }
  ctx.font = font_size + "pt fnt";
  content_input.addEventListener("keyup", function () {
    result_text.classList.contains("d-none")
      ? result_text.classList.remove("d-none")
      : null;
    result_text.innerHTML = " ";
    var new_content = content_input.value;
    var char_span = document.createElement("div");
    var pixel_span = document.createElement("div");
    var duplicate_span = document.createElement("div");
    // Ready to use the font in a canvas context
    // ctx.letterSpacing = "0.4px";
    var width = ctx.measureText(new_content).width;
    pixel_span.classList.add("alert", "p-2", "m-0");
    char_span.classList.add("alert", "p-2", "m-0");
    duplicate_span.classList.add("alert", "p-2", "m-0");

    remaining_char.innerHTML = char_limit[1] - new_content.length;
    remaining_pix.innerHTML = pix_limit[1] - Math.ceil(width);
    if (remaining_char.innerHTML < 0) {
      remaining_char.style.color = "#dc3545";
    } else {
      remaining_char.style.color = "#198754";
    }

    if (remaining_pix.innerHTML < 0) {
      remaining_pix.style.color = "#dc3545";
    } else {
      remaining_pix.style.color = "#198754";
    }

    if (duplicate_words(new_content)) {
      //            duplicate_span.innerHTML = "Contains duplicate words!";
      //            duplicate_span.classList.add("alert-danger");
      //            result_text.appendChild(duplicate_span);
    }
    if (width < pix_limit[0] || width > pix_limit[1]) {
      pix_length.style.color = "#dc3545";
      //            pixel_span.innerHTML = "Pixel length out of limits!";
      //            pixel_span.classList.add("alert-danger")
    } else {
      pix_length.style.color = "#198754";
      //            pixel_span.innerHTML = "Pixel length is ok!";f
      //            pixel_span.classList.add("alert-success")
    }
    if (
      new_content.length < char_limit[0] ||
      new_content.length > char_limit[1]
    ) {
      //            char_span.innerHTML = "Character count out of limits!";
      char_count.style.color = "#dc3545";
      //            char_span.classList.add("alert-danger")
    } else {
      char_count.style.color = "#198754";
      //            char_span.innerHTML = "Character count is ok!";
      //            char_span.classList.add("alert-success")
    }
    result_text.appendChild(char_span);
    result_text.appendChild(pixel_span);
    pix_length.innerHTML = Math.ceil(width);
    char_count.innerHTML = new_content.length;
    // result_div.appendChild(canvas)
    // ctx.strokeText(new_content, 100,100);
  });
}

function duplicate_words(string) {
  var words_arr = string
    .toLowerCase()
    .replace(/[^\w\s]/gi, "")
    .split(" ");
  var filtered = words_arr.filter(function (el) {
    return el != "";
  });
  var duplicates = filtered.filter(
    (item, index) => filtered.indexOf(item) !== index
  );
  if (duplicates.length == 0) {
    return false;
  } else {
    return true;
  }
}

async function verify_pass() {
  var input_pass = document.querySelector("[name=input-pass]");
  function failure(error) {
    console.log("ERROR: " + error);
  }
  function success(response) {
    if (response === "failed") {
      remove_alert();
      set_alert("Incorect Password!", "danger");
    }
    if (response === "success") {
      var form = document.querySelector("#details-form");
      var sbmt = document.querySelector("[name=change-details");
      var hidden = document.createElement("input");
      hidden.setAttribute("hidden", "hidden");
      hidden.name = "change-details";
      form.appendChild(hidden);
      //            sbmt.click();
      form.submit();
    }
  }
  await fetch("/verify-pass?pass=" + input_pass.value, {})
    .then((res) => res.json())
    .then((response) => success(response))
    .catch((error) => failure(error));
}

function download_file(url, fileName) {
  fetch(url, { method: "get", mode: "no-cors", referrerPolicy: "no-referrer" })
    .then((res) => res.blob())
    .then((res) => {
      const aElement = document.createElement("a");
      aElement.setAttribute("download", fileName);
      const href = URL.createObjectURL(res);
      aElement.href = href;
      aElement.setAttribute("target", "_blank");
      aElement.click();
      URL.revokeObjectURL(href);
    });
}
function set_transitions() {
  elements = document.querySelectorAll(".no-transition");

  elements.forEach(function (elem) {
    elem.classList.remove("no-transition");
  });
}

function toggle_nav() {
  btn = document.querySelector(".navbar-toggler");
  nav = document.querySelector("#navbar_collapse");
  main_nav = $("nav");
  btn.addEventListener("click", function () {
    if (nav.classList.contains("show")) {
      nav.classList.remove("show");
      change_nav_color();
    } else {
      nav.classList.add("show");
      change_nav_color();
    }
  });
}

function toggleLinkList(target) {
  if (
    target.parentElement.children[
      target.parentElement.children.length - 1
    ].classList.contains("d-none")
  ) {
    target.parentElement.children[
      target.parentElement.children.length - 1
    ].classList.remove("d-none");
    target.classList.remove("tree-list-arrow-right");
    target.classList.add("tree-list-arrow-down");
  } else {
    target.classList.remove("tree-list-arrow-down");
    target.classList.add("tree-list-arrow-right");
    target.parentElement.children[
      target.parentElement.children.length - 1
    ].classList.add("d-none");
  }
}

function lazy_load() {
  let images = document.querySelectorAll(".lazy");
  let options = {
    root: null,
    rootMargin: "0px 0px 50px 0px",
    threshold: 0.5,
  };

  let callback = (entries, observer) => {
    entries.forEach((entry) => {
      if (entry.isIntersecting) {
        const img = entry.target;
        if (img.getAttribute("data-srcset")) {
          const src = img.getAttribute("data-srcset");
          img.setAttribute("srcset", src);
          img.classList.remove("lazy");
          img.classList.add("lazy-loaded");
          observer.unobserve(img);
        } else if (img.getAttribute("data-src")) {
          const src = img.getAttribute("data-src");
          img.setAttribute("src", src);
          img.classList.remove("lazy");
          img.classList.add("lazy-loaded");
          observer.unobserve(img);
        }
      }
      // and some other methods
    });
  };

  let observer = new IntersectionObserver(callback, options);
  images.forEach((image) => {
    observer.observe(image);
  });
}

function hex(c) {
  var s = "0123456789abcdef";
  var i = parseInt(c);
  if (i == 0 || isNaN(c)) return "00";
  i = Math.round(Math.min(Math.max(0, i), 255));
  return s.charAt((i - (i % 16)) / 16) + s.charAt(i % 16);
}

/* Convert an RGB triplet to a hex string */
function convertToHex(rgb) {
  return hex(rgb[0]) + hex(rgb[1]) + hex(rgb[2]);
}

/* Remove '#' in color hex string */
function trim(s) {
  return s.charAt(0) == "#" ? s.substring(1, 7) : s;
}

/* Convert a hex string to an RGB triplet */
function convertToRGB(hex) {
  var color = [];
  color[0] = parseInt(trim(hex).substring(0, 2), 16);
  color[1] = parseInt(trim(hex).substring(2, 4), 16);
  color[2] = parseInt(trim(hex).substring(4, 6), 16);
  return color;
}

function generateColor(colorStart, colorEnd, colorCount) {
  // The beginning of your gradient
  var start = convertToRGB(colorStart);
  // The end of your gradient
  var end = convertToRGB(colorEnd);
  // The number of colors to compute
  var len = colorCount;
  //Alpha blending amount
  var alpha = 0.0;
  var saida = [];
  for (i = 0; i < len; i++) {
    var c = [];
    alpha += 1.0 / len;
    c[0] = start[0] * alpha + (1 - alpha) * end[0];
    c[1] = start[1] * alpha + (1 - alpha) * end[1];
    c[2] = start[2] * alpha + (1 - alpha) * end[2];
    saida.push(convertToHex(c));
  }

  return saida;
}

// Usage example

function calculate_element_visibility(elem) {
  const rect = elem.getBoundingClientRect();
  const window_h = window.innerHeight;
  const scroll = window.scrollY;
  //    const elem_pos = elem.offsetTop
  const elem_pos = rect.top + document.documentElement.scrollTop;
  const elem_height = rect.height;

  const hidden_before = scroll - elem_pos;
  const hidden_after = elem_pos + elem_height - (scroll + window_h);

  //    console.log(elem.offsetTop)
  //    console.log(elem_pos)
  //    console.log($("#seo-analyzer-teaser").offsetTop)
  //    console.log("------------")

  if (scroll > elem_pos + elem_height || elem_pos > scroll + window_h) {
    return 0;
  } else {
    //        console.log(elem)
    if (hidden_before > 0) {
      return 100 - (hidden_before * 100) / elem_height;
    }
    if (hidden_after > 0) {
      return 100 - (hidden_after * 100) / elem_height;
    }
  }
}

function report_section_in_viewport() {
  const sections = $(".report-section", true);
  const nav_links = $(".section-li", true);

  sections.forEach(function (section) {
    const percent = calculate_element_visibility(section);
    const active = $(".section-li-in-view");
    if (!active && percent > 0) {
      const link = Array.from(nav_links).find(
        (elem) =>
          section.id.replace("-", " ") ==
          elem.children[0].children[0].innerHTML.toLowerCase()
      );
      link.classList.add("section-li-in-view");
    }
    if (percent >= 35) {
      if (active) {
        active.classList.remove("section-li-in-view");
      }
      const link = Array.from(nav_links).find(
        (elem) =>
          section.id.replace("-", " ") ==
          elem.children[0].children[0].innerHTML.toLowerCase()
      );
      link.classList.add("section-li-in-view");
    }
    //        console.log(section)
    //        console.log(percent)
  });
}

function scroll_more_tools() {
  const btn = $("#page-button");
  if (!btn) {
    return;
  }
  btn.addEventListener("click", function () {
    if (btn.classList.contains("more-tools-button")) {
      $("#more-tools").scrollIntoView();
    } else {
      window.scrollTo(0, 0);
    }
  });
}

function document_scroll() {
  document.addEventListener(
    "scroll",
    function (ev) {
      //        console.log(ev)
      if (!app.is_user_page) {
        change_nav_color();
      }
      //        report_section_in_viewport()
      change_page_button();
    },
    true
  );
}

function change_page_button() {
  const btn = $("#page-button");
  if (!btn) {
    return;
  }
  const more_tools = $("#more-tools");
  const percent = calculate_element_visibility(more_tools);
  if (percent >= 25 || percent == undefined) {
    btn.classList.remove("more-tools-button");
    btn.classList.add("scroll-up-button");
    btn.children[1].classList.remove("d-none");
    btn.children[0].classList.add("d-none");
  } else {
    btn.classList.remove("scroll-up-button");
    btn.classList.add("more-tools-button");
    btn.children[1].classList.add("d-none");
    btn.children[0].classList.remove("d-none");
  }
}

function change_nav_color() {
  const nav = $("nav");
  const rect = nav.getBoundingClientRect();
  const items = $(".navbar-nav a, .navbar-nav span", true);
  //    console.log(window.scrollY)
  var logo = document.querySelector("#logo-link");
  var logoLetters = document.querySelectorAll(".logo-span-colored");

  var nav_menu = $("#navbar_collapse");
  if (nav_menu.classList.contains("show")) {
    if (logo) {
      //logo.classList.add("text-dark")
      logo.classList.add("text-white");
      logo.classList.add("ribbon");
    }

    if (logoLetters) {
      logoLetters.forEach(function (element) {
        element.classList.add("text-white");
        //element.classList.remove("text-white");
      });
    }

    //document.querySelector(".services > a:first-child:after").style.color = "black";
    items.forEach(function (el) {
      el.classList.add("text-dark");
      //el.classList.remove("text-shadoe-class");
    });
    nav.classList.add("nav-bg");

    return true;
  }

  if (window.scrollY > rect.height) {
    if (logo) {
      //logo.classList.add("text-dark")
      logo.classList.add("text-white");
      logo.classList.add("ribbon");
    }

    if (logoLetters) {
      logoLetters.forEach(function (element) {
        element.classList.add("text-white");
        //element.classList.remove("text-white");
      });
    }

    //document.querySelector(".services > a:first-child:after").style.color = "black";
    items.forEach(function (el) {
      el.classList.add("text-dark");
      //el.classList.remove("text-shadoe-class");
    });
    nav.classList.add("nav-bg");
  } else {
    if (logo) {
      logo.classList.remove("text-dark");
      logo.classList.add("text-white");
    }

    if (logoLetters) {
      logoLetters.forEach(function (element) {
        //element.classList.remove("text-dark");
        element.classList.add("text-white");
      });
    }
    items.forEach(function (el) {
      el.classList.remove("text-dark");
      //el.classList.add("text-white");
      //el.classList.add("text-shadoe-class");
    });

    if (logo) {
      logo.classList.add("text-white");
      logo.classList.remove("text-dark");
      logo.classList.remove("ribbon");
    }
    nav.classList.remove("nav-bg");
    //document.querySelector(".services > a:first-child:after").style.color = "white";
  }
}

function landing_report() {
  const btn = $("#landing-report-btn");
  const inpt = $("input[name=website_url]");

  btn.addEventListener("click", function (event) {
    event.preventDefault();
    if (!isValidUrl(inpt.value)) {
      set_alert("Please insert a valid URL", "danger");
      return false;
    }
    start_seo_report(event.target);
    //        console.log("aaa")
  });
}

function toggle_forgot() {
  const btn = $("#forgot-pass-toggler");
  let form = $("#forgot-pass-form");
  btn.addEventListener("click", function () {
    if (form.style.maxHeight == "0px" || form.style.maxHeight == "") {
      form.style.maxHeight = "500px";
    } else {
      form.style.maxHeight = "0";
    }
  });
}

function slide_cards() {
  const cards = $(".service-slider-item", true);
  counter = 0;
  slide_interval = setInterval(function () {
    if (counter >= cards.length - 1) {
      hide_card(counter);
      counter = 0;
      display_card(counter);
    } else {
      hide_card(counter);
      display_card(counter + 1);
      counter++;
    }
  }, 8000);
}
function hide_card(idx) {
  $(".service-slider-item", true)[idx].classList.remove("enter");
  // $(".service-slider-item", true)[idx].classList.add("exit");
  setTimeout(() => {
    // $(".service-slider-item", true)[idx].classList.remove("exit");
  }, 1500);
}

function display_card(idx) {
  $(".service-slider-item", true)[idx].classList.remove("exit");
  $(".service-slider-item", true)[idx].classList.add("enter");
}
function call_index() {
  subscribe();
  slide_cards();
}
function write_seo_title() {
  seo_tag_create();
}
function write_seo_description() {
  seo_tag_create();
}
function ocr() {
  clear_storage();
  check_file_upload();
}
function image_to_pdf() {
  clear_storage();
  check_file_upload();
  //    swap_images();
}

function split_pdf() {
  check_file_upload();
  clear_storage();
  toggle_sm_menu();
  load_pdfjs();
  toggle_help();
  btn = document.querySelector("#toggle-pdf-list");

  btn.addEventListener("click", function () {
    list = document.querySelector(".pdf-list");
    list.parentElement.classList.contains("d-none")
      ? list.parentElement.classList.remove("d-none")
      : list.parentElement.classList.add("d-none");
    list.parentElement.parentElement.classList.contains("d-none")
      ? list.parentElement.parentElement.classList.remove("d-none")
      : list.parentElement.parentElement.classList.add("d-none");
  });
}
function pdf_add_watermark() {
  check_file_upload();
  clear_storage();
  load_pdfjs();
  add_position_events();
  toggle_sm_menu();
  pdf_watermark_menu();
  toggle_help();
}

function merge_pdf() {
  load_pdfjs();
  check_file_upload();
  clear_storage();
}
function swap_pdf_pages() {
  load_pdfjs();
  check_file_upload();
  clear_storage();
}
function pdf_to_image() {
  clear_storage();
  check_file_upload();
  var zip_files = document.querySelector("#zip-files");
  zip_inpt = document.querySelector("#download_type");
  zip_inpt.addEventListener("click", function () {
    if (this.checked) {
      this.checked = false;
      this.value = "link";
    } else {
      this.checked = true;
      this.value = "zip";
    }
  });
  zip_files ? zip_files.addEventListener("click", _handleZipFiles) : null;
  function _handleZipFiles() {
    inpt = this.querySelector("input");
    if (inpt.checked) {
      inpt.checked = false;
      inpt.value = "link";
    } else {
      inpt.checked = true;
      inpt.value = "zip";
    }
  }
}

function keyword_density() {
  source_select();
  include_on_click();
  density_on_key();
  uncheck_method();
  check_file_upload();
}

function seo_title_checker() {}
function seo_description_desc() {}
function sitemap_broken_links() {
  sitemap_redirect_check();
  set_progress_token();
  handle_sitemap_home_redirect();
}
function seo_sitemap_checker() {
  set_progress_token();
  handle_sitemap_home_redirect();
}

function tool_sitemap_generator() {
  set_progress_token();
  update_connection_status();
  clear_storage();
  handle_sitemap_home_redirect();
}
function seo_robots_checker() {}
function seo_heading_checker() {}
function broken_links_checker() {
  set_progress_token();
  update_connection_status();
}
function check_http_header() {
  set_progress_token();
}
function domain_age_checker() {
  set_progress_token();
}

function website_tree_structure() {
  set_progress_token();
  update_connection_status();
}

function seo_report() {
  // toggle_report_info();
  set_progress_token();
  (function () {
    var requestAnimationFrame =
      window.requestAnimationFrame ||
      window.mozRequestAnimationFrame ||
      window.webkitRequestAnimationFrame ||
      window.msRequestAnimationFrame;
    window.requestAnimationFrame = requestAnimationFrame;
  })();
}

function user_login() {
  toggle_forgot();
}

function sitemap_monitor() {}

function sitemap_generator() {
  const btn = $(".sm-landing-button");
  if (btn) {
    btn.addEventListener("click", function (ev) {
      if (app.is_logged) {
        window.location.href = "/dashboard?action=sitemap-generator";
      } else {
        window.location.href = "/user-login";
      }
    });
  }
}

function call() {
  var loc = location.href.split("/").slice(3);

  let fname = false;
  let is_tool = false;
  if (loc[0] == "tools") {
    loc.shift();
    is_tool = true;
  }

  if (loc.length >= 1) {
    fname = loc[0].replaceAll("-", "_");
    if (fname.indexOf("?") !== -1) {
      fname = fname.substring(0, fname.indexOf("?"));
    }
    if (fname == "seo_report" && loc.length > 1) {
      fname += "_page";
    }
  }

  if (fname == "") {
    call_index();
  }

  if (fname == "sitemap_generator") {
    if (is_tool) {
      tool_sitemap_generator();
    } else {
      sitemap_generator();
    }
  } else {
    if (fname && typeof window[fname] === "function") {
      window[fname]();
    }
  }
}

//calling global functions
if (app.conversion_type !== null) {
  //    display_allowed_types();
  app.input_accept();
}

call();
app.init();

active_link();
set_transitions();
toggle_nav();
lazy_load();
scroll_more_tools();
document_scroll();