/**
 * maca Opening hours block – editor
 */
(function () {
    var __ = wp.i18n.__;
    var registerBlockType = wp.blocks.registerBlockType;
    var el = wp.element.createElement;
    var ServerSideRender = wp.serverSideRender;
    var TextControl = wp.components.TextControl;
    var ToggleControl = wp.components.ToggleControl;

    registerBlockType('maca-restu/maca-opening-hours', {
        title: __('maca Opening hours', 'maca-restu-pro'),
        description: __('Show weekly opening hours and date exceptions from settings.', 'maca-restu-pro'),
        category: 'maca-restu-pro',
        icon: 'clock',
        supports: {
            html: false
        },
        attributes: {
            title: { type: 'string', default: '' },
            showTitle: { type: 'boolean', default: true },
            highlightToday: { type: 'boolean', default: true },
            mondayFirst: { type: 'boolean', default: true }
        },
        edit: function (props) {
            var attributes = props.attributes;
            var setAttributes = props.setAttributes;

            return el(
                'div',
                { className: 'maca-restu-block-editor' },
                el(ServerSideRender, {
                    block: 'maca-restu/maca-opening-hours',
                    attributes: attributes
                }),
                el(
                    'div',
                    { className: 'maca-restu-block-controls' },
                    el(TextControl, {
                        label: __('Title', 'maca-restu-pro'),
                        value: attributes.title || '',
                        onChange: function (value) {
                            setAttributes({ title: value });
                        },
                        help: __('Leave empty for the default title.', 'maca-restu-pro')
                    }),
                    el(ToggleControl, {
                        label: __('Show title', 'maca-restu-pro'),
                        checked: attributes.showTitle !== false,
                        onChange: function (value) {
                            setAttributes({ showTitle: value });
                        }
                    }),
                    el(ToggleControl, {
                        label: __('Highlight today', 'maca-restu-pro'),
                        checked: attributes.highlightToday !== false,
                        onChange: function (value) {
                            setAttributes({ highlightToday: value });
                        }
                    }),
                    el(ToggleControl, {
                        label: __('Week starts on Monday', 'maca-restu-pro'),
                        checked: attributes.mondayFirst !== false,
                        onChange: function (value) {
                            setAttributes({ mondayFirst: value });
                        }
                    })
                )
            );
        },
        save: function () {
            return null;
        }
    });
})();
