Репозиторий с сайтами линеек продуктов

Сейчас в репозитории три сайта:

• eyepoint.physlab.ru
• usbadc10.physlab.ru
• files.mdrive.tech

Один сайт - одна линейка товаров. Каждый из сайтов находится внутри папки sites. В ветке dev-X.X версии сайтов с приставкой dev., в dev-X.X-stable продакшен версии сайтов. В прод все сайты запускаются с помощью глобального docker-compose-файла на сервере vili. На тест так же, только глобальный compose на odin.

Каждый сайт использует site_engine - набор общего кода, шаблонов, стилей и общих иконок. Однако у каждого сайта есть и свои части кода, а так же переводы и картинки. Такое частичное разделение было сделано вынужденно, чтобы по максимуму избавиться от повторяющегося кода разных сайтов. Из-за того что данные сайтов хранятся в питоновских файлах, приходится использовать динамическую загрузку модулей в server.py

Сайты и общий код разделены по принципу: в каждой папке сайта находятся только данные конкретного сайта. (.py-файлы с описанием продуктов тоже считать данными сайта). Таким образом при изменении конкретного сайта нужно изменять его в папке sites, а если нужно изменить что-то общее, то в папке site_engine.

Локальная разработка сайта

Для разработки сайта удобно запустить его на ПК локально. Для этого:

• Распаковать тестовое наполнение страниц загрузки. Т.е. папку download из архива sites/<sitename>/download.zip поместить в sites/<sitename>/download
• Скачать и установить python3.8
• Установить все необходимые пакеты и запустить:

python -m pip install -r requirements.txt
python server.py --site=eyepoint/mdrive/usbadc10

Сайт появится на localhost:8080

Сайт можно разрабатывать и под windows. Для этого нужно дополнительно установить пакет gettext

Разворачивание сайта на сервере

Для разворачивания на серверах ЦИФ МГУ есть готовые конфигурации и инструкции в приватных репозиториях https://gitlab.ximc.ru/sysadmin/server-config и https://gitlab.ximc.ru/sysadmin/dev-server-config

Для полноценной работы сайта нужно добавить контент на страницу загрузки, см. инструкцию "Добавление файлов загрузки"

В случае работы на сервере нужно пробросить volume в app/sites/<sitename>/download. На сервере на порту 5000 должен подниматься sftp-сервер, который занимается проброской volume. Тут лучше посмотреть как устроен сервис в docker compose.

Как добавить\удалить новый продукт на сайт

Описание всех продуктов лежит в файле sites//data/products.py. Новый продукт нужно создать по образцу, добавив имя, путь к картинке, описание и список технических характеристик.
Картинка продукта должна лежать в папке sites//images (см. примеры других продуктов)

После добавления продукта, а также после исправления любого текста, который видит пользователь (описание, вводная часть - любое слово, любая буква в интерфейсе) нужно обновлять файлы переводов!

Как обновить файлы переводов

(Ubuntu) Установите пакет для переводов и GUI для удобного редактирования переводов:

sudo apt install gettext
sudo snap install poedit

• Собрать файлы переводов

Для обновления переводов есть специальный скрипт scripts/update-po-files.sh Его нужно запустить из папки scripts (При этом пакет gettext должен быть установлен):

cd scripts && bash update-po-files.sh

Этот скрипт просмотрит файлы указанные в нём, один файл из которых общий для всех сайтов текст, другие три - в папке sites//data, найдёт все места, которые нуждаются в переводе на английский, и добавит во временный pot-файл перевода эти места. Этот же скрипт второй командой смерджит новые места с существующими переводами.

После чего нужно текст перевода в .po нужно написать самому. Для этого удобно использовать программу Poedit. С её помощью нужно открыть файл sites//locale/en_US/LC_MESSAGES/en.po и добавить отсутствующие переводы.
Так же нужно ещё скомпилировать эти переводы. За это отвечает скрипт rebuild-locale.sh. Если будете вносить изменения в rebuild-locale.sh, то обновите докерфайлы, там есть куски из этих файлов.

cd scripts && bash rebuild-locale.sh

Как добавить новую группу для скачивания

Пусть, например, для EyePoint P10 появился новый софт (помимо "прошивки" и "драйвера") - например, "плагины" (plugins)
Тогда в папке EyePoint_P10 (имя папки - как в "name" продукта, см. файл data/products) нужно создать папку plugins и накидать туда файлы для скачивания. Имена файлов нужно давать по образцу файлов в других папках. Затем нужно добавить новую категорию в список categories в файле data/download.py. Делать это нужно по образцу других категорий. После этого не забыть обновить файл перевода.

Добавление файлов загрузки

К Docker volume со скачиваемыми файлами можно подключиться удалённо через ssh. Для этого есть специальный контейнер dockershare который разворачивает ssh сервер с доступом исключительно к Docker volume.

Зайти по ssh (sftp, sshfs) можно вот так:

ssh -p 5000 root@<домен сайта> -i id_rsa

id_rsa - приватный ключ доступа. Публичный ключ доступа лежит в репозитории рядом с файлом контейнера в папке dockershare; приватный ключ должен быть у администратора. При обновлении ключей нужно заново сгенерировать пару приватный\публичный ключ, публичный ключ положить в папку с контейнером dockershare в репозиторий

Содержимое docker volume отображается в папку /drive контейнера

Для работы с папкой удобно пользоваться командой sshfs. Пример её запуска:

sshfs -p 5000 -oIdentityFile=/home/walker/Job/keys/id_rsa [email protected]:/drive /home/walker/foo

/home/walker/Job/keys/id_rsa - полный путь до приватного ключа eyepoint.kea.su - доменное имя сайта (либо IP) /home/walker/foo - путь, по которому хотите смонтировать удалённую папку. Точка монтирования должна существовать.

Структура файлов загрузки

<имя продукта>
  |
  |--<категория софта>
  |    |
  |    | - <имя файла в формате имя-версия.версия.версия-платформа.расширение> 
  |    | - <имя файла в формате имя-версия.версия.версия-платформа.расширение>
  |    | ...
  |--<категория софта>
  |    |
  |    | - <имя файла в формате имя-версия.версия.версия-платформа.расширение>
<имя продукта>
  |
  ...

Например:

EyePoint_P10
  |
  |--documentation
  |    |
  |    | - manual-0.0.0-d.pdf
  |    | - manual-0.0.1-d.pdf
  |    | - newman-1.1.5-h.txt
  |
  |--software
  |    |
  |    | - gui-5.5.0-win32.exe
  |    | - gui-5.5.0-deb.rpm
  |
EyePoint_S2
  |
  |--documentation
  |    |
  |    | - man-5.4.2-h.html
  |    | - man.2.2.2-y.pdf
  |
  |--driver
  |    |
  |    | - driver-0.0.0-win.inf
  |    | - driver-0.0.0-win.cat
  | 

Система с файлами достаточно гибкая. Версии файлов обязательны. Имена категорий софта (driver, documentation, software) и иконки нужно указать в data/download.py

Прочее

Бэкапы и перенос данных

На машине с наполненным volume с именем download и развёрнутым контейнером сайта, который должен быть назван epw, делаем:

docker run --rm --volumes-from epw -v $(pwd):/backup busybox tar cvf /backup/backup.tar /app/sites/<sitename>/download

Путь /app/sites//download совпадает с путём при создании контейнера. В результате получается файл backup.tar. Переместите файл backup.tar на другой хост, например через sshfs (установите sshfs: sudo apt install sshfs) На другой системе положите файл backup.tar в текущую директорию и создайте контейнер для распаковки:

sudo docker create --mount source=download,destination=/app/sites/<sitename>/download --name unpack busybox true

Далее запустите в этом контейнере распаковку, аналогично тому, как это было описано выше для архива с примером данных (download_sample):

sudo docker run --rm --volumes-from unpack -v $(pwd):/backup busybox tar xvf /backup/backup.tar
docker container rm unpack

Добавление нового сайта

• Внутри папки sites скопируйте папку сайт. Измените всё в ней в соответствии с названием и контентом нового сайта (Залезьте во все файлы, их не много, это контент сайта)
• Обновите все скрипты в папке scripts. (Добавьте туда путь до нового сайта)
• Обновите файлы переводов в новом сайте
• Желательно добавьте пример архива файлов

Источники и дополнительная информация

Иконки флагов взяты с
https://github.com/HatScripts/circle-flags.git

Иконки категорий софта и футера взяты у гугла в формате svg и перекрашены добавлением fill= https://fonts.google.com/icons?icon.set=Material+Symbols

Больше информации

https://ximc.ru/issues/37198
https://ximc.ru/issues/38120
https://ximc.ru/issues/36703
https://ximc.ru/issues/47312 https://ximc.ru/versions/3695 https://ximc.ru/issues/97341 https://ximc.ru/issues/97738