<commit_before><%@ include file="header.jsp" %>
<style type="text/css">
  @media (max-width: 1000px) {
    .category-selection {
      display: none;
    }

    body {
      background-color: white;
    }
  }

</style>

<div class="row">
  <div class="col-md-2 category-selection">
    <h4>Active</h4>
    <div class="checkbox">
      <label>
        <input id="active-cb" checked class="filter-cb" type="checkbox"/>
          Active Trucks
      </label>
    </div>
    <div class="checkbox">
      <label>
        <input id="inactive-cb" class="filter-cb" type="checkbox"/>
          Inactive Trucks
      </label>
    </div>
    <h4>Categories</h4>
    <a href="#" id="select-all">Select all</a> <a href="#" id="deselect-all">Deselect all</a>
    <div id="categories">
    </div>
  </div>
  <div class="col-md-10">
    <div id="truckList" class="tab-pane active">
    </div>
  </div>
</div>

<%@include file="include/core_js.jsp" %>
<script type="text/javascript">
  (function() {
    var truckData = [], $truckList = $("#truckList");

    function refreshTruckList(dataSet) {
      $truckList.empty();
      $.each(dataSet, function(i, datum) {
        var icon = datum["previewIcon"];
        var $section = $("<div class='col-xs-6 col-md-3'></div>");
        var thumbnailId ="thumbnail-" + i;
        var $thumbnail = $("<div class='thumbnail' id='" + thumbnailId + "'></div>");
        $section.append($thumbnail);
        $truckList.append($section);
        if (!icon) {
          icon = "//storage.googleapis.com/truckpreviews/truck_holder.svg";
        }
        $("<img width='180' height='180' src='" + icon + "'/>").appendTo($thumbnail);
        $thumbnail.append("<p class='text-center'><a href='/trucks/" + datum["id"] + "'>" + datum['name']+"</a></p>")
      });
    }

    function buildCategories() {
      var tmpSet = {}, $categories = $("#categories"), categoryList = [];
      $.each(truckData, function(i, truck) {
        $.each(truck.categories, function(j, category) {
          tmpSet[category] = 1;
        });
      });
      Object.keys(tmpSet).forEach(function(key) {
        categoryList.push(key);
      });
      categoryList.sort();
      $.each(categoryList, function(i, category) {
        $("<div class='checkbox'><label><input category-name='" + category + "' class='category-cb filter-cb' checked type='checkbox'/>" + category + "</label></div>").appendTo($categories);
      });
    }

    function parseSelectedCategories() {
      var categories = {};
      $(".category-cb:checked").each(function(i, target) {
        var item = $(target).attr("category-name");<commit_msg>No border on trucks page icons and entire thing is now clickable.<commit_after><%@ include file="header.jsp" %>
<style type="text/css">
  .thumbnail {
    border: none;
  }

  @media (max-width: 1000px) {
    .category-selection {
      display: none;
    }

    body {
      background-color: white;
    }
  }

</style>

<div class="row">
  <div class="col-md-2 category-selection">
    <h4>Active</h4>
    <div class="checkbox">
      <label>
        <input id="active-cb" checked class="filter-cb" type="checkbox"/>
          Active Trucks
      </label>
    </div>
    <div class="checkbox">
      <label>
        <input id="inactive-cb" class="filter-cb" type="checkbox"/>
          Inactive Trucks
      </label>
    </div>
    <h4>Categories</h4>
    <a href="#" id="select-all">Select all</a> <a href="#" id="deselect-all">Deselect all</a>
    <div id="categories">
    </div>
  </div>
  <div class="col-md-10">
    <div id="truckList" class="tab-pane active">
    </div>
  </div>
</div>

<%@include file="include/core_js.jsp" %>
<script type="text/javascript">
  (function() {
    var truckData = [], $truckList = $("#truckList");

    function refreshTruckList(dataSet) {
      $truckList.empty();
      $.each(dataSet, function(i, datum) {
        var icon = datum["previewIcon"];
        var $section = $("<div class='col-xs-6 col-md-3'></div>");
        var thumbnailId ="thumbnail-" + i;
        var $thumbnail = $("<div class='thumbnail' id='" + thumbnailId + "'></div>");
        var $a = $("<a href='/trucks/" + datum["id"] + "'></a>");
        $section.append($a);
        $a.append($thumbnail);
        $truckList.append($section);
        if (!icon) {
          icon = "//storage.googleapis.com/truckpreviews/truck_holder.svg";
        }
        $("<img width='180' height='180' src='" + icon + "'/>").appendTo($thumbnail);
        $thumbnail.append("<p class='text-center'><strong>" + datum['name']+"</strong></p>")
      });
    }

    function buildCategories() {
      var tmpSet = {}, $categories = $("#categories"), categoryList = [];
      $.each(truckData, function(i, truck) {
        $.each(truck.categories, function(j, category) {
          tmpSet[category] = 1;
        });
      });
      Object.keys(tmpSet).forEach(function(key) {
        categoryList.push(key);
      });
      categoryList.sort();
      $.each(categoryList, function(i, category) {
        $("<div class='checkbox'><label><input category-name='" + category + "' class='category-cb filter-cb' checked type='checkbox'/>" + category + "</label></div>").appendTo($categories);
      });
    }

    function parseSelectedCategories() {
      var categories = {};
      $(".category-cb:checked").each(function(i, target) {
        var item = $(target).attr("category-name");
{'fraction_non_alphanumeric': 0.20382047477744808, 'fraction_numerical': 0.00741839762611276, 'mean_word_length': 2.763433356594557, 'pattern_counts': {'":': 0, '<': 99, '<?xml version=': 0, '>': 99, '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': '1067970', 'n_tokens_mistral': 1790, 'n_tokens_neox': 1748, 'n_words': 332}