You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
133 lines
2.9 KiB
133 lines
2.9 KiB
{# TEXT #}
|
|
|
|
{% macro text(field) %}
|
|
<label for="field-{{field.key}}">
|
|
{{field.label}}
|
|
</label>
|
|
<input id="field-{{field.key}}"
|
|
name="{{field.key}}"
|
|
type="text"
|
|
value="{{field.value}}">
|
|
{% endmacro %}
|
|
|
|
|
|
{# TEXT AREA #}
|
|
|
|
{% macro longtext(field) %}
|
|
<label for="field-{{field.key}}">
|
|
{{field.label}}
|
|
</label>
|
|
<textarea id="field-{{field.key}}" name="{{field.key}}">{{field.value}}</textarea>
|
|
{% endmacro %}
|
|
|
|
|
|
{# FREE SELECT #}
|
|
|
|
{% macro free_select(field) %}
|
|
<label for="field-{{field.key}}">
|
|
{{field.label}}
|
|
</label>
|
|
<input id="field-{{field.key}}"
|
|
name="{{field.key}}"
|
|
type="text"
|
|
list="suggestions-{{field.key}}"
|
|
value="{{field.value}}">
|
|
<datalist id="suggestions-{{field.key}}">
|
|
{%- for option in field.options %}
|
|
<option value="{{option}}">
|
|
{%- endfor %}
|
|
</datalist>
|
|
{% endmacro %}
|
|
|
|
|
|
{# NUMBER #}
|
|
|
|
{% macro number(field) %}
|
|
<label for="field-{{field.key}}">
|
|
{{field.label}}
|
|
</label>
|
|
<input id="field-{{field.key}}"
|
|
name="{{field.key}}"
|
|
type="number"
|
|
value="{{field.value}}"
|
|
step="{{field.step}}"
|
|
min="{{field.min}}"
|
|
max="{{field.max}}">
|
|
{% endmacro %}
|
|
|
|
|
|
{# CHECKBOX #}
|
|
|
|
{% macro checkbox(field) %}
|
|
<label for="field-{{field.key}}">
|
|
{{field.label}}
|
|
</label>
|
|
<label class="checkbox-wrap" for="field-{{field.key}}">
|
|
<input id="field-{{field.key}}"
|
|
name="{{field.key}}"
|
|
type="checkbox"
|
|
{% if field.checked %}checked{% endif %}>
|
|
</label>
|
|
{% endmacro %}
|
|
|
|
|
|
{# SELECT #}
|
|
|
|
{% macro select(field) %}
|
|
<label for="field-{{field.key}}">
|
|
{{field.label}}
|
|
</label>
|
|
<select id="field-{{field.key}}" name="{{field.key}}">
|
|
{%- for option in field.options %}
|
|
<option value="{{option}}" {% if field.value == option %}selected{% endif %}>{{option}}</option>
|
|
{%- endfor %}
|
|
</select>
|
|
{% endmacro %}
|
|
|
|
|
|
{# TAGS #}
|
|
|
|
{% macro tags(field,free=false) %}
|
|
<label for="field-{{field.key}}">
|
|
{{field.label}}
|
|
</label>
|
|
<input type="hidden" id="field-{{field.key}}" name="{{field.key}}" value="{{field.value}}">
|
|
<div class="tag-input" id="tag-input-{{field.key}}"></div>
|
|
<datalist id="suggestions-{{field.key}}">
|
|
{%- for option in field.options %}
|
|
<option value="{{option}}">
|
|
{%- endfor %}
|
|
</datalist>
|
|
<script>
|
|
!(function() {
|
|
let taggle;
|
|
let hiden_field = document.querySelector('#field-{{field.key}}');
|
|
|
|
let onchange = () => {
|
|
let values = taggle.tag.values.join(" ");
|
|
hiden_field.setAttribute("value", values);
|
|
};
|
|
|
|
taggle = new Taggle('tag-input-{{field.key}}', {
|
|
placeholder: 'Enter tags...',
|
|
allowDuplicates: false,
|
|
tags: {{field.tags_json | safe }},
|
|
allowedTags: {% if not free %}{{field.all_tags_json | safe}}{% else %}[]{% endif %},
|
|
onTagAdd: onchange,
|
|
onTagRemove: onchange,
|
|
saveOnBlur: true,
|
|
clearOnBlur: false,
|
|
});
|
|
|
|
document.querySelector('#tag-input-{{field.key}} .taggle_input')
|
|
.setAttribute('list', 'suggestions-{{field.key}}');
|
|
})();
|
|
</script>
|
|
{% endmacro %}
|
|
|
|
|
|
{# FREE TAGS #}
|
|
|
|
{% macro free_tags(field) %}
|
|
{{ self::tags(field=field, free=true) }}
|
|
{% endmacro %}
|
|
|