let todayDate = new Date().toISOString().slice(0, 10);
$.get('https://app.ecuriedemonac.fr/api/records/events?join=entries&join=files&filter=isPublic,eq,1&filter=begin,gt,' + todayDate).then(response => {


    PetiteVue.createApp({
        // exposed to all expressions
        baseUrl : 'https://app.ecuriedemonac.fr/',
        events: response.records,
        event: undefined,
        openDetails: false,
        openRegister: false,
        qtt: 1,
        comment: '',
        name: '',
        registerDone :false,
        // getters
        get plusOne() {
            return this.count + 1
        },
        get isOpen() {
            if (!this.event) return false
            return !this.event.close || new Date(this.event.close) >= new Date()
        },
        // methods
        increment() {
            this.count++
        },
        $DBqDateTime(date) {
            const t = new Date(date);
            const day = ('0' + t.getDate()).slice(-2);
            const month = ('0' + (t.getMonth() + 1)).slice(-2);
            const year = t.getFullYear();
            const hours = ('0' + t.getHours()).slice(-2);
            const minutes = ('0' + t.getMinutes()).slice(-2);
            const seconds = ('0' + t.getSeconds()).slice(-2);
            return `${day}/${month}/${year}, ${hours}:${minutes}:${seconds}`;

        },
        entriesCount(event) {
            if (!event) return 0
            return event.entries.filter(e => !e.remove_date).length
        },
        remaining(event) {
            if (!event) return 9999
            if (!event.max) return 9999
            return event.max - this.entriesCount(event)
        },
        open(event) {
            this.event = event
            this.openDetails = true
        },
        closeEvent() {
            this.openDetails = false
            this.openRegister = false
            this.$nextTick(() => {
                this.event = undefined
            })
        },
        register(event) {
            this.openRegister = true
        },
        send() {
            $.post('https://app.ecuriedemonac.fr/api/records/entries', {
                event: this.event.id,
                qtt: this.qtt,
                comment: this.comment,
                guest: this.name
            })
            this.registerDone = true
            this.closeEvent()
            this.loadEvents()
            setTimeout(() => {
                this.registerDone = false
            }, 10000)
        },
        loadEvents() {
            let todayDate = new Date().toISOString().slice(0, 10);
            $.get('https://app.ecuriedemonac.fr/api/records/events?join=entries&join=files&filter=isPublic,eq,1&filter=begin,gt,' + todayDate).then(response => {
                this.events = response.records
            })
        },
        mounted() {
            this.loadEvents()
        }
    }).mount('#calendar')
})