contrapunctus/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Formatting

Browse source
This commit is contained in:
Pieter Vander Vennet 2023-05-06 11:05:41 +02:00
parent 36a0784e06
commit 5d3056cb09
1 changed files with 142 additions and 138 deletions
Download patch file Download diff file Expand all files Collapse all files

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