Граф приглашений habrahabr.ru
Вам нужно написать букмарклет, который будет запускаться в браузере на странице http://habrahabr.ru/users/ и который для первых N пользователей страницы http://habrahabr.ru/users/ построит и визуализирует граф приглашений на Хабр.
Пользователи Хабра могут:
- регистрироваться сами (тогда они будут являться корнем дерева)
- могут быть приглашены на сайт другим пользователем (тогда они будут являться узлом дерева)
- пользователи могут никого не приглашать (тогда они будут являться листьями дерева)
Дерево считается завершенным, когда оно имеет корень и все его концевые узлы являются листьями.
Пример: возьмем пользователя Zelenyikot он был приглашен на сайт пользоваттелем tyr и пригласил на сайт AntiInvader, Astrok, Biverofevil, vnnspace и других пользователей. В этом дереве tyr является корнем дерева (сам зарегистрировался), Zelenyikot узлом (был приглашен tyr), а vnnspace является листом этого дерева.
Сокращенная запись этого дерева будет выглядеть так:
tyr
├── Zelenyikot
│ ├── Biverofevil
| ├── ...
│ └── vnnspace
|
└── art3x
└── ...
Результатом выполнения задания должен быть 1 файл, который по возможности не должен загружать внешние зависимости.
Плюсами будут
- Разбиение проекта на модули (CJS, AMD, ...)
- Использование Promise ($.Deferred) для асинхронных операций
- Сборка модулей в 1 бандл (используя Grunt.js)
- AMD+r.js, CJS+browserify, CJS+LMD
- Анимация процесса загрузки и парсинга страниц
- Анимация процесса построения дерева (перестраивать дерево по мере загрузки страниц)
- Визуализация узла (иконка и имя пользователя минимум)
- Динамический рассчет высоты дерева
- Использование библиотек для визуализации данных (d3.js)
- Кэширование собранных данных в localStorage