Расширение Chrome, как показать модальный вариант из contextMenus - PullRequest
0 голосов
/ 12 марта 2019

Я работаю над расширением Chrome, которое будет считать выбранные слова.

файл manifest.json

  {
     "manifest_version": 2,
     "name": "Word Counter",
     "description": "To count article words",
     "version": "1.0.0",
     "icons": {
        "128": "icon_128.png"
     },

     "background": {
        "scripts": [
           "eventPage.js"
        ],
        "persistent": false
     },
     "permissions": [
        "activeTab",
        "contextMenus"
     ]
  }

файл eventPage.js

  let contextMenuItem = {
     "id": "countWords",
     "title": "count words",
     "contexts": ["selection"]
  }

  chrome.contextMenus.create(contextMenuItem)

  chrome.contextMenus.onClicked.addEventListener((selectedData) => {
     if (selectedData.menuItemId == 'countWords' && selectedData) {
          //What would be the logic
     }
  })

добавит опцию «считать слова» по правому клику. Теперь я хочу, чтобы при выборе опции подсчета слов в центре экрана появлялась модальная строка, показывающая количество выбранных слов.

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

enter image description here вид модального я смотрю здесь.

1 Ответ

0 голосов
/ 19 июня 2019

Этот конкретный пример с открытым исходным кодом, так что вы можете точно увидеть, как он это делает!

https://github.com/Steven-Roberts/Word-Counter-Plus/blob/d5de6f9840d3b772e916c582160160a6e1f01cb6/src/background.js#L32-L36

Спойлер: это не универсальный модал, а просто javascript старой школы alert(), поэтому он будет только текстовым.

Другие варианты: использование chrome всплывающих окон или Content Script для доступа к DOM текущей страницы и добавления вашего собственного модального сообщения по вашему усмотрению (это потребует от пользователей предоставления разрешения для вас, чтобы сделать это).

...