Greasy Fork is available in English.

lucianjp-library

Core library to handle webpages dom with userscripts

Fra og med 27.04.2023. Se den nyeste version.

Dette script bør ikke installeres direkte. Det er et bibliotek, som andre scripts kan inkludere med metadirektivet // @require https://update.greasyfork.org/scripts/464986/1182343/lucianjp-library.js

// ==UserScript==
// @name        lucianjp-library
// @namespace   lucianjp
// @version     1.0.0
// @author      lucianjp
// @grant       GM_addStyle
// @description Core library to handle webpages dom with userscripts
// ==/UserScript==

class LucianJP_Menu {
  constructor() {
    this.menuContainer = null;
    this.isActive = false;
  }

  createMenuContainer() {
    this.menuContainer = document.createElement('div');
    this.menuContainer.classList.add('lucianjp-menu');
    document.body.appendChild(this.menuContainer);

    // Handle shift keypress to show/hide the menu
    document.addEventListener('keydown', (event) => {
      if (event.key === 'Shift') {
        this.toggleMenu();
      }
    });
  }

  addMenuItem(text, onClick) {
    if (typeof onClick !== 'function') {
      console.error('LucianJP_Menu.addMenuItem(): onClick argument must be a function.');
      return;
    }

    const menuItem = document.createElement('div');
    menuItem.innerText = text;
    menuItem.classList.add('lucianjp-menu-item');
    menuItem.addEventListener('click', onClick);
    if (this.menuContainer == null) {
      this.createMenuContainer();
    }
    this.menuContainer.appendChild(menuItem);
  }

  toggleMenu() {
    if (!this.menuContainer) {
      this.createMenuContainer();
    }
    this.isActive = !this.isActive;
    this.menuContainer.classList.toggle('lucianjp-menu-close', !this.isActive);
  }
}

const lucianjp = {
  observe: (t, cb, once = false) => {
    let complete = true;

    const disconnectHandler = VM.observe(document, () => {
      if (!complete) return true;
      complete = false;
      const node = document.querySelector(t);

      if (node) {
        cb(node);
        return true;
      }

      complete = true;
    });
    if (once) ready(disconnectHandler);
  },
  ready: callback => {
    if (document.readyState != "loading") callback();
    else document.addEventListener("DOMContentLoaded", callback);
  },

  menu: new LucianJP_Menu()
}

// Add styles
GM_addStyle(`
  .lucianjp-menu {
    position: fixed;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
    transition: transform 0.3s ease-in-out;
  }

  .lucianjp-menu-close {
    transform: translateX(calc(100% - 20px)) translateY(-50%);
  }

  .lucianjp-menu-item {
    padding: 8px 16px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    color: #fff;
    background: #007aff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    margin: 8px 0;
  }

  .lucianjp-menu-item:hover {
    background: #0066cc;
  }
`);