Хабрахабр

Расширение браузера для сайта toster.ru

Привет, уважаемые Хабровчане.

Как и многие здесь я часто пользуюсь Тостером и порой очень не хватает некоторых фич, которые могли бы облегчить или ускорить процесс взаимодействия с данным сайтом.
Поэтому было решено сделать расширение для браузера, которое восполнило бы этот пробел.
В итоге родился вот такой проект — Toster Extension.

Что умеет расширение:

  1. Скрывать кнопку «Отметить решением» (для чужих вопросов)
  2. Поменять местами кнопки «Отметить решением» и «Нравится»
  3. Скрывать блок с вакансиями и заказами
  4. Скрывать блок «Похожие вопросы»
  5. Скрывать блок «Самое интересное за 24 часа»
  6. Дублировать пагинацию над списком вопросов в ленте
  7. Скрывать вопросы с решениями
  8. Использовать Ctrl+Enter для отправки формы
  9. Сохранять введенный в форму ответа текст до отправки
  10. Показывать имя или ник в списке вопросов
  11. Показывать все теги в списке вопросов
  12. Оборачивать примеры кода в спойлер
  13. Включить моноширинный шрифт для кода в вопросах/ответах/комментариях
  14. Открывать ссылки со страницы вопроса в новой вкладке
  15. Показывать ссылку на ЛС юзера на Хабре
  16. Показывать превью вопроса при наведении на заголовок в ленте
  17. Вырезать примеры кода из превью вопроса
  18. Показывать превью профиля при наведении на имя юзера
  19. Включить реалтайм показ новых уведомлений
  20. Черный список тегов
  21. Черный список пользователей

Примерно так выглядит сейчас моя

страница настроек

image

Расширение пока доступно только для Google Chrome и Firefox.

Проект написан на TypeScript, страница настроек с использованием Vue.js.

Да, знаю, некошерно и лучше бы использовать тот же IndexedDB, но пока вот так. В качестве временного хранилища вопросов используется LocalStorage.

Ближайшие планы:

  1. Отображение количества непрочитанных уведомлений на иконке расширения
  2. Лента вопросов с автоматическим обновлением
  3. Страница вопроса с автоматическим обновлением ответов и комментариев
  4. Поднять бэкенд для того, чтобы можно было хранить там проиндексированные вопросы, черные списки, разные отметки (например дизлайки) и прочее

Чуть позже расскажу о нюансах использования Vue.js в браузерном расширении, а так же об отличии Firefox и Chrome в неожиданном для меня месте.

Всем спасибо, что уделили немного времени. Жду предложений в Issues и конструктивной критики в комментариях.

Теги
Показать больше

Похожие статьи

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Кнопка «Наверх»
Закрыть