Редактирование: NanoUi
Перейти к навигации
Перейти к поиску
Внимание! Вы не авторизовались на сайте. Ваш IP-адрес будет публично видимым, если вы будете вносить любые правки. Если вы войдёте или создадите учётную запись, правки вместо этого будут связаны с вашим именем пользователя, а также у вас появятся другие преимущества.
Правка может быть отменена. Пожалуйста, просмотрите сравнение версий, чтобы убедиться, что это именно те изменения, которые вас интересуют, и нажмите «Записать страницу», чтобы ваша отмена правки была сохранена.
Текущая версия | Ваш текст | ||
Строка 159: | Строка 159: | ||
====Формат:==== | ====Формат:==== | ||
− | <pre class="blockofcode"><nowiki>{{:data.variable}}</nowiki></pre> | + | <pre class="blockofcode"><nowiki> {{:data.variable}}</nowiki></pre> |
Тэг вывода выводит на окно значение переменной как сроку | Тэг вывода выводит на окно значение переменной как сроку | ||
Строка 168: | Строка 168: | ||
<pre class="blockofcode"> | <pre class="blockofcode"> | ||
− | data["someString"] = "I am a string" | + | data["someString"] = "I am a string" |
</pre> | </pre> | ||
И в womdinger.tmpl мы запрашиваем доступ к data с ключём: | И в womdinger.tmpl мы запрашиваем доступ к data с ключём: | ||
<pre class="blockofcode"><nowiki> | <pre class="blockofcode"><nowiki> | ||
− | {{:data.someString}} </nowiki> | + | {{:data.someString}} </nowiki> |
</pre> | </pre> | ||
Когда интерфейс прогрузится, тэг будет прогружен как: | Когда интерфейс прогрузится, тэг будет прогружен как: | ||
<pre class="blockofcode"> | <pre class="blockofcode"> | ||
− | I am a string. | + | I am a string. |
</pre> | </pre> | ||
Строка 202: | Строка 202: | ||
<pre class="blockofcode"><nowiki> | <pre class="blockofcode"><nowiki> | ||
{{if expression}} | {{if expression}} | ||
− | < | + | <expression true content> |
{{/if}} | {{/if}} | ||
{{if expression}} | {{if expression}} | ||
− | < | + | <expression true content> |
{{else}} | {{else}} | ||
− | < | + | <expression false content> |
{{/if}} | {{/if}} | ||
{{if expression1}} | {{if expression1}} | ||
− | < | + | <expression1 true content> |
{{else expression2}} | {{else expression2}} | ||
− | < | + | <expression2 true content> |
{{/if}}</nowiki> | {{/if}}</nowiki> | ||
</pre> | </pre> | ||
− | Тэг If отображает информацию в зависимости от правдивости данного выражения. Если вы видите {{if data.is_prog}}, то это проверка на присутствие переменной is_prog (если is_prog равен null или 0 или не обозначен, то действие не выполняется). | + | Тэг If отображает информацию в зависимости от правдивости данного выражения. Если вы видите { {if data.is_prog}}, то это проверка на присутствие переменной is_prog (если is_prog равен null или 0 или не обозначен, то действие не выполняется). |
Комбинируя if и тэг else можно отображать другую информацию если выражение равно True. | Комбинируя if и тэг else можно отображать другую информацию если выражение равно True. | ||
Строка 230: | Строка 230: | ||
<pre class="blockofcode"> | <pre class="blockofcode"> | ||
<nowiki> | <nowiki> | ||
− | {{if data.aNumber}}data.aNumber | + | {{if data.aNumber}} data.aNumber is set (not null) and is positive {{/if}}</nowiki> |
</pre> | </pre> | ||
− | Когда интерфейс прогрузится | + | Когда интерфейс прогрузится тэг будет заменён на: |
<pre class="blockofcode"> | <pre class="blockofcode"> | ||
− | data.aNumber | + | data.aNumber is set (not null) and is positive |
</pre> | </pre> | ||
+ | Потому что data.aNumber обозначен (не null) и положителен (it's value is 123). | ||
====Пример 2:==== | ====Пример 2:==== | ||
Строка 242: | Строка 243: | ||
Пример темплейта: | Пример темплейта: | ||
− | <pre class="blockofcode">{{if data.someString == "Who goes there?"}} Some string is "Who goes there?" {{else}} Some string is not "Who goes there?" {{/if}</pre> | + | <pre class="blockofcode">{{if data.someString == "Who goes there?"}} Some string is "Who goes there?" { {else}} Some string is not "Who goes there?" { {/if}</pre> |
Когда интерфейс прогрузится тэг будет заменён на: | Когда интерфейс прогрузится тэг будет заменён на: | ||
Строка 254: | Строка 255: | ||
Пример темплейта: | Пример темплейта: | ||
<pre class="blockofcode"><nowiki> | <pre class="blockofcode"><nowiki> | ||
− | {{if data.aNumber < 50}} data.aNumber | + | {{if data.aNumber < 50}} data.aNumber is less than 50 {{else data.aNumber < 100}} data.aNumber is less than 100 {{else data.aNumber < 150}} data.aNumber is less than 150 {{else}} None of the expressions above are true. {{/if}</nowiki> |
</pre> | </pre> | ||
Когда интерфейс прогрузится тэг будет заменён на: | Когда интерфейс прогрузится тэг будет заменён на: | ||
Строка 273: | Строка 274: | ||
Каждый раз, когда тег for выполняет проходит по массиву, он устанавливает переменную ("value" по умолчанию) для данных текущей записи (другая переменная, значение по умолчанию «index», содержит индекс (номер элемента в массиве)). | Каждый раз, когда тег for выполняет проходит по массиву, он устанавливает переменную ("value" по умолчанию) для данных текущей записи (другая переменная, значение по умолчанию «index», содержит индекс (номер элемента в массиве)). | ||
− | И примером этого является использование тега вывода для печати содержимого (например, {{: value.key1}} и {{: value.key2}}). | + | И примером этого является использование тега вывода для печати содержимого (например, { {: value.key1}} и { {: value.key2}}). |
В сочетании с empty тегом тег for может отображать содержимое, когда массив пуст. | В сочетании с empty тегом тег for может отображать содержимое, когда массив пуст. | ||
Строка 296: | Строка 297: | ||
Пример темплейта: | Пример темплейта: | ||
− | + | <nowiki> | |
− | {{for data.emptyArray}} | + | { {for data.emptyArray}} |
− | + | { {:value.key}} | |
− | {{empty}} | + | { {empty}} |
− | + | This list is empty. | |
− | {{/for}</nowiki | + | { {/for} |
+ | </nowiki> | ||
Когда интерфейс прогрузится, тэги будут заменены на: | Когда интерфейс прогрузится, тэги будут заменены на: | ||
<pre class="blockofcode"> | <pre class="blockofcode"> | ||
− | + | This list is empty. | |
</pre> | </pre> | ||
=== Template Helpers === | === Template Helpers === | ||
− | Helpers - функции написанные на JavaScript, которые можно вызывать вместе с темплейтами. | + | Helpers - функции написанные на JavaScript, которые можно вызывать вместе с темплейтами. Они чаще вызываются в начале файла над HTML кодом. |
+ | |||
+ | Helpers вызываются с помощью объекта "helper". | ||
==== Link Helper ==== | ==== Link Helper ==== | ||
− | + | Format: | |
<pre class="blockofcode"><nowiki>{{:helper.link(text, icon, parameters, status, elementClass, elementId)}}</nowiki></pre> | <pre class="blockofcode"><nowiki>{{:helper.link(text, icon, parameters, status, elementClass, elementId)}}</nowiki></pre> | ||
− | + | The link helper generates a link (which by default is styled as a button). When clicked the button will send the supplied parameters to the server. | |
− | + | Parameters: | |
− | * text - | + | * text - string - The text which appears on the link. |
− | * icon - | + | * icon - string - An icon to show on the link. Icon names can be found at http://fontawesome.io/icons/. Examples: 'refresh', 'shuffle', 'radiation', 'power'. * parameters - JSON - Parameters to send to the server when the link is clicked. The "src" parameter is added automatically, do not add it here. |
− | * parameters - JSON - | + | * status - optional null/string - Optional status of the link. Can be null for active, 'disabled' for disabled or 'selected' for selected. Defaults to active if nothing is passed. |
− | * status - null/ | + | * elementClass - optional string - If provided this string will be added to the link as a class (used for custom styling in CSS or as a JavaScript selector). |
− | * elementClass - | + | * elementId - optional string - If provided this string will be added to the link as an id (used for custom styling in CSS or as a JavaScript selector). |
− | * elementId - | ||
'''Example 1: Basic usage''' | '''Example 1: Basic usage''' | ||
Строка 331: | Строка 334: | ||
<pre class="blockofcode"><nowiki>{{:helper.link('Toggle Power', 'power', { 'option' : 'togglePower' })}}</nowiki></pre> | <pre class="blockofcode"><nowiki>{{:helper.link('Toggle Power', 'power', { 'option' : 'togglePower' })}}</nowiki></pre> | ||
− | + | If clicked the receiving object's Topic proc's href_list will have the following entries (src is added automatically and should not be changed): | |
+ | |||
<pre class="blockofcode">list("src" = "\ref[src]", "option" = "togglePower")</pre> | <pre class="blockofcode">list("src" = "\ref[src]", "option" = "togglePower")</pre> | ||
Строка 338: | Строка 342: | ||
<pre class="blockofcode"><nowiki>{{:helper.link('Cut Red Wire', 'scissors', { 'wireColor' : 'red', 'action' : 'cut' })}}</nowiki></pre> | <pre class="blockofcode"><nowiki>{{:helper.link('Cut Red Wire', 'scissors', { 'wireColor' : 'red', 'action' : 'cut' })}}</nowiki></pre> | ||
− | + | If clicked the receiving object's Topic proc's href_list will have the following entries (src is added automatically and should not be changed): | |
+ | |||
<pre class="blockofcode">list("src" = "\ref[src]", "wireColor" = "red", "action" = "cut")</pre> | <pre class="blockofcode">list("src" = "\ref[src]", "wireColor" = "red", "action" = "cut")</pre> | ||