Привет ! Я знаю, странное название, ты запутался в этом и не волнуйся.


Введение

Небольшое представление обо мне, меня зовут Томас, мне 23 года, и я мод на этом ПОТРЯСАЮЩИЕ сообществу dev.to уже 3 года 💚🌱

Я также являюсь волонтером мода в VscodeTips а также CodeNewbie. Не стесняйтесь проверять эти сообщества!

Когда вы являетесь модом в сообществе Forem, вы являетесь боковой панелью для голосования за или против содержания любых сообщений. Добавить/удалить #тегии сообщить, является ли контент спамом или другим контентом против Нормы поведения.

Боковая панель для модерации сообщений о модах<br />» loading=»lazy» width=»880″ height=»429″/></a></p><p><a rel=🤔 Что такое Форем? →



Инструмент под вопросом

Когда вы видите сообщение, боковая панель мода не открыта по умолчанию. Поэтому я хотел создать простой скрипт на JavaScript с Расширение тампермонки чтобы боковая панель открывалась при загрузке страницы поста. ✨


Как это работает

Я искал непосредственно в источнике кода Forem, чтобы определить, как открывается панель, когда мы нажимаем на эту кнопку.

Кнопка, при нажатии которой открывается боковая панель мода

И я нашел этот кусок кодафункция переключать боковая панель модов! 😎

function toggleModActionsMenu() {
    document
      .getElementById('mod-actions-menu-btn-area')
      .classList.remove('hidden');
    document
      .getElementsByClassName('mod-actions-menu')[0]
      .classList.toggle('showing');

    // showing close icon in the mod panel if it is opened by clicking the button
    const modContainer = document.getElementById('mod-container');
    const panelDocument = modContainer.contentDocument;

    if (panelDocument) {
      const closePanel = panelDocument.getElementsByClassName(
        'close-actions-panel',
      )[0];

      closePanel && closePanel.classList.remove('hidden');
    }
  }
Войти в полноэкранный режим

Выйти из полноэкранного режима

Увидев это, я создал файл Tampermonkey:

(function() {
    'use strict';
// Get the element with this ID and remove the class 'hidden'
document
      .getElementById('mod-actions-menu-btn-area')
      .classList.remove('hidden');
// Show the sidebar mod menu 
    document
      .getElementsByClassName('mod-actions-menu')[0]
      .classList.toggle('showing');
})();
Войти в полноэкранный режим

Выйти из полноэкранного режима


Открытый исходный код 💚

Давай и становится де Разработчик открытого исходного кода ! Этот исходный код опубликован, и любой пользователь может внести свой вклад! 🧙🏼‍♂️

Я особенно благодарен @andypiper за исправление ссылки для установки этого скрипта на Tampermonkey и в типографике. 🤩🚀

Автоматически открывать панель Mod на DEV.