Formatting

This commit is contained in:
Pieter Vander Vennet 2023-05-06 11:05:41 +02:00
parent 36a0784e06
commit 5d3056cb09

View file

@ -5,15 +5,16 @@
* The questions can either be shown all at once or one at a time (in which case they can be skipped)
*/
import TagRenderingConfig from "../../../Models/ThemeConfig/TagRenderingConfig";
import { UIEventSource } from "../../../Logic/UIEventSource";
import type { Feature } from "geojson";
import type { SpecialVisualizationState } from "../../SpecialVisualization";
import {UIEventSource} from "../../../Logic/UIEventSource";
import type {Feature} from "geojson";
import type {SpecialVisualizationState} from "../../SpecialVisualization";
import LayerConfig from "../../../Models/ThemeConfig/LayerConfig";
import If from "../../Base/If.svelte";
import { onDestroy } from "svelte";
import {onDestroy} from "svelte";
import TagRenderingQuestion from "./TagRenderingQuestion.svelte";
import Tr from "../../Base/Tr.svelte";
import Translations from "../../i18n/Translations.js";
import {Utils} from "../../../Utils";
export let layer: LayerConfig;
export let tags: UIEventSource<Record<string, string>>;
@ -42,7 +43,7 @@
}
let skippedQuestions = new UIEventSource<Set<string>>(new Set<string>());
let questionboxElem: HTMLBaseElement
let questionsToAsk = tags.map(tags => {
const baseQuestions = (layer.tagRenderings ?? [])?.filter(tr => allowed(tr.labels) && tr.question !== undefined);
const questionsToAsk: TagRenderingConfig[] = [];
@ -72,9 +73,6 @@
let answered: number = 0;
let skipped: number = 0;
function focus(){
}
function skip(question: TagRenderingConfig, didAnswer: boolean = false) {
skippedQuestions.data.add(question.id);
skippedQuestions.ping();
@ -83,40 +81,44 @@
} else {
skipped++;
}
window.setTimeout(() => {
Utils.scrollIntoView(questionboxElem)
}, 50)
}
$: console.log("Current questionbox state:", {answered, skipped, questionsToAsk, layer, selectedElement, tags})
</script>
{#if _questionsToAsk.length === 0}
<div bind:this={questionboxElem}>
{#if _questionsToAsk.length === 0}
{#if skipped + answered > 0 }
<div class="thanks">
<Tr t={Translations.t.general.questionBox.done} />
<Tr t={Translations.t.general.questionBox.done}/>
</div>
{#if answered === 0}
{#if skipped === 1}
<Tr t={Translations.t.general.questionBox.skippedOne} />
<Tr t={Translations.t.general.questionBox.skippedOne}/>
{:else}
<Tr t={Translations.t.general.questionBox.skippedMultiple.Subs({skipped})} />
<Tr t={Translations.t.general.questionBox.skippedMultiple.Subs({skipped})}/>
{/if}
{:else if answered === 1}
{#if skipped === 0}
<Tr t={Translations.t.general.questionBox.answeredOne} />
<Tr t={Translations.t.general.questionBox.answeredOne}/>
{:else if skipped === 1}
<Tr t={Translations.t.general.questionBox.answeredOneSkippedOne} />
<Tr t={Translations.t.general.questionBox.answeredOneSkippedOne}/>
{:else}
<Tr t={Translations.t.general.questionBox.answeredOneSkippedMultiple.Subs({skipped})} />
<Tr t={Translations.t.general.questionBox.answeredOneSkippedMultiple.Subs({skipped})}/>
{/if}
{:else}
{#if skipped === 0}
<Tr t={Translations.t.general.questionBox.answeredMultiple.Subs({answered})} />
<Tr t={Translations.t.general.questionBox.answeredMultiple.Subs({answered})}/>
{:else if skipped === 1}
<Tr t={Translations.t.general.questionBox.answeredMultipleSkippedOne.Subs({answered})} />
<Tr t={Translations.t.general.questionBox.answeredMultipleSkippedOne.Subs({answered})}/>
{:else}
<Tr
t={Translations.t.general.questionBox.answeredMultipleSkippedMultiple.Subs({answered, skipped})} />
t={Translations.t.general.questionBox.answeredMultipleSkippedMultiple.Subs({answered, skipped})}/>
{/if}
{/if}
@ -127,12 +129,13 @@
</button>
{/if}
{/if}
{:else }
{:else }
<div>
<If condition={state.userRelatedState.showAllQuestionsAtOnce}>
<div>
{#each _questionsToAsk as question (question.id)}
<TagRenderingQuestion config={question} {tags} {selectedElement} {state} {layer}></TagRenderingQuestion>
<TagRenderingQuestion config={question} {tags} {selectedElement} {state}
{layer}></TagRenderingQuestion>
{/each}
</div>
@ -150,4 +153,5 @@
</If>
</div>
{/if}
{/if}
</div>