Перевод. Оригинальная статья Launching HTML5 Games In The ARK Desktop Wallet — Part One
https://blog.ark.io/launching-html5-games-in-the-ark-desktop-wallet-part-one-b26fd444f0d79c42Запуск HTML5 игр в настольном кошельке ARK - часть первая![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.ibb.co%2F163z24p%2F1-d-Yimg-Wzo-Tn-Xc-Nv-VFfdla-Zg.png&t=663&c=lw5dKlDXghZIkQ)
Добро пожаловать в первый урок из нашей серии, посвященный запуску игр на HTML5 в ARK Desktop Wallet! Эта серия предназначена для разработчиков всех уровней. Цель этой серии - преобразовать игрs HTML5 в полноценный плагин ARK Desktop Wallet. Первое руководство объяснит, как взаимодействовать с блокчейном в автономной среде HTML5, прежде чем, наконец, перейти в ARK Desktop Wallet.
На первый взгляд, этот учебник будет разбит на следующие части:
Часть первая: как импортировать адрес кошелька ARK в ваше приложение
Часть вторая: создание бэкенда для вашего плагина
Часть третья: заставить вашу игру работать с системой ставок
Часть четвертая: внедрение игровой логики в ваш плагин
Часть пятая: определение того, как выпадают призы
Часть шестая: запуск вашей игры в качестве плагина кошелька
Прежде чем мы начнем, нужно помнить одну вещь: эти учебные пособия направлены на запуск HTML5-игры в ARK Desktop Wallet. Эти учебные пособия не предназначены для обучения разработчиков, как создавать игры. Однако, как только ваша игра будет готова, мы будем рады поддержать ее в ARK Desktop Wallet. Итак, давайте начнем с импорта адреса кошелька в вашу игру!
Импортирование адреса кошелька в вашу игруВ этой первой части этой серии мы рассмотрим, как импортировать адрес кошелька, убедившись, что он действителен, чтобы игроки случайно не ошиблись, введя неправильный адрес и потеряв потенциальный приз. Это заложит основу для следующих частей, где мы напишем нашу игровую логику в нашем собственном плагине Core.
Мы будем использовать бесплатный движок Construct 3 - среду разработки игры «укажи и щелкни» - чтобы создать нашу простую игру HTML5, так что зайди туда и начни
новый проект.
https://editor.construct.net/![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.ibb.co%2FdL3CVNM%2F1-d-Yimg-Wzo-Tn-Xc-Nv-VFfdla-Zg.png&t=663&c=-ALBdxz7pgbhOw)
Это кому-нибудь знакомо? Это Сапер… Первая игра ARK для блокчейнов «игрок против игрока»!
К сожалению, на момент написания ARK JavaScript SDK не был полностью совместим с играми HTML5 из коробки, поэтому мы будем использовать альтернативу bs58check для проверки адресов. Шаги для создания нашей альтернативы описаны ниже, но если вы предпочитаете пропустить это, вы можете использовать готовую версию, которую мы обсудим через секунду. Если вы хотите собрать его самостоятельно, убедитесь, что у вас установлены NodeJS и npm, а затем выполните:
npm install -g browserify uglify-jsnpm
install bs58check
browserify — standalone bs58check -r bs58check | uglifyjs > bs58check.min.js
Затем мы импортируем наш файл bs58check.min.js в наш проект Construct 3, чтобы игра могла его использовать. Это действительно просто - просто щелкните правой кнопкой мыши «Сценарии» в правой верхней панели, выберите «Импорт сценариев» и перетащите файл bs58check.min.js в окно. Нажмите Импорт, и все готово!
Что делает адрес кошелька ARK действительным?Теперь нам нужно отступить от практической деятельности и сосредоточиться на теоретической стороне. Что делает адрес действительным, и как мы можем отделить адрес публичной сети ARK от адреса в сети разработки ARK или другом бриджчейне?
Каждый адрес должен быть ровно из 34 символов, а в случае публичной сети ARK каждый адрес начинается с буквы A; и наоборот, адреса в ARK Development Network начинаются с буквы D, а бриджченйны могут использовать свой собственный символ. Этот первый символ связан с сетевой версией - запомните, мы вернемся к нему через позже. Символы, используемые в адресе, известны как base58, который представляет собой группу из 58 буквенно-цифровых символов, которые легко различить для минимизации риска путаницы, например, 0 (ноль) и O (верхний регистр o) выглядят одинаково, поэтому они исключаются ; кроме того, I (прописные буквы i) и l (строчные буквы L) исключаются из набора символов по той же причине. Наконец, адрес включает контрольную сумму, чтобы убедиться, что остальная часть адреса была введена правильно, без опечаток.
Итак, помните, как первый символ адреса ARK Public Network - A, а ARK Development Network - D? Это происходит от того, что называется сетевой версией, и каждый блокчейн может иметь различную сетевую версию, которая определяет первый символ всех адресов кошелька в этой сети. В случае, если вам интересно - и вам это понадобится позже, - сетевая версия для ARK Public Network - 23, а сетевая версия для ARK Development Network - 30.
Теперь вы знаете, что адрес действителен, если - и только если - он имеет длину ровно 34 символа, начинается с правильного символа для сетевой версии блокчейна, содержит только символы в группе base58 и имеет действительную контрольную сумму. Теперь добавьте это в нашу игру!
Добавление адреса кошелька ARK в вашу игруДавайте начнем с добавления некоторых объектов в наш макет. В нашем примере мы собираемся добавить поле ввода текста для ввода пользователем своего адреса, кнопку для подтверждения введенного адреса и текстовое отображение, чтобы сообщить нам, является ли адрес действительным. Дважды щелкните «Макет 1» в правой верхней панели, затем щелкните правой кнопкой мыши пустой холст и выберите «Вставить новый объект». Дважды щелкните ввод текста и поместите его на макет, где вы хотите, чтобы он появился. Повторите это, чтобы добавить объекты Button и Text тоже. Не стесняйтесь настраивать стиль объектов так, как вам нравится, и если вы чувствуете себя креативным, добавьте несколько спрайтов и фоновое изображение, чтобы оживить ваш макет.
![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.ibb.co%2FfQ7nxx1%2F3.png&t=663&c=lkc4TlUQgr-KJw)
Сейчас мы собираемся погрузиться в Лист событий, и именно здесь происходит вся магия. Конструкция 3 основана на событиях, то есть реагирует на ситуации, возникающие в течение жизненного цикла игры. В нашем случае это событие, когда пользователь нажимает нашу кнопку. Дважды щелкните «Лист событий 1» и выберите «Добавить событие». Дважды щелкните нашу кнопку и выберите событие «По нажатию». Он будет выделен желтым цветом, поскольку это обычное событие.
![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.ibb.co%2FM7HXg32%2F4.png&t=663&c=STSY82OxbrokWA)