Делаем онлайн-решалку шахматных задач
Ещё относительно недавно я ленился переделать "шахматную ходилку" так, чтобы она могла помочь решать шахматные задачи. Сегодня, благодаря готовому продукту chessboard.js и ещё паре известных решений, таких как JQuery и JSON, можно сделать у себя на сайте такую решалку за 5 минут. Ну или не на сайте, а просто, "чтоб была".
Для удобства скидаем все нужные яваскрипты в папку js
, стили - в папку css
, картинки - в img
. Я поменял в коде chessboard.js
какой-то бывший там длинный и неудобный путь к картинкам на
cfg.pieceTheme = 'img/{piece}.png';
(строка 445). Ну и сами картинки выкачал.
Всё, что понадобится для запуска системы - подключить скрипты и стили из обычного файла HTML (или PHP), скажем, так:
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" /> <link rel="stylesheet" href="css/chessboard.css" /> <link rel="stylesheet" href="css/puzzle.css" /> <script src="js/json3.js"></script> <script src="js/jquery.js"></script> <script src="js/jquery-ui.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/chessboard.js"></script> <script src="js/chess.js"></script> <script src="js/puzzle.js"></script>
(можно разместить всё это в теге <head>
документа), ну и
<div id="container"> <div id="title" style="font-weight:bold;"></div> <div id="board" style="width: 400px"></div> <div id="msg" style="font-weight:bold; color:#CD5C5C;"></div> </div> <script src="puzzles.js"></script> <noscript>Извините, для работы приложения нужен включённый JavaScript</noscript>
(где хотите). Скрипты, правда, занимают почти мегабайт, но, по нынешним временам, это мелочь.
Не гарантирую, что не будет каких-нибудь мелких предупреждений в консоли Javascript, например, сообщений от JQuery об отсутствующем файле чего-нибудь :)
Теперь засуньте свои задачи в файл puzzles.js
следующего формата:
var puzzles = [ { date: '04/23/15', balP: '3', balM: '8', title: 'Мат в 2 хода - Ход белых', start: '1Q6/8/8/8/8/k2K4/8/8 w - - 0 1', moves: [ 'd3-c3', 'a3-a4', 'b8-b4' ] }, { date: '04/23/15', balP: '1', balM: '10', title: 'Мат в 1 ход - Ход белых', start: '3q1rk1/5pbp/5Qp1/8/8/2B5/5PPP/6K1 w - - 0 1', moves: [ 'f6-g7' ] } ];
Файл расположен, как видно из HTML-кода, в той же папке, что файл HTML. В файле, лежащем в архиве, задач намного больше.
date
- дата составления задачи;balP
,balM
- это баллы "+" и "-" за решение, раскомментарьте вjs/puzzle.js
строки 41 и 56 и впишите там URL скрипта, который будет накапливать статистику... если, конечно, хотите таковой завести;title
- заголовок;start
- начальная позиция в нотации FEN;moves
- решение.
Можно скачать всё сразу, развернуть архив, не создавая новой папки, и запустить файл puzzle.html
, должно работать на локальном компьютере.
Конечно, в очень старых браузерах, вроде IE8, работать не будет, как и используемые библиотеки.
Кодировка обоих файлов с кириллицей - Windows-1251, а не Юникод, но не должно быть проблем и после перекодирования в Юникод, так как все остальные библиотеки чисто англоязычные.
Скриншот приложения из "Хрома":
решаем шахматные задачи прямо в браузере
У кого есть интересные задачи - буду рад их увидеть.
При составлении задач имейте в виду следующее:
- кто ходит первым - определяется из нотации FEN (свойство
start
): значениеw
после описания положений фигур - белые,b
- чёрные; - ходы в массиве
moves
- только поле "отправления" и поле назначения, с тире между ними:'e2-e4'
; - ходы в массиве
moves
записываются с чередованием ходов белых и чёрных, ходы за соперника компьютер делает сам; - избегайте неоднозначностей при решении задач, теоретически можно было бы сделать
moves
массивом массивов и предусмотреть варианты ходов, но хлопотно (см.js/puzzle.js
); - избегайте пата, после этого придётся обновлять документ, так как отмены ходов в этой версии нет;
если предусмотрено превращение пешки - превращайте в ферзя, в коде- это вроде поправил, можно превращать, превращения белых - строчными буквамиjs/puzzle.js
стоит указаниеpromotion: 'q'
Скачать решалку шахматных задач, работающую онлайн и оффлайн в браузере, архив .zip (275 Кб)
Более новая сборка для PHP 7, MySQLi и кодировки Юникода utf-8, архив .zip с папкой внутри (274 Кб)
poschess.gixx.ru - задачи, игра по переписке, общение
23.04.2015, 13:15 [17217 просмотров]