novokosino.tk был первым моим большим проектом на node.js. Более того, сам javascript я тогда знал на довольно низком уровне, и тем более мало знал про модули node.js — однако разработка продолжается и сейчас, и проект потихоньку стал напоминать Франкенштейна, на котором можно наблюдать «пути становления». Параллельно в фоновом режиме идёт разработка новой версии, с более грамотным подходом к качеству кода и вообще архитектуре.

Инфраструктура и окружение

Всё работает на node.js, с nginx наружу. Смешно сказать, но даже отдача большинства файлов до сих пор лежит на плечах node.js — запрос, открытие/чтение файла, отдача содержимого с нужными заголовками… Этот подход уже был мной сто раз проклят, но пока оно остаётся в таком виде. Однако, сам node.js работает совершенно без нареканий и полностью меня устраивает.

Собственно база картинок

Конечно, база картинок — самое главное, что есть на сайте. Раньше она была организована вообще без БД — в SVG-файле были ссылки на картинки с номерами, и при нажатии на такую ссылку с сервера просто забирался файл «/photos/№_картинки.jpg». Когда количество фотографий превысило сотню, это тоже стало жутко напрягать, и в скором времени было переведено в базу данных. В SVG остался номер картинки, однако он теперь указывает на номер записи в БД, а в записи содержится уже всё нужное — адреса картинки во всех трёх размерах, связанные объекты, дата/место создания и прочее. Также создана база зданий, в которой пока хранятся только их названия.

Интерактивная карта

Интерактивная карта является моей гордостью. Меня всегда привлекали векторные форматы, однако в то время я практически ничего не знал о SVG. Эта карта стала вообще первым опытом применения SVG — и надо сказать, очень успешно. Не нужно заводить активные области на img, либо как-то перехватывать нажатия с помощью яваскрипта — достаточно просто привязать js-обработчики ко всем объектам SVG. Правда, SVG-объекты пока не встраиваются автоматом в DOM (а тем более при автоматическом их создании), поэтому приходится вручную генерировать специальный SVG-DOM, однако это не так уж и сложно.

SVG поистине очень удобный формат. Сочетание удобства написания вручную (это просто XML), кроссбраузерности, скриптовых возможностей (интерактивность, динамическое добавление объектов, встроенная анимация) и малого размера, на мой взгляд, делают его приоритетным для создания подобных карт, интересных и лёгких фонов, и прочих элементов оформления. Ну и конечно, если вы рисуете какой-то изначально векторный интерфейс (например, органы управления SCADA) — то SVG становится вашим первым выбором.

Сначала я правил SVG вручную, добавляя в него всё новые и новые ссылки на фотографии. Но опять же, после добавления двухсотой фотографии был сделан скрипт, динамически добавляющий все эти объекты, получая их координаты из БД.