Databases
StackOverflow2013
Postsdbo
PODetermining allowable moves on a grid
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PODetermining allowable moves on a grid
    primarykey
    data
    text
    <p>Can anyone suggest a suitable way of figuring out a pieces allowable moves on a grid similar to the one in the image below.</p> <p><img src="https://farm4.static.flickr.com/3534/3250436085_c91b07c7fd.jpg" alt="grid layout"></p> <p>Assuming piece1 is at position a1 and piece2 is at position c3, how can I figure out which grid squares are allowable moves if piece1 can move (say) 3 squares and piece2 can move 2?</p> <p>I've spent way too long developing text based MUDS it seems, I simply can't get my brain to take the next step into how to visualise potential movement even in the most simple of situations.</p> <p>If it matters, I'm trying to do this in javascript, but to be perfectly honest I think my failure here is a failure to conceptualise properly - not a failure in language comprehension.</p> <p><strong>Update - I'm adding the first round of code written after the below responses were posted. I thought it might be useful to people in a similar situation as me to see the code</strong></p> <p>It's sloppy and it only works for one item placed on the board so far, but at least the <code>check_allowable_moves()</code> function works for this initial run. For those of you wondering why the hell I'm creating those weird alphanumeric objects rather than just using numeric x axis and y axis - it's because an id in HTML can't start with a number. In fact pretending I <em>could</em> use numbers to start ids helped a great deal in making sense of the functionality and concepts described by the fantastic answers I got.</p> <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="application/xhtml+xml;utf-8"/&gt; &lt;title&gt;Test page&lt;/title&gt; &lt;style&gt; #chessboard { clear: both; border:solid 1px black; height: 656px; width:656px; /*width = 8*40 + 16 for border*/ } #chessboard .row { overflow: auto; clear: both; } #chessboard .row span { display: block; height: 80px; width: 80px; float: left; border:solid 1px black; } .allowable { background: blue; } &lt;/style&gt; &lt;script type="text/javascript" src="http://www.google.com/jsapi"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; google.load("jquery", "1.2.6"); google.load("jqueryui", "1.5.3"); &lt;/script&gt; &lt;script type="text/javascript"&gt; $(document).ready(function() { (function() { var global = this; global.Map = function(container) { function render_board() { var max_rows = 8; var cols = new Array('a','b', 'c', 'd', 'e', 'f', 'g', 'h'); var jqMap = $('&lt;div /&gt;'); jqMap.attr('id', 'chessboard'); var x=0; for(x; x&lt;max_rows; x++) { var jqRow = $('&lt;span /&gt;'); jqRow.addClass('row'); var i=0; for(i; i&lt;cols.length; i++) { var jqCol = $('&lt;span /&gt;'); jqCol.attr('id', cols[i]+(x+1)); jqCol.addClass(cols[i]); jqRow.append(jqCol); } jqMap.append(jqRow); } $('#'+container).append(jqMap); } function add_piece(where, id) { var jqPiece = $('&lt;div&gt;MY PIECE'+id+'&lt;/div&gt;'); var jqWhere = $('#'+where); jqPiece.attr('id', 'piece-'+id); jqPiece.addClass('army'); jqPiece.draggable({cursor: 'move', grid:[82, 82], containment: '#chessboard', revert: 'invalid', stop: function(ev, ui) { //console.log(ev.target.id); } }); jqWhere.append(jqPiece); check_allowable_moves(where); } function check_allowable_moves(location) { var x_axis = { 'a':1,'b':2, 'c':3, 'd':4, 'e':5, 'f':6, 'g':7, 'h':8 }; var x_axis_alpha = { 1:'a',2:'b', 3:'c', 4:'d', 5:'e', 6:'f', 7:'g', 8:'h' }; $('.allowable').droppable("destroy"); $('.allowable').removeClass('allowable'); //get the x,y values of the piece just placed var x = parseInt(x_axis[location[0]], 10); var y = parseInt(location[1], 10); var x_min = x-2; var y_min = y-2; for(x_min; x_min&lt;=x+2; x_min++) { for(y_min; y_min&lt;=y+2; y_min++) { var jqCell = $('#'+x_axis_alpha[x_min]+y_min) jqCell.addClass('allowable'); jqCell.droppable({ accept: '.army', drop: function(ev, ui) { //console.log(ev, ui, $(this)); //handle_drop(ev, ui, $(this)); check_allowable_moves($(this).attr('id')); } }); } y_min = parseFloat(y)-2; } } render_board(); add_piece('d5', '2'); } })(); var map = new Map('content'); }); &lt;/script&gt; &lt;/head&gt; &lt;body id="debug"&gt; &lt;div id="page"&gt; &lt;div id="content"&gt; &lt;/div&gt; &lt;/div&gt;&lt;!-- end page --&gt; &lt;/body&gt; &lt;/html&gt; </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USCommunity
    1. USSteerpike
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. PODetermining allowable moves on a grid
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. PODetermining allowable moves on a grid
      1. This table or related slice is empty.
      1. VTUpMod
    1. COThe image didn't make it into your post.
      singulars
      1. PODetermining allowable moves on a grid
      1. USDiodeus - James MacFarlane
    2. COImage is there, just not displaying. Here's the URL: http://farm4.static.flickr.com/3534/3250436085_c91b07c7fd.jpg?v=0
      singulars
      1. PODetermining allowable moves on a grid
      1. USPeter Boughton
    3. COFixed, for some reason the markdown preview accepts urls with ?, but not the actual rendered post. Will submit uservoice bug report if it's not already there.
      singulars
      1. PODetermining allowable moves on a grid
      1. USGreg Hewgill
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload