import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
import timestampIcon from '../../themes/icons/timestamp.svg';
 import TimestampCommand from './timestampcommand';

/**
 * Users can format the DateTime output based on a DateTime pattern
 *
 * The default DateTime pattern is dd/MM/yyyy hh:mm:ss aaa
 *
 * DateTime Patterns:
 *
 * yy = 2-digit year; yyyy = full year
 *
 * M = digit month; MM = 2-digit month
 *
 * d = digit day; dd = 2-digit day
 *
 * h = hours am/pm; hh = 2-digit hours am/pm; H = hours; HH = 2-digit hours
 *
 * m = minutes; mm = 2-digit minutes; aaa = AM/PM
 *
 * s = seconds; ss = 2-digit seconds
 *
 * S = miliseconds
 */
export default class Timestamp extends Plugin {
    init() {
        const editor = this.editor;
        const t = editor.t;
        const datetimeformat= editor.config.get('timestampConfig.datetimeFormat');

        editor.ui.componentFactory.add('timestamp', locale => {
            const buttonView = new ButtonView( locale );
            const command = editor.commands.get('timestamp');
            buttonView.set( {
                label: t('Timestamp'),
                icon: timestampIcon,
                withText: false,
                tooltip: true
            });
            buttonView.bind('isEnabled').to( command);

            buttonView.on('execute', () => {
              command.execute({ datetimeformat: datetimeformat })
            } );
            return buttonView;
        } );

        editor.commands.add('timestamp', new TimestampCommand(editor));
    }
}
