Авторизация
×

Логин (e-mail)

Пароль

Интерактивные истории, текстовые игры и квесты
Гиперкнига

Библиотека    Блог

Посетите наш новый сайт AXMAJS.RU

Элементы интерфейса. Раскрывающиеся ссылки

Борис Семёнов (Morych), 23.05.13 | Практика ASM

Раскрывающиеся ссылки или список-дерево — это совсем простой элемент интерфейса, предназначенный для компактного представления значительного объёма информации на одном экране.

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

Выглядеть это может, к примеру, следующим образом:

И полный код нашей тестовой истории с заготовкой элемента интерфейса:

:: StoryTitle
Элементы интерфейса. Раскрывающиеся ссылки

:: Start
<<set $link1 = false>>
<<set $link2 = false>>
<<set $link3 = false>>
[[Тест]]

:: Тест
<<if $link1>>
    [[▼ Ссылка 1|Тест {$link1 = !$link1}]]
    ^^Информация, которая относится к ссылке 1.^^
<<else>>
    [[► Ссылка 1|Тест {$link1 = !$link1}]]
<<endif>>
<<if $link2>>
    [[▼ Ссылка 2|Тест {$link2 = !$link2}]]
    ^^Информация, которая относится к ссылке 2.^^
<<else>>
    [[► Ссылка 2|Тест {$link2 = !$link2}]]
<<endif>>
<<if $link3>>
    [[▼ Ссылка 3|Тест {$link3 = !$link3}]]
    ^^Информация, которая относится к ссылке 3.^^
<<else>>
    [[► Ссылка 3|Тест {$link3 = !$link3}]]
<<endif>>

У каждой ссылки есть свой объект $link1...$linkN, который отвечает за видимость соответствующей информации. Если значение объекта равно true, информация видна, если false — скрыта. При нажатии на ссылку значение объекта меняется на противоположное:

{$linkN = !$linkN}

Если изменяющие направление стрелки перед ссылками не нужны, то код для каждой ссылки можно упростить:

[[Ссылка N|Тест {$linkN = !$linkN}]]
<<if $linkN>>
    ^^Информация, которая относится к ссылке N.^^
<<endif>>

Но лично мне больше нравится со стрелками. :) И не забываем инициализировать все объекты перед началом игры (хотя раскрывающиеся ссылки будут работать и без инициализации).

Комментарии: 3.

Профиль


Закрыть
DoubleDragon
23.05.13 20:51

Очень просто и эффективно!
Дженни
24.05.13 07:00

Со стрелочками гораздо нагляднее!
Morych
24.05.13 17:56

Да-да, согласен! :)

Для того, чтобы оставлять комментарии, необходимо зарегистрироваться и подтвердить в профиле указанный e-mail адрес.

При использовании любых материалов блога обязательно указание ссылки на источник