Ozbargains Tampermonkey Script v0.1

// ==UserScript==
// @name         Ozbargains Live helper
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Keep track of what you last viewed on ozbargains
// @author       T. Coleman
// @match        https://www.ozbargain.com.au/live
// @icon         https://www.google.com/s2/favicons?sz=64&domain=atomicobject.com
// @grant        GM_addStyle
// ==/UserScript==

// Copyright 2024 T. Coleman

// Permission is hereby granted, free of charge, to any person obtaining a copy of this software and
// associated documentation files (the “Software”), to deal in the Software without restriction,
// including without limitation the rights to use, copy, modify, merge, publish, distribute,
// sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:

// The above copyright notice and this permission notice shall be included in all copies or
// substantial portions of the Software.

// THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT
// NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
// NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

const resetTimeoutDelay = 5 * 60 * 1000; // 5 minute auto reset time
const controlBarID = "checks";

(function() {
    'use strict';

    const inlineCSS =
`table#livetable tr.bookmark td:nth-child(2) {
    width: 100%;
    height: 10px;
}
#livetable tr.bookmark td:nth-child(1) {
    display: none;
}
tr.bookmark td {
    background-color: #d6ffd6;
}

.templatecontainer {
    display: contents;
}

.customButton {
    background-color: #d6ffd6;
    border: 1px solid #72f172;
    padding: 5px;
    user-select: none;
}

.customButton:hover {
        background-color: #afffd2;
}

.customButton.paused {
        background-color: #A5FFA5;
}

.customButton.paused:hover {
        background-color: #89FF89;
}



.hidden {
    display: none;
}

.customButton:hover {
    background-color: #afffd2;
}

`;

  const controlsTemplate =
`<li>
  <div id="BookmarkPause" class="customButton">Pause</div>
</li>
<li>
  <div id="BookmarkReset" class="customButton">Reset</div>
</li>
`;


  const resetBtnId = "BookmarkReset";
  const pauseBtnId = "BookmarkPause";

  GM_addStyle(inlineCSS);

  // inject controls html
  const ctrlBar = document.getElementById(controlBarID);

  ctrlBar && (ctrlBar.innerHTML += controlsTemplate);

  const resetBtn = document.getElementById(resetBtnId);
  const pauseBtn = document.getElementById(pauseBtnId);

  const dragDrop = function(ev) {
    // console.log("drag ended");
    ev.stopPropagation();
    if (drgSrc) {
      this.after(drgSrc);
      drgSrc = undefined;
    }
  }

  const dragOver = function(ev) {
    ev.preventDefault();
  }

  const dragStart = function(ev) {
    ev.dataTransfer.effectAllowed = "move";
    drgSrc = this;

    const rows = document.querySelectorAll("table#livetable tbody tr.type-deal");
    // console.log(`Drag started: Found ${rows.length} rows`);
    for (const r of rows) {
      r.ondrop = dragDrop;
      r.ondragover = dragOver;
    }
  }

  const dragEnter = function(ev) {

  }

  const injectRow = function() {
    const tbody = document.querySelector("table#livetable tbody");

    const newbar = document.createElement("tr");
    const cell1 = document.createElement("td");
    const cell2 = document.createElement("td");
    cell2.setAttribute("colspan","5");

    newbar.classList.add("bookmark");
    newbar.appendChild(cell1);
    newbar.appendChild(cell2);
    newbar.setAttribute("draggable","true");
    newbar.ondragstart = dragStart;
    tbody.prepend(newbar);

    return newbar;
  }

  let schedReset = undefined;
  let paused = false;
  let drgSrc = undefined;

  const removeMarkersExcept = function(except) {
    const tbody = document.querySelector("table#livetable tbody");
    const markers = tbody.querySelectorAll("tr.bookmark");

    markers.forEach(e => e === except || tbody.removeChild(e));
  }

  let pendRow = undefined;


  const activateReset = function() {
    removeMarkersExcept(pendRow);
    pendRow.classList.remove("hidden");
    pendRow = undefined;
    schedReset = undefined;
  }

  const manualReset = function() {
    if (!pendRow) pendRow = injectRow();
    activateReset();
  }


  const scheduleReset = function() {
    pendRow = injectRow();
    pendRow.classList.add("hidden");

    schedReset = setTimeout(activateReset,resetTimeoutDelay)
  }

  const cancelReset = function() {
    if (schedReset != undefined) {
      clearTimeout(schedReset);
      schedReset = undefined;
      pendRow?.parentElement?.removeChild(pendRow);
      pendRow = undefined;
    }

  }

  const togglePause = function() {
    paused = !paused;

    if (paused) {
      pauseBtn?.classList.add("paused");
      cancelReset();
    }

    if (!paused) {
      pauseBtn?.classList.remove("paused");
    }
  }



  // const style = document.createElement("style");
  // style.setAttribute("type","text/css");
  // style.innerText=inlineCSS;
  // document.head.appendChild(style);

  document.addEventListener("blur",scheduleReset);
  document.addEventListener("focus", cancelReset);

  resetBtn?.addEventListener("click", manualReset);

  pauseBtn?.addEventListener("click", togglePause);

})();