<commit_before>
<script>
  
  function displayModel(model) {
    var $model_container = $(".user_model").empty(); 
    
    // model_container.append(JSON.stringify(model));
    
    if (model["word_count_message"] !== undefined) {
      $("<div>").append(model["word_count_message"]).append("<br>").appendTo($model_container);  
    }
         
      
    for (var i in model["tree"]["children"]) {
      var major_category = model["tree"]["children"][i];
      $("<center>").append($("<h2>").append(major_category["name"])).appendTo($model_container);
            
      var $table = $("<table>").addClass("um");
      $table.append("<tr><th>Value</th><th>Watson Score</th></tr>");
      
      for (var j in major_category["children"]) {
        var sub_category = major_category["children"][j];
                              
        for (var k in sub_category["children"]) {
          var sub_sub_category = sub_category["children"][k];
        
          var $row = $("<tr>");
            
          if (sub_sub_category["percentage"] > 0.8) {
            $row.addClass("interesting");
          }
          
          var $name = $("<td>").append(sub_sub_category["name"]);
          var $score = $("<td>").append((sub_sub_category["percentage"] * 100).toFixed(3));
          
          $row.append($name).append($score);
          $table.append($row);
        }
      }    

      $model_container.append($table).append("<br>");
    }
  }
  
  
  $(function() {
    $(".go").click(function() {
      var endpoint = "/AppBuilder/endpoint/personality_insights_twitter";
      var handle = $("input[name='handle']").val();
           
      $.ajax({
        type: "POST",
        url: endpoint,
        data: { "handle" : handle },
        success: function(response) {
          response = JSON.parse(response);
          displayModel(response);
        },
          failure: function(error) {
            console.log(error);
            $(".user_model").empty().append(error);
          }
        });
      
    });
  });
  
  
</script>




<span>Twitter Handle:</span> <input type="text" name="handle" value="IBMWatson" />
<input type="submit" value="Generate Insights!" class="go">


<div class="user_model"></div>


<style>

table.um
{
  border: 1px solid black;
  width: 100%;
  margin: 5px;
}

table.um tr, table.um td, table.um th
{
  border: 1px solid black;
  text-align: cetner;
  padding: 3px;
}<commit_msg>Added a "working" status indicator when the button is pressed<commit_after>
<script>
  
  function displayModel(model) {
    var $model_container = $(".user_model").empty(); 
    
    // model_container.append(JSON.stringify(model));
    
    if (model["word_count_message"] !== undefined) {
      $("<div>").append(model["word_count_message"]).append("<br>").appendTo($model_container);  
    }
         
      
    for (var i in model["tree"]["children"]) {
      var major_category = model["tree"]["children"][i];
      $("<center>").append($("<h2>").append(major_category["name"])).appendTo($model_container);
            
      var $table = $("<table>").addClass("um");
      $table.append("<tr><th>Value</th><th>Watson Score</th></tr>");
      
      for (var j in major_category["children"]) {
        var sub_category = major_category["children"][j];
                              
        for (var k in sub_category["children"]) {
          var sub_sub_category = sub_category["children"][k];
        
          var $row = $("<tr>");
            
          if (sub_sub_category["percentage"] > 0.8) {
            $row.addClass("interesting");
          }
          
          var $name = $("<td>").append(sub_sub_category["name"]);
          var $score = $("<td>").append((sub_sub_category["percentage"] * 100).toFixed(3));
          
          $row.append($name).append($score);
          $table.append($row);
        }
      }    

      $model_container.append($table).append("<br>");
    }
  }
  
  
  $(function() {
    $(".go").click(function() {
      $(".watson-status").show();
      
      var endpoint = "/AppBuilder/endpoint/personality_insights_twitter";
      var handle = $("input[name='handle']").val();
           
      $.ajax({
        type: "POST",
        url: endpoint,
        data: { "handle" : handle },
        success: function(response) {
          response = JSON.parse(response);
          displayModel(response);
          $(".watson-status").hide();
        },
          failure: function(error) {
            console.log(error);
            $(".user_model").empty().append(error);
            $(".watson-status").hide();
          }
        });
      
    });
  });
  
  
</script>




<span>Twitter Handle:</span> <input type="text" name="handle" value="IBMWatson" />
<input type="submit" value="Generate Insights!" class="go">
<div class="watson-status" style="display:none;">Asking Watson...</div>


<div class="user_model"></div>


<style>

table.um
{
  border: 1px solid black;
  width: 100%;
  margin: 5px;
}

table.um tr, table.um td, table.um th
{
  border: 1px solid black;
  text-align: cetner;
  padding: 3px;
}
{'fraction_non_alphanumeric': 0.187856160345844, 'fraction_numerical': 0.005502063273727648, 'mean_word_length': 2.322454308093995, 'pattern_counts': {'":': 0, '<': 53, '<?xml version=': 0, '>': 55, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2896068', 'n_tokens_mistral': 1603, 'n_tokens_neox': 1554, 'n_words': 260}