SHARE
TWEET

Untitled

a guest Oct 12th, 2017 52 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <div class="container">
  2.   <div class="row">
  3.     <div class="col-xs-12">
  4.       <h2>Tic Tac Toe</h2>
  5.       <div data-bind="visible: winner().length > 0">
  6.         <h3><label data-bind="text: winner"></label></h3>
  7.       </div>
  8.       <div data-bind=" visible: isBoardVisible && winner().length === 0">
  9.         <h3><label class='turnIndicator' data-bind="text: turnIndicator"></label></h3>
  10.       </div>
  11.     </div>
  12.   </div>
  13.   <div class="row">
  14.     <div class="col-xs-4 col-xs-offset-4 gameboard" data-bind="visible: isBoardVisible">
  15.       <div class="row">
  16.         <div id="cell-0-0" class="col-xs-4 cell">
  17.           <label data-bind="text: cell00" />
  18.         </div>
  19.         <div id="cell-0-1" class="col-xs-4 cell cell-middle">
  20.           <label data-bind="text: cell01" />
  21.         </div>
  22.         <div id="cell-0-2" class="col-xs-4 cell">
  23.           <label data-bind="text: cell02" />
  24.         </div>
  25.       </div>
  26.       <div class="row row-middle">
  27.         <div id="cell-1-0" class="col-xs-4 cell">
  28.           <label data-bind="text: cell10" />
  29.         </div>
  30.         <div id="cell-1-1" class="col-xs-4 cell cell-middle">
  31.           <label data-bind="text: cell11" />
  32.         </div>
  33.         <div id="cell-1-2" class="col-xs-4 cell">
  34.           <label data-bind="text: cell12" />
  35.         </div>
  36.       </div>
  37.       <div class="row">
  38.         <div id="cell-2-0" class="col-xs-4 cell">
  39.           <label data-bind="text: cell20" />
  40.         </div>
  41.         <div id="cell-2-1" class="col-xs-4 cell cell-middle">
  42.           <label data-bind="text: cell21" />
  43.         </div>
  44.         <div id="cell-2-2" class="col-xs-4 cell">
  45.           <label data-bind="text: cell22" />
  46.         </div>
  47.       </div>
  48.     </div>
  49.   </div>
  50.   <div class="row">
  51.     <div class="col-xs-4 col-xs-offset-4 startMenu" data-bind="visible: isStartMenuVisible">
  52.       <form>
  53.         <fieldset class="form-group">
  54.           <legend>Team</legend>
  55.           <div class="form-check">
  56.             <label for="radioX" class="form-check-label">
  57.               <input type="radio" class="form-check-input" name="optionside" value="X" id="radioX" data-bind="checked: player1Symbol">
  58.               X
  59.              
  60.             </label>
  61.           </div>
  62.           <div class="form-check">
  63.             <label class="form-check-label">
  64.               <input type="radio" class="form-check-input" name="optionside" value="O" id="radioO"  data-bind="checked: player1Symbol">
  65.               O
  66.              
  67.             </label>
  68.           </div>
  69.  
  70.         </fieldset>
  71.         <fieldset class="form-group">
  72.           <legend>Difficulty</legend>
  73.           <div class="form-check">
  74.             <label for="radioEasy" class="form-check-label">
  75.               <input type="radio" class="form-check-input" name="optradio" value="Easy" id="radioEasy" data-bind="checked: gameMode">
  76.               Easy
  77.             </label>
  78.           </div>
  79.           <div class="form-check">
  80.             <label for="radioHard" class="form-check-label">
  81.               <input type="radio" class="form-check-input" name="optradio" value="Hard" id="radioHard" data-bind="checked: gameMode">
  82.               Medium
  83.             </label>
  84.           </div>
  85.  
  86.         </fieldset>
  87.  
  88.         <div class="col-xs-12 text-center">
  89.           <input id="btnStart" type="button" class="btn btn-primary" value="Start Playing" data-bind="click: startPlaying">
  90.         </div>
  91.  
  92.       </form>
  93.     </div>
  94.     <div class="col-xs-2 col-xs-offset-5 text-center endMenu" data-bind="visible: winner().length > 0">
  95.       <input id="btnReset" type="button" class="btn btn-primary" value="Play Again" data-bind="click: resetGame">
  96.     </div>
  97.   </div>
RAW Paste Data
Top