alchemy-form 0.1.11 → 0.1.12

package/CHANGELOG.md

@@ -1,3 +1,20 @@
+## 0.1.12 (2022-10-12)
+
+* Don't let users manually add form widgets
+* Allow overriding alchemy-field title & description in extra widget settings
+* Allow overriding an alchemy-field's used wrapper-view
+* Add `AlchemyField#applyOptions(options)` method
+* Allow an alchemy-field's field_title property to be set
+* Allow turning off specific column filters in alchemy-table
+* Add inline enum field view
+* Fix alchemy-pager icons
+* Use `Model#getDisplayTitle()` to get the display title of records for alchemy-select-items
+* Make the QueryBuilder field's source data configurable
+* Add `VariableDefinition.fromMany()` method
+* `VariableDefinition.cast()` now also accepts `Field` instances
+* Add `QueryBuilder.applyToCriteria()` method
+* Fix schema fields sometimes getting the wrong schema from an Enum value
+
 ## 0.1.11 (2022-07-23)
 
 * Upgrade to `alchemy-media` v0.6.3

package/controller/form_api_controller.js

@@ -62,7 +62,6 @@ FormApi.setAction(async function related(conduit) {
 	conduit.end(result);
 });
 
-
 /**
  * The related action
  *

package/element/alchemy_field.js

@@ -70,6 +70,15 @@ Field.setAttribute('field-type');
  */
 Field.setAttribute('field-view');
 
+/**
+ * The wrapper view override
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ */
+Field.setAttribute('wrapper-view');
+
 /**
  * Is this a read only field?
  *
@@ -260,22 +269,19 @@ Field.setProperty(function is_translatable() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.12
  */
 Field.setProperty(function field_title() {
 
-	let config = this.config,
-	    result;
-
-	if (config) {
-		result = config.title;
-	}
+	let result = this._title || this.widget_settings?.title || this.config?.title;
 
 	if (!result && this.field_name) {
 		result = this.field_name.titleize();
 	}
 
 	return result;
+}, function setTitle(value) {
+	this._title = value;
 });
 
 /**
@@ -283,16 +289,11 @@ Field.setProperty(function field_title() {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.12
  */
 Field.setProperty(function field_description() {
 
-	let config = this.config,
-	    result;
-
-	if (config && config.options) {
-		result = config.options.description;
-	}
+	let result = this.widget_settings?.description || this.config?.description;
 
 	return result;
 });
@@ -393,11 +394,11 @@ Field.enforceProperty(function wrapper_file(new_value, old_value) {
 			return false;
 		}
 
-		let field_type = this.getFieldType(),
+		let wrapper_view = this.wrapper_view || this.getFieldType(),
 		     view_type = this.view_type;
 
-		if (field_type) {
-			return this.generateTemplatePath('wrappers', view_type, field_type);
+		if (wrapper_view) {
+			return this.generateTemplatePath('wrappers', view_type, wrapper_view);
 		}
 	}
 
@@ -584,6 +585,55 @@ Field.setProperty(function value() {
 	}
 });
 
+/**
+ * Apply options
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ *
+ * @param    {Object}   options
+ */
+Field.setMethod(function applyOptions(options) {
+
+	if (!options || typeof options != 'object') {
+		return;
+	}
+
+	if (options.purpose) {
+		this.purpose = options.purpose;
+	}
+
+	if (options.mode) {
+		this.mode = options.mode;
+	}
+
+	if (options.view) {
+		this.field_view = options.view;
+	}
+
+	if (options.wrapper) {
+		this.wrapper_view = options.wrapper;
+	}
+
+	if (options.readonly) {
+		this.readonly = true;
+	}
+
+	if (options.widget_settings) {
+		this.widget_settings = options.widget_settings;
+	}
+
+	if (options.data_src) {
+		this.data_src = options.data_src;
+	}
+
+	if (options.title) {
+		this.field_title = options.title;
+	}
+
+});
+
 /**
  * Get the field type
  *

package/element/alchemy_field_schema.js

@@ -5,9 +5,7 @@
  * @since    0.1.0
  * @version  0.1.0
  */
-var FieldSchema = Function.inherits('Alchemy.Element.Form.FieldCustom', function FieldSchema() {
-	FieldSchema.super.call(this);
-});
+var FieldSchema = Function.inherits('Alchemy.Element.Form.FieldCustom', 'FieldSchema');
 
 /**
  * The template to use for the content of this element
@@ -23,7 +21,7 @@ FieldSchema.setTemplateFile('form/elements/alchemy_field_schema');
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.4
+ * @version  0.1.12
  */
 FieldSchema.setProperty(function schema() {
 
@@ -38,15 +36,29 @@ FieldSchema.setProperty(function schema() {
 				let values = other_field.config.options.values;
 
 				if (values) {
+					let value;
 
 					if (values instanceof Classes.Alchemy.Map.Backed) {
-						schema = values.get(other_field.value);
+						value = values.get(other_field.value);
 					} else {
-						schema = values[other_field.value];
+						value = values[other_field.value];
+					}
+
+					if (value) {
+						if (value.schema) {
+							schema = value.schema;
+						} else if (value.value) {
+							// Enumified values can be wrapped on the server-side
+							value = value.value;
+
+							if (value.schema) {
+								schema = value.schema;
+							}
+						}
 					}
 
-					if (schema && schema.schema) {
-						schema = schema.schema;
+					if (!schema) {
+						schema = value;
 					}
 				}
 			}

package/element/alchemy_pager.js

@@ -12,28 +12,28 @@ const Pager = Function.inherits('Alchemy.Element.Form.Base', 'Pager');
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.12
  */
 Pager.setTemplate(`<ul>
 	<li class="afp-first">
 		<a href="#" aria-label="First page">
-			<al-ico type="arrow-left-double"></al-ico>
+			<al-ico icon-name="left-to-line"></al-ico>
 		</a>
 	</li>
 	<li class="afp-prev">
 		<a href="#" aria-label="Previous page">
-			<al-ico type="arrow-left"></al-ico>
+			<al-ico icon-name="left"></al-ico>
 		</a>
 	</li>
 
 	<li class="afp-next">
 		<a href="#" aria-label="Next page">
-			<al-ico type="arrow-right"></al-ico>
+			<al-ico icon-name="right"></al-ico>
 		</a>
 	</li>
 	<li class="afp-last">
 		<a href="#" aria-label="Last page">
-			<al-ico type="arrow-right-double"></al-ico>
+			<al-ico icon-name="right-to-line"></al-ico>
 		</a>
 	</li>
 </ul>`, true);

package/element/alchemy_select_item.js

@@ -85,13 +85,27 @@ Item.enforceProperty(function alchemy_select(new_value) {
  *
  * @author   Jelle De Loecker <jelle@elevenways.be>
  * @since    0.1.5
- * @version  0.1.5
+ * @version  0.1.12
  */
 Item.setProperty(function display_title() {
 
-	if (!this.data) {
-		return '';
+	let result;
+
+	if (this.data) {
+		const model = this.data.$model;
+
+		if (model) {
+			result = model.getDisplayTitle(this.data, ['title', 'name']);
+		}
+	}
+
+	if (!result) {
+		if (this.data) {
+			result = this.data.title || this.data.name || this.data.$pk || this.value;
+		} else {
+			result = this.value;
+		}
 	}
 
-	return this.data.title || this.data.name || this.data.username || this.data.$pk || this.value;
+	return result || '';
 });

package/element/alchemy_table.js

@@ -626,7 +626,7 @@ Table.setMethod(function showPagination() {
  *
  * @author   Jelle De Loecker <jelle@elevenways.be>
  * @since    0.1.8
- * @version  0.1.11
+ * @version  0.1.12
  *
  * @param    {FieldConfig}   field_config   The config on how to display the field
  * @param    {Object}        container      The container where the field should be in
@@ -663,6 +663,8 @@ Table.setMethod(function getFieldConfigView(field_config, container) {
 	alchemy_field.purpose = this.purpose || 'view';
 	alchemy_field.mode = this.mode || 'inline';
 
+	alchemy_field.applyOptions(field_config.options);
+
 	//alchemy_field.view_type = this.view_type || 'view_inline';
 	alchemy_field.field_name = field.name;
 	alchemy_field.config = field;
@@ -886,7 +888,7 @@ Table.setMethod(function attachContextMenus() {
  *
  * @author   Jelle De Loecker <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.12
  */
 Table.setMethod(function onFieldsetAssignment(value, old_value) {
 
@@ -939,18 +941,22 @@ Table.setMethod(function onFieldsetAssignment(value, old_value) {
 		names_row.append(col);
 
 		col = this.createElement('th');
-		input = this.createElement('input');
-		input.dataset.field = field.path;
-		input.classList.add('filter');
-		input.setAttribute('type', 'search');
-		input.setAttribute('aria-label', 'Filter ' + field.title);
-
-		// If filters have been defined already, put it in the value
-		if (this.filters && this.filters[field.path]) {
-			input.setAttribute('value', this.filters[field.path]);
+
+		if (field.options.filter !== false) {
+			input = this.createElement('input');
+			input.dataset.field = field.path;
+			input.classList.add('filter');
+			input.setAttribute('type', 'search');
+			input.setAttribute('aria-label', 'Filter ' + field.title);
+
+			// If filters have been defined already, put it in the value
+			if (this.filters && this.filters[field.path]) {
+				input.setAttribute('value', this.filters[field.path]);
+			}
+
+			col.append(input);
 		}
 
-		col.append(input);
 		filter_row.append(col);
 	}
 

package/element/query_builder_entry.js

@@ -127,7 +127,7 @@ QueryBuilderEntry.setProperty(function value() {
  *
  * @author   Jelle De Loecker <jelle@elevenways.be>
  * @since    0.1.6
- * @version  0.1.6
+ * @version  0.1.12
  */
 QueryBuilderEntry.setMethod(async function loadData(config, element) {
 
@@ -149,10 +149,11 @@ QueryBuilderEntry.setMethod(async function loadData(config, element) {
 		items = await this.loadValueTypeData(config);
 	}
 
-	console.log('Got items:', items);
-	items.clean(null);
-	items.clean(undefined);
-	items.clean(false);
+	if (items) {
+		items.clean(null);
+		items.clean(undefined);
+		items.clean(false);
+	}
 
 	return {
 		items: items,

package/helper/query_builder_ns.js

@@ -0,0 +1,108 @@
+const QueryBuilder = Fn.getNamespace('Alchemy.QueryBuilder');
+
+/**
+ * Apply query builder settings to a criteria
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ *
+ * @param    {Object}     conditions
+ * @param    {Criteria}   criteria
+ * @param    {Boolean}    inverted
+ */
+QueryBuilder.applyToCriteria = function applyToCriteria(conditions, criteria, inverted) {
+
+	if (!conditions || !conditions.rules?.length) {
+		return;
+	}
+
+	let group;
+
+	if (conditions.condition == 'or') {
+		group = criteria.or();
+	} else {
+		group = criteria.and();
+	}
+
+	if (inverted == null) {
+		inverted = false;
+	}
+
+	if (conditions.inverted) {
+		inverted = !inverted;
+	}
+
+	for (let rule of conditions.rules) {
+		applyRule(rule, criteria, inverted);
+	}
+};
+
+/**
+ * Apply a single rule to a criteria
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ *
+ * @param    {Object}     rule
+ * @param    {Criteria}   criteria
+ * @param    {Boolean}    inverted
+ */
+function applyRule(rule, criteria, inverted) {
+
+	if (rule.type == 'group') {
+		return QueryBuilder.applyToCriteria(rule, criteria, inverted);
+	}
+
+	if (rule.type != 'qb_entry') {
+		return;
+	}
+
+	// Referencing other fields is not supported
+	if (rule.value_variable) {
+		return;
+	}
+
+	let context = criteria.where(rule.field);
+
+	if (inverted) {
+		context = context.not();
+	}
+
+	if (rule.operator == 'is_empty') {
+		context.isEmpty();
+		return;
+	}
+
+	if (rule.operator == 'is_null') {
+		context.isNull();
+		return;
+	}
+
+	let value = rule.value_explicit.value;
+
+	let method;
+
+	switch (rule.operator) {
+		case 'ne':
+		case 'not_equals':
+			method = 'ne';
+			break;
+		
+		case 'starts_with':
+			value = RegExp.interpret('^' + value);
+			method = 'equals';
+			break;
+		
+		case 'ends_with':
+			value = RegExp.interpret(value + '$');
+			method = 'equals';
+			break;
+		
+		default:
+			method = rule.operator;
+	}
+
+	context[method](value);
+}

package/helper/query_builder_variable_definition/00_variable_definition.js

@@ -102,12 +102,48 @@ VariableDefinition.constitute(function prepareOperators() {
 	this.assignment_operators = {};
 });
 
+/**
+ * Get a list of definitions from the input
+ *
+ * @author   Jelle De Loecker <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ *
+ * @param    {*}   input
+ *
+ * @return   {VariableDefinition[]}
+ */
+VariableDefinition.setStatic(function fromMany(input) {
+
+	let result = [];
+
+	if (input) {
+
+		let schema = input.schema;
+
+		if (schema && schema instanceof Classes.Alchemy.Schema) {
+
+			for (let entry of schema) {
+
+				let instance = VariableDefinition.cast(entry);
+		
+				if (instance) {
+					result.push(instance);
+				}
+			}
+
+		}
+	}
+
+	return result;
+});
+
 /**
  * Create the correct variable definition
  *
  * @author   Jelle De Loecker <jelle@elevenways.be>
  * @since    0.1.6
- * @version  0.1.6
+ * @version  0.1.12
  */
 VariableDefinition.setStatic(function cast(entry) {
 
@@ -119,6 +155,21 @@ VariableDefinition.setStatic(function cast(entry) {
 		return entry;
 	}
 
+	if (entry instanceof Classes.Alchemy.Field) {
+		let field = entry;
+
+		entry = {
+			name        : field.name,
+			title       : field.title,
+			description : field.options.description,
+			type        : field.constructor.type_name,
+		};
+
+		if (!VariableDefinition.getMember(entry.type)) {
+			entry.type = 'string';
+		}
+	}
+
 	if (!entry.type) {
 		return null;
 	}

package/helper/widgets/alchemy_field_widget.js

@@ -16,16 +16,13 @@ const AlchemyField = Function.inherits('Alchemy.Widget', 'AlchemyField');
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.0
+ * @version  0.1.12
  */
 AlchemyField.constitute(function prepareSchema() {
 
-	//let widgets = this.createSchema();
-
-	// widgets.addField('type', 'Enum', {values: alchemy.getClassGroup('widgets')});
-	// widgets.addField('config', 'Schema', {schema: 'type'});
-
-	// this.schema.addField('widgets', widgets, {array: true});
+	this.setAddChecker(function(widget_element) {
+		return false;
+	});
 });
 
 /**
@@ -73,7 +70,7 @@ AlchemyField.enforceProperty(function alchemy_form(new_value) {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.0
- * @version  0.1.11
+ * @version  0.1.12
  */
 AlchemyField.setMethod(function populateWidget() {
 
@@ -89,29 +86,7 @@ AlchemyField.setMethod(function populateWidget() {
 
 	field_el.field_name = config.field;
 
-	if (config.purpose) {
-		field_el.purpose = config.purpose;
-	}
-
-	if (config.mode) {
-		field_el.mode = config.mode;
-	}
-
-	if (config.view) {
-		field_el.field_view = config.view;
-	}
-
-	if (config.readonly) {
-		field_el.readonly = true;
-	}
-
-	if (config.widget_settings) {
-		field_el.widget_settings = config.widget_settings;
-	}
-
-	if (config.data_src) {
-		field_el.data_src = config.data_src;
-	}
+	field_el.applyOptions(config);
 
 	this.element.append(field_el);
 });

package/helper/widgets/alchemy_form_widget.js

@@ -11,6 +11,20 @@
  */
 const AlchemyForm = Function.inherits('Alchemy.Widget', 'AlchemyForm');
 
+/**
+ * Prepare the schema
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ */
+AlchemyForm.constitute(function prepareSchema() {
+
+	this.setAddChecker(function(widget_element) {
+		return false;
+	});
+});
+
 /**
  * Populate the widget
  *

package/helper/widgets/alchemy_table_widget.js

@@ -11,6 +11,20 @@
  */
 const AlchemyTable = Function.inherits('Alchemy.Widget', 'AlchemyTable');
 
+/**
+ * Prepare the schema
+ *
+ * @author   Jelle De Loecker   <jelle@elevenways.be>
+ * @since    0.1.12
+ * @version  0.1.12
+ */
+AlchemyTable.constitute(function prepareSchema() {
+
+	this.setAddChecker(function(widget_element) {
+		return false;
+	});
+});
+
 /**
  * Populate the widget
  *

package/helper_field/query_builder_field.js

@@ -50,42 +50,63 @@ QueryBuilderField.setMethod(function cast(value, to_datasource) {
  *
  * @author   Jelle De Loecker   <jelle@elevenways.be>
  * @since    0.1.6
- * @version  0.1.6
+ * @version  0.1.12
  *
  * @param    {Object}        config
  * @param    {HTMLElement}   element
  */
 QueryBuilderField.setMethod(function loadData(config, element) {
 
+	const options = this.options || {},
+	      source_type = options.variable_data || 'document',
+	      add_form_value = options.add_form_value || false;
+
+	let api_route,
+	    form;
+
+	let body = {
+		source_type,
+		config,
+	};
+
 	if (element) {
-		let form = element.queryParents('alchemy-form');
-
-		if (form) {
-			let doc = form.document;
-
-			if (doc && doc.root_document) {
-				doc = doc.root_document;
-			}
-
-			let model_name,
-			    $pk;
-			
-			if (doc) {
-				model_name = doc.$model_name;
-				$pk = doc.$pk;
-			}
-
-			return element.hawkejs_helpers.Alchemy.getResource({
-				name  : 'FormApi#queryBuilderData',
-				post  : true,
-				body  : {
-					model        : model_name,
-					$pk          : $pk,
-					config       : config,
-				}
-			});
+		form = element.queryParents('alchemy-form');
+
+		if (add_form_value && form) {
+			body.form_value = form.value;
 		}
 	}
 
-	return [];
+	// Use the current document data to get the variable data
+	if (form && source_type == 'document') {
+
+		let doc = form.document;
+
+		if (doc && doc.root_document) {
+			doc = doc.root_document;
+		}
+
+		let model_name,
+			$pk;
+		
+		if (doc) {
+			model_name = doc.$model_name;
+			$pk = doc.$pk;
+		}
+
+		body.model = model_name;
+		body.$pk = $pk;
+	}
+
+	if (options.route) {
+		api_route = options.route;
+	} else {
+		api_route = 'FormApi#queryBuilderData';
+	}
+
+	return element.hawkejs_helpers.Alchemy.getResource({
+		name  : api_route,
+		post  : true,
+		body,
+	});
 });

package/helper_field/query_builder_value.js

@@ -9,48 +9,3 @@
  * @version  0.1.6
  */
 const QueryBuilderValue = Function.inherits('Alchemy.Field.QueryBuilder', 'QueryBuilderValue');
-
-/**
- * Load remote data
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.6
- * @version  0.1.6
- *
- * @param    {Object}        config
- * @param    {HTMLElement}   element
- */
-QueryBuilderValue.setMethod(function loadData(config, element) {
-
-	if (element) {
-		let form = element.queryParents('alchemy-form');
-
-		if (form) {
-			let doc = form.document;
-
-			if (doc && doc.root_document) {
-				doc = doc.root_document;
-			}
-
-			let model_name,
-			    $pk;
-			
-			if (doc) {
-				model_name = doc.$model_name;
-				$pk = doc.$pk;
-			}
-
-			return element.hawkejs_helpers.Alchemy.getResource({
-				name  : 'FormApi#queryBuilderData',
-				post  : true,
-				body  : {
-					model        : model_name,
-					$pk          : $pk,
-					config       : config,
-				}
-			});
-		}
-	}
-
-	return [];
-});

package/helper_field/query_builder_variable.js

@@ -9,48 +9,3 @@
  * @version  0.1.6
  */
 const QueryBuilderVariable = Function.inherits('Alchemy.Field.QueryBuilder', 'QueryBuilderVariable');
-
-/**
- * Load remote data
- *
- * @author   Jelle De Loecker   <jelle@elevenways.be>
- * @since    0.1.6
- * @version  0.1.6
- *
- * @param    {Object}        config
- * @param    {HTMLElement}   element
- */
-QueryBuilderVariable.setMethod(function loadData(config, element) {
-
-	if (element) {
-		let form = element.queryParents('alchemy-form');
-
-		if (form) {
-			let doc = form.document;
-
-			if (doc && doc.root_document) {
-				doc = doc.root_document;
-			}
-
-			let model_name,
-				$pk;
-			
-			if (doc) {
-				model_name = doc.$model_name;
-				$pk = doc.$pk;
-			}
-
-			return element.hawkejs_helpers.Alchemy.getResource({
-				name  : 'FormApi#queryBuilderData',
-				post  : true,
-				body  : {
-					model        : model_name,
-					$pk          : $pk,
-					config       : config,
-				}
-			});
-		}
-	}
-
-	return [];
-});

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "alchemy-form",
 	"description": "Form plugin for Alchemy",
-	"version": "0.1.11",
+	"version": "0.1.12",
 	"repository": {
 		"type" : "git",
 		"url"  : "https://github.com/11ways/alchemy-form.git"

package/view/form/elements/alchemy_select_item.hwk

@@ -1,7 +1,5 @@
-<% data = self.data %>
-
 {% if self.custom_template %}
 	{% include self.custom_template %}
 {% else %}
-	{{ data.title or data.name or data.$pk or self.value }}
+	{{ self.display_title }}
 {% /if %}

package/view/form/inputs/view_inline/enum.hwk

@@ -0,0 +1 @@
+<span class="alchemy-field-value alchemy-field-enum">{{ value }}</span>

package/view/form/select/qb_item.hwk

@@ -1,3 +1,4 @@
+<% data = self.data %>
 <div class="qb-select-item qb-select-type-{% self.type %}">
 	<div class="type-and-name">
 		<span class="option-type" data-type={% data.type_name %}></span>

package/view/form/inputs/view_inline/file.hwk

@@ -1,6 +0,0 @@
-{% if value %}
-	<img
-		!Media={% value %}
-		+media-route="Media::thumb"
-	>
-{% /if %}