===== KG's code =====
==== Javascript ====
=== kg.definitions.fields ===
<code javascript>
kg.fields.hotel = [
  { name: 'stad*', size: 'md', validation:  {'not-empty___message': 'Je moet een stad waar het hotel ligt ingeven'} },
  { name: 'naam', size: 'lg', label: 'hotelnaam', labelOffcanvas: 'hotel', classOffcanvas: 'font-size-120' },
  { name: '[checkin*', size: 'sm', type: 'dateStart', validation: {'not-empty___message':'Geef de checkin datum in', 'kg-date-max':'checkout', 'kg-date-max-message': 'De checkin datum moet vóór de checkout liggen'}, colOffcanvas: 'col-6' },
  { name:'checkout*', size: 'sm', type:'date', validation:{'not-empty___message':'Geef de checkout datum in'}, colOffcanvas: 'col-6' },
  { name: 'gratisannuleren', size: 'sm', type:'date', label: 'annuleerbaar tot', info: 'datum tot wanneer er gratis geannuleerd kan worden', options: ['nocopy'] },
  { name: 'adres', size: 'lg', labelOffcanvas: '' },
  { name: 'telefoon', size: 'md', labelOffcanvas: '' },
  { name: 'email', size: 'md', type: 'email', labelOffcanvas: '' },
  { name: 'website', size: 'lg', type: 'url', labelOffcanvas: '' },
  { name: 'geboekt', size: 'xs', type: 'check' },
  { name: 'reservatiecode', size: 'md', classOffcanvas: 'lead bg-success-subtle px-2 border lh-lg' },
  { name: 'prijs', size: 'sm', type: 'decimal' },
  { name: 'ontbijt', size: 'xs', type: 'decimal', info: 'totaalprijs voor ontbijt, gebruik -1 indien ontbijt inbegrepen is in de prijs', options: ['nocopy'], values: kg.values.inbegrepen },
  { name: 'diner', size: 'xs', type: 'decimal', info: 'totaalprijs voor diner, gebruik -1 indien diner inbegrepen is in de prijs', options: ['nocopy'], values: kg.values.inbegrepen },
  { name: 'betaald', size: 'sm', type: 'decimal', info: 'bedrag dat al betaald werd bij reservatie', values: kg.values.saldo, valuesArguments: [['prijs', 'ontbijt','diner'], 'betaald'] },
  { name: '[checkin_tijd', size: 'sm', type: 'time', colOffcanvas: 'col-6' },
  { name: 'checkout_tijd', size: 'sm', type: 'time', colOffcanvas: 'col-6' },
  { name: 'latlon', size: 'lg', type: 'latlon', labelExtra: 'GPS coordinaten: lat,lon' },
  { name: 'opmerkingen', col: 'col-12', type: 'textarea'},
  { name: 'reis_id', type: 'hidden'}
];
if ( kg.data.reis['reis_label_lokale_taal'] ) {
  kg.fields.hotel.splice(2, 0, { name: 'naam_lokale_taal', size: 'lg', label: 'hotelnaam in lokale taal', labelOffcanvas: 'in lokale taal' });
  kg.fields.hotel.splice(7, 0, { name: 'adres_lokale_taal', size: 'lg', labelOffcanvas: '' });
}
</code>
<code javascript>
    kg.values.inbegrepen = (val) => {
      if ( val == -1 ) {
        return 'inbegrepen';
      } else {
        return (val || '');
      }
    }
    
    kg.values.saldo = (args, data) => {
      let tebetalen = 0;
      if ( Array.isArray(args[0]) ) {
        for ( const field of args[0] ) {
          if ( data[field] && (data[field] != -1 ) ) {
            tebetalen += Number(data[field]);
          }
        }
      } else {
        tebetalen = data[args[0]] || null;
      }
      let betaald = 0;
      if ( Array.isArray(args[1]) ) {
        for ( const field of args[1] ) {
          if ( data[field] && (data[field] != -1 ) ) {
            betaald += Number(data[field]);
          }
        }
      } else {
        betaald = data[args[1]] || null;
      }
      const saldo = Number.parseFloat(tebetalen - betaald).toFixed(2);
      if ( isNaN(saldo) ) {
        return betaald;
      }
      if ( saldo == 0 ) {
        return `${betaald} (volledig voldaan)`
      } else {
        return `${betaald} (nog ${saldo} te betalen)`;
      }
    }
</code>