diff --git a/cors_webserver.py b/cors_webserver.py deleted file mode 100644 index e8cd308..0000000 --- a/cors_webserver.py +++ /dev/null @@ -1,19 +0,0 @@ -#!/usr/bin/env python3 -try: - # Python 3 - from http.server import HTTPServer, SimpleHTTPRequestHandler, test as test_orig - import sys - def test (*args): - test_orig(*args, port=int(sys.argv[1]) if len(sys.argv) > 1 else 8000) -except ImportError: # Python 2 - from BaseHTTPServer import HTTPServer, test - from SimpleHTTPServer import SimpleHTTPRequestHandler - -class CORSRequestHandler (SimpleHTTPRequestHandler): - def end_headers (self): - self.send_header('Access-Control-Allow-Origin', '*') - SimpleHTTPRequestHandler.end_headers(self) - -if __name__ == '__main__': - test(CORSRequestHandler, HTTPServer) - diff --git a/css/main.css b/css/main.css index 3858256..6bdd2b2 100644 --- a/css/main.css +++ b/css/main.css @@ -39,7 +39,7 @@ body { .frame { width: 100%; height: 160px; padding: 0; } .frame .slidee { margin: 0; padding: 0; height: 100%; list-style: none; } -.frame .slidee li { float: left; margin: 0 5px 0 0; padding: 0; width: 120px; height: 100%; } +.frame .slidee li { float: left; margin: 0 5px 0 0; padding: 0; width: 150px; height: 100%; } .scrollbar { width: 100%; @@ -55,3 +55,22 @@ body { .slidee li { border: 1px solid black; } + +.coursename { + font-size: 8pt; + font-weight: bold; +} + +.courseimagecontainer { + height: 75%; + width: 100%; + height: 7em; + display: flex; + align-items: center; + justify-content: center; +} + +.courseimage { + margin-left: auto; + margin-right: auto; +} diff --git a/js/main.js b/js/main.js index d1d1454..8dae758 100644 --- a/js/main.js +++ b/js/main.js @@ -49,7 +49,20 @@ preprocessor.load(function(data) { $("#courseSelection").empty(); for(var race in slyelement.curRaces) { var raceD = slyelement.curRaces[race]; - $("#courseSelection").append("
  • " + raceD.raceInfo.name +" " + raceD.raceInfo.date + "
  • "); + + var url = raceD.raceInfo.url; + var pathName = url.substring(url.lastIndexOf("/")+1); + getImageFromWikipedia(raceD,pathName,100,(raceD1,imageURL) => { + $("#courseSelection").append("
  • " + + "" + raceD1.raceInfo.name +""+ + "
    " + + " " + + "
    " + + raceD1.raceInfo.date.toLocaleDateString("en-US") + + "
  • "); + slyelement.obj.reload(); + }); + } $("#courseSelection li").click(function(event) { var raceI = event.target.attributes.data.value; @@ -57,7 +70,7 @@ preprocessor.load(function(data) { $("#lineGraphBox").empty(); createLineGraph("#lineGraphBox", rdata); }); - slyelement.obj.reload(); + slyelement.obj.reload(); }); $(window).resize(function(e) { diff --git a/js/util.js b/js/util.js index 93d84ae..f8161c8 100644 --- a/js/util.js +++ b/js/util.js @@ -118,3 +118,32 @@ function getColorValue(index, all){ return "hsl(" + colorValue + ", " + 100 + "%, 35% )"; } + +/** + +data - own user data +pagename - the page where the image will be taken from +imagesize - target image size +callback(data,imageURL) - callback that will be called. Arguments are the provided + user data (data) and the final imageURL. + +**/ +function getImageFromWikipedia(data,pageName,imagesize,callback){ + $.ajax({ + url: "https://en.wikipedia.org/w/api.php", + data: { + format: "json", + action: "query", + titles: pageName, + prop:"pageimages", + pithumbsize:imagesize, + }, + dataType: 'jsonp', + success: function (dataResult) { + for(var key in dataResult.query.pages){ + var d = dataResult.query.pages[key]; + callback(data,d.thumbnail.source); + } + } + }); +};