index.html (16433B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <!-- Material Design fonts --> 8 <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700"> 9 <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/icon?family=Material+Icons"> 10 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.3/css/bootstrap.min.css" integrity="sha384-MIwDKRSSImVFAZCVLtU0LMDdON6KVCrZHyVQQj6e8wIEJkW4tvwqXrbMIya1vriY" crossorigin="anonymous"> 11 <link rel="stylesheet" href="https://cdn.rawgit.com/FezVrasta/bootstrap-material-design/dist/dist/bootstrap-material-design.min.css"> 12 <title>Lornsenschule Vertretungsplan</title> 13 </head> 14 <body> 15 <div class="bmd-layout-container" id="Main"> 16 <main class="bmd-layout-content"> 17 <div class="container"> 18 <h1 id="school"></h1></br> 19 20 <ul class="nav nav-tabs" id="Tabs"> 21 <li class="nav-item"><a class="nav-link active" data-target="#vertretungen" data-toggle="tab">Vertretungen</a></li> 22 <li class="nav-item"><a class="nav-link" data-target="#messages" data-toggle="tab">Messages</a></li> 23 </ul> 24 25 <div class="tab-content"> 26 <div class="tab-pane fade in active" id="vertretungen"><div id="days" day="0"></div><div id="days" day="1"></div></div> 27 <div class="tab-pane fade" id="messages"></div> 28 </div> 29 30 </div> 31 </main> 32 </div> 33 34 <!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 35 <script> 36 function reloadPage() { 37 var remote = require('electron').remote 38 remote.getCurrentWindow().reload() 39 } 40 window.$ = window.jQuery = require('./js/jquery-3.1.0.min.js'); 41 var request = require('request') 42 , cachedRequest = require('cached-request')(request) 43 , cacheDirectory = "cache"; 44 var url = "https://api.vertretungsplan.me/" + 45 "v2/" + 46 "substitutionschedules/" + 47 "Schleswig_Lornsenschule/" + 48 "schulervertretungsplan" + 49 "?client=desktop_marcel" 50 51 cachedRequest({ 52 url: url, 53 json: true, 54 ttl: 1800000 55 }, function (error, response, body) { 56 console.log("Response Code: " + response.statusCode) 57 if (!error && response.statusCode === 200) { 58 console.log("Parsing") 59 document.all.school.innerHTML = body.schoolId.replace(/_/g, ' ') + ' Vertretungsplan'; // Print the json response 60 for (var key in body.days) { 61 if (body.days.hasOwnProperty(key)) { 62 date = body.days[key].dateString 63 substitutions = body.days[key].substitutions 64 messages = body.days[key].messages 65 day = key 66 console.log("Day found") 67 $("#messages").append('<h2 id="date">' + date + '</h2>') 68 for (var key in messages) { 69 if (messages.hasOwnProperty(key)) { 70 $("#messages").append('<div class="card card-block" style="height: 10%; background-color: #EEEEEE; color: #000"><p>' + messages[key].replace(/\n/g, ' ') + '</p></div>') 71 } 72 } 73 console.log(day) 74 $("div").filter("[day='" + day + "']", "#days").append('<h2 id="date" date="' + date + '">' + date + '</h2>') 75 for (var key in substitutions) { 76 if (substitutions.hasOwnProperty(key)) { 77 console.log("Substitutions found") 78 substitutions_now = substitutions[key] 79 klassen = substitutions_now.classes 80 for (var key in klassen) { 81 if (klassen.hasOwnProperty(key)) { 82 console.log("Class found") 83 klasse = klassen[key] 84 if ($("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").length == 0) { 85 console.log("Found new Class") 86 $("h2").filter("[date='" + date + "']", "#days").after('<div id="klasse" klasse="' + klasse + '"><h3 id="klasse" klasse="' + klasse + '" day="' + day + '">' + klasse + '</h3>') 87 }else{} 88 var reg = new RegExp('[-]'); 89 lesson = substitutions_now.lesson 90 substitutions_type = substitutions_now.type 91 text = substitutions_now.text 92 console.log("Appending") 93 console.log("Multiple Subjects: " + reg.test(lesson)) 94 if (substitutions_type == "Vertretung") { 95 if (reg.test(lesson)) { 96 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #2196F3; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 300%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 97 }else{ 98 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #2196F3; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 350%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 99 } 100 }else{ 101 if (substitutions_type == "Betreuung") { 102 if (reg.test(lesson)) { 103 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #2196F3; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 300%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 104 }else{ 105 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #2196F3; color: #fff" id="substitution" substitution="' + lesson + '>' + '<div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 350%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 106 } 107 }else{ 108 if (substitutions_type == "Unterricht geändert") { 109 if (reg.test(lesson)) { 110 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #FFA000; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 300%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 111 }else{ 112 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #FFA000; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row">' + '<div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 350%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 113 } 114 }else{ 115 if (substitutions_type == "Lehrertausch") { 116 if (reg.test(lesson)) { 117 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #9C27B0; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 300%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 118 }else{ 119 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #9C27B0; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 350%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 120 } 121 }else{ 122 if (substitutions_type == "anderer Raum") { 123 if (reg.test(lesson)) { 124 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #9C27B0; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 300%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 125 }else{ 126 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #9C27B0; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 350%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 127 } 128 }else{ 129 if (substitutions_type == "Aufgaben") { 130 if (reg.test(lesson)) { 131 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #F44336; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 300%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 132 }else{ 133 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #F44336; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 350%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 134 } 135 }else{ 136 if (substitutions_type == "Sondereins.") { 137 if (reg.test(lesson)) { 138 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #2196F3; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 300%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 139 }else{ 140 $("h3").filter("[klasse='" + klasse + "'][day='" + day + "']", "#klasse").after('<div class="card card-block" style="height: 10%; background-color: #2196F3; color: #fff" id="substitution" substitution="' + lesson + '"><div class="row"><div class="col-md-4" style="position: relative; margin: 0;"><p style="font-size: 350%; margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">' + lesson + '</p></div><div class="col-md-8"><h4>' + substitutions_type + '</h4></br><h7>' + text + '</h7></div></div></div>') 141 } 142 } 143 } 144 } 145 } 146 } 147 } 148 } 149 $.fn.sortSubstitutions = jQuery.fn.sortSubstitutions = function sortSubstitutions() { 150 $("> div", this[0]).sort(dec_sort).appendTo(this[0]); 151 function dec_sort(a, b){ return ($(b).attr("substitution")) < ($(a).attr("substitution")) ? 1 : -1; } 152 } 153 $('div#klasse[klasse="' + klasse + '"]').sortSubstitutions(); 154 } 155 } 156 } 157 } 158 } 159 } 160 $.fn.sortClasses = jQuery.fn.sortClasses = function sortClasses() { 161 $("> div", this[0]).sort(dec_sort).appendTo(this[0]); 162 function dec_sort(a, b){ return ($(b).attr("klasse")) < ($(a).attr("klasse")) ? 1 : -1; } 163 } 164 $('#days[day="0"]').sortClasses(); 165 $('#days[day="1"]').sortClasses(); 166 }else{ 167 console.log(error) 168 $("#Main").append('<p class="bg-danger">Scheinbar geht dein Internet nicht :/</p>') 169 } 170 }) 171 172 $('#Tabs a').click(function (e) { 173 e.preventDefault() 174 $(this).tab('show') 175 }) 176 </script> 177 <!-- Include all compiled plugins (below), or include individual files as needed --> 178 <script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.2.0/js/tether.min.js" integrity="sha384-Plbmg8JY28KFelvJVai01l8WyZzrYWG825m+cZ0eDDS1f7d/js6ikvy1+X+guPIB" crossorigin="anonymous"></script> 179 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.3/js/bootstrap.min.js" integrity="sha384-ux8v3A6CPtOTqOzMKiuo3d/DomGaaClxFYdCu2HPMBEkf6x2xiDyJ7gkXU0MWwaD" crossorigin="anonymous"></script> 180 <script src="https://cdn.rawgit.com/FezVrasta/bootstrap-material-design/dist/dist/bootstrap-material-design.iife.min.js"></script> 181 <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> 182 <script src="https://maxcdn.bootstrapcdn.com/js/ie10-viewport-bug-workaround.js"></script> 183 </body> 184 </html>