// ==UserScript==
// @name        Fill out usps scheduled pickup
// @namespace   Violentmonkey Scripts
// @match       https://tools.usps.com/schedule-pickup-steps.htm*
// @grant       none
// @version     1.0
// @author      tjkeller.xyz
// @description 2/11/2024, 7:23:34 PM
// ==/UserScript==

/* First page config */
const fill = {
  emailAddress: "youremail@example.com",
  phoneNumber: "777-777-7777",
  zipCode: "60606",
  state: "IL",
  city: "CHICAGO",
  addressLineOne: "701 My Lovely Home St.",
  lastName: "Smith",
  firstName: "John"
}

/* Misc config */
const packageLocationFill = "Porch"

/* Fill funcs */
function fillInitialFields() {
  for (let fieldName in fill)
    document.getElementById(fieldName).value = fill[fieldName]
}

function fillDogField() {
  const f = document.querySelector("#second-radio-verification[name=isDogHere]")
  f.checked = true
  return f
}

function fillPackageLocation() {
  const f = document.getElementById("packageLocation")
  f.value = packageLocationFill
  return f
}

function fillPickupTime() {
  const f = document.getElementById("pickup-regular-time")
  f.click()
  return f
}

function fillPickupDate() {
  const f = document.querySelector("#schedule-pickup-cal td:not(.ui-datepicker-unselectable)") // Gets first date that is selectable
  f.click()
  return f
}

function fillTerms() {
  const f = document.querySelector(".termsConditions")
  f.checked = true
  return f
}

function fillHazmat() {
  const f = document.querySelector("#hazmat-no")
  f.checked = true
  return f
}

function scrollToDetails() {
  document.getElementById("quantityCheck").scrollIntoView()
}

function showPickupDateInStepFour(pickupDateTD) {
  const month = parseInt(pickupDateTD.dataset.month) + 1
  const year  = pickupDateTD.dataset.year
  const day   = pickupDateTD.firstElementChild.innerText

  const date = `${month}-${day}-${year}`

  const dateElement = document.createElement("div")
  dateElement.class = "step-four-top-header"
  dateElement.innerHTML =  `<p class="step-four-row-header"></p>`
  dateElement.innerHTML += `<p class="step-four-row-header" style="font-weight:bold;">Date of Pickup: ${date}</p>`

  const container = document.querySelector("div.pickup-summary-gray-box-wrapper div")
  const sibiling = container.querySelector("div.step-four-top-header")
  container.insertBefore(dateElement, sibiling)
  return dateElement
}

/* Start */
fillInitialFields()

document.querySelector("#webToolsAddressCheck").addEventListener("click", () => {
  const magicChange = new Event("change")

  fillDogField()       .dispatchEvent(magicChange)
  fillPackageLocation().dispatchEvent(magicChange)

  fillPickupTime() // Works through click

  setTimeout(() => {
    showPickupDateInStepFour(fillPickupDate()) // Need to wait for this (calendar) to load in first since it's loaded dynamically
    fillHazmat()
    fillTerms()
    scrollToDetails()
  }, 750)
})