Cuandollega

Agrega boton de favoritos a cuando llega
Wrap lines
// ==UserScript==
//
// @name         Cuandollega
// @license      MIT
// @namespace    http://mardelplata.gob.ar
// @version      2024-03-01
// @description  Agrega boton de favoritos a cuando llega
// @author       You
// @match        https://appsl.mardelplata.gob.ar/app_cuando_llega/cuando.php
// @icon         https://www.google.com/s2/favicons?sz=64&domain=gob.ar
// @grant        none
// @run-at       document-idle
// ==/UserScript==

(function () {
  "use strict"

  var trashIcon = `<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg width="20px" height="20px" viewBox="0 0 16 16" fill="red" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 8L6 2H16V14H6L0 8ZM6.79289 6.20711L8.58579 8L6.79289 9.79289L8.20711 11.2071L10 9.41421L11.7929 11.2071L13.2071 9.79289L11.4142 8L13.2071 6.20711L11.7929 4.79289L10 6.58579L8.20711 4.79289L6.79289 6.20711Z" fill="#000000"/>
</svg>`

  //Form elements
  const linea = document.querySelector("#Slineas")
  const calle = document.querySelector("#ScallesInt")
  const interseccion = document.querySelector("#ScallesPrinc")
  const parada = document.querySelector("#Sparadas")
  const queryBtn = document.querySelector('#a_actualizar')

  const container = document.querySelector("div.container")
  const containerToCorrect = document.querySelector(".containe-fluid")
  const footer = document.querySelector("footer")

  const divFormGroupNode = document.createElement("div")
  const anchorBtnToggleNode = document.createElement("a")
  const ulNode = document.createElement("ul")
  const divBtnGroupNode = document.createElement('div')
  const buttonSaveNode = document.createElement("button");

  // getting rid of the useless instrucctions dropdown
  document.querySelector("#fader").remove()
  document.querySelector("#fade").remove()
  document.querySelector(".header").after(containerToCorrect)

  // correct the placement of nodes in the DOM
  containerToCorrect.classList = "container-fluid"
  containerToCorrect.after(footer)

  ulNode.classList = "list-group collapse"
  ulNode.id = "collapsable"
  anchorBtnToggleNode.classList = "btn btn-success collapsed"
  anchorBtnToggleNode.setAttribute("href", "#collapsable")
  anchorBtnToggleNode.setAttribute("data-toggle", "collapse")
  anchorBtnToggleNode.innerText = "Favoritos ▼"
  //TODO: close list group on focus lost
  anchorBtnToggleNode.addEventListener("onblur", () => anchorBtnToggleNode.classList.add("collapsed"))

  buttonSaveNode.innerHTML = "⭐"
  buttonSaveNode.classList = "btn btn-info";

  //TODO: Disable the saveButton depending on the context
  // if (
  // 	Slineas.value === "-1" ||
  // 	Slineas.value === "" ||
  // 	ScallesPrinc.value === "-1" ||
  // 	ScallesPrinc.value === "" ||
  // 	ScallesInt.value === "-1" ||
  // 	ScallesInt.value === ""
  // ) {
  // 	favBtn.setAttribute('disabled', "")
  // } else {
  // 	favBtn.removeAttribute('disabled')
  // }


  divFormGroupNode.classList = "form-group"
  divFormGroupNode.append(anchorBtnToggleNode)
  container.prepend(divFormGroupNode, ulNode)
  divBtnGroupNode.classList = "btn-group container-fluid"

  buttonSaveNode.addEventListener("click", () => {
    localStorage.setItem(localStorage.length, JSON.stringify({
      bus: { bus: linea.options[linea.selectedIndex].text, value: linea.value },
      mainST: { street: interseccion.options[interseccion.selectedIndex].text, value: interseccion.value },
      intersection: { street: calle.options[calle.selectedIndex].text, value: calle.value },
      stop: { stop: parada.options[parada.selectedIndex].text, value: parada.value }
    }))
    loadFavorites()
  });

  divBtnGroupNode.appendChild(queryBtn)
  divBtnGroupNode.appendChild(buttonSaveNode)
  container.appendChild(divBtnGroupNode);

  loadFavorites();

  function loadFavorites() {
    ulNode.textContent = ''
    for (let i = 0; i < localStorage.length; i++) {
      const element = JSON.parse(localStorage[localStorage.key(i)]);

      let liNode = document.createElement("li");
      let text = document.createElement("div");

      // text.innerHTML = localStorage.key(i);
      text.addEventListener("click", async () => {
        getBus(element.bus.value, element.stop.value)
      });

      let delBtn = document.createElement("div")
      // delBtn.classList = "btn btn-danger"
      delBtn.innerHTML = trashIcon
      delBtn.addEventListener("click", (event) => {
        event.stopPropagation();
        localStorage.removeItem(localStorage.key(i))
        loadFavorites()
      })
      delBtn.addEventListener('mouseover', () => {
        delBtn.style.outline = 'red'
      })
      liNode.classList = "list-group-item list-group-item-action"
      liNode.style.display = "flex"
      liNode.style.justifyContent = "space-between"

      text.textContent = `${element.bus.bus} -> ${element.stop.stop}`
      text.style.cursor = 'pointer'
      liNode.appendChild(text)
      liNode.appendChild(delBtn)
      // liNode.insertAdjacentElement("beforeend", delBtn)
      ulNode.appendChild(liNode);
    }

    if (ulNode.childElementCount == 0) {
      ulNode.insertAdjacentHTML('beforeend', "<li class='list-group-item'>No hay favoritos</li>")
    }
  }

  async function getBus(codigoLineaParada = 110, identificadorParada = P2417,) {
    let x = await fetch("https://appsl.mardelplata.gob.ar/app_cuando_llega/webWS.php", {
      "credentials": "include",
      "headers": {
        "User-Agent": "Mozilla/5.0 (X11; Linux x86_64; rv:135.0) Gecko/20100101 Firefox/135.0",
        "Accept": "application/json, text/javascript, */*; q=0.01",
        "Accept-Language": "en-US,en;q=0.7,es-AR;q=0.3",
        "Content-Type": "application/x-www-form-urlencoded; charset=UTF-8",
        "X-Requested-With": "XMLHttpRequest",
        "Sec-Fetch-Dest": "empty",
        "Sec-Fetch-Mode": "cors",
        "Sec-Fetch-Site": "same-origin",
        "Sec-GPC": "1",
        "Priority": "u=0",
        "Pragma": "no-cache",
        "Cache-Control": "no-cache"
      },
      "referrer": "https://appsl.mardelplata.gob.ar/app_cuando_llega/cuando.php",
      "body": `accion=RecuperarProximosArribosW&identificadorParada=${identificadorParada}&codigoLineaParada=${codigoLineaParada}`,
      "method": "POST",
      "mode": "cors"
    })

    x.json().then(y => {
      var table = document.querySelector("#t_arribo")
      table.textContent = ''
      console.log(y)
      if (y.CodigoEstado === -1) {
        $.confirm({
          content: y.MensajeEstado,
          title: false,
          type: "red",
          backgroundDismiss: true,
          buttons: {
            Aceptar: {
              btnClass: 'btn-danger',
              action: function () {
              }
            }
          }
        })
        return
      }
      for (var i = 0; i < y.arribos.length; i++) {

        var tableRow = document.createElement('tr')
        var ramal = document.createElement('td')
        var arribo = document.createElement('td')

        ramal.textContent = y.arribos[i].DescripcionBandera
        arribo.textContent = y.arribos[i].Arribo


        tableRow.appendChild(ramal)
        tableRow.appendChild(arribo)

        table.appendChild(tableRow)
      }
      table.parentNode.classList.add('mostrarTabla')
    })
  }



})();
欢迎访问Greasy Fork镜像
