<commit_before>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="favicon.ico">

    <title>Developer Level Project: Tic Tac Toe</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
    <link href="css/bootstrap.theme.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="css/tictactoe.css" rel="stylesheet">
  </head>

  <body>

    <div class="container">

      <!-- Jumbotron -->
      <div class="jumbotron top">
        <h1>Tic Tac Toe! <small>Welcome to the Developer Level Tic Tac Toe Challenge!</small></h1>
        <p class="lead">You will be using this rough page layout to build a functional Tic Tac Toe game entirely in javascript. You don't have to keep any of this page, but since the assignment focusses on the javascript implementation, the layout has been created for you so you can focus on the functionality.</p>
      </div>

      <!-- Tic Tac Toe Board -->
      <div class="row">
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe right">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="w-100"></div>
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe right">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="w-100"></div>
        <div class="col col-tictactoe bottom">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe bottom">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe bottom right">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
      </div>

    </div> <!-- /container -->


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-3.2.1.min.js"><\/script>')</script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
    <script>window.Popper || document.write('<script src="js/vendor/popper.min.js"><\/script>')</script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
    <script>if((typeof $().modal != 'function')) { document.write('<script src="js/vendor/bootstrap.min.js"><\/script>'); }</script>
    <script>
        var clickCount = 0;
        $('div.col-tictactoe button').click(function (event) {
            console.log(this, event);
            //if($(this).html() != "") { return; }
            if(!$(this).hasClass('btn-default')) { return; }
            if(clickCount % 2 == 0) {
                $(this).removeClass('btn-default').addClass('btn-success').html("X");
                console.log("Player one");
            } else {
                $(this).removeClass('btn-default').addClass('btn-danger').html("O");
                console.log("Player two");
            }
            if(clickCount >= 4) {
                var winner = getWinner();
                if(winner) {
                    alert(winner+" won!");
                    $('div.col-tictactoe button')
                        .removeClass('btn-success btn-danger')
                        .addClass('btn-default')
                        .html("");
                }
            }
            clickCount++;
        });
        function getWinner() {
            var btns = $('div.col-tictactoe button');
            // [
                // 0 = btn 1,
                // 1 = btn 2,
                // 2 = btn 3,
                // 3 = btn 4,
                // 4 = btn 5,
                // 5 = btn 6,
                // 6 = btn 7,
                // 7 = btn 8,
                // 8 = btn 9
            //] btns[2]
            var wins = [
                [0, 1, 2], //0
                [0, 4, 8], //1
                [0, 3, 6], //2

                [0, 1, 2], //3
                [1, 4, 7], //4

                [0, 1, 2], //5
                [2, 5, 8], //6
                [2, 4, 6], //7

                [0, 3, 6], //8
                [3, 4, 5], //9

                [0, 4, 8], //10
                [1, 4, 7], //11
                [2, 4, 6],
                [3, 4, 5],

                [2, 5, 8],
                [3, 4, 5],

                [0, 3, 6],
                [2, 4, 6],
                [6, 7, 8],

                [6, 7, 8],
                [1, 4, 7],

                [6, 7, 8],
                [0, 4, 8],
                [2, 5, 8]
            ];

            // You can't use the forEach here, since it uses a function
            // and we need to return the value found. 
            // Using another loop, get this function to work properly.

            for (var i = 0; i < wins.length; i++) {
                var set = wins[i];
                // set = [0, 1, 2]
                var offsetForButton1 = set[0];
                var btn1 = btns[offsetForButton1];

                var offsetForButton2 = set[1];
                var btn2 = btns[offsetForButton2];

                var offsetForButton3 = set[2];
                var btn3 = btns[offsetForButton3];

                if($(btn1).hasClass('btn-default')) { continue; }

                var me = $(btn1).html();
                if(me != $(btn2).html()) { continue; }
                if(me != $(btn3).html()) { continue; }
                return me;
            }
            return false;
            <commit_msg>Robust version<commit_after>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="favicon.ico">

    <title>Developer Level Project: Tic Tac Toe</title>

    <!-- Bootstrap core CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="<KEY>" crossorigin="anonymous">
    <link href="css/bootstrap.theme.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="css/tictactoe.css" rel="stylesheet">
  </head>

  <body>

    <div class="container">

      <!-- Jumbotron -->
      <div class="jumbotron top">
        <h1>Tic Tac Toe! <small>Welcome to the Developer Level Tic Tac Toe Challenge!</small></h1>
        <p class="lead">You will be using this rough page layout to build a functional Tic Tac Toe game entirely in javascript. You don't have to keep any of this page, but since the assignment focusses on the javascript implementation, the layout has been created for you so you can focus on the functionality.</p>
      </div>

      <!-- Tic Tac Toe Board -->
      <div class="row">
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe right">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="w-100"></div>
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe right">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="w-100"></div>
        <div class="col col-tictactoe bottom">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe bottom">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
        <div class="col col-tictactoe bottom right">
            <button type="button" class="btn btn-default btn-block btn-tictactoe"></button>
        </div>
      </div>

    </div> <!-- /container -->


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-3.2.1.min.js"><\/script>')</script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
    <script>window.Popper || document.write('<script src="js/vendor/popper.min.js"><\/script>')</script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="<KEY>" crossorigin="anonymous"></script>
    <script>if((typeof $().modal != 'function')) { document.write('<script src="js/vendor/bootstrap.min.js"><\/script>'); }</script>
    <script>
        var clickCount = 0;
        $('div.col-tictactoe button').click(function (event) {
            console.log(this, event);
            //if($(this).html() != "") { return; }
            if(!$(this).hasClass('btn-default')) { return; }
            if(clickCount % 2 == 0) {
                $(this).removeClass('btn-default').addClass('btn-success').html("X");
                console.log("Player one");
            } else {
                $(this).removeClass('btn-default').addClass('btn-danger').html("O");
                console.log("Player two");
            }
            if(clickCount >= 4) {
                var winner = getWinner();
                if(winner) {
                    alert(winner+" won!");
                    $('div.col-tictactoe button')
                        .removeClass('btn-success btn-danger')
                        .addClass('btn-default')
                        .html("");
                }
            }
            clickCount++;
        });
        function getWinner() {
            var btns = $('div.col-tictactoe button');
            // [
                // 0 = btn 1,
                // 1 = btn 2,
                // 2 = btn 3,
                // 3 = btn 4,
                // 4 = btn 5,
                // 5 = btn 6,
                // 6 = btn 7,
                // 7 = btn 8,
                // 8 = btn 9
            //] btns[2]
            var wins = [
                [0, 1, 2], // 0, 1, 2
                [0, 4, 8], // 0, 1, 2
                [0, 3, 6], // 0, 0, 0
                [1, 4, 7], // 1, 1, 1
                [2, 5, 8], // 2, 2, 2
                [2, 4, 6], // 2, 1, 0
                [3, 4, 5], // 0, 1, 2
                [6, 7, 8]  // 0, 1, 2
            ];

            // You can't use the forEach here, since it uses a function
            // and we need to return the value found. 
            // Using another loop, get this function to work properly.

            for (var i = 0; i < wins.length; i++) {
                var set = wins[i];
                // set = [0, 1, 2]
                var offsetForButton1 = set[0];
                var btn1 = btns[offsetForButton1];

                var offsetForButton2 = set[1];
                var btn2 = btns[offsetForButton2];

                var offsetForButton3 = set[2];
                var btn3 = btns[offsetForButton3];

                if($(btn1).hasClass('btn-default')) { continue; }

                var me = $(btn1).html();
                if(me != $(btn2).html()) { continue; }
                if(me != $(btn3).html()) { continue; }
                return me;
            }
            return false;
            
{'fraction_non_alphanumeric': 0.16997725549658832, 'fraction_numerical': 0.021683093252463988, 'mean_word_length': 1.729360645561763, 'pattern_counts': {'":': 0, '<': 197, '<?xml version=': 0, '>': 197, 'https://': 8, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4168381', 'n_tokens_mistral': 4244, 'n_tokens_neox': 3869, 'n_words': 967}