<commit_before><!DOCTYPE html>
<html>
<head>
<title>ShellSort Proficiency Exercise</title>
<link href="AeBookAV.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="../css/JSAV.css" type="text/css" />
</head>

<body>
<style>
  #jsavcontainer {
    width: 500px;
    height: 200px;
    background-color: #efe;
  }
  p.jsavoutput.jsavline {
    height: 40px;
  }
</style>
  <h1>A Simple JSAV Interactive Exercise</h1>
  <div id="jsavcontainer">
    <a class="jsavsettings" href="#">Settings</a>
    <p align="center" class="jsavexercisecontrols"></p>
    <ol id="exerArray"></ol>
    <p class="jsavoutput jsavline"></p>
  </div>

    <script
       src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
    </script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <script src="../lib/jquery.transform.light.js"></script>
    <script src="../build/JSAV.js"></script>

    <script>

    var arraySize = 8,
        initialArray = [],
        jsavArray,
        $array = $("#exerArray"),
        av = new JSAV($("#jsavcontainer"));

    av.recorded(); // we are not recording an AV with an algorithm

    function initialize() {
      av.umsg("Directions: Click on all array elements from left to right to highlight them. Then click on the first and last elements to swap them."); 
      av.forward();
      var htmldata = "";
      for (var i = arraySize; i > 0; i--) {
        var randomVal = Math.floor(Math.random()*100);
        htmldata += "<li>" + randomVal + "</li>";
        initialArray[arraySize-i] = randomVal;
      }
      $array.html(htmldata);

      jsavArray = av.ds.array($array, {indexed: true});
      swapIndex = av.variable(-1);
      return jsavArray;
    }
    
    function modelSolution(jsav) {
      var modelArray = jsav.ds.array(initialArray);
      for (var i = 0; i < arraySize; i++) {
        modelArray.highlight(i);
        jsav.stepOption("grade", true);
        jsav.step();
      }
      // swap the first and last element
      modelArray.swap(0, arraySize - 1);
      jsav.stepOption("grade", true);
      return modelArray;
    }
    
    // define a variable to hold the value of index to be swapped
    var swapIndex;
    
    var exercise = av.exercise(modelSolution, initialize, {css: "background-color"});
    exercise.reset();
    
    // bind a function to handle all click events on the array
    jsavArray.click(function(index) {
      // if last index is highlighted, we are in "swap mode"
      if (this.isHighlight(arraySize - 1)) {<commit_msg>Added score widget; enabled continuous mode<commit_after><!DOCTYPE html>
<html>
<head>
<title>Simple JSAV Proficiency Exercise Example</title>
<link href="AeBookAV.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="../css/JSAV.css" type="text/css" />
</head>

<body>
<style>
  #jsavcontainer {
    width: 500px;
    height: 250px;
    background-color: #efe;
  }
  p.jsavoutput.jsavline {
    height: 40px;
  }
  .jsavscore {
    text-align: center;
  }
</style>
  <h1>A Simple JSAV Interactive Exercise</h1>
  <div id="jsavcontainer">
    <a class="jsavsettings" href="#">Settings</a>
    <p align="center" class="jsavexercisecontrols"></p>
    <p class="jsavscore"></p>
    <ol id="exerArray"></ol>
    <p class="jsavoutput jsavline"></p>
  </div>

    <script
       src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
    </script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <script src="../lib/jquery.transform.light.js"></script>
    <script src="../build/JSAV.js"></script>

    <script>

    var arraySize = 8,
        initialArray = [],
        jsavArray,
        $array = $("#exerArray"),
        av = new JSAV($("#jsavcontainer"));

    av.recorded(); // we are not recording an AV with an algorithm

    function initialize() {
      av.umsg("Directions: Click on all array elements from left to right to highlight them. Then click on the first and last elements to swap them."); 
      av.forward();
      var htmldata = "";
      for (var i = arraySize; i > 0; i--) {
        var randomVal = Math.floor(Math.random()*100);
        htmldata += "<li>" + randomVal + "</li>";
        initialArray[arraySize-i] = randomVal;
      }
      $array.html(htmldata);

      jsavArray = av.ds.array($array, {indexed: true});
      swapIndex = av.variable(-1);
      return jsavArray;
    }
    
    function modelSolution(jsav) {
      var modelArray = jsav.ds.array(initialArray);
      for (var i = 0; i < arraySize; i++) {
        modelArray.highlight(i);
        jsav.stepOption("grade", true);
        jsav.step();
      }
      // swap the first and last element
      modelArray.swap(0, arraySize - 1);
      jsav.stepOption("grade", true);
      return modelArray;
    }
    
    // define a variable to hold the value of index to be swapped
    var swapIndex;
    
    var exercise = av.exercise(modelSolution, initialize, {css: "background-color"},
                              { feedback: "continuous"});
    exercise.reset();
    
    // bind a function to handle all click events on the array
    jsavArray.click(function(index) {
      // if last index is highlighted, we are in "swap mode"
      if (this.isHighlight(arraySize - 1)) {
{'fraction_non_alphanumeric': 0.15579302587176602, 'fraction_numerical': 0.010123734533183352, 'mean_word_length': 2.6717136958017895, 'pattern_counts': {'":': 0, '<': 75, '<?xml version=': 0, '>': 75, 'https://': 4, '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': '1658168', 'n_tokens_mistral': 1792, 'n_tokens_neox': 1708, 'n_words': 428}