import uploadIcon from './icons/abc.svg';
import ButtonView from '@ckeditor/ckeditor5-ui/src/button/buttonview';
import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
import imageIcon from '@ckeditor/ckeditor5-core/theme/icons/image.svg';

export default class CustomFileExporerPlugin extends Plugin {
    init() {
        // debugger;
        // console.log( 'InsertImage was manh si cui bap' );
        // const editor = this.editor;

        // editor.ui.componentFactory.add('fileExplorer', (locale) => {
        //     const view = new ButtonView(locale);

        //     view.set({
        //         label: 'Choose a file',
        //         icon: uploadIcon,
        //         tooltip: true
        //     });

        //     // Callback executed once the icon is clicked
        //     view.on('execute', () => {
        //         // fire a JS event
        //         window.dispatchEvent(new Event('Test'));
        //     });

        //     return view;
        // });
        const editor = this.editor;

        editor.ui.componentFactory.add( 'fileExplorer', locale => {
            const view = new ButtonView( locale );

            view.set( {
                label: 'Insert image',
                icon: imageIcon,
                tooltip: true
            } );

            // Callback executed once the image is clicked.
            view.on( 'execute', () => {
                const imageUrl = prompt( 'Image URL' );

                editor.model.change( writer => {
                    const imageElement = writer.createElement( 'image', {
                        src: imageUrl
                    } );

                    // Insert the image in the current selection location.
                    editor.model.insertContent( imageElement, editor.model.document.selection );
                } );
            } );

            return view;
        } );
    }
}
