Напишите свои собственные таблицы встреч D&D на JavaScript для Dungeon Masters
coding web-monetization javascript javascript-development front-end-development gaming side-project dungeons-and-dragons online-gaming

Напишите свои собственные таблицы встреч D&D на JavaScript для Dungeon Masters

4 марта 2022 г.

Введение в кликабельные таблицы контактов + пример


Вот фрагмент, который потенциально может быть полезен любому мастеру подземелий. После этого пошагового руководства вы поймете, как работает скрипт, и адаптируете его для своих игр.


Полный пример здесь:


https://codepen.io/mongo0se/pen/JjOvgZg


Фрагмент пошагового руководства


Мясо и картошка — это JavaScript-функция rollOnTable:


```javascript


функция rollOnTable() {


// создаем список всех строк таблицы


var trs = document.getElementById("встречи").getElementsByTagName("tr");


// выбираем случайное число, которое находится в диапазоне количества строк таблицы


var rand = Math.floor( Math.random() * trs.length );


// установить для всех строк белый фон (не выделенный).


// - это на случай, если мы снова бросим по столу. В противном случае мы бы продолжали выделять


// строки случайным образом, и было бы неясно, каков будет результат.


var trsList = Array.prototype.slice.call(trs);


trsList.forEach((элемент) => { element.style.backgroundColor = "white"; })


// выделить новую строку


trs[rand].style.backgroundColor = "голубой";


Короче говоря, все, что происходит, это то, что вы запускаете эту функцию сначала при загрузке страницы, а затем снова при нажатии кнопки.


Таблица (как показано в примере codepen.io) может быть оформлена по размеру. Я включил номер броска кубика, чтобы его можно было распечатать, чтобы дать возможность выбора.


Дальнейшее использование помимо таблиц контактов + текст аромата


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


Для ароматного текста я бы предложил адаптацию моего генератора ночных свиданий: https://codepen.io/mongo0se/pen/oNwBxvz.


:::предупреждение


В этом фрагменте используется jQuery вместо ванильного JavaScript, как в последнем фрагменте. Конечно, вы можете отказаться от этой зависимости и применить ту же логику. У меня нет причин использовать jQuery здесь, это было чисто по привычке.


Например, 3 массива, содержащие части строк идеи даты:


```javascript


вар элемент = [


"Палаш",


"Шелковая маска",


"Сухая рука"


переменная itemAction=[


"мерцает в существование",


"угрожающе светится",


"испускает жуткий шепот из множества тихих голосов",


вар itemSuffix=[


".",


".",


"в руке бегущего к тебе гиганта.",


"на богато украшенном деревянном постаменте."


В завершение: напишите свои собственные кликабельные таблицы встреч


Я надеюсь, что эти фрагменты найдут применение где-нибудь в сеансе или, по крайней мере, дадут толчок вашему творчеству.


Успокойтесь, а если вы не можете успокоиться, то сделайте это так, как сможете.


Оригинал

Recent Post

Categories

PREVIOUS ARTICLE
NEXT ARTICLE