Databases
StackOverflow2013
Postsdbo
POPHP Tournament Bracket System
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POPHP Tournament Bracket System
    text
    copied!<p>Happy new year to all!!</p> <p>I'm trying to make starcraft 2 tournament web site for me and friends.</p> <p>i stuck on tournament system.</p> <p>I have a jquery script that makes a bracket but I couldn't figure out how can I implament it with my database and php:(</p> <p>I would like to ask you some questions please.</p> <p>I have this html and jquery script.</p> <p>my mysql database is like this</p> <pre><code>tournamenttree id - UserID - TournamentID - Round 1 - 1 - 1 - 1 2 - 15 - 1 - 1 3 - 17 - 1 - 1 4 - 25 - 1 - 1 </code></pre> <p>and</p> <pre><code>tournaments id - tournamentname - createdtime - players - active 1 -Sunday Cup - time() - 4 - 1 </code></pre> <p>and Users table</p> <pre><code> &lt;?php $link = mysql_connect( '', '', '' ); if ( !is_resource( $link ) ) die( 'MySQL Connect Error' ); if ( !mysql_select_db( 'db6968_game', $link ) ) die( 'MySQL DB Error' ); mysql_query( "SET CHARACTER SET UTF8" ); mysql_query( "SET collation_connection = 'utf8_turkish_ci'" ); ?&gt; &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us"&gt; &lt;head&gt; &lt;title&gt;MyTournamentName&lt;/title&gt; &lt;script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'&gt; &lt;/script&gt; &lt;script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js' type='text/javascript'&gt; &lt;/script&gt; &lt;style type="text/css"&gt; .tournament { background-color: #F0F0F0; border: dashed 1px solid; overflow: auto; } .tournament .bracket { background-color: #DFDFDF; min-width: 100px; vertical-align: top; float: left; } .tournament .bracket .match { background-color: #D0D0D0; border-top: 1px solid; border-right: 1px solid; border-bottom: 1px solid; } .tournament .bracket .match .p1 { height: 20px; } .tournament .bracket .match .p2 { height: 20px; } .tournament .bracket .match .spacer { background-color: #DFDFDF; height: 38px; } .tournament .bracket .spacer { height: 80px; } .tournament .bracket .half-spacer { height: 40px; } .tournament .bracket .small-spacer { height: 10px; background-color: #F1F1F1; } .tournament .bracket .winner { border-bottom: 1px solid; } .left-line { border-left: 1px solid; } .tournament .cell { min-width: 100px; height: 20px; float: left; background-color: #DFDFDF; } .tournament .l2 { background-color: #D0D0D0; } .tournament .lmax { width: 0px; clear: both; } &lt;/style&gt; &lt;script type="text/javascript"&gt; var matchInfo = { "rounds" : [ { "name": "Round1", "matches" : [ { "id" : 1, "p1" : "mTwDeMuslim", "p2" : "Luffy" }, { "id" : 2, "p1" : "SeleCT", "p2" : "NEXGenius" }, { "id" : 3, "p1" : "Fenix", "p2" : "SoftBall" }, { "id" : 4, "p1" : "White-Ra", "p2" : "Ice" }, { "id" : 5, "p1" : "HuK", "p2" : "RedArchon" }, { "id" : 6, "p1" : "Capoch", "p2" : "Loner" }, { "id" : 7, "p1" : "mTwDIMAGA", "p2" : "MakaPrime" }, { "id" : 8, "p1" : "TLAF-Liquid`TLO", "p2" : "SEN" } ] }, { "name": "Round2", "matches" : [ { "id" : 9, "p1" : null, "p2" : null }, { "id" : 10, "p1" : null, "p2" : null }, { "id" : 11, "p1" : null, "p2" : null }, { "id" : 12, "p1" : null, "p2" : null } ] }, { "name": "Round3", "matches" : [ { "id" : 13, "p1" : null, "p2" : null }, { "id" : 14, "p1" : null, "p2" : null }, ] }, { "name": "Round4", "matches" : [ { "id" : 15, "p1" : null, "p2" : null }, ] } ] }; $(document).ready(function($) { var base = $('#writeHere'); var matchDivsByRound = []; for (var roundIndex=0; roundIndex&lt;matchInfo.rounds.length; roundIndex++) { var round = matchInfo.rounds[roundIndex]; var bracket = checkedAppend('&lt;div class="bracket"&gt;&lt;/div&gt;', base); var matchDivs = []; matchDivsByRound.push(matchDivs); //setup the match boxes round by round for (var i=0; i&lt;round.matches.length; i++) { var vOffset = checkedAppend('&lt;div&gt;&lt;/div&gt;', bracket); var match = round.matches[i]; var matchHtml = '&lt;div class="match" id="match' + match.id + '"&gt;' + '&lt;div class="p1"&gt;' + fmtName(match.p1) + '&lt;/div&gt;' + '&lt;div class="spacer"&gt;&lt;/div&gt;' + '&lt;div class="p2"&gt;' + fmtName(match.p2) + '&lt;/div&gt;'; matchDiv = checkedAppend(matchHtml, bracket); matchDivs.push(matchDiv); if (roundIndex &gt; 0) { //row 2+; line up with previous row var alignTo = matchDivsByRound[roundIndex-1][i*2]; //offset to line up tops var desiredOffset = alignTo.position().top - matchDiv.position().top; //offset by half the previous match-height desiredOffset += alignTo.height() / 2; vOffset.height(desiredOffset); } else { checkedAppend('&lt;div class="small-spacer"&gt;&lt;/div&gt;', bracket); } if (roundIndex &gt; 0) { //tweak our size so we stretch to the middle of the appropriate element var stretchTo = matchDivsByRound[roundIndex-1][i*2+1]; var newH = stretchTo.position().top + stretchTo.height()/2 - matchDiv.position().top; var deltaH = newH - matchDiv.height(); matchDiv.height(newH); var spacer = matchDiv.find('.spacer'); spacer.height(spacer.height() + deltaH); } } } //setup the final winners box; just a space for a name whose bottom is centrally aligned with the last match bracket = checkedAppend('&lt;div class="bracket"&gt;&lt;/div&gt;', base); var vOffset = checkedAppend('&lt;div&gt;&lt;/div&gt;', bracket); var alignTo = matchDivsByRound[matchInfo.rounds.length - 1][0]; //only 1 match in the last round var html = '&lt;div class="winner"&gt;?&lt;/div&gt;'; var winnerDiv = checkedAppend(html, bracket); vOffset.height(alignTo.position().top - winnerDiv.position().top + alignTo.height() / 2 - winnerDiv.height()); }); function fmtName(name) { return null != name ? name : '?'; } function checkedAppend(rawHtml, appendTo) { var html = $(rawHtml); if (0 == html.length) { throw "Built ourselves bad html : " + rawHtml; } html.appendTo(appendTo); return html; } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div&gt;blah blah blah&lt;/div&gt; &lt;div id="writeHere" class="tournament"&gt;&lt;/div&gt; &lt;div&gt;blah blah blah&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>I tried to do this </p> <pre><code> &lt;?php function getusername($id){ $sql = mysql_query("SELECT * FROM users WHERE UserID = '".$id."'"); $ROW = mysql_fetch_assoc($sql); $data = $ROW['Username']; return $data; } ?&gt; var matchInfo = { "rounds" : [ { "name": "Round1", "matches" : [ &lt;?php for ($i = 0; $i &lt; $num_rounds; ++$i) { $matches = $teams * pow(.5, $i - 1) / 2; $ROW = mysql_fetch_array($sql); for ($j = 0; $j &lt; $matches; ++$j) { echo '{ "id" : '.$j.', "p1" : "'.$ROW['UserID'].'", "p2" : "'.$ROW['UserID' + $j - 1].'" }'; echo $coma = ','; } echo $coma= ''; }?&gt; </code></pre> <p>but it gives me this</p> <pre><code> var matchInfo = { "rounds" : [ { "name": "Round1", "matches" : [ { "id" : 0, "p1" : "1", "p2" : "" },{ "id" : 1, "p1" : "1", "p2" : "2" },{ "id" : 2, "p1" : "1", "p2" : "1" },{ "id" : 3, "p1" : "1", "p2" : "1" },{ "id" : 0, "p1" : "15", "p2" : "" },{ "id" : 1, "p1" : "15", "p2" : "3" },{ "id" : 0, "p1" : "17", "p2" : "" }, ] }, </code></pre> <p>according to my database there are 4 teams but with my php script it gives me 7 matches. it should be only 2 matches. cos there are 4 teams.</p> <p>i just cannot figure out this. is there anyone can give me an idea or help me please? thanks</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

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