Игра "Пятнашки"
Приглашаю посмотреть на разработанный мной учебный (не обучающий) проект разработки скрипта игры "Пятнашки" (альфа-версия):
![]() Разработка: http://ru.wikiversity.org/wiki/15_puzzle Демо: http://puzzlewikivers.sourceforge.net/15puzzle.html Скрипт (версия 0.1): http://ru.wikiversity.org/wiki/15_puzzle_0.1 |
Как-то скучно. Пример похожего скрипта-плагина для jQuery.
P.S. А от выпадения неразрешимых комбинаций Вы как-нибудь защищаетесь? |
Вы отстали от тенденций в web-разработке лет на 10. Вы не умеете верстать. Код ужасен.
Вам нужно читать учебные материалы, а не писать их. Если бы это было подано, как "я написал свой первый скрипт, гляньте, что не так", было бы что обсуждать. И ещё: не любая комбинация в пятнашках сходится. Надо перемешивать начальную комбинацию, а не придумывать произвольную. |
Цитата:
Критиковать просто, а что-то сделать полезное желающих мало. Цитата:
|
Цитата:
|
Цитата:
Цитата:
Я не понимаю, почему люди, не разбирающиеся в предметной области, делает учебные материалы в этой области. А потом мы удивляемся, откуда новички набираются всего того бреда, с которым приходят на форум. |
Цитата:
Также и с Викиверситетом. Сейчас Вы критикуете, позже придут специалисты и всё исправят, и через несколько лет везде будут ссылаться на курсы Викиверситета как на образец. |
Цитата:
|
Цитата:
Вы зря гоните на Kolyaj, у него есть сайт alljs.ru, на котором он старался и писал учебные материалы для таких нубов как Вы и Я. :) ps: Ваш скрипт очень сомнителен с точки зрения обучающей способности, подача материала может быть, но не сам скрипт. Проще создать массив из 15 элементов и перемешать их, а не придумывать очень сложный для понимания велосипед. Дальше мне просто лень писать, что там исправлять, т.к. Вы должны ещё открыть для себя мир js и html/css |
Bolo1910,
пожалуйста, воспринимайте конструктивную критику конструктивно. Ваш код не тот, по которому стоит учиться. Используйте css, разделяйте логику и представление, не делайте кашу из тегов, не исользуйте document.write без необходимости, используйте методы DOM, забудьте про учебники по html, датированные ранее, чем 2005 годом, помните про кроссбраузерность. |
Этот код по праву можно назвать индусским. В обработчиках onclick одно и то же. Тут даже не знание js дико лажает, а в общем умение программировать, проектировать модель и т.д. Что например будешь делать если надо будет поле сделать 5*5? А должно решаться чисто сменой в конфигурации вместо 4 на 5.
|
Цитата:
Такой на форумах критики мало. |
Цитата:
|
Хм, какое совпадение... http://govnokod.ru/4389
|
както вы сильно жестко на парня накинулись...
|
Цитата:
Но если надо то по скрипту эту функцию добавить просто (могу сделать). |
Пятнашки )))
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1251" /> <title>15</title> <style type="text/css"> td{ height: 40px; width: 40px; text-align: center; color: #FFFFF0; font-weight: bold; font-size: large; } </style> </head> <body> <script language="JavaScript" type="text/javascript"> for (var m = [], l = 4, k = 1, z = [l - 1, l - 1], // l--размер поля b = ["background-color: #4169E1;", "background-color: #C0C0C0;color: #C0C0C0;"], t = document.createElement("table"), c = 0; c < l; c++) { var tr = t.insertRow(c); m[c] = []; for (var s = 0; s < l; s++) { var td = tr.insertCell(s); td.style.cssText = b[0]; td.onclick = function (a, e) { return function () { cl_go(a, e) } }(c, s); m[c][s] = k; td.innerHTML = k++ } } t.rows[l - 1].cells[l - 1].style.cssText = b[1]; t.rows[l - 1].cells[l - 1].innerHTML=''; m[l - 1][l - 1] = 0; document.body.appendChild(t); var end = m.toString().split(",").join(""), v = l * l * 2; function go() { for (var a = [ [-1, 0], [0, -1], [1, 0], [0, 1] ]; a.length;) { var e = Math.floor(Math.random() * a.length), d = a[e]; a.splice(e, 1); if (m[z[0] + d[0]] && m[z[0] + d[0]][z[1] + d[1]]) break } m[z[0]][z[1]] = m[z[0] + d[0]][z[1] + d[1]]; t.rows[z[0]].cells[z[1]].style.cssText = b[0]; t.rows[z[0]].cells[z[1]].innerHTML = m[z[0]][z[1]]; t.rows[z[0] + d[0]].cells[z[1] + d[1]].style.cssText = b[1]; t.rows[z[0] + d[0]].cells[z[1] + d[1]].innerHTML = ''; m[z[0] + d[0]][z[1] + d[1]] = 0; z = [z[0] + d[0], z[1] + d[1]]; if (m[l - 1][l - 1] || v > 0) { v--; setTimeout(arguments.callee, 100) } else { alert("Please play!!!"); v = l * l * 2 } } function cl_go(a, e) { for (var d = [ [-1, 0], [0, -1], [1, 0], [0, 1] ]; d.length;) { var g = Math.floor(Math.random() * d.length), f = d[g]; d.splice(g, 1); if (m[a + f[0]] && m[a + f[0]][e + f[1]] == 0) { m[a + f[0]][e + f[1]] = m[a][e]; m[a][e] = 0; t.rows[a].cells[e].style.cssText = b[1]; t.rows[a].cells[e].innerHTML = ''; t.rows[a + f[0]].cells[e + f[1]].style.cssText = b[0]; t.rows[a + f[0]].cells[e + f[1]].innerHTML = m[a + f[0]][e + f[1]]; z = [a, e]; break } } end == m.toString().split(",").join("") && alert("Game over") }; </script> <input type="button" name="" value="Mix" onclick="go()"/> </body> </html> |
рони,
а почему время прохождения не выдает? Это же самое интересное :) |
Gozar,
Будет Вам и дудка, будет и свисток ))) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=windows-1251" /> <title>15</title> <style type="text/css"> td{ height: 40px; width: 40px; text-align: center; color: #FFFFF0; font-weight: bold; font-size: large; } </style> </head> <body> <script language="JavaScript" type="text/javascript"> for (var m = [], l = 4, k = 1, z = [l - 1, l - 1],start,step, // l--размер поля b = ["background-color: #4169E1;", "background-color: #C0C0C0;color: #C0C0C0;"], t = document.createElement("table"), c = 0; c < l; c++) { var tr = t.insertRow(c); m[c] = []; for (var s = 0; s < l; s++) { var td = tr.insertCell(s); td.style.cssText = b[0]; td.onclick = function (a, e) { return function () { cl_go(a, e) } }(c, s); m[c][s] = k; td.innerHTML = k++ } } t.rows[l - 1].cells[l - 1].style.cssText = b[1]; t.rows[l - 1].cells[l - 1].innerHTML=''; m[l - 1][l - 1] = 0; document.body.appendChild(t); var end = m.toString().split(",").join(""), v = l * l * 2; function go() { for (var a = [ [-1, 0], [0, -1], [1, 0], [0, 1] ]; a.length;) { var e = Math.floor(Math.random() * a.length), d = a[e]; a.splice(e, 1); if (m[z[0] + d[0]] && m[z[0] + d[0]][z[1] + d[1]]) break } m[z[0]][z[1]] = m[z[0] + d[0]][z[1] + d[1]]; t.rows[z[0]].cells[z[1]].style.cssText = b[0]; t.rows[z[0]].cells[z[1]].innerHTML = m[z[0]][z[1]]; t.rows[z[0] + d[0]].cells[z[1] + d[1]].style.cssText = b[1]; t.rows[z[0] + d[0]].cells[z[1] + d[1]].innerHTML = ''; m[z[0] + d[0]][z[1] + d[1]] = 0; z = [z[0] + d[0], z[1] + d[1]]; if (m[l - 1][l - 1] || v > 0) { v--; setTimeout(arguments.callee, 100) } else {step=0;start = new Date(); alert("Please play!!!"); v = l * l * 2 } } function cl_go(a, e) { if(end == m.toString().split(",").join("")) {alert("Please Mix!!!");return}; step++; for (var d = [ [-1, 0], [0, -1], [1, 0], [0, 1] ]; d.length;) { var g = Math.floor(Math.random() * d.length), f = d[g]; d.splice(g, 1); if (m[a + f[0]] && m[a + f[0]][e + f[1]] == 0) { m[a + f[0]][e + f[1]] = m[a][e]; m[a][e] = 0; t.rows[a].cells[e].style.cssText = b[1]; t.rows[a].cells[e].innerHTML = ''; t.rows[a + f[0]].cells[e + f[1]].style.cssText = b[0]; t.rows[a + f[0]].cells[e + f[1]].innerHTML = m[a + f[0]][e + f[1]]; z = [a, e]; break } } end == m.toString().split(",").join("") && alert("Game over "+Math.floor(((new Date()).getTime() - start.getTime())/1000)+" s "+step+" step") }; </script> <input type="button" name="" value="Mix" onclick="go()"/> </body> </html> |
камрады, оцените, как вам наша реализация пятнашек?
|
Мне как только начавшему писать на js (да и вообще писать что либо на каком-либо языке программирования) очень даже хороший пример. Мне не нужен сейчас для примеров классный код, с подключением каких-то заумных библиотек , мне нужна для начала простая "азбука" пусть даже в виде "индусского кода". Как использовать циклы, условия, переменные, объекты, как просто менять данные местами, используя функции. Тут всего понемногу, просто и прозрачно. А начинающему сразу забивать голову jQuery, как тут предлагают, считаю глупо.
Потому большое спасибо за пример! |
согласно вашей логике:
- сначала нужно научиться машину водить плохо, чтобы потом переучиваться водить ее хорошо - чтобы освоить английский, надо учить китайский - чтобы приготовить амлет, надо зарезать свинью ... |
Приехал =(
![]() Тут минус в том, что автор очень неэффективно решил проблемы, возникающие перед ним в процессе разработки. Раскидал ячейки, хотя проще было циклом. Придумал неправильный алгоритм заполнения ячеек и вешает на него заплатку. Посоветовался бы на форуме, как лучше ее решить =) |
Цитата:
- водить машину зная принцип работы двигателя сгорания; - использовать рацию зная как осуществляется передача радиоволн; - жить в доме и знать что такое фундамент; - ну и используя jQvery знать тот язык на котором он написан. А ваши три примера "и не в склад и не в лад поцелуй дрова в живот". |
Решение пятнашек (вместо матрицы 3х3 ставите матрицу 4х4)
Взял пятнашки от рони, перетасовал их вручную, вроде работает :) У "восьмерки" пространство состояний 3^22, у пятнашек оно больше))) В целом решение писалось для любых квадратных матриц. Косяки вида "если подать уже решенное состояние, алгоритм будет его решать в ~3 хода" не исправлял, т.к. делал на скорую руку. |
nerv_,
:victory: |
|
Надеюсь, тут заменят цифры картинками?
|
Цитата:
|
Часовой пояс GMT +3, время: 11:10. |