Добавить таблицу с текстовым log в локальную web-страницу html+css+js

3 000 руб. за проект
13 октября 2024, 20:26 • 5 откликов • 53 просмотра
Имеется несложная локальная (почти статическая) web-страница html+css+js. В ней есть несколько вкладок и таблицы. js функции заполняют таблицы из текстовых файлов вида ./data/имя.js, где ./ - папка этой web странички. Файлы ./data/имя.js периодически, примерно раз в 30 сек, сохраняет десктопное приложение. В принципе, десктопное приложение уже отрисовывает всю информацию в ходе работы, но недавно было решено, что можно более красиво отобразить это в браузере в с помощью html+css+js. Поэтому, требуется добавить на страницу новую вкладку, на которой в верхней половине страницы будет отображаться новая таблица, а в нижней - текстовый log, содержимое которого обновляется в зависимости от того на какую ячейку таблицы кликнул пользователь.
Подробности хочу показать в zoom.

Детали реализации:
- весь контент для таблицы задаётся в файле вида ./data/имя.js;
- предусмотреть задание/отображение цвета фона у ячеек, например из файла того же или другого ./data/имя.js;
- такие файлы периодически обновляет/перезаписывает десктопное приложение, как некоторый локальный бэкэнд, код которого разрабатывается мной;
- пользователю требуется наблюдать эти результаты в браузере, открыв эту страницу (локально);
- данные только для отображения, не для редактирования, но с возможность выделения и копирования в буфер и с возможностью навигации по таблице, требуется подсвечивать ту ячейку, которую в данный момент выбрал пользователь, в нижней половине вкладки требуется отображать тот текстовый log, который соотв. выбранной ячейке;
- в зависимости от выбранной ячейки - выводить текстовый log в нижней части вкладки;
- требуется автоматически обновлять этот контент с новыми данными из файлов ./data/имя.js, так как наше десктопное приложение примерно 1 раз в 30 сек. обновляет/перезаписывает эти файлы;
- вопрос: удастся ли сохранить при обновлении контента выбранную пользователем ячейку?
- вопрос: будет ли это достаточно быстро?;
- предусмотреть кнопку "обновить" на этой вкладке, по нажатию вызвать то же самое обновление контента (ту же самую функцию обновления);
- ориентировочное максимальное количество столбцов - около 20, строк около 340;
- текстовых логов будет столько, сколько ячеек в таблице;
- эти текстовые данные десктопное приложение также будет сохранять в одном или разных файлах ./data/имя.js, как лучше для фронтэнда так и сделаю;
- предусмотреть горизонтальный слайдер, чтобы пользователь мог управлять высотой таблицы и высотой окна текстового лога под таблицей;
- вопрос: удастся ли сохранить текущее положение горизонтального слайдера при обновлении контента?;
- вопрос: можно ли после обновления показывать всегда последнюю строку таблицы ?;

Полностью все детали этого фронтэнда, наверное, легче показать в zoom, чем описывать.

Файлы