131 lines
6.7 KiB
JavaScript
Executable File
131 lines
6.7 KiB
JavaScript
Executable File
Vue.createApp({
|
|
data: function() {
|
|
return { 'events': null
|
|
, 'frm': { 'e': null, 'modal': null }
|
|
, 'faults': null
|
|
, 'fields': { 'coordinates': { 'patterns': [ '^$', '^-?\\d{1,3}(?:\\.\\d+)?,-?\\d{1,3}(?:\\.\\d+)?$' ], 'default': '-27.38621539644283,153.0351689206467' }
|
|
, 'start': { 'patterns': [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:?\\d{0,2}$' ], 'default': '' }
|
|
, 'end': { 'patterns': [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:?\\d{0,2}$' ], 'default': '' }
|
|
, 'title': { 'patterns': [ '^.{10,50}$' ], 'default': 'Event Title' }
|
|
, 'description': { 'patterns': [ '^.{16,}$' ], 'default': 'Event Description' }
|
|
, 'location': { 'patterns': [ '^.{5,100}$' ], 'default': 'Event Location' }
|
|
}
|
|
}
|
|
},
|
|
methods: { formatDate: function(dt) {
|
|
var fmt = 'DD MMM YYYY';
|
|
var m = moment(dt);
|
|
var t = m.hour() * 3600 + m.minute() * 60 + m.second();
|
|
if ( t > 0 ) {
|
|
fmt = ' ddd DD MMM YYYY, h:mm A';
|
|
}
|
|
var ret = moment(dt).format(fmt);
|
|
return ret;
|
|
},
|
|
hoursDiff: function(d1, d2) {
|
|
return moment(d2).diff(moment(d1), 'hours', true);
|
|
},
|
|
createEvent: function() {
|
|
var event = {};
|
|
for ( var k in this.fields ) {
|
|
event[k] = this.fields[k].default;
|
|
}
|
|
const now = moment();
|
|
let next7pm = moment().hour(19).minute(0).second(0);
|
|
if (now.isSameOrAfter(next7pm)) {
|
|
next7pm.add(1, 'day');
|
|
}
|
|
event.hours = 2.5;
|
|
const twoHoursLater = moment(next7pm).add(event.hours, 'hours');
|
|
event.start = next7pm.format('YYYY-MM-DDTHH:mm');
|
|
event.end = twoHoursLater.format('YYYY-MM-DDTHH:mm');
|
|
this.events.unshift(event);
|
|
this.frm.e = 0;
|
|
},
|
|
saveEvents: function() {
|
|
console.log(this.events);
|
|
var app = this;
|
|
jQuery.post( 'api.php'
|
|
, { 'cmd': 'put'
|
|
, 'payload': btoa(JSON.stringify(this.events))
|
|
}
|
|
, function(data) {
|
|
app.events = data;
|
|
app.frm.e = null;
|
|
app.validateEvents();
|
|
}
|
|
);
|
|
},
|
|
deleteEvent: function() {
|
|
this.events.splice(this.frm.e, 1);
|
|
this.frm.e = null;
|
|
this.validateEvents();
|
|
},
|
|
validateEvents: function() {
|
|
var faults = [];
|
|
for ( var e in this.events ) {
|
|
var start = moment(this.events[e].start);
|
|
var end = start.add(this.events[e].hours, 'hours');
|
|
this.events[e].end = end.format('YYYY-MM-DDTHH:mm');
|
|
for ( var k in this.fields ) {
|
|
var value = this.events[e][k];
|
|
value = ( value == undefined ? '' : value );
|
|
var patterns = this.fields[k].patterns;
|
|
var match = false;
|
|
for ( var p in patterns ) {
|
|
var pattern = new RegExp(patterns[p]);
|
|
match = match || pattern.test(value);
|
|
}
|
|
if ( ! match ) {
|
|
var fault = {};
|
|
fault.e = e;
|
|
fault.k = k;
|
|
fault.v = value;
|
|
fault.msg = 'Bad format for ' + k + '.';
|
|
faults.push(fault);
|
|
}
|
|
}
|
|
var d1 = moment(this.events[e].start);
|
|
var d2 = moment(this.events[e].end);
|
|
if ( d2.isSameOrBefore(d1) ) {
|
|
var fault = {};
|
|
fault.e = e;
|
|
fault.k = 'end';
|
|
fault.v = this.formatDate(d2);
|
|
fault.msg = 'Event ends before start.';
|
|
faults.push(fault);
|
|
}
|
|
}
|
|
this.faults = ( faults.length == 0 ? null : faults );
|
|
},
|
|
load: function() {
|
|
var app = this;
|
|
jQuery.get( 'api.php'
|
|
, { 'cmd': 'get' }
|
|
, function(data) {
|
|
app.events = data;
|
|
app.validateEvents();
|
|
$('body').fadeIn();
|
|
}
|
|
);
|
|
},
|
|
modal: function(property) {
|
|
var d = {};
|
|
d.property = property;
|
|
d.value = this.events[this.frm.e][property];
|
|
this.frm.modal = d;
|
|
},
|
|
modalUpdate: function() {
|
|
this.events[this.frm.e][this.frm.modal.property] = this.frm.modal.value;
|
|
this.frm.modal = null;
|
|
this.validateEvents();
|
|
},
|
|
modalCancel: function() {
|
|
this.frm.modal = null;
|
|
}
|
|
},
|
|
mounted: function() {
|
|
this.load();
|
|
}
|
|
}).mount('#app')
|