').addClass('condition-group').appendTo(parent.container);
+ this.options = ConditionsUI.instantiateTemplate('#condition-group-options-template').appendTo(parent.container);
+ this.separator = ConditionsUI.instantiateTemplate('#condition-group-separator-template').appendTo(parent.container);
+ this.addButton = this.options.find('.condition-add');
+
+ for (const condition of conditionGroup.conditions) {
+ this.children.push(new ConditionsUI.Condition(this, condition));
+ }
+
+ this.addButton.on('click', () => this.onAddCondition());
+ }
+
+ cleanup() {
+ for (const child of this.children) {
+ child.cleanup();
+ }
+
+ this.addButton.off('click');
+ this.container.remove();
+ this.options.remove();
+ this.separator.remove();
+ }
+
+ save() {
+ this.parent.save();
+ }
+
+ remove(child) {
+ const index = this.children.indexOf(child);
+ if (index < 0) {
+ return;
+ }
+
+ child.cleanup();
+ this.children.splice(index, 1);
+ this.conditionGroup.conditions.splice(index, 1);
+
+ if (this.children.length === 0) {
+ this.parent.remove(this, false);
+ }
+ }
+
+ onAddCondition() {
+ const condition = this.parent.createDefaultCondition(this.parent.conditionNameDefault);
+ this.conditionGroup.conditions.push(condition);
+ this.children.push(new ConditionsUI.Condition(this, condition));
+ }
+};
+
+ConditionsUI.Condition = class Condition {
+ constructor(parent, condition) {
+ this.parent = parent;
+ this.condition = condition;
+ this.container = ConditionsUI.instantiateTemplate('#condition-template').appendTo(parent.container);
+ this.input = this.container.find('input');
+ this.typeSelect = this.container.find('.condition-type');
+ this.operatorSelect = this.container.find('.condition-operator');
+ this.removeButton = this.container.find('.condition-remove');
+
+ this.updateTypes();
+ this.updateOperators();
+ this.updateInput();
+
+ this.input.on('change', () => this.onInputChanged());
+ this.typeSelect.on('change', () => this.onConditionTypeChanged());
+ this.operatorSelect.on('change', () => this.onConditionOperatorChanged());
+ this.removeButton.on('click', () => this.onRemoveClicked());
+ }
+
+ cleanup() {
+ this.input.off('change');
+ this.typeSelect.off('change');
+ this.operatorSelect.off('change');
+ this.removeButton.off('click');
+ this.container.remove();
+ }
+
+ save() {
+ this.parent.save();
+ }
+
+ updateTypes() {
+ const conditionDescriptors = this.parent.parent.conditionDescriptors;
+ const optionGroup = this.typeSelect.find('optgroup');
+ optionGroup.empty();
+ for (const type of Object.keys(conditionDescriptors)) {
+ const conditionDescriptor = conditionDescriptors[type];
+ $('
@@ -563,9 +647,12 @@
+
+
+