diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..dc528e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.Rhistory diff --git a/index.html b/index.html index 612c7fb..8d5d1fa 100644 --- a/index.html +++ b/index.html @@ -48,26 +48,7 @@
-
diff --git a/js/diagrams.js b/js/diagrams.js index 443a0c0..0fc9488 100644 --- a/js/diagrams.js +++ b/js/diagrams.js @@ -2,8 +2,19 @@ // https://bl.ocks.org/mbostock/3884955 function createLineGraph(containerId, raceData){ - console.log(raceData); + // Rough input validation + if(raceData.raceInfo === undefined) { + console.error(["Sorry, that raceData is empty. :-(", raceData]); + return; // early return to avoid errors + } else { + console.log(raceData); + } + + var enhancedLapData = processor.getEnhancedLapDataPerDriver(raceData); + + + // Configuration var height = 720; var width = 1080; var linePointSize = 5; diff --git a/js/main.js b/js/main.js index 5652d8f..d1d1454 100644 --- a/js/main.js +++ b/js/main.js @@ -4,35 +4,64 @@ * This file contains the main control flow. */ -preprocessor.load(function(data) { - var $frame = $('.strecken-selector'); - var $slidee = $frame.children('ul').eq(0); - var $wrap = $frame.parent(); - var options = { - horizontal: 1, - itemNav: 'basic', - smart: 1, - activateOn: 'click', - mouseDragging: 1, - touchDragging: 1, - releaseSwing: 1, - startAt: 3, - scrollBar: $wrap.find('.scrollbar'), - scrollBy: 1, - pagesBar: $wrap.find('.pages'), - activatePageOn: 'click', - speed: 300, - elasticBounds: 1, - dragHandle: 1, - dynamicHandle: 1, - clickBar: 1, - }; - $('.frame').sly(options); +var slyelement = { + obj: {}, + curRaces: {}, + el: '.frame', + options: { + horizontal: 1, + itemNav: 'basic', + smart: 1, + activateOn: 'click', + mouseDragging: 1, + touchDragging: 1, + releaseSwing: 1, + startAt: 3, + scrollBar: $('.strecken-selector').parent().find('.scrollbar'), + scrollBy: 1, + pagesBar: $('.strecken-selector').parent().find('.pages'), + activatePageOn: 'click', + speed: 300, + elasticBounds: 1, + dragHandle: 1, + dynamicHandle: 1, + clickBar: 1, + } +}; + + +preprocessor.load(function(data) { + slyelement.obj = new Sly($(slyelement.el), slyelement.options); + slyelement.obj.init(); + // Some sample code for a year selector - TODO: Improve a lot and move somewhere else var yearSelector = $("#seasonByYearSelector"); - var seasons = processor.getSeasonsWithLapData(); - for(var season in seasons){ yearSelector.append(""); } - createLineGraph("#lineGraphBox", processor.getRace(970)); + var seasons = processor.getSeasonsWithLapData(); + + for(var season in seasons){ yearSelector.append(""); } + + // Someone chose a year + yearSelector.change(function(event) { + var selectedYear = $(event.target).val(); + slyelement.curRaces = processor.getRacesByYear(selectedYear); + $("#courseSelection").empty(); + for(var race in slyelement.curRaces) { + var raceD = slyelement.curRaces[race]; + $("#courseSelection").append("
  • " + raceD.raceInfo.name +" " + raceD.raceInfo.date + "
    • "); + } + $("#courseSelection li").click(function(event) { + var raceI = event.target.attributes.data.value; + var rdata = slyelement.curRaces.filter(r => r.raceInfo.raceId == raceI)[0]; + $("#lineGraphBox").empty(); + createLineGraph("#lineGraphBox", rdata); + }); + slyelement.obj.reload(); + }); + + $(window).resize(function(e) { + slyelement.obj.reload(); + }); + }); diff --git a/js/processor.js b/js/processor.js index 9dabd99..56db0cb 100644 --- a/js/processor.js +++ b/js/processor.js @@ -34,7 +34,17 @@ var processor = { //Attach Qualifying Data lapData.qualifying = processor.getQualifyingForDriver(raceData, driver); //add Qualifying Data to the Laps - var lap0 = {'driverId': driver.driverId, 'lap': 0, 'position': lapData.qualifying.position}; + var lap0 = {'driverId': driver.driverId, 'lap': 0}; + // Figure out the position of that driver + if (lapData.qualifying !== undefined) { + // Use qualifying data, if available + lap0['position'] = lapData.qualifying.position; + } else { + // TODO: Easy fallback. + // Maybe just take result from first lap - Future: Perhaps leave out that data point at all + lap0['position'] = 0; + } + var endResult = raceData.results.filter(res => res.driverId == driver.driverId && res.laps == 0); if(endResult.length > 0){ lap0.finished = endResult[0]; @@ -55,6 +65,7 @@ var processor = { } }); }); + lapData.laps.sort((o1,o2) => o1["lap"] - o2["lap"]); result.push(lapData); }); return result; @@ -62,7 +73,9 @@ var processor = { getRacesByYear: function(year) { var races = queries.getRacesByYear(year); - return races.map(race => processor.getRace(race.raceId)); + var racesUnsorted = races.map(race => processor.getRace(race.raceId)); + racesUnsorted.sort((o1,o2) => o1["raceInfo"]["round"] - o2["raceInfo"]["round"]); + return racesUnsorted; }, //Gets the position of Driver with driverid in specific lap diff --git a/js/queries.js b/js/queries.js index 5d24e0c..6d55f1f 100644 --- a/js/queries.js +++ b/js/queries.js @@ -117,7 +117,12 @@ var queries = { getRaceById: function(raceId){ var rawData = preprocessor.getResults(); - return rawData.races[raceId]; + for(var key in rawData.races){ + if(rawData.races[key].raceId == raceId){ + return rawData.races[key]; + } + } + return null; }, getRacesByYear: function(year){