Skip to content

Commit

Permalink
add option_image_path documentation to select and select-from-query
Browse files Browse the repository at this point in the history
  • Loading branch information
@mipmip
mipmip committed Apr 16, 2024
1 parent c27e59f commit fba8b84
Show file tree
Hide file tree
Showing 5 changed files with 74 additions and 27 deletions.
6 changes: 6 additions & 0 deletions assets/_custom.scss
View file
Expand Up @@ -21,6 +21,12 @@
}
}

.book-search {
border: 1px solid black;
border-radius: 5px;
padding: 5px;
}



/*
Expand Down
63 changes: 50 additions & 13 deletions ...Reference/03-content-model/03-form-fields/data-field-types/select-from-query.md
View file
Expand Up @@ -13,16 +13,19 @@ strings generated by an query string.

## Properties

| property | value type | optional | description |
|-------------------|----------------------------|---------------------------|----------------------------------------------------------------------------------------------|
| key | string | mandatory | Keys are for internal use and must be unique |
| title | string | optional | The title of the element |
| tip | string | optional (default: null) | Text entered here with markdown formatting is displayed as context help in an overlay box |
| default | string OR array of strings | optional (default: null) | default value when the key is not set yet |
| multiple | boolean | optional (default: false) | Enable multiple selection |
| autoSave | boolean | optional (default: false) | Form data is automatically saved after changing the value |
| query_glob | string | mandatory | Glob string to select one or more files |
| query_string | string | mandatory | string to use on one the of the query types |
| property | value type | optional | description |
|:-----------------------|----------------------------|---------------------------|-------------------------------------------------------------------------------------------------------|
| key | string | mandatory | Keys are for internal use and must be unique |
| title | string | optional | The title of the element |
| tip | string | optional (default: null) | Text entered here with markdown formatting is displayed as context help in an overlay box |
| default | string OR array of strings | optional (default: null) | default value when the key is not set yet |
| multiple | boolean | optional (default: false) | Enable multiple selection |
| autoSave | boolean | optional (default: false) | Form data is automatically saved after changing the value |
| query_glob | string | mandatory | Glob string to select one or more files |
| query_string | string | mandatory | string to use on one the of the query types |
| option_image_path | string | optional (default: null) | path to images having the same name as the options values e.g. `quiqr/model/images` |
| option_image_width | number | optional (default: null) | when `option_image_path` is set image width as well to have a aligned option listing |
| option_image_extension | string | optional (defaul: null) | when `option_image_path` is set, optionally set extension to e.g. `jpg`. Then all images should be of type `jpg`. |

## Example 1

Expand Down Expand Up @@ -52,6 +55,40 @@ possible frontmatter result
sample_field: Monday
```

## Example 2

This example shows a simple query together with image visualization.

{{< figure src="../select_visual.png" caption="Select field" >}}

### Configuration

{{< code-toggle file="./quiqr/model/base" >}}
key: sample_field
title: Sample field
type: select-from-query
multiple: false
default: 2
query_glob: data/system_data.json
query_string: .weekday[]
option_image_path: ./quiqr/model/images
option_image_width: 200
option_image_extension: jpg

{{< /code-toggle >}}

### Output

options:
- Monday
- Tuesday
- ...

possible frontmatter result
```yaml
sample_field: Monday
```

## Query Language

The Quiqr Query Language is inspired by JQ, but has some additions specially
Expand All @@ -77,14 +114,14 @@ When the query_string starts with `.` the file content data will be queried.

### Populating select option with filenames from a directory.

```
```yaml
query_glob: content/resources/*.md
query_string: #file_name[]
query_string: "#file_name[]"
```

### Populating select option with titles from front matter from multiple directories.

```
```yaml
query_glob: content/**/*.md
query_string: .title[]
```
Expand Down
26 changes: 14 additions & 12 deletions ...-Developer-Reference/03-content-model/03-form-fields/data-field-types/select.md
View file
Expand Up @@ -16,18 +16,20 @@ an array of numbers or strings.

## Properties

| property | value type | optional | description |
|-------------------|-------------------------------------------|---------------------------|-------------------------------------------------------------------------------------------|
| key | string | mandatory | Keys are for internal use and must be unique |
| title | string | optional | The title of the element |
| tip | string | optional (default: null) | Text entered here with markdown formatting is displayed as context help in an overlay box |
| default | string OR number OR array of strings | optional (default: null) | default value when the key is not set yet |
| multiple | boolean | optional (default: false) | Enable multiple selection |
| autoSave | boolean | optional (default: false) | Form data is automatically saved after changing the value |
| options | array of dictionaries OR array of strings | mandatory | Array with title/value pairs, or an array with strings when text and value are the same |
| options.[n].text | string | optional | String with option visible text |
| options.[n].value | string | optional | String with option value to save when selected |

| property | value type | optional | description |
|------------------------|-------------------------------------------|---------------------------|-------------------------------------------------------------------------------------------------------------------|
| key | string | mandatory | Keys are for internal use and must be unique |
| title | string | optional | The title of the element |
| tip | string | optional (default: null) | Text entered here with markdown formatting is displayed as context help in an overlay box |
| default | string OR number OR array of strings | optional (default: null) | default value when the key is not set yet |
| multiple | boolean | optional (default: false) | Enable multiple selection |
| autoSave | boolean | optional (default: false) | Form data is automatically saved after changing the value |
| option_image_path | string | optional (default: null) | path to images having the same name as the options values e.g. `quiqr/model/images` |
| option_image_width | number | optional (default: null) | when `option_image_path` is set image width as well to have a aligned option listing |
| option_image_extension | string | optional (defaul: null) | when `option_image_path` is set, optionally set extension to e.g. `jpg`. Then all images should be of type `jpg`. |
| options | array of dictionaries OR array of strings | mandatory | Array with title/value pairs, or an array with strings when text and value are the same |
| options.[n].text | string | optional | String with option visible text |
| options.[n].value | string | optional | String with option value to save when selected |

## Example 1

Expand Down
Binary file added ...er-Reference/03-content-model/03-form-fields/data-field-types/select_visual.png
View file
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 4 additions & 2 deletions content/docs/20-Quiqr-Developer-Reference/03-content-model/_index.md
View file
Expand Up @@ -47,8 +47,10 @@ the following properties:

### Full Example

[The Kitchen Sink Template](https://github.com/quiqr/quiqr-template-kitchen-sink) has a every field type configured. Use this template
to learn and play around with the Quiqr model.
[The Kitchen Sink
Template](https://github.com/quiqr/quiqr-template-kitchen-sink) has a every
field type configured. Use this template to learn and play around with the
Quiqr model.



Expand Down

0 comments on commit fba8b84

Please sign in to comment.