'use strict'; var iosocket = io.connect(); var tbdLable = 'To be determined', noTeam = 'Kein Team'; // setup all my handlers iosocket.on('clientrefresh', function(){ location.reload(); }); iosocket.on('stateChange', function(state){ console.log(state); // basically the server tracks the state since it is the same for al clients // So we know that we HAVE to update at this point $('#team-container').bracket({ init: state, decorator: { edit: function(){}, render: render_fn }, teamWidth: 130, scoreWidth: 20, matchMargin: 20, roundMargin: 20 }); }); function render_fn(container, data, score, state) { switch (state) { case "empty-bye": container.append(noTeam) return; case "empty-tbd": container.append(tbdLable) return; case "entry-no-score": console.log('no score');// no return case "entry-default-win": console.log('default win');// no return case "entry-complete": container.append(data); return; } } $( document ).ready(function() { tbdLable = $('#TBD').val(); noTeam = $('#NoT').val(); // get my state var context = 'main'; iosocket.emit('loadState',context); });