Basic functionality. Faketime via GET.
parent
c17c5a8e97
commit
f3207103c4
47
index.html
47
index.html
|
@ -6,37 +6,54 @@
|
|||
|
||||
<link rel="stylesheet" href="css/bootstrap.min.css">
|
||||
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
|
||||
<script type="text/javascript" src="js/xml2json.js"></script>
|
||||
<script type="text/javascript" src="js/Schedule.js"></script>
|
||||
|
||||
<title>Datenspuren Wegweiser</title>
|
||||
<title>Konferenz Wegweiser</title>
|
||||
</head>
|
||||
<body class="bg-dark text-info">
|
||||
<h1>Datenspuren Wegweiser</h1>
|
||||
<div class="talks">
|
||||
<div class="talk">nächste talk</div>
|
||||
<h1>Konferenz Wegweiser</h1>
|
||||
<h2>
|
||||
<span class="conf_title">loading schedule..</span>
|
||||
<small>(<span class="conf_start"></span> - <span class="conf_end"></span>)</small>
|
||||
</h2>
|
||||
|
||||
<h3>demnächst stattfindende Talks</h3>
|
||||
<div class="talks card-deck">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2>Plan: <span id="scheduleName"></span></h2>
|
||||
<h2>Plan:</h2>
|
||||
|
||||
<script>
|
||||
$.when( $.ready ).then(function() {
|
||||
let path = "./src/schedule.xml";
|
||||
$.get( path, function( data ) {
|
||||
this.xml = new XMLSerializer().serializeToString(data);
|
||||
|
||||
this.xml = new XMLSerializer().serializeToString(data);
|
||||
//console.log(xml2json(this.xml));
|
||||
|
||||
var scheduleXml = $( $.parseXML( this.xml ) );
|
||||
// load your schedule
|
||||
var scheduleXml = $( $.parseXML(this.xml) );
|
||||
var s = new Schedule(scheduleXml);
|
||||
|
||||
$('#scheduleName').html( s.getScheduleTitle() );
|
||||
// for testing purposes
|
||||
// Example: ?faketime=2018-09-22T19:29:00
|
||||
let faketime = new URL(window.location.href).searchParams.get("faketime");
|
||||
if (faketime != null){
|
||||
s.setTimeTo(new Date(faketime));
|
||||
}
|
||||
|
||||
var talks = s.getTalks(s);
|
||||
//console.log(talks[0].childNodes[0].nodeValue.text());
|
||||
for ( var i = 0; i < talks.length; i++) {
|
||||
item = "<li>" + talks[i] + "<li>";
|
||||
$('.talk').append(item);
|
||||
// output part of the schedule
|
||||
$('.conf_title').html( s.getScheduleTitle() );
|
||||
$('.conf_start').html( s.getScheduleStart());
|
||||
$('.conf_end').html( s.getScheduleEnd());
|
||||
|
||||
var events = s.getNextEvents();
|
||||
for ( var i = 0; i < events.length; i++ ) {
|
||||
item = '<div class="card"><div class="card-title">' + events[i].title + "<div>" +events[i].date+ "</div>";
|
||||
$('.talks').append(item);
|
||||
if (i >= 2){
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
|
|
@ -9,7 +9,7 @@ var Schedule = class {
|
|||
schedule = false;
|
||||
|
||||
/**
|
||||
* Array of talks
|
||||
* Array of Events
|
||||
*
|
||||
* [{
|
||||
* id: 2132,
|
||||
|
@ -17,13 +17,22 @@ var Schedule = class {
|
|||
* date:2018-09-22T10:30:00+02:00
|
||||
* }]
|
||||
*/
|
||||
talks = [];
|
||||
events = [];
|
||||
|
||||
|
||||
query = {
|
||||
time : { 'from' : new Date, 'to' : new Date }
|
||||
/**
|
||||
* object with Information of the conference
|
||||
* {'title', 'start', 'end', ..}
|
||||
*/
|
||||
conf = {
|
||||
title: 'defaultConf',
|
||||
start: '1984-09-23',
|
||||
end: '1984-09-24'
|
||||
}
|
||||
|
||||
/**
|
||||
* indepent time
|
||||
*/
|
||||
now = new Date();
|
||||
|
||||
/**
|
||||
*
|
||||
|
@ -50,46 +59,90 @@ var Schedule = class {
|
|||
* class constructor
|
||||
*/
|
||||
constructor(scheduleXml){
|
||||
this.schedule = scheduleXml;
|
||||
this.talks = this.getTalks();
|
||||
this.schedule = scheduleXml.children("schedule");
|
||||
|
||||
this.conf.title = this.schedule.children("conference").children("title").text();
|
||||
this.conf.start = this.schedule.children("conference").children("start").text();
|
||||
this.conf.end = this.schedule.children("conference").children("end").text();
|
||||
this.events = this.getEvents();
|
||||
}
|
||||
|
||||
/**
|
||||
* set orientation time
|
||||
*/
|
||||
setTimeTo(time){
|
||||
this.now = time;
|
||||
}
|
||||
|
||||
/**
|
||||
* @return String the schedule title
|
||||
*/
|
||||
getScheduleTitle(){
|
||||
return this.schedule.find("title")[0]
|
||||
return this.conf.title;
|
||||
}
|
||||
|
||||
/**
|
||||
* return array of all talks
|
||||
* @return day of conf start
|
||||
*/
|
||||
getTalks(){
|
||||
this.schedule.find('event');
|
||||
|
||||
return [];
|
||||
getScheduleStart(){
|
||||
return this.conf.start;
|
||||
}
|
||||
/**this.events
|
||||
* @return day of conf end
|
||||
*/
|
||||
getScheduleEnd(){
|
||||
return this.conf.end;
|
||||
}
|
||||
|
||||
/**
|
||||
* get next talks by time and room
|
||||
* return array of all Events
|
||||
*/
|
||||
getEvents(){
|
||||
let allEvents = [];
|
||||
if (this.events.length == 0 ){
|
||||
//this.schedule.find('event').toArray();
|
||||
this.schedule.find('event').each( function(){
|
||||
allEvents.push({
|
||||
title: $(this).children('title').text(),
|
||||
date: $(this).children('date').text(),
|
||||
});
|
||||
});
|
||||
}
|
||||
// console.log( 888, allEvents );
|
||||
return allEvents;
|
||||
}
|
||||
|
||||
/**
|
||||
* get next Events by time and room
|
||||
*
|
||||
* @param {Timestamp} minimum time to start
|
||||
* @param {*} room
|
||||
*/
|
||||
getTalk(time, room){
|
||||
|
||||
return talk;
|
||||
}
|
||||
|
||||
/**
|
||||
* get the next talks, based on time
|
||||
* @param {Date} time
|
||||
* get the next Events, based on time
|
||||
*
|
||||
*/
|
||||
getNextTalks(time){
|
||||
let startTime = new Date(Date.now())
|
||||
getNextEvents(){
|
||||
if (this.events.length == 0){
|
||||
return this.events;
|
||||
}
|
||||
|
||||
this.query.time.from = time.toISOString();
|
||||
console.log(this.query);
|
||||
let talks = [];
|
||||
|
||||
let now = this.now;
|
||||
//let now = new Date('September 22, 2018 19:30:00').getTime();
|
||||
|
||||
this.events.forEach( talk => {
|
||||
let talkStart = new Date(talk.date).getTime();
|
||||
if ( talkStart >= now ){
|
||||
talks.push(talk);
|
||||
}
|
||||
});
|
||||
|
||||
return talks;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue