Your IP : 172.69.17.155

Current Path : /var/www/element/data/www/revenuestory.ru/bitrix/js/landing/ui/field/textfield/src/
Upload File :
Current File : /var/www/element/data/www/revenuestory.ru/bitrix/js/landing/ui/field/textfield/src/textfield.js

import {BaseField} from 'landing.ui.field.basefield';
import {Text, Type, Event, Dom, Runtime} from 'main.core';
import {BaseEvent} from 'main.core.events';
import {fetchEventsFromOptions} from 'landing.ui.component.internal';

export class TextField extends BaseField
{
	constructor(options)
	{
		super(options);
		this.setEventNamespace('BX.Landing.UI.Field.TextField');
		this.subscribeFromOptions(fetchEventsFromOptions(options));

		this.bind = this.options.bind;
		this.changeTagButton = this.options.changeTagButton;
		this.onInputHandler = Type.isFunction(this.options.onInput) ? this.options.onInput : () => {};
		this.onValueChangeHandler = Type.isFunction(this.options.onValueChange) ? this.options.onValueChange : () => {};
		this.textOnly = Type.isBoolean(this.options.textOnly) ? this.options.textOnly : false;
		this.content = this.textOnly ? Text.encode(this.content) : this.content;
		this.input.innerHTML = this.content;

		this.onInputClick = this.onInputClick.bind(this);
		this.onInputMousedown = this.onInputMousedown.bind(this);
		this.onDocumentMouseup = this.onDocumentMouseup.bind(this);
		this.onInputInput = this.onInputInput.bind(this);
		this.onDocumentClick = this.onDocumentClick.bind(this);
		this.onDocumentKeydown = this.onDocumentKeydown.bind(this);
		this.onInputKeydown = this.onInputKeydown.bind(this);

		Event.bind(this.input, 'click', this.onInputClick);
		Event.bind(this.input, 'mousedown', this.onInputMousedown);
		Event.bind(this.input, 'input', this.onInputInput);
		Event.bind(this.input, 'keydown', this.onInputKeydown);

		Event.bind(document, 'click', this.onDocumentClick);
		Event.bind(document, 'keydown', this.onDocumentKeydown);
		Event.bind(document, 'mouseup', this.onDocumentMouseup);
	}

	onInputInput()
	{
		this.onInputHandler(this.input.innerText);
		this.onValueChangeHandler(this);

		const event = new BaseEvent({
			data: {value: this.getValue()},
			compatData: [this.getValue()],
		});

		this.emit('onChange', event);
	}

	onDocumentKeydown(event)
	{
		if (event.keyCode === 27)
		{
			if (this.isEditable())
			{
				if (this === BX.Landing.UI.Field.BaseField.currentField)
				{
					BX.Landing.UI.Panel.EditorPanel.getInstance().hide();
				}

				this.disableEdit();
			}
		}
	}

	onInputKeydown(event)
	{
		if (event.keyCode === 13)
		{
			if (this.isTextOnly())
			{
				event.preventDefault();
			}
		}
	}

	enableTextOnly()
	{
		this.textOnly = true;
		this.input.innerHTML = `${this.input.innerText}`.trim();
	}

	disableTextOnly()
	{
		this.textOnly = false;
	}

	isTextOnly()
	{
		return this.textOnly;
	}

	isContentEditable()
	{
		return this.contentEditable !== false;
	}

	onDocumentClick()
	{
		if (this.isEditable() && !this.fromInput)
		{
			if (this === BX.Landing.UI.Field.BaseField.currentField)
			{
				BX.Landing.UI.Panel.EditorPanel.getInstance().hide();
			}

			this.disableEdit();
		}

		this.fromInput = false;
	}

	onDocumentMouseup()
	{
		setTimeout(() => {
			this.fromInput = false;
		}, 10);
	}

	onInputClick(event)
	{
		event.preventDefault();
		event.stopPropagation();
		this.fromInput = false;
	}

	onInputMousedown(event)
	{
		this.enableEdit();

		BX.Landing.UI.Tool.ColorPicker.hideAll();
		BX.Landing.UI.Button.FontAction.hideAll();

		requestAnimationFrame(() => {
			if (event.target.nodeName === 'A')
			{
				const range = document.createRange();
				range.selectNode(event.target);
				window.getSelection().removeAllRanges();
				window.getSelection().addRange(range);
			}
		});

		this.fromInput = true;

		event.stopPropagation();
	}

	enableEdit()
	{
		if (!this.isEditable())
		{
			if (this !== BX.Landing.UI.Field.BaseField.currentField && BX.Landing.UI.Field.BaseField.currentField !== null)
			{
				BX.Landing.UI.Field.BaseField.currentField.disableEdit();
			}

			BX.Landing.UI.Field.BaseField.currentField = this;

			if (!this.isTextOnly())
			{
				if (this.changeTagButton)
				{
					this.changeTagButton.onChangeHandler = this.onChangeTag.bind(this);
				}

				BX.Landing.UI.Panel.EditorPanel.getInstance().show(this.layout, null, this.changeTagButton ? [this.changeTagButton] : null);
				this.input.contentEditable = true;
			}
			else
			{
				BX.Landing.UI.Panel.EditorPanel.getInstance().hide();
				this.input.contentEditable = true;
			}

			if (!this.isContentEditable())
			{
				this.input.contentEditable = false;
			}
		}
	}

	onChangeTag(value)
	{
		this.tag = value;
	}

	disableEdit()
	{
		this.input.contentEditable = false;
	}

	isEditable()
	{
		return this.input.isContentEditable;
	}

	reset()
	{
		this.setValue('');
	}

	adjustTags(element)
	{
		if (element.lastChild && element.lastChild.nodeName === 'BR')
		{
			Dom.remove(element.lastChild);
			this.adjustTags(element);
		}

		return element;
	}

	getValue()
	{
		if (this.textOnly)
		{
			return this.input.innerText;
		}

		return this.adjustTags(Runtime.clone(this.input)).innerHTML.replace(/ /g, '');
	}
}

export {
	TextField as Text,
};