Merge pull request #28 from anatolykopyl/dependabot/npm_and_yarn/webpack-5.94.0

Bump webpack from 5.76.0 to 5.94.0
2026-03-26 12:55:13 +00:00 · 2024-09-17 10:05:37 +03:00 · 2024-08-30 10:48:27 +00:00 · 2024-06-19 10:06:12 +03:00 · 2024-06-18 04:12:08 +00:00 · 2023-12-10 14:04:02 +03:00
27 changed files with 8209 additions and 7896 deletions
--- a/.babelrc
+++ b/.babelrc
@@ -1,3 +1,3 @@
 {
  "presets": ["@babel/preset-env"]
-}
+}
--- a/.gitignore
+++ b/.gitignore
@@ -1,5 +1,7 @@
 /node_modules
+.DS_Store
 /.cache
 /.idea
 /assets
-.zip
+.zip
+/.vscode
--- a/README.md
+++ b/README.md
@@ -1,4 +1,7 @@
 # vk-mute
+
+[![code style](https://antfu.me/badge-code-style.svg)](https://github.com/antfu/eslint-config)
+
 Заглушить собеседника в беседе в ВК. 🔇

 На данный момент ВКонтакте не позволяет заглушать людей в беседах. Это расширение для Chrome берется это исправить.
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -0,0 +1,3 @@
+const antfu = require('@antfu/eslint-config').default
+
+module.exports = antfu()
--- a/extension/assets/icons/icon128.png
+++ b/extension/assets/icons/icon128.png
--- a/extension/assets/icons/icon140.png
+++ b/extension/assets/icons/icon140.png
--- a/extension/assets/icons/icon48.png
+++ b/extension/assets/icons/icon48.png
--- a/extension/assets/mute.png
+++ b/extension/assets/mute.png
--- a/extension/dist/background.js
+++ b/extension/dist/background.js
--- a/extension/dist/dom.js
+++ b/extension/dist/dom.js
--- a/extension/dist/popup.html
+++ b/extension/dist/popup.html
@@ -2,12 +2,11 @@
 <html>
  <head>
    <meta charset="UTF-8">
-  </head>
+  <script defer src="popup.js"></script></head>
  <body>
    <div class="header">
      <h3 align="center">VK Mute</h3>
    </div>
-    <!--<button id="disableButton">Toggle</button>-->
    <div style="text-align: center;">
      <label class="switch">
        <input type="checkbox" id="disableCheckbox">
@@ -19,5 +18,5 @@
    <div class="donation_btn">
      <a href="./donate.html" title="Пожертвовать" target="_blank">💸</a>
    </div>
-  <script src="popup.js"></script></body>
-</html>
+  </body>
+</html>
--- a/extension/dist/popup.js
+++ b/extension/dist/popup.js
--- a/extension/manifest.json
+++ b/extension/manifest.json
@@ -6,20 +6,21 @@
        "128": "assets/icons/icon128.png",
        "48": "assets/icons/icon48.png"
    },
-    "version": "1.3",
+    "version": "1.5.0",
    "description": "Позволяет заглушить нежелаемых собеседников",
    "permissions": [
-        "declarativeContent",
        "storage"
    ],
-    "background": {
-        "scripts": ["dist/background.js"],
-        "persistent": false
-    },
-    "page_action": {
+    "action": {
+        "default_icon": {
+            "140": "assets/icons/icon140.png",
+            "128": "assets/icons/icon128.png",
+            "48": "assets/icons/icon48.png"
+        },
+        "default_title": "VK Mute",
        "default_popup": "dist/popup.html"
    },
-    "manifest_version": 2,
+    "manifest_version": 3,
    "content_scripts": [
        {
            "matches": ["https://*.vk.com/*"],
@@ -27,6 +28,9 @@
        }
    ],
    "web_accessible_resources": [
-        "assets/mute.png"
+        {
+            "resources": ["assets/mute.png"],
+            "matches": ["https://*.vk.com/*"]
+        }
    ]
 }
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -1,30 +1,34 @@
 {
  "name": "vk-mute",
-  "version": "1.0.0",
+  "version": "1.5.0",
  "description": "Заглушить собеседника в беседе в ВК. 🔇",
  "main": "src/dom/main.js",
  "scripts": {
    "build": "webpack --config webpack.config.js",
-    "watch": "webpack --config webpack.config.js --watch"
+    "watch": "webpack --config webpack.config.js --watch",
+    "lint": "eslint ."
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/anatolykopyl/vk-mute.git"
  },
-  "author": "",
-  "license": "ISC",
+  "author": "Anatoly Kopyl <hi@kopyl.dev>",
+  "license": "GPL-3.0",
  "bugs": {
    "url": "https://github.com/anatolykopyl/vk-mute/issues"
  },
  "homepage": "https://github.com/anatolykopyl/vk-mute#readme",
  "devDependencies": {
+    "@antfu/eslint-config": "^2.4.3",
    "@babel/core": "^7.9.0",
    "@babel/preset-env": "^7.9.5",
-    "babel-loader": "^8.1.0",
-    "css-loader": "^3.5.2",
-    "html-webpack-plugin": "^4.2.0",
+    "babel-loader": "^8.3.0",
+    "css-loader": "^6.7.3",
+    "eslint": "^8.55.0",
+    "html-webpack-plugin": "^5.5.0",
+    "raw-loader": "^4.0.2",
    "style-loader": "^1.1.4",
-    "webpack": "^4.42.1",
+    "webpack": "^5.94.0",
    "webpack-cli": "^4.7.2"
  }
 }
--- a/src/background/background.js
+++ b/src/background/background.js
@@ -1,14 +0,0 @@
-chrome.runtime.onInstalled.addListener(function () {
-    chrome.storage.sync.set({ isExtensionOn: true }, function () {
-        console.log('isExtensionOn: ' + true);
-    });
-
-    chrome.declarativeContent.onPageChanged.removeRules(undefined, function () {
-        chrome.declarativeContent.onPageChanged.addRules([{
-            conditions: [new chrome.declarativeContent.PageStateMatcher({
-                pageUrl: { hostEquals: 'vk.com' },
-            })],
-            actions: [new chrome.declarativeContent.ShowPageAction()]
-        }]);
-    });
-});
--- a/src/dom/controls.js
+++ b/src/dom/controls.js
@@ -1,25 +1,29 @@
+import { getChatBody } from '../utils/getChatBody'
+import muteSvg from './mute.svg'
+
 /**
 *
 * @param id {String}
 * @return {HTMLSpanElement}
 */
-import {getChatBody} from "../utils/getChatBody";
-
 function muteBtnHTML(id) {
-    const element = document.createElement('span');
-    element.setAttribute('class', 'mute_message');
-    element.setAttribute('id', `mute${id}`);
-    element.setAttribute('label', 'Заглушить');
-    element.style.background = `url(${chrome.runtime.getURL("assets/mute.png")}) center no-repeat`;
-    element.innerHTML = '<div class="mute_tooltip tt_w tt_black tt_down"><div class="tt_text">Заглушить</div></div>';
-    return element;
+  const element = document.createElement('span')
+  element.setAttribute('class', 'im-mess--mute')
+  element.setAttribute('id', `mute${id}`)
+  element.setAttribute('label', 'Заглушить')
+  element.innerHTML = `${muteSvg}<div class="mute_tooltip tt_w tt_black tt_down"><div class="tt_text">Заглушить</div></div>`
+  return element
 }

+/**
+ *
+ * @param target {HTMLElenemt}
+ */
 export function tryToAddControls(target) {
-    if (target.className === 'im-mess--check fl_l') {
-        const message = target.parentElement;
-        addControlButton(message);
-    }
+  if (target.className === 'im-mess--check fl_l') {
+    const message = target.parentElement
+    addControlButton(message)
+  }
 }

 /**
@@ -29,10 +33,10 @@ export function tryToAddControls(target) {
 * @return {HTMLElement}
 */
 function addMuteButton(actionArea, senderId) {
-    const muteButton = muteBtnHTML(senderId);
-    actionArea.appendChild(muteButton);
-    muteButton.style.display = "none";
-    return muteButton;
+  const muteButton = muteBtnHTML(senderId)
+  actionArea.appendChild(muteButton)
+  muteButton.style.visibility = 'hidden'
+  return muteButton
 }

 /**
@@ -40,63 +44,58 @@ function addMuteButton(actionArea, senderId) {
 * @param actionsArea {HTMLElement}
 */
 function addActionAreaEvents(actionsArea) {
-    actionsArea.parentElement.addEventListener("mouseenter", function (event) {
-        event.target.getElementsByClassName("mute_message")[0].style.display = "inline-block";
-    });
+  actionsArea.parentElement.addEventListener('mouseenter', (event) => {
+    event.target.getElementsByClassName('im-mess--mute')[0].style.visibility = 'visible'
+  })

-    actionsArea.parentElement.addEventListener("mouseleave", function (event) {
-        event.target.getElementsByClassName("mute_message")[0].style.display = "none";
-    });
+  actionsArea.parentElement.addEventListener('mouseleave', (event) => {
+    event.target.getElementsByClassName('im-mess--mute')[0].style.visibility = 'hidden'
+  })
 }

 /**
 *
- * @return {function(...[]=)}
+ * @this {HTMLElement}
 */
 function setIdToHideHandle() {
-    return function (event) {
-        const clickedId = event.target.id.substr(4);     // get id of sender from element id
-        let clickedName = event.target.parentElement.parentElement.parentElement.parentElement;
-        clickedName = clickedName.children[0].children[0].children[0].innerText;
+  const clickedId = this.id.substring(4)
+  let clickedName = this.parentElement.parentElement.parentElement.parentElement
+  clickedName = clickedName.children[0].children[0].children[0].textContent

-        chrome.storage.sync.get('idsToHide', function(data) {
-            let idsToHide = data.idsToHide || [];
-            if (idsToHide.filter(user => user.id == clickedId).length === 0) {
-                idsToHide.push({
-                    id: clickedId,
-                    name: clickedName
-                });
-                chrome.storage.sync.set({idsToHide: idsToHide}, function () {
-                    chrome.storage.sync.get('isExtensionOn', function(data) {
-                        if (data.isExtensionOn) {
-                            hideExistingMessages();
-                        }
-                    });
-                });
-            }
-        });
+  chrome.storage.sync.get('idsToHide', (data) => {
+    const idsToHide = data.idsToHide || []
+    if (idsToHide.filter(user => user.id === clickedId).length === 0) {
+      idsToHide.push({
+        id: clickedId,
+        name: clickedName,
+      })
+      chrome.storage.sync.set({ idsToHide }, () => {
+        chrome.storage.sync.get('isExtensionOn', (data) => {
+          if (data.isExtensionOn)
+            hideExistingMessages()
+        })
+      })
    }
+  })
 }

 export function hideExistingMessages() {
-    chrome.storage.sync.get('idsToHide', function(data) {
-        const chatBody = getChatBody();
-        for (let item of chatBody.children) {
-            if (data.idsToHide.filter(user => user.id == item.dataset.peer).length > 0) {
-                item.style.display = "none";
-            }
-        }
-    })
+  chrome.storage.sync.get('idsToHide', (data) => {
+    const chatBody = getChatBody()
+    for (const item of chatBody.children) {
+      if (data.idsToHide.filter(user => user.id === item.dataset.peer).length > 0)
+        item.style.display = 'none'
+    }
+  })
 }

 // Try to add controls until successful. Needed for page refresh.
 export function createTryToInitInterval() {
-    const controlsInterval = setInterval(function () {
-        if(!tryToInitControls(controlsInterval)){
-            clearInterval(controlsInterval);
-        }
-    }, 200)
-    return controlsInterval;
+  const controlsInterval = setInterval(() => {
+    if (!tryToInitControls(controlsInterval))
+      clearInterval(controlsInterval)
+  }, 200)
+  return controlsInterval
 }

 /**
@@ -104,32 +103,33 @@ export function createTryToInitInterval() {
 * @param message {HTMLElement}
 */
 function addControlButton(message) {
-    // Check if message is not an outgoing one
-    if (!message.classList.contains('im-mess_out')) {
-        const actionsArea = message.getElementsByClassName("im-mess--actions")[0];
-        if (actionsArea && actionsArea.lastChild.className !== "mute_message") {
-            const senderId = message.parentElement.parentElement.parentElement["dataset"].peer;
-            const muteBtn = addMuteButton(actionsArea, senderId);
-            addActionAreaEvents(actionsArea);
-            muteBtn.addEventListener("click", setIdToHideHandle());
-            return true;
-        } else {
-            return false;
-        }
+  // Check if message is not an outgoing one
+  if (!message.classList.contains('im-mess_out')) {
+    const actionsArea = message.getElementsByClassName('im-mess--actions')[0]
+    if (actionsArea && actionsArea.lastChild.className !== 'im-mess--mute') {
+      const senderId = message.parentElement.parentElement.parentElement.dataset.peer
+      const muteBtn = addMuteButton(actionsArea, senderId)
+      addActionAreaEvents(actionsArea)
+      muteBtn.addEventListener('click', setIdToHideHandle)
+      return true
    }
+    else {
+      return false
+    }
+  }
 }

 export function tryToInitControls() {
-    let status = true;
-    const chatBody = getChatBody();
-    if(!chatBody) return false;
-    for (let item of chatBody.children) {
-        if (item.className.includes('im-mess-stack _im_mess_stack')) {
-            let messages = item.children[1].children[1].getElementsByClassName('im-mess _im_mess');
-            for (let message of messages) {
-                status = addControlButton(message);
-            }
-        }
+  let status = true
+  const chatBody = getChatBody()
+  if (!chatBody)
+    return false
+  for (const item of chatBody.children) {
+    if (item.className.includes('im-mess-stack _im_mess_stack')) {
+      const messages = item.children[1].children[1].getElementsByClassName('im-mess _im_mess')
+      for (const message of messages)
+        status = addControlButton(message)
    }
-    return status;
-}
+  }
+  return status
+}
--- a/src/dom/dom.css
+++ b/src/dom/dom.css
@@ -1,30 +1,35 @@
 .mute_tooltip {
-    position: absolute;
-    left: -50px;
-    top: -33px;
-    display: none;
+  position: absolute;
+  left: -50px;
+  top: -33px;
+  display: none;
 }

 .mute_tooltip::after {
-    left: 61px !important;
+  left: 61px !important;
 }

 /* Show the tooltip text when you mouse over the tooltip container */
-.mute_message:hover .mute_tooltip {
-    display: block !important;
-    opacity: 1;
+.im-mess--mute:hover .mute_tooltip {
+  display: block !important;
+  opacity: 1;
 }

-.mute_message {
-    position: relative;
-    display: inline-block;
-    vertical-align: top;
-    padding-top: 2px;
-    width: 24px;
-    height: 24px;
-    background-size: 11px !important;
+.im-mess--mute {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 24px;
+  height: 24px;
+  opacity: .5;
+  color: var(--vkui--color_icon_secondary);
+}
+
+.im-mess--mute:hover {
+  opacity: 1;
 }

 .im-mess--actions {
-    margin-right: -30px !important;
+  margin-right: -30px !important;
 }
--- a/src/dom/hide_element.js
+++ b/src/dom/hide_element.js
@@ -1,58 +1,52 @@
-import {getChatBody} from "../utils/getChatBody";
-import {tryToAddControls, hideExistingMessages} from "./controls";
+import { getChatBody } from '../utils/getChatBody'
+import { hideExistingMessages, tryToAddControls } from './controls'

 export function addNewMessageEventListener() {
-    const chatBody = getChatBody();
-    chatBody.addEventListener('DOMNodeInserted', function(event) {
-        newMessageHandler(event.target)
-    });
+  const chatBody = getChatBody()
+  chatBody.addEventListener('DOMNodeInserted', (event) => {
+    newMessageHandler(event.target)
+  })
 }

 function newMessageHandler(message) {
-    tryToAddControls(message);
-    if (message.className === 'im-mess-stack _im_mess_stack ') {
-        chrome.storage.sync.get('isExtensionOn', function(data) {
-            if (data.isExtensionOn) {
-                chrome.storage.sync.get('idsToHide', function(data) {
-                    if (data.idsToHide.filter(user => user.id == message.dataset.peer).length > 0) {
-                        message.style.display = "none";
-                    }
-                });
-            }
-        });
-    }
+  tryToAddControls(message)
+  if (message.className === 'im-mess-stack _im_mess_stack ') {
+    chrome.storage.sync.get('isExtensionOn', (data) => {
+      if (data.isExtensionOn) {
+        chrome.storage.sync.get('idsToHide', (data) => {
+          if (data.idsToHide.filter(user => user.id === message.dataset.peer).length > 0)
+            message.style.display = 'none'
+        })
+      }
+    })
+  }
 }

 export function returnMessagesEventListener() {
-    chrome.storage.onChanged.addListener(function(changes) {
-        const isExtensionOn = changes.isExtensionOn;
-        const idsToHide = changes.idsToHide;
-        const chatBody = getChatBody();
-        if (isExtensionOn) {
-            if (isExtensionOn.newValue === false) {
-                for (let item of chatBody.children) {
-                    item.style.display = "block";
-                }
-            } else {
-                hideExistingMessages();
+  chrome.storage.onChanged.addListener((changes) => {
+    const isExtensionOn = changes.isExtensionOn
+    const idsToHide = changes.idsToHide
+    const chatBody = getChatBody()
+    if (isExtensionOn) {
+      if (isExtensionOn.newValue === false) {
+        for (const item of chatBody.children)
+          item.style.display = 'block'
+      }
+      else {
+        hideExistingMessages()
+      }
+    }
+    if (idsToHide) {
+      chrome.storage.sync.get('isExtensionOn', (data) => {
+        if (data.isExtensionOn) {
+          if (idsToHide.newValue.length < idsToHide.oldValue.length) {
+            for (const item of chatBody.children) {
+              if (idsToHide.newValue.filter(user => user.id === item.dataset.peer).length === 0)
+                item.style.display = 'block'
            }
+          }
        }
-        if (idsToHide) {
-            chrome.storage.sync.get('isExtensionOn', function(data) {
-                if (data.isExtensionOn) {
-                    if (idsToHide.newValue.length < idsToHide.oldValue.length) {
-                        // for (let item of chatBody.children) {
-                        //     item.style.display = "block";
-                        // }
-                        // hideExistingMessages();
-                        for (let item of chatBody.children) {
-                            if (idsToHide.newValue.filter(user => user.id == item.dataset.peer).length === 0) {
-                                item.style.display = "block";
-                            }
-                        }
-                    }
-                }
-            });
-        }
-    });
-}
+      })
+    }
+  })
+}
--- a/src/dom/main.js
+++ b/src/dom/main.js
@@ -1,22 +1,21 @@
 import './dom.css'
-import {createTryToInitInterval, hideExistingMessages, tryToInitControls} from "./controls";
-import {UrlController} from "../utils/Url";
-import {addNewMessageEventListener, returnMessagesEventListener} from "./hide_element";
+import { UrlController } from '../utils/Url'
+import { createTryToInitInterval, hideExistingMessages, tryToInitControls } from './controls'
+import { addNewMessageEventListener, returnMessagesEventListener } from './hide_element'

 function init() {
-    const url = new UrlController();
-    url.onChange(() => {
-        if (tryToInitControls()) {
-            createTryToInitInterval();
-            addNewMessageEventListener();
-            returnMessagesEventListener();
-            chrome.storage.sync.get('isExtensionOn', function(data) {
-                if (data.isExtensionOn) {
-                    hideExistingMessages();
-                }
-            });
-        }
-    })
+  const url = new UrlController()
+  url.onChange(() => {
+    if (tryToInitControls()) {
+      createTryToInitInterval()
+      addNewMessageEventListener()
+      returnMessagesEventListener()
+      chrome.storage.sync.get('isExtensionOn', (data) => {
+        if (data.isExtensionOn)
+          hideExistingMessages()
+      })
+    }
+  })
 }

-init();
+init()
--- a/src/dom/mute.svg
+++ b/src/dom/mute.svg
@@ -0,0 +1,9 @@
+<svg 
+  xmlns="http://www.w3.org/2000/svg" 
+  width="16" 
+  height="16" 
+  fill="currentColor" 
+  viewBox="2 1 13 13"
+>
+  <path d="M4.69 5.5 11 11.8v1.7c0 .3-.23.47-.49.5l-3.63-3.5H4a1 1 0 0 1-1-1v-3a1 1 0 0 1 1-1h.69Zm.77-2.85 2.2 2.19L10.5 2.5c.27.02.49.2.49.48v5.2l2.6 2.6a.75.75 0 0 1-1.06 1.06L4.4 3.71a.75.75 0 0 1 1.06-1.06Z"></path>
+</svg>
--- a/src/popup/popup.css
+++ b/src/popup/popup.css
@@ -1,125 +1,122 @@
 * {
-    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
 }

 body {
-    min-width: 160px;
-    margin: 0;
+  min-width: 160px;
+  margin: 0;
 }
-/* The switch - the box around the slider */
+
 .switch {
-    position: relative;
-    display: inline-block;
-    width: 60px;
-    height: 34px;
+  position: relative;
+  display: inline-block;
+  width: 60px;
+  height: 34px;
 }

-/* Hide default HTML checkbox */
 .switch input {
-    opacity: 0;
-    width: 0;
-    height: 0;
+  opacity: 0;
+  width: 0;
+  height: 0;
 }

-/* The slider */
 .slider {
-    position: absolute;
-    cursor: pointer;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background-color: #ccc;
-    -webkit-transition: .4s;
-    transition: .4s;
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: .4s;
+  transition: .4s;
 }

 .slider:before {
-    position: absolute;
-    content: "";
-    height: 26px;
-    width: 26px;
-    left: 4px;
-    bottom: 4px;
-    background-color: white;
-    -webkit-transition: .4s;
-    transition: .4s;
+  position: absolute;
+  content: "";
+  height: 26px;
+  width: 26px;
+  left: 4px;
+  bottom: 4px;
+  background-color: white;
+  -webkit-transition: .4s;
+  transition: .4s;
 }

 input:checked + .slider {
-    background-color: #2196F3;
+  background-color: #2196F3;
 }

 input:focus + .slider {
-    box-shadow: 0 0 1px #2196F3;
+  box-shadow: 0 0 1px #2196F3;
 }

 input:checked + .slider:before {
-    -webkit-transform: translateX(26px);
-    -ms-transform: translateX(26px);
-    transform: translateX(26px);
+  -webkit-transform: translateX(26px);
+  -ms-transform: translateX(26px);
+  transform: translateX(26px);
 }

-/* Rounded sliders */
 .slider.round {
-    border-radius: 34px;
+  border-radius: 34px;
 }

 .slider.round:before {
-    border-radius: 50%;
+  border-radius: 50%;
 }

 .header {
-    background-color: #2196F3;
-    color: white;
-    width: 100%;
-    height: 3rem;
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    margin-bottom: 1rem;
+  background-color: #2196F3;
+  color: white;
+  width: 100%;
+  height: 3rem;
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 1rem;
 }

 h3 {
-    margin: 0;
+  margin: 0;
 }

 .idToHide {
-    padding: 10px;
-    box-sizing: border-box;
-    display: flex;
-    justify-content: space-between;
-    background-color: #fff;
+  padding: 10px;
+  box-sizing: border-box;
+  display: flex;
+  justify-content: space-between;
+  background-color: #fff;
 }

 .idToHide:hover {
-    background-color: #f1f1f1;
+  background-color: #f1f1f1;
 }

 #id_list {
-    color: black;
-    position: relative;
-    width: 100%;
-    margin-top: 1rem;
+  color: black;
+  position: relative;
+  width: 100%;
+  margin-top: 1rem;
 }

 .del_item {
-    cursor: pointer;
-    transition: transform 0.2s;
+  cursor: pointer;
+  transition: transform 0.2s;
 }

 .del_item:hover {
-    transform: scale(1.15);
+  transform: scale(1.15);
 }

 .donation_btn {
-    text-align: right;
-    margin-top: .5rem;
-    padding: 0 10px 10px 0;
+  text-align: right;
+  margin-top: .5rem;
+  padding: 0 10px 10px 0;
 }

 a {
-    text-decoration: none;
-    color: hsl(207, 90%, 35%);
+  text-decoration: none;
+  color: hsl(207, 90%, 35%);
 }
--- a/src/popup/popup.html
+++ b/src/popup/popup.html
@@ -7,7 +7,6 @@
    <div class="header">
      <h3 align="center">VK Mute</h3>
    </div>
-    <!--<button id="disableButton">Toggle</button>-->
    <div style="text-align: center;">
      <label class="switch">
        <input type="checkbox" id="disableCheckbox">
@@ -20,4 +19,4 @@
      <a href="./donate.html" title="Пожертвовать" target="_blank">💸</a>
    </div>
  </body>
-</html>
+</html>
--- a/src/popup/popup.js
+++ b/src/popup/popup.js
@@ -1,54 +1,51 @@
 import './popup.css'

-//let disableButton = document.getElementById('disableButton');
-let disableCheckbox = document.getElementById('disableCheckbox');
-let idsToHideElements = document.getElementsByClassName('idToHide');
-let idList = document.getElementById("id_list");
-let isExtensionOn;
-let idsToHide = [];
+const disableCheckbox = document.getElementById('disableCheckbox')
+const idsToHideElements = document.getElementsByClassName('idToHide')
+const idList = document.getElementById('id_list')
+let isExtensionOn
+let idsToHide = []

 function idBtnHTML(user) {
-    const element = document.createElement('div');
-    element.setAttribute('class', 'idToHide');
-    element.innerHTML = `
+  const element = document.createElement('div')
+  element.setAttribute('class', 'idToHide')
+  element.innerHTML = `
        <a href="https://vk.com/id${user.id}" target="_blank" title="Перейти в профиль">🤐 ${user.name}</a>
        <span class="del_item" title="Удалить">🗑️</span>
-    `;
-    element.id = user.id;
-    return element;
+    `
+  element.id = user.id
+  return element
 }

-chrome.storage.sync.get('isExtensionOn', function(data) {
-    isExtensionOn = data.isExtensionOn;
+chrome.storage.sync.get('isExtensionOn', (data) => {
+  isExtensionOn = data.isExtensionOn

-    disableCheckbox.checked = isExtensionOn;
-});
+  disableCheckbox.checked = isExtensionOn
+})

-chrome.storage.sync.get('idsToHide', function(data) {
-    idsToHide = data.idsToHide;
-    for (const id in idsToHide) {
-        const row = idBtnHTML(idsToHide[id]);
-        idList.appendChild(row);
+chrome.storage.sync.get('idsToHide', (data) => {
+  idsToHide = data.idsToHide
+  for (const id in idsToHide) {
+    const row = idBtnHTML(idsToHide[id])
+    idList.appendChild(row)
+  }
+
+  for (const element of idsToHideElements) {
+    for (const child of element.childNodes) {
+      if (child.className === 'del_item') {
+        child.addEventListener('click', () => {
+          idsToHide = idsToHide.filter(user => user.id !== element.id)
+          chrome.storage.sync.set({ idsToHide }, () => {
+            element.remove()
+          })
+        })
+      }
    }
-    for (const element of idsToHideElements) {
-        for (const child of element.childNodes) {
-            if (child.className === "del_item") {
-                child.addEventListener('click', function() {
-                    idsToHide = idsToHide.filter(user => user.id != element.id);
-                    chrome.storage.sync.set({idsToHide: idsToHide}, function() {
-                        element.remove();
-                        console.log('Cleared idsToHide');
-                    });
-                });
-            }
-        }
-    };    
-});
+  }
+})

 disableCheckbox.addEventListener('change', (event) => {
-    isExtensionOn = event.target.checked;
+  isExtensionOn = event.target.checked

-    chrome.storage.sync.set({isExtensionOn}, function() {
-        console.log('isExtensionOn: '+isExtensionOn);
-    });
-});
+  chrome.storage.sync.set({ isExtensionOn })
+})
--- a/src/utils/Url.js
+++ b/src/utils/Url.js
@@ -1,47 +1,42 @@
-const INTERVAL_TIME = 100;
+const INTERVAL_TIME = 100

 export class UrlController {
+  constructor() {
+    this._changeListeners = []
+    this._interval = null
+    this._url = window.location.href
+  }

-    constructor() {
-        this._changeListeners = [];
-        this._interval = null;
-        this._url = window.location.href;
+  onChange(cb) {
+    this._changeListeners.push(cb)
+    if (this._interval === null)
+      this._createInterval()
+  }
+
+  removeEventListener(cb) {
+    this._changeListeners = this._changeListeners.filter(item => item !== cb)
+    if (this._changeListeners.length === 0)
+      this._clearInterval()
+  }
+
+  _intervalTick() {
+    const currentUrl = window.location.href
+    if (currentUrl !== this.url) {
+      this._broadcast(this.url, currentUrl)
+      this.url = currentUrl
    }
+  }

-    onChange(cb) {
-        this._changeListeners.push(cb);
-        if (this._interval === null) {
-            this._createInterval();
-        }
-    }
+  _broadcast(oldUrl, newUrl) {
+    this._changeListeners.forEach(cb => cb(oldUrl, newUrl))
+  }

-    removeEventListener(cb) {
-        this._changeListeners = this._changeListeners.filter(item=>item !== cb);
-        if(this._changeListeners.length === 0) {
-            this._clearInterval();
-        }
-    }
+  _createInterval() {
+    this.interval = setInterval(() => this._intervalTick(), INTERVAL_TIME)
+  }

-    _intervalTick() {
-        const currentUrl = window.location.href;
-        if (currentUrl !== this.url) {
-            this._broadcast(this.url, currentUrl);
-            this.url = currentUrl;
-        }
-
-    }
-
-    _broadcast(oldUrl, newUrl) {
-        this._changeListeners.forEach(cb => cb(oldUrl, newUrl));
-    }
-
-    _createInterval() {
-        this.interval = setInterval(() => this._intervalTick(), INTERVAL_TIME)
-    }
-
-    _clearInterval() {
-        clearInterval(this.interval)
-        this.interval = null
-    }
-
-}
+  _clearInterval() {
+    clearInterval(this.interval)
+    this.interval = null
+  }
+}
--- a/src/utils/getChatBody.js
+++ b/src/utils/getChatBody.js
@@ -1,3 +1,3 @@
 export function getChatBody() {
-    return document.getElementsByClassName("_im_peer_history im-page-chat-contain")[0];
-}
+  return document.getElementsByClassName('_im_peer_history im-page-chat-contain')[0]
+}
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,45 +1,49 @@
-const path = require('path');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
+const path = require('node:path')
+const HtmlWebpackPlugin = require('html-webpack-plugin')

 module.exports = {
-    mode: "development",
-    devtool: "inline-source-map",
-    entry: {
-        dom: './src/dom/main.js',
-        background: './src/background/background.js',
-        popup: './src/popup/popup.js'
-    },
-    output: {
-        filename: '[name].js',
-        path: path.resolve(__dirname, 'extension/dist')
-    },
-    module: {
-        rules: [
-            {
-                test: /\.m?js$/,
-                exclude: /(node_modules|bower_components)/,
-                use: {
-                    loader: 'babel-loader',
-                    options: {
-                        presets: ['@babel/preset-env']
-                    }
-                }
-            },
-            {
-                test: /\.css$/i,
-                use: ['style-loader', 'css-loader'],
-            }
-        ]
-    },
-    plugins: [new HtmlWebpackPlugin({
-        template: "./src/popup/popup.html",
-        filename: "popup.html",
-        chunks: ['popup']
+  mode: 'development',
+  devtool: 'inline-source-map',
+  entry: {
+    dom: './src/dom/main.js',
+    popup: './src/popup/popup.js',
+  },
+  output: {
+    filename: '[name].js',
+    path: path.resolve(__dirname, 'extension/dist'),
+  },
+  module: {
+    rules: [
+      {
+        test: /\.m?js$/,
+        exclude: /(node_modules|bower_components)/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: ['@babel/preset-env'],
+          },
+        },
+      },
+      {
+        test: /\.css$/i,
+        use: ['style-loader', 'css-loader'],
+      },
+      {
+        test: /\.svg$/i,
+        use: 'raw-loader',
+      },
+    ],
+  },
+  plugins: [
+    new HtmlWebpackPlugin({
+      template: './src/popup/popup.html',
+      filename: 'popup.html',
+      chunks: ['popup'],
    }),
    new HtmlWebpackPlugin({
-        template: "./src/donate.html",
-        filename: "donate.html",
-        chunks: ['donate']
-    })]
-
-}
+      template: './src/donate.html',
+      filename: 'donate.html',
+      chunks: ['donate'],
+    }),
+  ],
+}
Author	SHA1	Message	Date
Anatoly Kopyl	544ef14295	Merge pull request #28 from anatolykopyl/dependabot/npm_and_yarn/webpack-5.94.0 Bump webpack from 5.76.0 to 5.94.0	2024-09-17 10:05:37 +03:00
dependabot[bot]	218fc0610e	Bump webpack from 5.76.0 to 5.94.0 Bumps [webpack](https://github.com/webpack/webpack) from 5.76.0 to 5.94.0. - [Release notes](https://github.com/webpack/webpack/releases) - [Commits](https://github.com/webpack/webpack/compare/v5.76.0...v5.94.0) --- updated-dependencies: - dependency-name: webpack dependency-type: direct:development ... Signed-off-by: dependabot[bot] <support@github.com>	2024-08-30 10:48:27 +00:00
Anatoly Kopyl	02a46d4908	Merge pull request #27 from anatolykopyl/dependabot/npm_and_yarn/braces-3.0.3 Bump braces from 3.0.2 to 3.0.3	2024-06-19 10:06:12 +03:00
dependabot[bot]	07bcb773f5	Bump braces from 3.0.2 to 3.0.3 Bumps [braces](https://github.com/micromatch/braces) from 3.0.2 to 3.0.3. - [Changelog](https://github.com/micromatch/braces/blob/master/CHANGELOG.md) - [Commits](https://github.com/micromatch/braces/compare/3.0.2...3.0.3) --- updated-dependencies: - dependency-name: braces dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2024-06-18 04:12:08 +00:00
anatolykopyl	b926f0edbf	Add eslint	2023-12-10 14:04:02 +03:00
anatolykopyl	91f1833534	Migrate to manifest v3	2023-12-10 11:15:53 +03:00
Anatoly Kopyl	4089f640ea	Merge pull request #25 from anatolykopyl/dependabot/npm_and_yarn/postcss-8.4.31 Bump postcss from 8.4.20 to 8.4.31	2023-12-09 13:15:20 +03:00
Anatoly Kopyl	85596a95a6	Merge pull request #26 from anatolykopyl/dependabot/npm_and_yarn/babel/traverse-7.23.2 Bump @babel/traverse from 7.9.5 to 7.23.2	2023-10-28 11:53:03 +03:00
dependabot[bot]	4cebd66a85	Bump @babel/traverse from 7.9.5 to 7.23.2 Bumps [@babel/traverse](https://github.com/babel/babel/tree/HEAD/packages/babel-traverse) from 7.9.5 to 7.23.2. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.23.2/packages/babel-traverse) --- updated-dependencies: - dependency-name: "@babel/traverse" dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2023-10-20 00:45:14 +00:00
dependabot[bot]	bc49282b62	Bump postcss from 8.4.20 to 8.4.31 Bumps [postcss](https://github.com/postcss/postcss) from 8.4.20 to 8.4.31. - [Release notes](https://github.com/postcss/postcss/releases) - [Changelog](https://github.com/postcss/postcss/blob/main/CHANGELOG.md) - [Commits](https://github.com/postcss/postcss/compare/8.4.20...8.4.31) --- updated-dependencies: - dependency-name: postcss dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2023-10-07 10:53:05 +00:00
Anatoly Kopyl	78c6b02214	Merge pull request #24 from anatolykopyl/dependabot/npm_and_yarn/webpack-5.76.0 Bump webpack from 5.75.0 to 5.76.0	2023-03-17 11:41:04 +03:00
dependabot[bot]	97a8920057	Bump webpack from 5.75.0 to 5.76.0 Bumps [webpack](https://github.com/webpack/webpack) from 5.75.0 to 5.76.0. - [Release notes](https://github.com/webpack/webpack/releases) - [Commits](https://github.com/webpack/webpack/compare/v5.75.0...v5.76.0) --- updated-dependencies: - dependency-name: webpack dependency-type: direct:development ... Signed-off-by: dependabot[bot] <support@github.com>	2023-03-15 09:35:17 +00:00
Anatoly Kopyl	a22c3485fa	Merge pull request #23 from anatolykopyl/dependabot/npm_and_yarn/json5-and-babel-loader-and-css-loader-and-html-webpack-plugin-and-webpack-2.2.3 Bump json5, babel-loader, css-loader, html-webpack-plugin and webpack	2023-01-01 22:38:20 +03:00
dependabot[bot]	fd8c01e41b	Bump json5, babel-loader, css-loader, html-webpack-plugin and webpack Bumps [json5](https://github.com/json5/json5) to 2.2.3 and updates ancestor dependencies [json5](https://github.com/json5/json5), [babel-loader](https://github.com/babel/babel-loader), [css-loader](https://github.com/webpack-contrib/css-loader), [html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin) and [webpack](https://github.com/webpack/webpack). These dependencies need to be updated together. Updates `json5` from 2.1.3 to 2.2.3 - [Release notes](https://github.com/json5/json5/releases) - [Changelog](https://github.com/json5/json5/blob/main/CHANGELOG.md) - [Commits](https://github.com/json5/json5/compare/v2.1.3...v2.2.3) Updates `babel-loader` from 8.1.0 to 8.3.0 - [Release notes](https://github.com/babel/babel-loader/releases) - [Changelog](https://github.com/babel/babel-loader/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel-loader/compare/v8.1.0...v8.3.0) Updates `css-loader` from 3.5.2 to 6.7.3 - [Release notes](https://github.com/webpack-contrib/css-loader/releases) - [Changelog](https://github.com/webpack-contrib/css-loader/blob/master/CHANGELOG.md) - [Commits](https://github.com/webpack-contrib/css-loader/compare/v3.5.2...v6.7.3) Updates `html-webpack-plugin` from 4.2.0 to 5.5.0 - [Release notes](https://github.com/jantimon/html-webpack-plugin/releases) - [Changelog](https://github.com/jantimon/html-webpack-plugin/blob/main/CHANGELOG.md) - [Commits](https://github.com/jantimon/html-webpack-plugin/compare/v4.2.0...v5.5.0) Updates `webpack` from 4.42.1 to 5.75.0 - [Release notes](https://github.com/webpack/webpack/releases) - [Commits](https://github.com/webpack/webpack/compare/v4.42.1...v5.75.0) --- updated-dependencies: - dependency-name: json5 dependency-type: indirect - dependency-name: babel-loader dependency-type: direct:development - dependency-name: css-loader dependency-type: direct:development - dependency-name: html-webpack-plugin dependency-type: direct:development - dependency-name: webpack dependency-type: direct:development ... Signed-off-by: dependabot[bot] <support@github.com>	2023-01-01 19:37:39 +00:00
Anatoly Kopyl	aad1365953	Merge pull request #21 from anatolykopyl/dependabot/npm_and_yarn/loader-utils-1.4.2 Bump loader-utils from 1.4.1 to 1.4.2	2022-11-25 02:40:15 +03:00
dependabot[bot]	de578fd210	Bump loader-utils from 1.4.1 to 1.4.2 Bumps [loader-utils](https://github.com/webpack/loader-utils) from 1.4.1 to 1.4.2. - [Release notes](https://github.com/webpack/loader-utils/releases) - [Changelog](https://github.com/webpack/loader-utils/blob/v1.4.2/CHANGELOG.md) - [Commits](https://github.com/webpack/loader-utils/compare/v1.4.1...v1.4.2) --- updated-dependencies: - dependency-name: loader-utils dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-11-18 00:39:12 +00:00
Anatoly Kopyl	59ca6bb360	Merge pull request #20 from anatolykopyl/dependabot/npm_and_yarn/minimatch-3.1.2 Bump minimatch from 3.0.4 to 3.1.2	2022-11-10 23:21:20 +03:00
dependabot[bot]	f7474d863b	Bump minimatch from 3.0.4 to 3.1.2 Bumps [minimatch](https://github.com/isaacs/minimatch) from 3.0.4 to 3.1.2. - [Release notes](https://github.com/isaacs/minimatch/releases) - [Commits](https://github.com/isaacs/minimatch/compare/v3.0.4...v3.1.2) --- updated-dependencies: - dependency-name: minimatch dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-11-10 20:20:24 +00:00
Anatoly Kopyl	9a2381690e	Merge pull request #19 from anatolykopyl/dependabot/npm_and_yarn/loader-utils-1.4.1 Bump loader-utils from 1.4.0 to 1.4.1	2022-11-10 23:14:05 +03:00
dependabot[bot]	ecc265430b	Bump loader-utils from 1.4.0 to 1.4.1 Bumps [loader-utils](https://github.com/webpack/loader-utils) from 1.4.0 to 1.4.1. - [Release notes](https://github.com/webpack/loader-utils/releases) - [Changelog](https://github.com/webpack/loader-utils/blob/v1.4.1/CHANGELOG.md) - [Commits](https://github.com/webpack/loader-utils/compare/v1.4.0...v1.4.1) --- updated-dependencies: - dependency-name: loader-utils dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-11-08 09:50:42 +00:00
Anatoly Kopyl	a8290e41f3	Merge pull request #18 from anatolykopyl/dependabot/npm_and_yarn/glob-parent-5.1.2 Bump glob-parent from 3.1.0 to 5.1.2	2022-10-09 13:13:10 +03:00
dependabot[bot]	343ebe14ea	Bump glob-parent from 3.1.0 to 5.1.2 Bumps [glob-parent](https://github.com/gulpjs/glob-parent) from 3.1.0 to 5.1.2. - [Release notes](https://github.com/gulpjs/glob-parent/releases) - [Changelog](https://github.com/gulpjs/glob-parent/blob/main/CHANGELOG.md) - [Commits](https://github.com/gulpjs/glob-parent/compare/v3.1.0...v5.1.2) --- updated-dependencies: - dependency-name: glob-parent dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-10-09 10:12:57 +00:00
Anatoly Kopyl	31dcbae1da	Merge pull request #17 from anatolykopyl/dependabot/npm_and_yarn/terser-4.8.1 Bump terser from 4.6.11 to 4.8.1	2022-08-14 04:11:42 +03:00
dependabot[bot]	2330704243	Bump terser from 4.6.11 to 4.8.1 Bumps [terser](https://github.com/terser/terser) from 4.6.11 to 4.8.1. - [Release notes](https://github.com/terser/terser/releases) - [Changelog](https://github.com/terser/terser/blob/master/CHANGELOG.md) - [Commits](https://github.com/terser/terser/commits) --- updated-dependencies: - dependency-name: terser dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-07-21 01:38:14 +00:00
Anatoly	56bf77001c	Merge pull request #16 from anatolykopyl/dependabot/npm_and_yarn/minimist-1.2.6 Bump minimist from 1.2.5 to 1.2.6	2022-04-03 13:12:23 +03:00
dependabot[bot]	d8f653382b	Bump minimist from 1.2.5 to 1.2.6 Bumps [minimist](https://github.com/substack/minimist) from 1.2.5 to 1.2.6. - [Release notes](https://github.com/substack/minimist/releases) - [Commits](https://github.com/substack/minimist/compare/1.2.5...1.2.6) --- updated-dependencies: - dependency-name: minimist dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-03-26 16:24:48 +00:00
Anatoly	afa274b651	Bump manifest version	2022-02-20 02:45:07 +03:00
Anatoly	9a201e7412	Обновил иконку	2022-02-20 02:35:06 +03:00
Anatoly	fee04826c9	Merge pull request #15 from anatolykopyl/dependabot/npm_and_yarn/path-parse-1.0.7 Bump path-parse from 1.0.6 to 1.0.7	2022-02-13 13:43:12 +03:00
Anatoly	ae88addcfd	Merge pull request #14 from anatolykopyl/dependabot/npm_and_yarn/nth-check-2.0.1 Bump nth-check from 2.0.0 to 2.0.1	2022-02-13 13:42:57 +03:00
dependabot[bot]	119d598c24	Bump path-parse from 1.0.6 to 1.0.7 Bumps [path-parse](https://github.com/jbgutierrez/path-parse) from 1.0.6 to 1.0.7. - [Release notes](https://github.com/jbgutierrez/path-parse/releases) - [Commits](https://github.com/jbgutierrez/path-parse/commits/v1.0.7) --- updated-dependencies: - dependency-name: path-parse dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-02-13 10:42:00 +00:00
dependabot[bot]	c227c69aaf	Bump nth-check from 2.0.0 to 2.0.1 Bumps [nth-check](https://github.com/fb55/nth-check) from 2.0.0 to 2.0.1. - [Release notes](https://github.com/fb55/nth-check/releases) - [Commits](https://github.com/fb55/nth-check/compare/v2.0.0...v2.0.1) --- updated-dependencies: - dependency-name: nth-check dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-02-13 10:42:00 +00:00
Anatoly	874c0694ba	Merge pull request #13 from anatolykopyl/dependabot/npm_and_yarn/ajv-6.12.6 Bump ajv from 6.12.0 to 6.12.6	2022-02-13 13:41:30 +03:00
dependabot[bot]	671ab3c037	Bump ajv from 6.12.0 to 6.12.6 Bumps [ajv](https://github.com/ajv-validator/ajv) from 6.12.0 to 6.12.6. - [Release notes](https://github.com/ajv-validator/ajv/releases) - [Commits](https://github.com/ajv-validator/ajv/compare/v6.12.0...v6.12.6) --- updated-dependencies: - dependency-name: ajv dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com>	2022-02-13 10:39:45 +00:00