Специальные функции для Интернета

Чернила были разработаны так, чтобы максимально сосредоточиться на одной задаче: написание интерактивного текста. Мы сопротивлялись перегрузке языка дополнительными функциями, чтобы сохранить хороший баланс мощности, гибкости и простоты.

Таким образом, у чернил на языке нет встроенных инструментов для таких вещей, как вставка изображений, поскольку он полностью зависит от типа истории, которую вы делаете. Если вы пишете диалог для 3D-игры, указание отображаемого изображения не обязательно имеет смысл.

Тем не менее, Inky предоставляет некоторые дополнительные функции, которые можно использовать специально для сохранения в Интернете (начиная с версии 0.10.0). Все эти дополнительные функции используют чернильную систему тегов, которая позволяет вам предоставлять специальные текстовые аннотации для каждой строки, перед ней или над ней. Теги - это просто чистый текст, который невидим для читателя, но может быть прочитан игровой системой или, в нашем случае, веб-шаблоном.

Изображений

Вот как вы вставляете изображение:

# IMAGE: imageName.jpg

Файл изображения должен находиться в той же папке, что и другие файлы, или, если хотите, вы можете использовать путь, например:

# IMAGE: myImages/imageName.jpg

Вы также можете добавить тег изображения в конце строки. Изображение всегда будет отображаться над текстом в игре.

The above picture is a dog. # IMAGE: dog.jpg

(Это на самом деле потому, что все теги связаны с определенными строками текста, и когда у вас есть тег в отдельной строке, он будет связан со строкой текста под ним.)

Очистка экрана

Еще одна особенность, характерная для веб-шаблона Inky, - это тег clear:

# CLEAR

Это удалит весь текст в текущем потоке, и начнется снова с верхней части страницы. Убедитесь, что вы вставляете это сразу после выбора! Если вы вставите его в середину фрагмента текста, верхняя часть будет очищена до его просмотра.

Глобальные теги: темная тема и автор

Чтобы использовать темную тему, просто поместите это в самый верх вашего файла с чернилами:

# theme: dark

Веб-шаблон может считывать это как глобальный тег и имеет встроенный стиль для изменения темы. (Он использует «темный» как класс для всей страницы. Когда вы видите использование.darkселектора в файле CSS, это переопределения для темной темы.)

Чтобы установить имя автора, поместите его в верхней части вашего файла чернил:

# author: Your Name

Это будет найдено чернильным веб-шаблоном и использовано для вставки подписи непосредственно под основным заголовком.

Пользовательские классы CSS

Вы также можете полностью настроить внешний вид отдельных строк текста с помощью классов CSS. Чернилами добавьте тег в строку, например:

You make your way into the forest.

There's a pool of blood on the ground. # CLASS: danger

Затем вы можете сказать браузеру, как выглядит «опасный» класс, добавив следующее в ваш style.css:

.danger {

color: red;

}

Точка, за которой следует слово, определяет, как мы определяем класс стилей в CSS. В большинстве наших предыдущих примеров не было точек, поскольку они были встроены в такие элементы, как «p» для «абзаца». Они также могут быть объединены, p.dangerчто означало бы «параграф с классом опасности» и сработало бы так же хорошо в нашем примере.

Пользовательский пример CSS: конец

Шаблон Inky содержит встроенные стили для класса с именем end, если вы хотите показать слова The End в центрированном / жирном стиле. Итак, чтобы использовать это, поместите следующее в конце вашей истории:

# CLASS: end

The End

-> END

Подведем итог:

  • Средняя линия - это сам текст.
  • Первая строка применяет класс CSS «конец» к тексту.
  • Последняя строка сообщает механизму чернил, что мы намеренно закончили, это не конец.

А чтобы настроить стиль конечного класса CSS, найдите.endв нижней части файла CSS.

Перезапуск истории

Веб-шаблон Inky имеет еще одну встроенную функцию. Если вы вставите # RESTARTтег, он немедленно очистит ход истории (включая всю историю выборов игрока и все переменные) и начнет заново с самого начала. Поскольку это немедленно, вы, вероятно, захотите оставить выбор, например:

You died!

+ Try again from the beginning.

# RESTART

-> END

На -> ENDсамом деле переадресация никогда не будет достигнута, но это хорошая практика: вы все равно захотите, чтобы Инки не жаловался, что у вас плохой конец.

Настройка внешнего вида

Это руководство предназначено для начинающих - оно не предполагает никаких знаний о веб-технологиях.

Приведенный выше шаг экспорта должен был сохранить папку со следующими файлами:

  • index.html - файл HTML, который связывает другие вместе, и является основным, который вы дважды щелкаете, если хотите просмотреть свою историю. Он сообщает браузеру приблизительную структуру страницы и загружает другие файлы.
  • main.js - это основной файл JavaScript, где вы можете настроить поведение представления истории.
  • style.css - это основной файл CSS, который определяет такие вещи, как цвета, шрифты, а также информацию о размерах и интервале, такую ​​как ширина абзацев и поля. Мы также можем определить переходы, например, как исчезают абзацы.
  • yourStoryName.js - это фактическое содержание чернил, экспортированное Inky. Это единственный файл, который полностью уникален для вашей истории, в отличие от части общего шаблона, сохраненного Inky. Вы никогда не должны редактировать этот файл напрямую.
  • ink.js - это порт JavaScript самого движка чернил.

Чтобы изменить любой из этих файлов, вы должны открыть их в текстовом редакторе. Мы рекомендуем Sublime Text, но вы также можете использовать Notepad ++ для Windows, TextEdit для Mac или любой другой редактор, с которым вы знакомы. Однако не используйте Microsoft Word!


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: