Смотри также : Список примеров , учебное видео
Если Ваш сайт работает на WordPress, то может пригодиться плагин Simple Bitcoin Faucets – там много подобных игр.
Существуют тысячи бесплатных игр на Javascript. Если у Вас игровой вебсайт, почему бы не порадовать игроков бонусами?
В этом примере мы используем классический Тетрис – замечательную реализацию Blockrain. Игра работает внутри DIV :
<div class="game" style="width:250px; height:500px;"></div>
и запускается вот так:
$('.game').blockrain({showFieldOnStart: true});
Безусловно, в любой игре будет нетрудно найти код, выполняемый, когда игра закончена, и пора выдавать бонусы.
У этой игры всё совсем просто – есть удобный callback:
onGameOver: function(score){ //тут мы спрячем игру // и покажем один из Кранов (по результату игры) }
Итак, давайте создадим Краны – игровые бонусы, используя URL страницы с игрой в конфигурации крана. Чем больше Кранов – тем лучше. Во-первых, чтобы было интереснее играть. Во-вторых – больше ссылок на Вашу страницу из Списка Кранов, и из списка приложений используемой микроплатёжной системы, например отсюда.
Если Вы не знаете, как создать Удалённый Кран – посмотрите этот пример, это совсем просто.
Для простоты давайте сдлаем пять бонусных Кранов, первый (очки – 10000 или меньше, “Сатоши Тетрис – приз 10K” FaucetID 123951, второй (очки – 20000, “Сатоши Тетрис – приз 20K”, FaucetID 123952) … пятый (очки – 50000, “Сатоши Тетрис – приз 50K”, FaucetID 123955).
Теперь подготовим HTML где мы покажем Кран, когда игра закончится:
<!-- Блок div id='wmexp-faucet-TO-BE' сейчас невидим, мы выставим правильный id и покажем его по окончании игры --> <div id='wmexp-faucet-TO-BE' style='display:none; min-height:600px;background-color:blue;'></div> <!-- Блок div class="game" сейчас видимый, мы его спрячем, когда игра закончится и будет вден бонусный Кран --> <div class="game" style="width:250px; height:500px;"></div>
Последний штрих, давайте напишем функцию, которая выбирает Кран в зависимости от набранных очков, прячет игру, и Кран показывает.
<script> show_reward = function(score) { var rewards = [ {score:10000, faucet_id:123951}, {score:20000, faucet_id:123952}, {score:30000, faucet_id:123953}, {score:40000, faucet_id:123954}, {score:50000, faucet_id:123955}, ]; var faucet_id = rewards[0].faucet_id; for(var i = 0; i < rewards.length; i++) { if(score >= rewards[i].score) { faucet_id = rewards[i].faucet_id; } } document.querySelector('.game').style.display = 'none'; //прячем игру document.querySelector('#wmexp-faucet-TO-BE').style.display = 'block'; //показываем Кран document.getElementById('wmexp-faucet-TO-BE').id = 'wmexp-faucet-'+faucet_id; // выставляет правильный id var script = document.createElement('script'); //создает скрипт script.src = 'https://wmexp.com/faucet/'+faucet_id+'/'; //вычисляет url по Faucet ID document.head.appendChild(script); //вставляет скрипт } </script>
Теперь вставим вызов функции в код:
<script> jQuery(document).ready(function () { jQuery('.game').blockrain( { showFieldOnStart: true, onGameOver: function(score){ show_reward(score); }, }); }); </script>
Всё! Вот результат: