ES2015 first look / babeljs

dev/Component/AbstracCheckbox.js

@@ -1,68 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-		ko = require('ko'),
-
-		Utils = require('Common/Utils'),
-
-		AbstractComponent = require('Component/Abstract')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractComponent
-	 */
-	function AbstracCheckbox(oParams)
-	{
-		AbstractComponent.call(this);
-
-		this.value = oParams.value;
-		if (Utils.isUnd(this.value) || !this.value.subscribe)
-		{
-			this.value = ko.observable(Utils.isUnd(this.value) ? false : !!this.value);
-		}
-
-		this.enable = oParams.enable;
-		if (Utils.isUnd(this.enable) || !this.enable.subscribe)
-		{
-			this.enable = ko.observable(Utils.isUnd(this.enable) ? true : !!this.enable);
-		}
-
-		this.disable = oParams.disable;
-		if (Utils.isUnd(this.disable) || !this.disable.subscribe)
-		{
-			this.disable = ko.observable(Utils.isUnd(this.disable) ? false : !!this.disable);
-		}
-
-		this.label = oParams.label || '';
-		this.inline = Utils.isUnd(oParams.inline) ? false : oParams.inline;
-
-		this.readOnly = Utils.isUnd(oParams.readOnly) ? false : !!oParams.readOnly;
-		this.inverted = Utils.isUnd(oParams.inverted) ? false : !!oParams.inverted;
-
-		this.labeled = !Utils.isUnd(oParams.label);
-		this.labelAnimated = !!oParams.labelAnimated;
-	}
-
-	_.extend(AbstracCheckbox.prototype, AbstractComponent.prototype);
-
-	AbstracCheckbox.prototype.click = function()
-	{
-		if (!this.readOnly && this.enable() && !this.disable())
-		{
-			this.value(!this.value());
-		}
-	};
-
-	AbstracCheckbox.componentExportHelper = AbstractComponent.componentExportHelper;
-
-	module.exports = AbstracCheckbox;
-
-}());

dev/Component/AbstracCheckbox.jsx

@@ -0,0 +1,51 @@
+
+import ko from 'ko';
+import Utils from 'Common/Utils';
+import {AbstractComponent} from 'Component/Abstract';
+
+class AbstracCheckbox extends AbstractComponent
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+
+		super();
+
+		this.value = params.value;
+		if (Utils.isUnd(this.value) || !this.value.subscribe)
+		{
+			this.value = ko.observable(Utils.isUnd(this.value) ? false : !!this.value);
+		}
+
+		this.enable = params.enable;
+		if (Utils.isUnd(this.enable) || !this.enable.subscribe)
+		{
+			this.enable = ko.observable(Utils.isUnd(this.enable) ? true : !!this.enable);
+		}
+
+		this.disable = params.disable;
+		if (Utils.isUnd(this.disable) || !this.disable.subscribe)
+		{
+			this.disable = ko.observable(Utils.isUnd(this.disable) ? false : !!this.disable);
+		}
+
+		this.label = params.label || '';
+		this.inline = Utils.isUnd(params.inline) ? false : params.inline;
+
+		this.readOnly = Utils.isUnd(params.readOnly) ? false : !!params.readOnly;
+		this.inverted = Utils.isUnd(params.inverted) ? false : !!params.inverted;
+
+		this.labeled = !Utils.isUnd(params.label);
+		this.labelAnimated = !!params.labelAnimated;
+	}
+
+	click() {
+		if (!this.readOnly && this.enable() && !this.disable())
+		{
+			this.value(!this.value());
+		}
+	}
+}
+
+export {AbstracCheckbox, AbstracCheckbox as default};

dev/Component/AbstracRadio.js

@@ -1,65 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-		ko = require('ko'),
-
-		Utils = require('Common/Utils'),
-
-		AbstractComponent = require('Component/Abstract')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractComponent
-	 */
-	function AbstracRadio(oParams)
-	{
-		AbstractComponent.call(this);
-
-		this.values = ko.observableArray([]);
-
-		this.value = oParams.value;
-		if (Utils.isUnd(this.value) || !this.value.subscribe)
-		{
-			this.value = ko.observable('');
-		}
-
-		this.inline = Utils.isUnd(oParams.inline) ? false : oParams.inline;
-		this.readOnly = Utils.isUnd(oParams.readOnly) ? false : !!oParams.readOnly;
-
-		if (oParams.values)
-		{
-			var aValues = _.map(oParams.values, function (sLabel, sValue) {
-				return {
-					'label': sLabel,
-					'value': sValue
-				};
-			});
-
-			this.values(aValues);
-		}
-
-		this.click = _.bind(this.click, this);
-	}
-
-	AbstracRadio.prototype.click = function(oValue) {
-		if (!this.readOnly && oValue)
-		{
-			this.value(oValue.value);
-		}
-	};
-
-	_.extend(AbstracRadio.prototype, AbstractComponent.prototype);
-
-	AbstracRadio.componentExportHelper = AbstractComponent.componentExportHelper;
-
-	module.exports = AbstracRadio;
-
-}());

dev/Component/AbstracRadio.jsx

@@ -0,0 +1,48 @@
+
+import {_} from 'common';
+import ko from 'ko';
+import Utils from 'Common/Utils';
+import {AbstractComponent} from 'Component/Abstract';
+
+class AbstracRadio extends AbstractComponent
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+
+		super();
+
+		this.values = ko.observableArray([]);
+
+		this.value = params.value;
+		if (Utils.isUnd(this.value) || !this.value.subscribe)
+		{
+			this.value = ko.observable('');
+		}
+
+		this.inline = Utils.isUnd(params.inline) ? false : params.inline;
+		this.readOnly = Utils.isUnd(params.readOnly) ? false : !!params.readOnly;
+
+		if (params.values)
+		{
+			this.values(_.map(params.values, (label, value) => {
+				return {
+					'label': label,
+					'value': value
+				};
+			}));
+		}
+
+		this.click = _.bind(this.click, this);
+	}
+
+	click(value) {
+		if (!this.readOnly && value)
+		{
+			this.value(value.value);
+		}
+	};
+}
+
+export {AbstracRadio, AbstracRadio as default};

dev/Component/Abstract.js

@@ -1,76 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-		ko = require('ko'),
-
-		Utils = require('Common/Utils')
-	;
-
-	/**
-	 * @constructor
-	 */
-	function AbstractComponent()
-	{
-		this.disposable = [];
-	}
-
-	/**
-	 * @type {Array}
-	 */
-	AbstractComponent.prototype.disposable = [];
-
-	AbstractComponent.prototype.dispose = function ()
-	{
-		_.each(this.disposable, function (fFuncToDispose) {
-			if (fFuncToDispose && fFuncToDispose.dispose)
-			{
-				fFuncToDispose.dispose();
-			}
-		});
-	};
-
-	/**
-	 * @param {*} ClassObject
-	 * @param {string} sTemplateID
-	 * @return {Object}
-	 */
-	AbstractComponent.componentExportHelper = function (ClassObject, sTemplateID) {
-		var oComponent = {
-			viewModel: {
-				createViewModel: function(oParams, oComponentInfo) {
-
-					oParams = oParams || {};
-					oParams.element = null;
-
-					if (oComponentInfo.element)
-					{
-						oParams.component = oComponentInfo;
-						oParams.element = $(oComponentInfo.element);
-
-						require('Common/Translator').i18nToNodes(oParams.element);
-
-						if (!Utils.isUnd(oParams.inline) && ko.unwrap(oParams.inline))
-						{
-							oParams.element.css('display', 'inline-block');
-						}
-					}
-
-					return new ClassObject(oParams);
-				}
-			}
-		};
-
-		oComponent['template'] = sTemplateID ? {
-			element: sTemplateID
-		} : '<b></b>';
-
-		return oComponent;
-	};
-
-	module.exports = AbstractComponent;
-
-}());

dev/Component/Abstract.jsx

@@ -0,0 +1,55 @@
+
+import {_} from 'common';
+import ko from 'ko';
+import Utils from 'Common/Utils';
+
+class AbstractComponent
+{
+	constructor() {
+		this.disposable = [];
+	}
+
+	dispose() {
+		_.each(this.disposable, (funcToDispose) => {
+			if (funcToDispose && funcToDispose.dispose)
+			{
+				funcToDispose.dispose();
+			}
+		});
+	}
+}
+
+/**
+ * @param {*} ClassObject
+ * @param {string} templateID
+ * @return {Object}
+ */
+const componentExportHelper = (ClassObject, templateID) => {
+	return {
+		template: templateID ? {element: templateID} : '<b></b>',
+		viewModel: {
+			createViewModel: (params, componentInfo) => {
+
+				params = params || {};
+				params.element = null;
+
+				if (componentInfo && componentInfo.element)
+				{
+					params.component = componentInfo;
+					params.element = $(componentInfo.element);
+
+					require('Common/Translator').i18nToNodes(params.element);
+
+					if (!Utils.isUnd(params.inline) && ko.unwrap(params.inline))
+					{
+						params.element.css('display', 'inline-block');
+					}
+				}
+
+				return new ClassObject(params);
+			}
+		}
+	};
+}
+
+export {AbstractComponent, componentExportHelper};

dev/Component/AbstractInput.js

@@ -1,92 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-		ko = require('ko'),
-
-		Enums = require('Common/Enums'),
-		Utils = require('Common/Utils'),
-
-		AbstractComponent = require('Component/Abstract')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractComponent
-	 */
-	function AbstractInput(oParams)
-	{
-		AbstractComponent.call(this);
-
-		this.value = oParams.value || '';
-		this.size = oParams.size || 0;
-		this.label = oParams.label || '';
-		this.preLabel = oParams.preLabel || '';
-		this.enable = Utils.isUnd(oParams.enable) ? true : oParams.enable;
-		this.trigger = oParams.trigger && oParams.trigger.subscribe ? oParams.trigger : null;
-		this.placeholder = oParams.placeholder || '';
-
-		this.labeled = !Utils.isUnd(oParams.label);
-		this.preLabeled = !Utils.isUnd(oParams.preLabel);
-		this.triggered = !Utils.isUnd(oParams.trigger) && !!this.trigger;
-
-		this.classForTrigger = ko.observable('');
-
-		this.className = ko.computed(function () {
-
-			var
-				iSize = ko.unwrap(this.size),
-				sSuffixValue = this.trigger ?
-					' ' + Utils.trim('settings-saved-trigger-input ' + this.classForTrigger()) : ''
-			;
-
-			return (0 < iSize ? 'span' + iSize : '') + sSuffixValue;
-
-		}, this);
-
-		if (!Utils.isUnd(oParams.width) && oParams.element)
-		{
-			oParams.element.find('input,select,textarea').css('width', oParams.width);
-		}
-
-		this.disposable.push(this.className);
-
-		if (this.trigger)
-		{
-			this.setTriggerState(this.trigger());
-
-			this.disposable.push(
-				this.trigger.subscribe(this.setTriggerState, this)
-			);
-		}
-	}
-
-	AbstractInput.prototype.setTriggerState = function (nValue)
-	{
-		switch (Utils.pInt(nValue))
-		{
-			case Enums.SaveSettingsStep.TrueResult:
-				this.classForTrigger('success');
-				break;
-			case Enums.SaveSettingsStep.FalseResult:
-				this.classForTrigger('error');
-				break;
-			default:
-				this.classForTrigger('');
-				break;
-		}
-	};
-
-	_.extend(AbstractInput.prototype, AbstractComponent.prototype);
-
-	AbstractInput.componentExportHelper = AbstractComponent.componentExportHelper;
-
-	module.exports = AbstractInput;
-
-}());

dev/Component/AbstractInput.jsx

@@ -0,0 +1,75 @@
+
+import ko from 'ko';
+import Utils from 'Common/Utils';
+import {SaveSettingsStep} from 'Common/Enums';
+import {AbstractComponent} from 'Component/Abstract';
+
+class AbstractInput extends AbstractComponent
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+
+		super();
+
+		this.value = params.value || '';
+		this.size = params.size || 0;
+		this.label = params.label || '';
+		this.preLabel = params.preLabel || '';
+		this.enable = Utils.isUnd(params.enable) ? true : params.enable;
+		this.trigger = params.trigger && params.trigger.subscribe ? params.trigger : null;
+		this.placeholder = params.placeholder || '';
+
+		this.labeled = !Utils.isUnd(params.label);
+		this.preLabeled = !Utils.isUnd(params.preLabel);
+		this.triggered = !Utils.isUnd(params.trigger) && !!this.trigger;
+
+		this.classForTrigger = ko.observable('');
+
+		this.className = ko.computed(() => {
+
+			var
+				size = ko.unwrap(this.size),
+				suffixValue = this.trigger ?
+					' ' + Utils.trim('settings-saved-trigger-input ' + this.classForTrigger()) : ''
+			;
+
+			return (0 < size ? 'span' + size : '') + suffixValue;
+
+		}, this);
+
+		if (!Utils.isUnd(params.width) && params.element)
+		{
+			params.element.find('input,select,textarea').css('width', params.width);
+		}
+
+		this.disposable.push(this.className);
+
+		if (this.trigger)
+		{
+			this.setTriggerState(this.trigger());
+
+			this.disposable.push(
+				this.trigger.subscribe(this.setTriggerState, this)
+			);
+		}
+	}
+
+	setTriggerState(value) {
+		switch (Utils.pInt(value))
+		{
+			case SaveSettingsStep.TrueResult:
+				this.classForTrigger('success');
+				break;
+			case SaveSettingsStep.FalseResult:
+				this.classForTrigger('error');
+				break;
+			default:
+				this.classForTrigger('');
+				break;
+		}
+	}
+}
+
+export {AbstractInput, AbstractInput as default};

dev/Component/Checkbox.js

@@ -1,29 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-
-		AbstracCheckbox = require('Component/AbstracCheckbox')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstracCheckbox
-	 */
-	function CheckboxComponent(oParams)
-	{
-		AbstracCheckbox.call(this, oParams);
-	}
-
-	_.extend(CheckboxComponent.prototype, AbstracCheckbox.prototype);
-
-	module.exports = AbstracCheckbox.componentExportHelper(
-		CheckboxComponent, 'CheckboxComponent');
-
-}());

dev/Component/Checkbox.jsx

@@ -0,0 +1,7 @@
+
+import {componentExportHelper} from 'Component/Abstract';
+import {AbstracCheckbox} from 'Component/AbstracCheckbox';
+
+class CheckboxComponent extends AbstracCheckbox {}
+
+module.exports = componentExportHelper(CheckboxComponent, 'CheckboxComponent');

dev/Component/Classic/Checkbox.js

@@ -1,29 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-
-		AbstracCheckbox = require('Component/AbstracCheckbox')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstracCheckbox
-	 */
-	function ClassicCheckboxComponent(oParams)
-	{
-		AbstracCheckbox.call(this, oParams);
-	}
-
-	_.extend(ClassicCheckboxComponent.prototype, AbstracCheckbox.prototype);
-
-	module.exports = AbstracCheckbox.componentExportHelper(
-		ClassicCheckboxComponent, 'CheckboxClassicComponent');
-
-}());

dev/Component/Classic/Checkbox.jsx

@@ -0,0 +1,7 @@
+
+import {componentExportHelper} from 'Component/Abstract';
+import {AbstracCheckbox} from 'Component/AbstracCheckbox';
+
+class ClassicCheckboxComponent extends AbstracCheckbox {}
+
+module.exports = componentExportHelper(ClassicCheckboxComponent, 'ClassicCheckboxComponent');

dev/Component/Input.js

@@ -1,29 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-
-		AbstractInput = require('Component/AbstractInput')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractInput
-	 */
-	function InputComponent(oParams)
-	{
-		AbstractInput.call(this, oParams);
-	}
-
-	_.extend(InputComponent.prototype, AbstractInput.prototype);
-
-	module.exports = AbstractInput.componentExportHelper(
-		InputComponent, 'InputComponent');
-
-}());

dev/Component/Input.jsx

@@ -0,0 +1,7 @@
+
+import {componentExportHelper} from 'Component/Abstract';
+import {AbstractInput} from 'Component/AbstractInput';
+
+class InputComponent extends AbstractInput {}
+
+module.exports = componentExportHelper(InputComponent, 'InputComponent');

dev/Component/MaterialDesign/Checkbox.js

@@ -1,66 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-		ko = require('ko'),
-
-		AbstracCheckbox = require('Component/AbstracCheckbox')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstracCheckbox
-	 */
-	function CheckboxMaterialDesignComponent(oParams)
-	{
-		AbstracCheckbox.call(this, oParams);
-
-		this.animationBox = ko.observable(false).extend({'falseTimeout': 200});
-		this.animationCheckmark = ko.observable(false).extend({'falseTimeout': 200});
-
-		this.animationBoxSetTrue = _.bind(this.animationBoxSetTrue, this);
-		this.animationCheckmarkSetTrue = _.bind(this.animationCheckmarkSetTrue, this);
-
-		this.disposable.push(
-			this.value.subscribe(function (bValue) {
-				this.triggerAnimation(bValue);
-			}, this)
-		);
-	}
-
-	_.extend(CheckboxMaterialDesignComponent.prototype, AbstracCheckbox.prototype);
-
-	CheckboxMaterialDesignComponent.prototype.animationBoxSetTrue = function()
-	{
-		this.animationBox(true);
-	};
-
-	CheckboxMaterialDesignComponent.prototype.animationCheckmarkSetTrue = function()
-	{
-		this.animationCheckmark(true);
-	};
-
-	CheckboxMaterialDesignComponent.prototype.triggerAnimation = function(bBox)
-	{
-		if (bBox)
-		{
-			this.animationBoxSetTrue();
-			_.delay(this.animationCheckmarkSetTrue, 200);
-		}
-		else
-		{
-			this.animationCheckmarkSetTrue();
-			_.delay(this.animationBoxSetTrue, 200);
-		}
-	};
-
-	module.exports = AbstracCheckbox.componentExportHelper(
-		CheckboxMaterialDesignComponent, 'CheckboxMaterialDesignComponent');
-
-}());

dev/Component/MaterialDesign/Checkbox.jsx

@@ -0,0 +1,48 @@
+
+import {_} from 'common';
+import ko from 'ko';
+import {componentExportHelper} from 'Component/Abstract';
+import {AbstracCheckbox} from 'Component/AbstracCheckbox';
+
+class CheckboxMaterialDesignComponent extends AbstracCheckbox
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+		
+		super(params);
+
+		this.animationBox = ko.observable(false).extend({'falseTimeout': 200});
+		this.animationCheckmark = ko.observable(false).extend({'falseTimeout': 200});
+
+		this.animationBoxSetTrue = _.bind(this.animationBoxSetTrue, this);
+		this.animationCheckmarkSetTrue = _.bind(this.animationCheckmarkSetTrue, this);
+
+		this.disposable.push(
+			this.value.subscribe((value) => {
+				this.triggerAnimation(value);
+			}, this)
+		);
+	}
+
+	animationBoxSetTrue() {
+		this.animationBox(true);
+	}
+
+	animationCheckmarkSetTrue() {
+		this.animationCheckmark(true);
+	}
+
+	triggerAnimation(box) {
+		if (box) {
+			this.animationBoxSetTrue();
+			_.delay(this.animationCheckmarkSetTrue, 200);
+		} else {
+			this.animationCheckmarkSetTrue();
+			_.delay(this.animationBoxSetTrue, 200);
+		}
+	}
+}
+
+module.exports = componentExportHelper(CheckboxMaterialDesignComponent, 'CheckboxMaterialDesignComponent');

dev/Component/Radio.js

@@ -1,29 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-
-		AbstracRadio = require('Component/AbstracRadio')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstracRadio
-	 */
-	function RadioComponent(oParams)
-	{
-		AbstracRadio.call(this, oParams);
-	}
-
-	_.extend(RadioComponent.prototype, AbstracRadio.prototype);
-
-	module.exports = AbstracRadio.componentExportHelper(
-		RadioComponent, 'RadioComponent');
-
-}());

dev/Component/Radio.jsx

@@ -0,0 +1,7 @@
+
+import {componentExportHelper} from 'Component/Abstract';
+import {AbstracRadio} from 'Component/AbstracRadio';
+
+class RadioComponent extends AbstracRadio {}
+
+module.exports = componentExportHelper(RadioComponent, 'RadioComponent');

dev/Component/SaveTrigger.js

@@ -1,94 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-
-		Enums = require('Common/Enums'),
-		Utils = require('Common/Utils'),
-
-		AbstractComponent = require('Component/Abstract')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractComponent
-	 */
-	function SaveTriggerComponent(oParams)
-	{
-		AbstractComponent.call(this);
-
-		this.element = oParams.element || null;
-		this.value = oParams.value && oParams.value.subscribe ? oParams.value : null;
-
-		if (this.element)
-		{
-			if (this.value)
-			{
-				this.element.css('display', 'inline-block');
-
-				if (oParams.verticalAlign)
-				{
-					this.element.css('vertical-align', oParams.verticalAlign);
-				}
-
-				this.setState(this.value());
-
-				this.disposable.push(
-					this.value.subscribe(this.setState, this)
-				);
-			}
-			else
-			{
-				this.element.hide();
-			}
-		}
-	}
-
-	SaveTriggerComponent.prototype.setState = function (nValue)
-	{
-		switch (Utils.pInt(nValue))
-		{
-			case Enums.SaveSettingsStep.TrueResult:
-				this.element
-					.find('.animated,.error').hide().removeClass('visible')
-					.end()
-					.find('.success').show().addClass('visible')
-				;
-				break;
-			case Enums.SaveSettingsStep.FalseResult:
-				this.element
-					.find('.animated,.success').hide().removeClass('visible')
-					.end()
-					.find('.error').show().addClass('visible')
-				;
-				break;
-			case Enums.SaveSettingsStep.Animate:
-				this.element
-					.find('.error,.success').hide().removeClass('visible')
-					.end()
-					.find('.animated').show().addClass('visible')
-				;
-				break;
-			default:
-			case Enums.SaveSettingsStep.Idle:
-				this.element
-					.find('.animated').hide()
-					.end()
-					.find('.error,.success').removeClass('visible')
-				;
-				break;
-		}
-	};
-
-	_.extend(SaveTriggerComponent.prototype, AbstractComponent.prototype);
-
-	module.exports = AbstractComponent.componentExportHelper(
-		SaveTriggerComponent, 'SaveTriggerComponent');
-
-}());

dev/Component/SaveTrigger.jsx

@@ -0,0 +1,79 @@
+
+import Utils from 'Common/Utils';
+import {SaveSettingsStep} from 'Common/Enums';
+import {AbstractComponent, componentExportHelper} from 'Component/Abstract';
+
+class SaveTriggerComponent extends AbstractComponent
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+
+		super();
+
+		this.element = params.element || null;
+		this.value = params.value && params.value.subscribe ? params.value : null;
+
+		if (this.element)
+		{
+			if (this.value)
+			{
+				this.element.css('display', 'inline-block');
+
+				if (params.verticalAlign)
+				{
+					this.element.css('vertical-align', params.verticalAlign);
+				}
+
+				this.setState(this.value());
+
+				this.disposable.push(
+					this.value.subscribe(this.setState, this)
+				);
+			}
+			else
+			{
+				this.element.hide();
+			}
+		}
+	}
+
+	setState(value) {
+
+		switch (Utils.pInt(value))
+		{
+			case SaveSettingsStep.TrueResult:
+				this.element
+					.find('.animated,.error').hide().removeClass('visible')
+					.end()
+					.find('.success').show().addClass('visible')
+				;
+				break;
+			case SaveSettingsStep.FalseResult:
+				this.element
+					.find('.animated,.success').hide().removeClass('visible')
+					.end()
+					.find('.error').show().addClass('visible')
+				;
+				break;
+			case SaveSettingsStep.Animate:
+				this.element
+					.find('.error,.success').hide().removeClass('visible')
+					.end()
+					.find('.animated').show().addClass('visible')
+				;
+				break;
+			default:
+			case SaveSettingsStep.Idle:
+				this.element
+					.find('.animated').hide()
+					.end()
+					.find('.error,.success').removeClass('visible')
+				;
+				break;
+		}
+	};
+}
+
+module.exports = componentExportHelper(SaveTriggerComponent, 'SaveTriggerComponent');

dev/Component/Script.js

@@ -1,52 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-		$ = require('$'),
-
-		AbstractComponent = require('Component/Abstract')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractComponent
-	 */
-	function ScriptComponent(oParams)
-	{
-		AbstractComponent.call(this);
-
-		if (oParams.component && oParams.component.templateNodes && oParams.element &&
-			oParams.element[0] && oParams.element[0].outerHTML)
-		{
-			var sScript = oParams.element[0].outerHTML;
-			sScript = sScript
-				.replace(/<x-script/i, '<script')
-				.replace(/<b><\/b><\/x-script>/i, '</script>')
-			;
-
-			if (sScript)
-			{
-				oParams.element.text('');
-				oParams.element.replaceWith(
-					$(sScript).text(oParams.component.templateNodes[0] &&
-						oParams.component.templateNodes[0].nodeValue ?
-							oParams.component.templateNodes[0].nodeValue : ''));
-			}
-			else
-			{
-				oParams.element.remove();
-			}
-		}
-	}
-
-	_.extend(ScriptComponent.prototype, AbstractComponent.prototype);
-
-	module.exports = AbstractComponent.componentExportHelper(ScriptComponent);
-
-}());

dev/Component/Script.jsx

@@ -0,0 +1,39 @@
+
+import {$} from 'common';
+import {AbstractComponent, componentExportHelper} from 'Component/Abstract';
+
+class ScriptComponent extends AbstractComponent
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+
+		super();
+
+		if (params.component && params.component.templateNodes && params.element &&
+			params.element[0] && params.element[0].outerHTML)
+		{
+			let script = params.element[0].outerHTML;
+			script = script
+				.replace(/<x-script/i, '<script')
+				.replace(/<b><\/b><\/x-script>/i, '</script>')
+			;
+
+			if (script)
+			{
+				params.element.text('');
+				params.element.replaceWith(
+					$(script).text(params.component.templateNodes[0] &&
+						params.component.templateNodes[0].nodeValue ?
+							params.component.templateNodes[0].nodeValue : ''));
+			}
+			else
+			{
+				params.element.remove();
+			}
+		}
+	}
+}
+
+module.exports = componentExportHelper(ScriptComponent, 'ScriptComponent');

dev/Component/Select.js

@@ -1,45 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-
-		Utils = require('Common/Utils'),
-		Translator = require('Common/Translator'),
-
-		AbstractInput = require('Component/AbstractInput')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractInput
-	 */
-	function SelectComponent(oParams)
-	{
-		AbstractInput.call(this, oParams);
-
-		this.options = oParams.options || '';
-
-		this.optionsText = oParams.optionsText || null;
-		this.optionsValue = oParams.optionsValue || null;
-		this.optionsCaption = oParams.optionsCaption || null;
-
-		if (this.optionsCaption)
-		{
-			this.optionsCaption = Translator.i18n(this.optionsCaption);
-		}
-
-		this.defautOptionsAfterRender = Utils.defautOptionsAfterRender;
-	}
-
-	_.extend(SelectComponent.prototype, AbstractInput.prototype);
-
-	module.exports = AbstractInput.componentExportHelper(
-		SelectComponent, 'SelectComponent');
-
-}());

dev/Component/Select.jsx

@@ -0,0 +1,31 @@
+
+import Utils from 'Common/Utils';
+import Translator from 'Common/Translator';
+import {componentExportHelper} from 'Component/Abstract';
+import {AbstractInput} from 'Component/AbstractInput';
+
+class SelectComponent extends AbstractInput
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+
+		super(params);
+
+		this.options = params.options || '';
+
+		this.optionsText = params.optionsText || null;
+		this.optionsValue = params.optionsValue || null;
+		this.optionsCaption = params.optionsCaption || null;
+
+		if (this.optionsCaption)
+		{
+			this.optionsCaption = Translator.i18n(this.optionsCaption);
+		}
+
+		this.defautOptionsAfterRender = Utils.defautOptionsAfterRender;
+	}
+}
+
+module.exports = componentExportHelper(SelectComponent, 'SelectComponent');

dev/Component/SvgIcon.js

@@ -1,35 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		$ = require('$'),
-		sUrl = null,
-		getUtl = function () {
-			if (!sUrl)
-			{
-				sUrl = 'rainloop/v/' + ($('#rlAppVersion').attr('content') || '0.0.0')	+ '/static/css/svg/icons.svg';
-			}
-
-			return sUrl;
-		}
-	;
-
-	module.exports = {
-		viewModel: {
-			createViewModel: function(oParams, oComponentInfo) {
-				var icon = oParams.icon || 'null';
-				if (oComponentInfo.element && oComponentInfo.element)
-				{
-					$(oComponentInfo.element).replaceWith(
-'<svg class="svg-icon svg-icon-' + icon + '"><use xlink:href="' + getUtl() + '#svg-icon-' + icon + '"></use></svg>');
-				}
-			}
-		},
-		'template': '<b></b>'
-	};
-
-}());
-
-

dev/Component/SvgIcon.jsx

@@ -0,0 +1,30 @@
+
+import {$} from 'common';
+
+let
+	cachedUrl = null,
+	getUtl = () => {
+		if (!cachedUrl)
+		{
+			const version = $('#rlAppVersion').attr('content') || '0.0.0';
+			cachedUrl = `rainloop/v/${version}/static/css/svg/icons.svg`;
+		}
+
+		return cachedUrl;
+	}
+;
+
+module.exports = {
+	template: '<b></b>',
+	viewModel: {
+		createViewModel: (params, componentInfo) => {
+			if (componentInfo && componentInfo.element)
+			{
+				const icon = params.icon || 'null';
+				$(componentInfo.element).replaceWith(
+					`<svg class="svg-icon svg-icon-${icon}"><use xlink:href="${getUtl()}#svg-icon-${icon}"></use></svg>`
+				);
+			}
+		}
+	}
+};

dev/Component/TextArea.js

@@ -1,34 +0,0 @@
-
-(function () {
-
-	'use strict';
-
-	var
-		_ = require('_'),
-
-		Utils = require('Common/Utils'),
-
-		AbstractInput = require('Component/AbstractInput')
-	;
-
-	/**
-	 * @constructor
-	 *
-	 * @param {Object} oParams
-	 *
-	 * @extends AbstractInput
-	 */
-	function TextAreaComponent(oParams)
-	{
-		AbstractInput.call(this, oParams);
-
-		this.rows = oParams.rows || 5;
-		this.spellcheck = Utils.isUnd(oParams.spellcheck) ? false : !!oParams.spellcheck;
-	}
-
-	_.extend(TextAreaComponent.prototype, AbstractInput.prototype);
-
-	module.exports = AbstractInput.componentExportHelper(
-		TextAreaComponent, 'TextAreaComponent');
-
-}());

dev/Component/TextArea.jsx

@@ -0,0 +1,20 @@
+
+import Utils from 'Common/Utils';
+import {componentExportHelper} from 'Component/Abstract';
+import {AbstractInput} from 'Component/AbstractInput';
+
+class TextAreaComponent extends AbstractInput
+{
+	/**
+	 * @param {Object} params
+	 */
+	constructor(params) {
+
+		super(params);
+
+		this.rows = params.rows || 5;
+		this.spellcheck = Utils.isUnd(params.spellcheck) ? false : !!params.spellcheck;
+	}
+}
+
+module.exports = componentExportHelper(TextAreaComponent, 'TextAreaComponent');