First working version

This commit is contained in:
pietervdvn 2022-07-10 18:08:06 +02:00
parent f79730ac0f
commit 6f5283a2d2

View file

@ -154,7 +154,10 @@ export default class TagRenderingQuestion extends Combine {
const ifNotsPresent = applicableMappings.some(mapping => mapping.ifnot !== undefined)
if(applicableMappings.length > 8 && !ifNotsPresent && (configuration.freeform?.type === undefined || configuration.freeform?.type === "string")){
if (applicableMappings.length > 8 &&
(configuration.freeform?.type === undefined || configuration.freeform?.type === "string") &&
(!configuration.multiAnswer || configuration.freeform === undefined)) {
return TagRenderingQuestion.GenerateSearchableSelector(state, configuration, applicableMappings, tagsSource)
}
@ -231,15 +234,20 @@ export default class TagRenderingQuestion extends Combine {
private static GenerateSearchableSelector(
state: FeaturePipelineState,
configuration: TagRenderingConfig,
applicableMappings: { if: TagsFilter; then: TypedTranslation<object>; icon?: string; iconClass?: string, addExtraTags: Tag[], searchTerms?: Record<string, string[]> }[], tagsSource: UIEventSource<any>): InputElement<TagsFilter>{
const values : { show: BaseUIElement, value: TagsFilter, mainTerm: Record<string, string>, searchTerms?: Record<string, string[]> }[] = []
for (const mapping of applicableMappings) {
applicableMappings: { if: TagsFilter; ifnot?: TagsFilter, then: TypedTranslation<object>; icon?: string; iconClass?: string, addExtraTags: Tag[], searchTerms?: Record<string, string[]> }[], tagsSource: UIEventSource<any>): InputElement<TagsFilter> {
const values: { show: BaseUIElement, value: number, mainTerm: Record<string, string>, searchTerms?: Record<string, string[]> }[] = []
for (let i = 0; i < applicableMappings.length; i++) {
const mapping = applicableMappings[i];
const tr = mapping.then.Subs(tagsSource.data)
const patchedMapping = <{iconClass: "small-height", then: TypedTranslation<object>}> {...mapping, iconClass: "small-height"}
const patchedMapping = <{ iconClass: "small-height", then: TypedTranslation<object> }>{
...mapping,
iconClass: `small-height`,
icon: mapping.icon ?? "./assets/svg/none.svg"
}
const fancy = TagRenderingQuestion.GenerateMappingContent(patchedMapping, tagsSource, state).SetClass("normal-background")
values.push({
show: fancy,
value: mapping.if,
value: i,
mainTerm: tr.translations,
searchTerms: mapping.searchTerms
})
@ -252,36 +260,67 @@ export default class TagRenderingQuestion extends Combine {
onEmpty = new VariableUiElement(searchValue.map(search => configuration.render.Subs({[ff.key]: search})))
}
const classes = "h-32 overflow-scroll"
const presetSearch = new SearchablePillsSelector<TagsFilter>(values,{
const classes = "h-64 overflow-scroll"
const presetSearch = new SearchablePillsSelector<number>(values, {
selectIfSingle: true,
mode: configuration.multiAnswer ? "select-many" : "select-one",
searchValue,
onNoMatches: onEmpty?.SetClass(classes).SetClass("flex justify-center items-center"),
searchAreaClass: classes
})
return new InputElementMap(presetSearch,
(x0, x1) => false,
arr => {
console.log("Arr is ", arr)
if(arr[0] !== undefined){
return new And(arr)
return new InputElementMap<number[], And>(presetSearch,
(x0, x1) => {
if (x0 == x1) {
return true;
}
if (x0 === undefined || x1 === undefined) {
return false;
}
if (x0.and.length !== x1.and.length) {
return false;
}
for (let i = 0; i < x0.and.length; i++) {
if (x1.and[i] != x0.and[i]) {
return false
}
}
return true;
},
(selected) => {
if (ff !== undefined && searchValue.data?.length > 0 && !presetSearch.someMatchFound.data) {
const t = new Tag(ff.key, searchValue.data)
if (ff.addExtraTags) {
return new And([t, ...ff.addExtraTags])
}
return t;
return new And([t]);
}
}
if (selected === undefined || selected.length == 0) {
return undefined;
},
tf => {
if(tf["and"] !== undefined){
return tf["and"];
}
return [tf];
const tfs = Utils.NoNull(applicableMappings.map((mapping, i) => {
if (selected.indexOf(i) >= 0) {
return mapping.if
} else {
return mapping.ifnot
}
}))
console.log("Got tags", tfs)
return new And(tfs);
},
(tf) => {
if (tf === undefined) {
return []
}
const selected: number[] = []
for (let i = 0; i < applicableMappings.length; i++) {
const mapping = applicableMappings[i]
if (tf.and.some(t => mapping.if == t)) {
selected.push(i)
}
}
return selected;
},
[searchValue, presetSearch.someMatchFound]
);
@ -423,13 +462,13 @@ export default class TagRenderingQuestion extends Combine {
private static GenerateMappingContent(mapping: {
then: Translation,
icon?: string,
iconClass?: "small" | "medium" | "large" | "small-height"
iconClass?: "small" | "medium" | "large" | "small-height" | "medium-height" | "large-height"
}, tagsSource: UIEventSource<any>, state: FeaturePipelineState): BaseUIElement {
const text = new SubstitutedTranslation(mapping.then, tagsSource, state)
if (mapping.icon === undefined) {
return text;
}
return new Combine([new Img(mapping.icon).SetClass("mr-1 mapping-icon-"+(mapping.iconClass ?? "small")), text]).SetClass("flex")
return new Combine([new Img(mapping.icon).SetClass("mr-1 mapping-icon-" + (mapping.iconClass ?? "small")), text]).SetClass("flex items-center")
}
private static GenerateFreeform(state: FeaturePipelineState, configuration: TagRenderingConfig, applicableUnit: Unit, tags: UIEventSource<any>, feedback: UIEventSource<Translation>)