WME HN Highlighter

A House Number script that highlights the native HN from white in yellow colour.
Wrap lines
// ==UserScript==
// @name          WME HN Highlighter
// @description   A House Number script that highlights the native HN from white in yellow colour.  
// @namespace     https://greasyfork.org/users/1087400-kid4rm90s
// @version       2025.01.30.02
// @include       /^https:\/\/(www|beta)\.waze\.com\/(?!user\/)(.{2,6}\/)?editor\/?.*$/
// @author        kid4rm90s
// @license       MIT
// @grant         GM_addStyle
// @require       https://greasyfork.org/scripts/24851-wazewrap/code/WazeWrap.js
// ==/UserScript==

/* global W */
/* global WazeWrap */

(function main() {
  "use strict";

  const scriptName = GM_info.script.name;
  const { version } = GM_info.script;

  console.log(`${scriptName}: Loading `);

  // Display change log immediately as it has no dependencies on waze itself.
  const changeLog = [
    { version: "1.0", message: "Initial Version" },
    { version: "1.1", message: "Removed unneccessary lines" },	
    { version: "2025.01.29.02", message: "Removed unneccessary lines" },
    { version: "2025.01.30.01", message: "Added colour for input-wrapper" },	
  ];

  async function checkVersion() {
    if (!WazeWrap?.Ready && !WazeWrap?.Interface?.ShowScriptUpdate) {
      setTimeout(checkVersion, 200);
      return;
    }

    const versionKey = `${scriptName.replace(/\s/g, "")}Version`;
    const previousVersion = window.localStorage.getItem(versionKey);

    if (previousVersion === version) {
      return;
    }

    let announcement = "";
    let startIndex = 0;

    // Find the index of the previous version in the change log
    if (previousVersion) {
      startIndex = changeLog.findIndex(log => log.version === previousVersion);
      if (startIndex === -1) {
        startIndex = 0; // If not found, start from the beginning
      }
    }
    announcement += "<ul>";
    // Build the announcement message from the change log
    for (let i = startIndex + 1; i < changeLog.length; i++) {
      const msg = `<li> V${changeLog[i].version}: ${changeLog[i].message} </li>\n`;
      announcement += msg;
    }
    announcement += "</ul>";

    console.group(`${scriptName} v${version} changelog:`);
    changeLog.slice(startIndex + 1).forEach(log => console.log(`V${log.version}: ${log.message}`));
    console.groupEnd();
    const title = startIndex > 0 ? `V${changeLog[startIndex].version} -> V${version}` : `Welcome to HNH V${version}`;
    console.log("ShwowScriptUpdate", scriptName, title, announcement);
    WazeWrap.Interface.ShowScriptUpdate(
      scriptName,
      title,
      announcement,
      "https://greasyfork.org/en/scripts//525203",
    );
    window.localStorage.setItem(versionKey, version);
  }
  checkVersion();

  // Initialize RHN once Waze has been loaded.
  function initialize() {
    console.log(`${scriptName} initializing.`);
  }
  
function applyStyles() {
        document.querySelectorAll('.house-number-marker').forEach(marker => {
            marker.style.backgroundColor = '#FFFF00'; // Yellow
        });

        document.querySelectorAll('.house-numbers-layer .house-number .content .input-wrapper input')
            .forEach(input => {
                input.style.backgroundColor = '#07ff00'; // Bright Green 
            });
    }

    // Observe DOM changes to apply styles dynamically
    const observer = new MutationObserver(applyStyles);
    observer.observe(document.body, { childList: true, subtree: true });

    // Initial call to apply styles if elements already exist
    applyStyles();

    // Apply styles using GM_addStyle for better enforcement
    GM_addStyle(`
        .house-number-marker {
            background-color: #FFFF00 !important; /* Change to yellow */
        }
        .house-numbers-layer .house-number .content .input-wrapper input {
            background-color: #07ff00 !important; /* Bright Green */
        }
    `);

    console.log(`${scriptName} initialized.`); 
	
})();