Vue.createApp({
  data: function() {
          return { 'events': null
                 , 'frm': { 'e': null, 'modal': null }
                 , 'faults': null
                 , 'patterns': { 'coordinates': [ '^$', '^-?\\d{1,3}(?:\\.\\d+)?,-?\\d{1,3}(?:\\.\\d+)?$' ]
                               , 'start':       [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}$' ]
                               , 'end':         [ '^\\d{4}-\\d{2}-\\d{2}T\\d{2}:\\d{2}:\\d{2}$' ]
                               , 'title':       [ '^.{20,50}$' ]
                               , 'description': [ '^.{20,}$' ]
                               , 'location':    [ '^.{5,100}$' ]
                               }
                 }
        },
  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 = 'DD MMM YYYY, HH:mm:ss';
                           }
                           var ret = moment(dt).format(fmt);
                           return ret;
                         },
             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 ) {
                                 for ( var k in this.patterns ) {
                                   var value = this.events[e][k];
                                   value = ( value == undefined ? '' : value );
                                   var patterns = this.patterns[k];
                                   var match = false;
                                   for ( var p in patterns ) {
                                     var pattern = new RegExp(this.patterns[k][p]);
                                     match = match || pattern.test(value);
                                   }
                                   console.log(e, k, value, match);
                                   if ( ! match ) {
                                     var fault = {};
                                     fault.e = e;
                                     fault.k = k;
                                     fault.v = value;
                                     faults.push(fault);
                                   }
                                 }
                               }
                               this.faults = ( faults.length == 0 ? null : faults );
                             },
             modal: function(property) {
                      var d = {};
                      d.property = property;
                      d.value = this.events[this.frm.e][property];
                      this.frm.modal = d;
                    }
           },
  mounted: function() {
             var app = this;
             jQuery.get( 'api.php'
                       , { 'cmd': 'get' }
                       , function(data) {
                           app.events = data;
                           app.validateEvents();
                           $('body').fadeIn();
                         }
                       );
           }
}).mount('#app')