JSFiddle - React, Tailwind, and code Playground

by Tom Randolph

HTML

<script>
    var tracks = [
  {
    "code": "MRD",
    "name": "Monticello",
    "currentRace": {
      "number": 10,
      "mtp": 0,
      "status": "C",
      "postTimeUtc": null
    },
    "raceCount": 10,
    "countryCode": "USA",
    "equibaseCode": "MRX",
    "isFavorite": false,
    "hasVideo": false,
    "status": "C"
  },
  {
    "code": "AUS",
    "name": "TAREE",
    "currentRace": {
      "number": 1,
      "mtp": 0,
      "status": "O",
      "postTimeUtc": "2016-10-20T04:00:00Z"
    },
    "raceCount": 8,
    "countryCode": "AUS",
    "equibaseCode": "AUS",
    "isFavorite": false,
    "hasVideo": false,
    "status": "O"
  },
  {
    "code": "AUB",
    "name": "CANBERRA",
    "currentRace": {
      "number": 1,
      "mtp": 0,
      "status": "O",
      "postTimeUtc": "2016-10-20T04:00:00Z"
    },
    "raceCount": 8,
    "countryCode": "AUS",
    "equibaseCode": "AUB",
    "isFavorite": false,
    "hasVideo": false,
    "status": "O"
  },
  {
    "code": "AUC",
    "name": "IPSWICH",
    "currentRace": {
      "number": 1,
      "mtp": 0,
      "status": "O",
      "postTimeUtc": "2016-10-20T04:00:00Z"
    },
    "raceCount": 7,
    "countryCode": "AUS",
    "equibaseCode": "AUC",
    "isFavorite": false,
    "hasVideo": false,
    "status": "O"
  },
  {
    "code": "BED",
    "name": "Belmont",
    "currentRace": {
      "number": 9,
      "mtp": 8,
      "status": "O",
      "postTimeUtc": null
    },
    "raceCount": 9,
    "countryCode": "USA",
    "equibaseCode": "BEL",
    "isFavorite": false,
    "hasVideo": true,
    "status": "O"
  },
  {
    "code": "TWN",
    "name": "Charles Town",
    "currentRace": {
      "number": 1,
      "mtp": 0,
      "status": "O",
      "postTimeUtc": "2016-10-20T23:00:00Z"
    },
    "raceCount": 8,
    "countryCode": "USA",
    "equibaseCode": "CT",
    "isFavorite": false,
    "hasVideo": true,
    "status": "O"
  },
  {
    "code": "DTN",
    "name": "Delta Downs",
    "currentRace": {
      "number": 1,
 ...

CSS

textarea {
  width: 200px;
  height: 300px;
}

JavaScript

console.log(tracks[0]);

tracks.sort(function (a, b) {

    if (a.status === 'C' || a.postTimeUtc !== null ||
        b.status === 'C' || b.postTimeUtc !== null) {
      return 1;
    }

    if (a.currentRace.mtp < b.currentRace.mtp) {
      return -1
    } else if (a.currentRace.mtp === b.currentRace.mtp) {
      return 0;
    } else {
      return 1;
    }
 });
console.log(tracks[0])

var text = '';
for(var i in tracks) {
	text += tracks[i].name + ' - ' +tracks[i].currentRace.mtp + "\n";
}
console.log(text);
var t = document.getElementById("tracks");
t.value = text;