import { modalNotifier } from "./evts.js";

const demoarticles = {
  "0e15747bc12f43108fcfe6379a7614b1": {
    Anstellungsart: "unknown",
    Alter: "13. Februar 2023",
    Titel: "Sozialarbeiter*in Intake + Springer*in, 60–80 %",
    Firma: "Stadt Zürich Soziale Dienste",
    id: "0e15747bc12f43108fcfe6379a7614b1",
    siId: "43667",
    href: "/sd/de/index/ueber_das_departement/arbeiten_sd/offene_stellen_sd/job-detailseite.43667.html",
    lnk: "https://www.stadt-zuerich.ch/sd/de/index/ueber_das_departement/arbeiten_sd/offene_stellen_sd/job-detailseite.43667.html",
    content: {
      Ort: " \n                        Für das Intake im Sozialzentrum Helvetiaplatz",
      Antritt: "1. April 2023",
      Beschreibung:
        "Ihre Aufgaben\n\nSie klären umfassend die Anliegen der Klientinnen und Klienten ab.Sie bieten kurzfristige finanzielle Unterstützung mit dem Ziel der beruflichen und sozialen Integration.Sie sind zuständig für die Triage, Vernetzung und Koordination und leiten Sofortmassnahmen in den Bereichen Sozialhilfe und Krisenintervention ein.Sie arbeiten mit Quartierteams, Fachstellen, Behörden und Sozialversicherungen zusammen.Sie werden von Sachbearbeitenden administrativ unterstützt, können auf das Wissen von internen Fachstellen zurückgreifen und arbeiten eng mit Ihren Kolleginnen und Kollegen im Team zusammen.\n\n\nSie bringen mit\n\n\nWir bieten Ihnen\n\n\nInteressiert?\n\n",
      Anmelden:
        "https://career2.successfactors.eu/career?company=STZH&career_ns=job_application&career_job_req_id=35956&jobPipeline=eGovSTZH_%2Fsd%2Fde%2Findex%2Fueber_das_departement%2Farbeiten_sd%2Foffene_stellen_sd",
      Kontaktperson: "none",
    },
  },
  d3fe59f9f882ee789ee139c733ed1d2b: {
    Anstellungsart: "unknown",
    Alter: "13. Februar 2023",
    Titel:
      "Fachhochschulpraktikant*in Soziale Arbeit im Schreibdienst, 60–80 %",
    Firma: "Stadt Zürich Soziale Dienste",
    id: "d3fe59f9f882ee789ee139c733ed1d2b",
    siId: "43632",
    href: "/sd/de/index/ueber_das_departement/arbeiten_sd/offene_stellen_sd/job-detailseite.43632.html",
    lnk: "https://www.stadt-zuerich.ch/sd/de/index/ueber_das_departement/arbeiten_sd/offene_stellen_sd/job-detailseite.43632.html",
    content: {
      Ort: " \n                        Für ein Erstpraktikum",
      Antritt: "15. August 2023",
      Beschreibung:
        "Ihre Aufgaben\n\nAls Teil des Schreibdienst Teams arbeiten Sie im Rahmen des Schreibbüros am Empfang, übernehmen den Telefondienst und bei Bedarf Kurzberatungen.Sie unterstützen die Klient*innen beim Verfassen von Bewerbungsunterlagen, einfacher Korrespondenz und Ausfüllen von Formularen und anderen Schriftstücke. Sie bieten Hilfe beim Verstehen von amtlichen und anderen Dokumenten.Sie bieten lösungsorientierte Kurzberatungen mit Schwerpunkt Wohnungssuche an.Sie erhalten Einblick in die Freiwilligenbetreuung und arbeiten mit bei niederschwelligen Informations- und Bildungsveranstaltungen.Sie nehmen an Arbeitssitzungen, Teamsitzungen und Supervision teil.\n\n\nSie bringen mit\n\n\nWir bieten Ihnen\n\n\nInteressiert?\n\n",
      Anmelden:
        "https://career2.successfactors.eu/career?company=STZH&career_ns=job_application&career_job_req_id=35922&jobPipeline=eGovSTZH_%2Fsd%2Fde%2Findex%2Fueber_das_departement%2Farbeiten_sd%2Foffene_stellen_sd",
      Kontaktperson: "none",
    },
  },
};

const articleSelection = ["Alter", "Anstellungsart", "Titel", "Firma", "lnk"];

export default function parseArticles(articles) {
  modalNotifier('!done');
  //articles = demoarticles;

  let outputElement = document.getElementById("output");
  outputElement.innerHTML = "";
  let divWrapper = document.createElement("div");
  divWrapper.classList.add("w3-responsive", "w3-row");

  let articleArray = articleSort(articles, 'byNumber');

  //console.log(articleArray);

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

    let article = articleArray[i]

    let div = document.createElement("div");
    div.classList.add("w3-half", "w3-container", "w3-padding");
    div.setAttribute("data-siId", article['siId']);
    div.setAttribute("data-lnk", article['lnk']);
    let card = document.createElement("div");
    card.classList.add("w3-card-4", "w3-hover-flat-concrete");

    let header = document.createElement("header");
    header.classList.add("w3-container");
    let title = document.createElement("h4");
    title.innerText = article['Titel'];

    header.appendChild(title);

    let content = document.createElement("div");
    content.classList.add("w3-container");

    let p = document.createElement('p');
    p.innerText = article['Adresse'];

    content.appendChild(p);

    let footer = document.createElement("footer");
    footer.classList.add("w3-container");
    p = document.createElement('p');
    p.innerText = `${article['Zimmer']} | ${article['Preis']}`;
    footer.appendChild(p);

    let imgDiv = document.createElement('div');
    imgDiv.id = 'img'+article['siId'];

    if (article['imgUrl'] != 'none') {
      let img = document.createElement('img');
      img.src = article['imgUrl'];
      img.style.width = '100%';
      imgDiv.appendChild(img);
    }

    card.appendChild(header);
    card.appendChild(imgDiv);
    card.appendChild(content);
    card.appendChild(footer);

    let a = document.createElement("a");
    a.setAttribute("href", article['lnk']);
    a.target = "_blank";
    a.appendChild(card)
    div.appendChild(a);

    divWrapper.appendChild(div);

  }
  outputElement.appendChild(divWrapper);

  //lauch Picture Getter
  getPictures(divWrapper);
}

function articleSort(articles, mode = 'byNumber') {
  let sortArray = [];
  switch(mode) {
    case 'byNumber':
      for (let id in articles) {
        let number = articles[id]['number'];
        sortArray.push({[number]: articles[id]})
      }
      sortArray = sortArray.sort((a,b) => a[Object.keys(a)[0]]['number'] - b[Object.keys(b)[0]]['number']);
      let dateSortArray = [];
      for (let sortId in sortArray) {
        let objName = Object.keys(sortArray[sortId])[0]
        dateSortArray.push(sortArray[sortId][objName]);
      }
      articles = dateSortArray;
      break;  
    case 'byPlace':
      break;
    case 'byKind':
      break;
  }
  return articles
}

function getPictures(container) {
  const currentPage = window.activeState['currentPage'];
  for (let i = 0; i < container.children.length; i++) {
    let article = container.children[i];
    let lnk = article.dataset.lnk;
    let siId = article.dataset.siid;

    if (currentPage != window.activeState['currentPage']) return;
    
    let reqUrl = "php/index.php/content/siId="+ siId +"/href="+ lnk;
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function () {
      if (this.readyState == 4 && this.status == 200) {
        let resp = JSON.parse(this.responseText);
        if (!resp) {
          console.log(reqUrl);
          return;
        }
        let imgDiv = document.getElementById('img'+siId);
        if (imgDiv == null) return;
        imgDiv.innerHTML = '';
        let img = document.createElement('img');
        img.src = resp['imgUrl'];
        img.style.width = '100%';
        imgDiv.appendChild(img);
        
      }
    };
    xhttp.open("GET", reqUrl, true);
    xhttp.send();
  }
}