{"size": 2088, "ext": "js", "max_stars_repo_path": "packages/ckeditor5-build-classic/plugin/ckeditor5-video/src/videoresize/videoresizeediting.js", "max_stars_repo_name": "pxzlin/ckeditor5", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "packages/ckeditor5-build-classic/plugin/ckeditor5-video/src/videoresize/videoresizeediting.js", "max_issues_repo_name": "pxzlin/ckeditor5", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "packages/ckeditor5-build-classic/plugin/ckeditor5-video/src/videoresize/videoresizeediting.js", "max_forks_repo_name": "pxzlin/ckeditor5", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 22.6956521739, "max_line_length": 76, "alphanum_fraction": 0.6288314176}
import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
import VideoResizeCommand from './videoresizecommand';

export default class VideoResizeEditing extends Plugin {
	static get pluginName() {
		return 'VideoResizeEditing';
	}

	constructor( editor ) {
		super( editor );

		editor.config.define( 'video', {
			resizeUnit: '%',
			resizeOptions: [ {
				name: 'videoResize:original',
				value: null,
				icon: 'original'
			},
			{
				name: 'videoResize:25',
				value: '25',
				icon: 'small'
			},
			{
				name: 'videoResize:50',
				value: '50',
				icon: 'medium'
			},
			{
				name: 'videoResize:75',
				value: '75',
				icon: 'large'
			} ]
		} );
	}

	init() {
		const editor = this.editor;
		const command = new VideoResizeCommand( editor );

		this._registerSchema();
		this._registerConverters();

		editor.commands.add( 'videoResize', command );
	}

	_registerSchema() {
		this.editor.model.schema.extend( 'video', { allowAttributes: 'width' } );
		this.editor.model.schema.setAttributeProperties( 'width', {
			isFormatting: true
		} );
	}

	_registerConverters() {
		const editor = this.editor;

		// Dedicated converter to propagate video's attribute to the video tag.
		editor.conversion.for( 'downcast' ).add( dispatcher =>
			dispatcher.on( 'attribute:width:video', ( evt, data, conversionApi ) => {
				if ( !conversionApi.consumable.consume( data.item, evt.name ) ) {
					return;
				}

				const viewWriter = conversionApi.writer;
				const figure = conversionApi.mapper.toViewElement( data.item );

				if ( data.attributeNewValue !== null ) {
					viewWriter.setStyle( 'width', data.attributeNewValue, figure );
					viewWriter.addClass( 'video_resized', figure );
				} else {
					viewWriter.removeStyle( 'width', figure );
					viewWriter.removeClass( 'video_resized', figure );
				}
			} )
		);

		editor.conversion.for( 'upcast' )
			.attributeToAttribute( {
				view: {
					name: 'figure',
					styles: {
						width: /.+/
					}
				},
				model: {
					key: 'width',
					value: viewElement => viewElement.getStyle( 'width' )
				}
			} );
	}
}
