var Toast = require ('./toast');
var Tpl = require ('./image-editor.xml');

/**
 * A form to handle the image database, it allows to add new images or
 * replace it.
 */
module.exports = new Class
({
	Extends: Vn.Component
	,Properties:
	{
		/**
		 * The REST connection used to upload the image.
		 */
		conn:
		{
			type: Vn.JsonConnection
		}
	}
	
	,initialize: function (props)
	{
		this.loadTemplateFromString (Tpl);

		var self = this;
		this.$.form.onsubmit = function ()
			{ self._onSubmit (); return false; };

		this.parent (props);
	}
	
	,onNameChange: function ()
	{
		var newValue = this.$.name.value;
		
		if (!newValue)
			newValue = null
	
		this.emit ('name-changed', newValue);
	}
	
	,_onSubmit: function ()
	{
		this.$.submit.disabled = true;
		this.$.spinner.start ();

		this.conn.sendFormMultipart (this.$.form,
			this._onResponse.bind (this));
	}
	
	,_onResponse: function (json, error)
	{
		this.$.submit.disabled = false;
		this.$.spinner.stop ();

		if (error)
			throw error;

		Toast.showMessage (_('ImageAdded'));
		this.emit ('file-uploaded', this.$.name.value);
	}
	
	,setData: function (image, directory)
	{
		this.$.name.value = image;
		this.$.schema.value = directory;
	}
});