longkenj / voz Show/Hide All Images

// ==UserScript==
// @name        voz Show/Hide All Images
// @namespace   english
// @description  voz Show or Hide All Images
// @include     http*://*voz.vn*
// @version     1.2.2
// @run-at document-end
// @copyright 2021, LongKenj (https://voz.vn/u/longkenj.1528130/)
// @license MIT
// @icon https://voz.vn/styles/next/xenforo/voz-logo.png
// @homepageURL https://voz.vn/
// @supportURL https://voz.vn/u/longkenj.1528130/
// @grant       longkenj
// @updateURL https://openuserjs.org/meta/longkenj/voz_ShowHide_All_Images.meta.js
// @downloadURL https://openuserjs.org/install/longkenj/voz_ShowHide_All_Images.user.js
// ==/UserScript==

// Local Storage - "1" : SHOW | "0" : HIDE
var option_show = localStorage.getItem("show");
if (localStorage.getItem("show") == null) {
  option_show = localStorage.setItem("show", "1");
}
else {
  option_show = localStorage.getItem("show");
}

console.log(option_show);

// 1. Create the button
var button = document.createElement("button");
button.innerHTML = "Hide images";

// 2. Append somewhere
var buttonGroup = document.getElementsByClassName("p-navgroup p-discovery")[0];
buttonGroup.appendChild(button);

// 3. Add event handler
button.addEventListener("click", toggle);

// 4. Add Hotkey Ctrl + Delete to Show / Hide
function doc_keyUp(e) {
  if (e.ctrlKey && e.keyCode == 46) {
    toggle();
  }
}
document.addEventListener("keyup", doc_keyUp, false);

// SHOW
function ShowImage() {
  var NodeObject = document.querySelectorAll(".bbImageWrapper");
  var NodeObjectVid = document.querySelectorAll(".bbMediaWrapper");
  var NodeObjectAva = document.querySelectorAll(".message-avatar");
  var NodeObjectImg = document.querySelectorAll("img");

  NodeObject.forEach(function (item) {
    item.style.display = "block";
  });

  NodeObjectVid.forEach(function (item) {
    item.style.display = "block";
  });

  NodeObjectAva.forEach(function (item) {
    item.style.display = "block";
  });

  NodeObjectImg.forEach(function (item) {
    item.style.display = "block";
  });

  button.innerHTML = "Hide images";
}

// HIDE
function HideImage() {
  var NodeObject = document.querySelectorAll(".bbImageWrapper");
  var NodeObjectVid = document.querySelectorAll(".bbMediaWrapper");
  var NodeObjectAva = document.querySelectorAll(".message-avatar");
  var NodeObjectImg = document.querySelectorAll("img");

  NodeObject.forEach(function (item) {
    item.style.display = "none";
  });

  NodeObjectVid.forEach(function (item) {
    item.style.display = "none";
  });

  NodeObjectAva.forEach(function (item) {
    item.style.display = "none";
  });

  NodeObjectImg.forEach(function (item) {
    item.style.display = "none";
  });
  button.innerHTML = "Show images";
}

// 5. Load page
if (option_show == "0") {
  document.onload(HideImage());
}
// else
// {
//     document.onload(ShowImage());
// }

function toggle() {
  if (button.innerHTML == "Show images") {
    ShowImage();
    localStorage.setItem("show", "1");
  }
  else {
    HideImage();
    localStorage.setItem("show", "0");
  }
}