Обеспечьте эквивалент представления читателя Firefox с самого сайта
Я хотел бы предоставить функцию, которая очень похожа на представление читателя Firefox для всех браузеров, встроив ее в сайт, над которым я работаю, чтобы ее можно было включить, щелкнув переключатель или что-то подобное.
Я нашел репозиторий Mozilla Readability, который описывает себя как:
Автономная версия библиотеки удобочитаемости, используемой для Firefox Reader View.
Я импортировал это на свой сайт и добавил переключатель для замены содержимого главной страницы HTML-кодом, полученным из этой библиотеки, но он предоставляет только некоторые функции представления читателя Firefox. Он убрал различные нетекстовые элементы, оставив только простую страницу с текстом и изображениями, но ему не хватает стиля, используемого в представлении читателя Firefox, и, что более важно, ему не хватает плавающей панели инструментов, которая позволяет пользователю динамически настраивать стиль страницы / текста. , или попросите прочитать им текст.
Затем я нашел исходный код для представления Firefox для читателя , но интеграция его с сайтом, над которым я работаю, кажется, по крайней мере, довольно сложной, если не невозможной без значительного переписывания. Есть ли способ встроить представление читателя Firefox на веб-сайт?
Это не дубликат раздела " Как я могу внедрить Mozilla readability.js на свой веб-сайт?", как я уже реализовал
readability.js
для сайта, над которым я работаю. Вот урезанный пример того, как я это делаю:
import { Readability } from '@mozilla/readability';
function htmlToElement(htmlString) {
const template = document.createElement('template');
template.innerHTML = htmlString.trim();
return template.content.firstChild;
}
document.getElementsByClassName('layoutmain')[0].replaceWith(
htmlToElement(
new Readability(document.cloneNode(true)).parse().content
)
);
Я использую Svelte , который выполняет импорт в приведенном выше коде, но я думаю, что это в значительной степени не имеет отношения к рассматриваемому вопросу.