require('./style.scss');

module.exports = new Class({
	Extends: Htk.Field
	,Tag: 'htk-button'
	,Properties: {
		image: {
			type: String
			,set(x) {
				this.iconNode.name = x;
			}
		},
		icon: {
			type: String
			,set(x) {
				this.iconNode.name = x;
			}
		},
		tip: {
			type: String
			,set(x) {
				this.node.title = x ? _(x) : '';
				this.renderContent();
			}
			,get() {
				return this.node.title;
			}
		},
		showText: {
			type: Boolean
			,set(x) {
				this._showText = x;
				this.renderContent();
			}
			,get() {
				return this._showText;
			}
		}
	}
	
	,_showText: false
	
	,render() {
		var node = this.createRoot('button');
	
		this.iconNode = new Htk.Icon();
		node.appendChild(this.iconNode.node);
	}
	
	,renderContent() {
		if (this._textNode)
			Vn.Node.remove(this._textNode);

		if (this._showText && this.node.title) {
			this._textNode = this.createElement('span');
			this._textNode.className = 'text';
			this._textNode.appendChild(this.createTextNode(this.node.title));
			this.node.appendChild(this._textNode);
		}
	}
});