Задача

Реализовать интерфейс по предоставленному дизайну (см. icons.psd). Как это должно работать Пользователю выводится список действий в виде иконок. Каждое действие можно выполнять не чаще чем раз в N секунд (задается в настройках действия). После выполнения действия (клика на иконку) оно становится неактивным. Когда действие неактивно, то над ним показывается таймер с обратным отсчетом. Если в настройках действия указано, что оно может использоваться только VIP-пользователями, то остальным пользователям, при попытке выполнения, должно выдаваться сообщение об ошибке.

Сами “действия” можно сделать пустыми функциями. Как иконки с действиями реализованы в игре можно посмотреть здесь http://fotostrana.ru/pet/

Условия

В PHP-шаблоне у вас есть переменные, где хранится информация о списке действий и прочие данные.

Список действий:

$actions = array(
0 => array(
'id' => 123,
'css_class' => 'icoTest icoPos1',
'title' => 'Test 1',
'vip' => false,
'rest_time' => 0,
'recovery_time' => 600,
),
1 => array(
'id' => 123,
'css_class' => 'icoTest icoPos2',
'title' => 'Test 2',
'vip' => false,
'rest_time' => 428,
'recovery_time' => 660,
),
2 => array(
'id' => 123,
'css_class' => 'icoTest icoPos3',
'title' => 'Test 3',
'vip' => true,
'rest_time' => 0,
'recovery_time' => 480,
),
);

VIP-статус пользователя:

$user_is_vip = false;

Что необходимо сделать

• Создать PHP-файл, где будет формироваться необходимый HTML- и JS-код на основе упомянутых выше переменных.
• Создать HTML-файл с готовым содержимым для тестирования в браузере.
• Реализовать задачу на JavaScript с применением jQuery (любая версия).