<commit_before>$(function() {
  var showSuggestion = function() {
    var title = $('#suggestion-title');
    var body = $('#suggestion-body');
    switch ($(this).data("symbol")) {
      case "AR":
        title.html("Incorrect article usage");
        body.html("We use <em>a</em> or <em>an</em> when a noun is new or unknown. We use <em>a</em>" +
          "before words that begin with a consonant sound (a carrot) and <em>an</em>" +
          "before words that begin with a vowel sound (an orange, an hour).");
        break;
      case "SP":
        title.html("Incorrect spelling");
        var word = $(this).data("selection");
        body.html("We could not find the word <em>" + word + "</em> in our dictionary.");
        break;
      case "C":
        title.html("Incorrect capitalization");
        var text = "A capitalized word is one beginning with an upper case letter. We capitalize words in the following situations:";
        text += "<ul>";
        text += "<li>Beginning of a sentence</li>";
        text += "<li>Proper nouns</li>";
        text += "<li>The pronoun <em>I</em></li>";
        text += "<li>Names of months and days of the week</li>";
        text += "<li>Name of countries and languages</li>";
        body.html(text);
        break;
      default:
        // Do not show explanation box
        return;
    }
    $("#user-view .suggestion").show();
  };

  var hideSuggestion = function() {
    $("#user-view .suggestion").hide();
  };

  var displayCorrections = function(text, response) {
    $('#user-entry').hide();
    $('#user-view').show();

    var changes = response.changes;
    var analysis = response.analysis;

    if (analysis) {
        $(".precision").html(analysis.precision);
        $(".recall").html(analysis.recall);
    } else {
        $(".precision").html("");
        $(".recall").html("");
    }

    // sort in descending order, so added <span>s don't mess up the offset.
    changes.sort(function(a, b) {
      return b.start - a.start;
    });
    for (var i = 0; i < changes.length; i++) {
      var start = changes[i].start;
      var end = start + changes[i].selection.length;

      var prev = text.slice(0, start);
      var after = text.slice(end, text.length);

      var span = '<mark data-symbol="' + changes[i].symbol + '" ';
      span += '         data-selection="' + changes[i].selection + '">';
      text = prev + span + changes[i].selection + "</mark>" + after;
    }

    $("#user-view .text").html(text);

    $('#user-view mark').hover(showSuggestion, hideSuggestion);
  };

  $('#user-view .btn').on('click', function() {
    $('#user-entry button').prop('disabled', false);
    $('#user-view').hide();
    $('#user-entry').show();
  });

  $('#user-entry .btn-primary').on('click', function() {
    var text = $('#user-entry textarea').val();
    var id = $('#id').val();
    var algo = $("#algorithm option:selected").val();

    // disable button before sending
    $('#user-entry button').prop('disabled', true);
    // send text to API
    $.ajax({
        url: "/predict",
        method: "POST",
        data: JSON.stringify({text: text, id: id, algorithm: algo}),
        contentType: "application/json; charset=utf-8",
        dataType: "json"
    }).done(function(response) {
        displayCorrections(text, response);
    });
  });

  $('#example').on('click', function() {
    $.ajax({
        url: "/essays?random=1",
        dataType: "json"
    }).done(function(json) {
        $('#id').val(json.id);
        $('#text-entry').html(json.text);<commit_msg>Unicornily show explanation and suggestions<commit_after>$(function() {
  var showSuggestion = function() {
    var title = $('#suggestion-title');
    var body = $('#suggestion-body');
    var selection = $(this).data("selection");
    var algo = $(this).data("algo");
    var explanation = $(this).data("explanation");
    var suggestions = $(this).data("suggestions").split("///");
    var righterText;
    switch ($(this).data("symbol")) {
      case "AR":
        title.html("Incorrect article usage");
        righterText = "We use <em>a</em> or <em>an</em> when a noun is new or unknown. We use <em>a</em>";
        righterText += "before words that begin with a consonant sound (a carrot) and <em>an</em>";
        righterText += "before words that begin with a vowel sound (an orange, an hour).";
        break;
      case "SP":
        title.html("Incorrect spelling");
        righterText = "We could not find the word <em>" + selection + "</em> in our dictionary.";
        break;
      case "C":
        title.html("Incorrect capitalization");
        righterText = "A capitalized word is one beginning with an upper case letter. We capitalize words in the following situations:";
        righterText += "<ul>";
        righterText += "<li>Beginning of a sentence</li>";
        righterText += "<li>Proper nouns</li>";
        righterText += "<li>The pronoun <em>I</em></li>";
        righterText += "<li>Names of months and days of the week</li>";
        righterText += "<li>Name of countries and languages</li>";
        break;
      default:
        // Do not show explanation box
        return;
    }
    var text = "";
    if (explanation) {
      text += "<p>" + explanation + "</p>";
    }
    if (suggestions.length > 0) {
      text += "<p>Suggestions:</p>";
      text += "<ul>";
      for (var i = 0; i < suggestions.length; i++) {
        text += "<li>" + suggestions[i] + "</li>";
      }
      text += "</ul>";
    }

    if (algo == 'righter') {
      body.html(righterText);
    } else {
      body.html(text);
    }
    $("#user-view .suggestion").show();
  };

  var hideSuggestion = function() {
    $("#user-view .suggestion").hide();
  };

  var displayCorrections = function(algo, text, response) {
    $('#user-entry').hide();
    $('#user-view').show();

    var changes = response.changes;
    var analysis = response.analysis;

    if (analysis) {
        $(".precision").html(analysis.precision);
        $(".recall").html(analysis.recall);
    } else {
        $(".precision").html("");
        $(".recall").html("");
    }

    // sort in descending order, so added <span>s don't mess up the offset.
    changes.sort(function(a, b) {
      return b.start - a.start;
    });
    for (var i = 0; i < changes.length; i++) {
      var start = changes[i].start;
      var end = start + changes[i].selection.length;

      var prev = text.slice(0, start);
      var after = text.slice(end, text.length);

      var explanation = changes[i].explanation || "";
      var suggestions = changes[i].suggestions || [];
      suggestions = suggestions.join("///");
      var span = '<mark data-symbol="' + changes[i].symbol + '" ';
      span += '         data-selection="' + changes[i].selection + '" ';
      span += '         data-explanation="' + explanation + '" ';
      span += '         data-suggestions="' + suggestions + '" ';
      span += '         data-algo="' + algo + '">';
      text = prev + span + changes[i].selection + "</mark>" + after;
    }

    $("#user-view .text").html(text);

    $('#user-view mark').hover(showSuggestion, hideSuggestion);
  };

  $('#user-view .btn').on('click', function() {
    $('#user-entry button').prop('disabled', false);
    $('#user-view').hide();
    $('#user-entry').show();
  });

  $('#user-entry .btn-primary').on('click', function() {
    var text = $('#user-entry textarea').val();
    var id = $('#id').val();
    var algo = $("#algorithm option:selected").val();

    // disable button before sending
    $('#user-entry button').prop('disabled', true);
    // send text to API
    $.ajax({
        url: "/predict",
        method: "POST",
        data: JSON.stringify({text: text, id: id, algorithm: algo}),
        contentType: "application/json; charset=utf-8",
        dataType: "json"
    }).done(function(response) {
        displayCorrections(algo, text, response);
    });
  });

  $('#example').on('click', function() {
    $.ajax({
        url: "/essays?random=1",
        dataType: "json"
    }).done(function(json) {
        $('#id').val(json.id);
        $('#text-entry').html(json.text);
{'fraction_non_alphanumeric': 0.19536423841059603, 'fraction_numerical': 0.0012263919548687761, 'mean_word_length': 2.533362218370884, 'pattern_counts': {'":': 6, '<': 66, '<?xml version=': 0, '>': 64, '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': '4528165', 'n_tokens_mistral': 2491, 'n_tokens_neox': 2429, 'n_words': 641}