@windward/games 0.8.1 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +3 -0
- package/components/content/blocks/crosswordPuzzle/CrosswordPuzzle.vue +4 -24
- package/components/content/blocks/dragDrop/BucketGame.vue +139 -60
- package/components/content/blocks/flashcards/CardFace.vue +22 -57
- package/components/content/blocks/flashcards/Flashcard.vue +19 -16
- package/components/content/blocks/flashcards/FlashcardSlides.vue +13 -38
- package/components/content/blocks/matchingGame/MatchingGame.vue +3 -3
- package/components/content/blocks/multipleChoice/MultipleChoice.vue +18 -118
- package/components/content/blocks/sevenStrikes/SevenStikes.vue +158 -165
- package/components/content/blocks/slideshow/SlideShow.vue +49 -99
- package/components/content/blocks/wordJumble/WordJumble.vue +122 -129
- package/components/settings/BucketGameSettingsManager.vue +9 -0
- package/components/settings/FlashCardSlidesManager.vue +26 -91
- package/i18n/en-US/components/content/blocks/bucket_game.ts +1 -0
- package/i18n/en-US/components/content/blocks/multiple_choice.ts +0 -1
- package/i18n/en-US/shared/content_blocks.ts +1 -0
- package/i18n/es-ES/components/content/blocks/bucket_game.ts +1 -0
- package/i18n/es-ES/components/content/blocks/multiple_choice.ts +0 -1
- package/i18n/es-ES/shared/content_blocks.ts +1 -0
- package/i18n/sv-SE/components/content/blocks/bucket_game.ts +1 -0
- package/i18n/sv-SE/components/content/blocks/multiple_choice.ts +0 -1
- package/i18n/sv-SE/shared/content_blocks.ts +1 -0
- package/package.json +1 -1
- package/test/__mocks__/contentBlockMock.js +94 -0
- package/test/mocks.js +1 -0
- package/test/settings/BucketGameManager.spec.js +3 -3
|
@@ -8,10 +8,7 @@
|
|
|
8
8
|
{{ block.metadata.config.instructions }}
|
|
9
9
|
</p>
|
|
10
10
|
<br />
|
|
11
|
-
<v-carousel
|
|
12
|
-
:value="block.metadata.config.currentSlide"
|
|
13
|
-
:hide-delimiters="hideDeliminators"
|
|
14
|
-
>
|
|
11
|
+
<v-carousel v-model="currentSlide" hide-delimiters>
|
|
15
12
|
<template #prev="{ on, attrs }">
|
|
16
13
|
<v-btn
|
|
17
14
|
variant="elevated"
|
|
@@ -44,13 +41,20 @@
|
|
|
44
41
|
>
|
|
45
42
|
<v-sheet height="90%" tile>
|
|
46
43
|
<Flashcard
|
|
47
|
-
v-model="block.metadata.config.cards[index].side"
|
|
48
44
|
:options="card"
|
|
49
|
-
:slide="
|
|
50
|
-
:key="seed + '-' +
|
|
45
|
+
:slide="currentSlide"
|
|
46
|
+
:key="seed + '-' + currentSlide"
|
|
51
47
|
:assets="block.assets"
|
|
52
48
|
/>
|
|
53
49
|
</v-sheet>
|
|
50
|
+
<div class="d-flex justify-end">
|
|
51
|
+
{{
|
|
52
|
+
$t('windward.games.shared.content_blocks.out_of', [
|
|
53
|
+
index + 1,
|
|
54
|
+
block.metadata.config.cards.length,
|
|
55
|
+
])
|
|
56
|
+
}}
|
|
57
|
+
</div>
|
|
54
58
|
</v-carousel-item>
|
|
55
59
|
</v-carousel>
|
|
56
60
|
</div>
|
|
@@ -73,6 +77,7 @@ export default {
|
|
|
73
77
|
toggle: true,
|
|
74
78
|
seed: Crypto.id(),
|
|
75
79
|
cards: [],
|
|
80
|
+
currentSlide: 0,
|
|
76
81
|
}
|
|
77
82
|
},
|
|
78
83
|
beforeMount() {
|
|
@@ -84,7 +89,6 @@ export default {
|
|
|
84
89
|
}
|
|
85
90
|
if (_.isEmpty(this.block.metadata.config)) {
|
|
86
91
|
this.block.metadata.config = {}
|
|
87
|
-
this.block.metadata.config.currentSlide = 0
|
|
88
92
|
this.block.metadata.config.title = this.$t(
|
|
89
93
|
'windward.games.components.content.blocks.flashcard.title'
|
|
90
94
|
)
|
|
@@ -101,39 +105,10 @@ export default {
|
|
|
101
105
|
computed: {
|
|
102
106
|
slide() {
|
|
103
107
|
if (this.block.metadata.config.cards.length > 0) {
|
|
104
|
-
return this.
|
|
108
|
+
return this.currentSlide + 1
|
|
105
109
|
}
|
|
106
110
|
return 0
|
|
107
111
|
},
|
|
108
|
-
hideDeliminators() {
|
|
109
|
-
const condition1 =
|
|
110
|
-
window.innerWidth <= 1483 ||
|
|
111
|
-
this.block.metadata.config.cards.length >= 13
|
|
112
|
-
const condition2 =
|
|
113
|
-
this.block.metadata.config.cards.length >= 12 &&
|
|
114
|
-
window.innerWidth <= 1692
|
|
115
|
-
const condition3 =
|
|
116
|
-
this.block.metadata.config.cards.length >= 11 &&
|
|
117
|
-
window.innerWidth <= 1634
|
|
118
|
-
const condition4 =
|
|
119
|
-
this.block.metadata.config.cards.length >= 10 &&
|
|
120
|
-
window.innerWidth <= 1571
|
|
121
|
-
const condition5 =
|
|
122
|
-
this.block.metadata.config.cards.length >= 9 &&
|
|
123
|
-
window.innerWidth <= 1518
|
|
124
|
-
|
|
125
|
-
if (
|
|
126
|
-
condition1 ||
|
|
127
|
-
condition2 ||
|
|
128
|
-
condition3 ||
|
|
129
|
-
condition4 ||
|
|
130
|
-
condition5
|
|
131
|
-
) {
|
|
132
|
-
return true
|
|
133
|
-
} else {
|
|
134
|
-
return false
|
|
135
|
-
}
|
|
136
|
-
},
|
|
137
112
|
},
|
|
138
113
|
methods: {
|
|
139
114
|
onActionPanelEdit() {
|
|
@@ -97,7 +97,7 @@
|
|
|
97
97
|
group="people"
|
|
98
98
|
tabindex="0"
|
|
99
99
|
>
|
|
100
|
-
<div :id="mainPrompt.file.
|
|
100
|
+
<div :id="mainPrompt.file.file_asset_id">
|
|
101
101
|
<v-img
|
|
102
102
|
:aria-describedby="
|
|
103
103
|
getFileAriaDescribedBy(
|
|
@@ -196,7 +196,7 @@
|
|
|
196
196
|
:id="
|
|
197
197
|
block.metadata.config.prompts[
|
|
198
198
|
startingIndex
|
|
199
|
-
][startingIndex].file.
|
|
199
|
+
][startingIndex].file.file_asset_id
|
|
200
200
|
"
|
|
201
201
|
>
|
|
202
202
|
<v-img
|
|
@@ -498,7 +498,7 @@ export default {
|
|
|
498
498
|
(outerElement) => {
|
|
499
499
|
const mainElement = outerElement.find((element) => {
|
|
500
500
|
return (
|
|
501
|
-
element.file?.
|
|
501
|
+
element.file?.file_asset_id ==
|
|
502
502
|
evt.to.firstElementChild.id
|
|
503
503
|
)
|
|
504
504
|
})
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
</p>
|
|
15
15
|
</v-col>
|
|
16
16
|
</v-row>
|
|
17
|
-
<v-carousel height="auto"
|
|
17
|
+
<v-carousel height="auto" hide-delimiters>
|
|
18
18
|
<template #prev="{ on, attrs }">
|
|
19
19
|
<v-btn
|
|
20
20
|
variant="elevated"
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
>
|
|
43
43
|
</template>
|
|
44
44
|
<v-carousel-item
|
|
45
|
-
v-for="question in block.metadata.config.questions"
|
|
45
|
+
v-for="(question, index) in block.metadata.config.questions"
|
|
46
46
|
:key="question.id"
|
|
47
47
|
>
|
|
48
48
|
<v-col class="d-flex justify-center">
|
|
@@ -134,9 +134,9 @@
|
|
|
134
134
|
>
|
|
135
135
|
</v-row>
|
|
136
136
|
</v-col>
|
|
137
|
-
<v-
|
|
138
|
-
<v-flex
|
|
139
|
-
|
|
137
|
+
<v-container>
|
|
138
|
+
<v-row class="d-flex justify-center">
|
|
139
|
+
<v-col></v-col>
|
|
140
140
|
<v-col align="center" tabindex="0">
|
|
141
141
|
{{
|
|
142
142
|
$t(
|
|
@@ -153,32 +153,19 @@
|
|
|
153
153
|
style="pointer-events: none"
|
|
154
154
|
></v-progress-linear>
|
|
155
155
|
</v-col>
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
</v-
|
|
159
|
-
<v-
|
|
160
|
-
<v-flex
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
</p>
|
|
170
|
-
<p>
|
|
171
|
-
{{ studentAmountCorrect }}
|
|
172
|
-
{{
|
|
173
|
-
$t(
|
|
174
|
-
'windward.games.components.content.blocks.multiple_choice.out_of'
|
|
175
|
-
)
|
|
176
|
-
}}
|
|
177
|
-
{{ totalQuestionsMultipleChoice }}
|
|
178
|
-
</p>
|
|
179
|
-
</v-col>
|
|
180
|
-
</v-flex>
|
|
181
|
-
</v-layout>
|
|
156
|
+
<v-col></v-col>
|
|
157
|
+
</v-row>
|
|
158
|
+
</v-container>
|
|
159
|
+
<v-container>
|
|
160
|
+
<v-row class="d-flex justify-end">
|
|
161
|
+
{{
|
|
162
|
+
$t('windward.games.shared.content_blocks.out_of', [
|
|
163
|
+
index + 1,
|
|
164
|
+
block.metadata.config.questions.length,
|
|
165
|
+
])
|
|
166
|
+
}}
|
|
167
|
+
</v-row>
|
|
168
|
+
</v-container>
|
|
182
169
|
</v-carousel-item>
|
|
183
170
|
<DialogBox
|
|
184
171
|
v-model="dialog"
|
|
@@ -223,9 +210,6 @@ import Crypto from '~/helpers/Crypto'
|
|
|
223
210
|
import { mapGetters } from 'vuex'
|
|
224
211
|
import BaseContentBlock from '~/components/Content/Blocks/BaseContentBlock'
|
|
225
212
|
import DialogBox from '~/components/Core/DialogBox.vue'
|
|
226
|
-
import UserContentBlockState from '~/models/UserContentBlockState'
|
|
227
|
-
import ContentBlock from '~/models/ContentBlock'
|
|
228
|
-
import Course from '~/models/Course'
|
|
229
213
|
|
|
230
214
|
export default {
|
|
231
215
|
name: 'MultipleChoice',
|
|
@@ -262,8 +246,6 @@ export default {
|
|
|
262
246
|
hintText: '',
|
|
263
247
|
answerDescriptionModal: false,
|
|
264
248
|
answerDescription: '',
|
|
265
|
-
studentAmountCorrect: null,
|
|
266
|
-
totalQuestionsMultipleChoice: null,
|
|
267
249
|
studentResponses: [],
|
|
268
250
|
mountCourseCounter: false,
|
|
269
251
|
}
|
|
@@ -293,89 +275,8 @@ export default {
|
|
|
293
275
|
}
|
|
294
276
|
return 0
|
|
295
277
|
},
|
|
296
|
-
hideDeliminators() {
|
|
297
|
-
const condition1 =
|
|
298
|
-
window.innerWidth <= 1483 ||
|
|
299
|
-
this.block.metadata.config.questions.length >= 13
|
|
300
|
-
const condition2 =
|
|
301
|
-
this.block.metadata.config.questions.length >= 12 &&
|
|
302
|
-
window.innerWidth <= 1692
|
|
303
|
-
const condition3 =
|
|
304
|
-
this.block.metadata.config.questions.length >= 11 &&
|
|
305
|
-
window.innerWidth <= 1634
|
|
306
|
-
const condition4 =
|
|
307
|
-
this.block.metadata.config.questions.length >= 10 &&
|
|
308
|
-
window.innerWidth <= 1571
|
|
309
|
-
const condition5 =
|
|
310
|
-
this.block.metadata.config.questions.length >= 9 &&
|
|
311
|
-
window.innerWidth <= 1518
|
|
312
|
-
|
|
313
|
-
if (
|
|
314
|
-
condition1 ||
|
|
315
|
-
condition2 ||
|
|
316
|
-
condition3 ||
|
|
317
|
-
condition4 ||
|
|
318
|
-
condition5
|
|
319
|
-
) {
|
|
320
|
-
return true
|
|
321
|
-
} else {
|
|
322
|
-
return false
|
|
323
|
-
}
|
|
324
|
-
},
|
|
325
|
-
},
|
|
326
|
-
watch: {
|
|
327
|
-
render(newValue) {
|
|
328
|
-
if (newValue) {
|
|
329
|
-
this.onTotalAmountOfQuestions()
|
|
330
|
-
}
|
|
331
|
-
},
|
|
332
|
-
},
|
|
333
|
-
mounted() {
|
|
334
|
-
//this.mountCourseCounter = false
|
|
335
|
-
this.onAmountCorrect()
|
|
336
|
-
//this.onTotalAmountOfQuestions()
|
|
337
278
|
},
|
|
338
279
|
methods: {
|
|
339
|
-
async onAmountCorrect() {
|
|
340
|
-
let correct = 0
|
|
341
|
-
// grabs user state to get the total amount of questions a studentanswered correctly
|
|
342
|
-
let userState = await UserContentBlockState.where({
|
|
343
|
-
'metadata->block->tag': 'plugin-games-multiple-choice',
|
|
344
|
-
course_user_id: this.enrollment.id,
|
|
345
|
-
}).get()
|
|
346
|
-
userState.forEach((state) => {
|
|
347
|
-
state.metadata.studentResponses.forEach((element) => {
|
|
348
|
-
if (element.isStudentCorrect === true) {
|
|
349
|
-
correct = correct + 1
|
|
350
|
-
}
|
|
351
|
-
})
|
|
352
|
-
})
|
|
353
|
-
// need to wait till correct has the new value to set the var
|
|
354
|
-
setTimeout(() => {
|
|
355
|
-
// sets total
|
|
356
|
-
this.studentAmountCorrect = correct
|
|
357
|
-
this.mountCourseCounter = true
|
|
358
|
-
}, 1000)
|
|
359
|
-
},
|
|
360
|
-
async onTotalAmountOfQuestions() {
|
|
361
|
-
let multipleChoiceTotalQuestions = 0
|
|
362
|
-
// get total amount of questions via content block route
|
|
363
|
-
let multipleChoiceBlocks = await ContentBlock.where(
|
|
364
|
-
'tag',
|
|
365
|
-
'plugin-games-multiple-choice'
|
|
366
|
-
)
|
|
367
|
-
.for(new Course({ id: this.course.id }))
|
|
368
|
-
.get()
|
|
369
|
-
|
|
370
|
-
multipleChoiceBlocks.forEach((element) => {
|
|
371
|
-
element.block.metadata.config.questions.forEach((question) => {
|
|
372
|
-
multipleChoiceTotalQuestions =
|
|
373
|
-
multipleChoiceTotalQuestions + 1
|
|
374
|
-
})
|
|
375
|
-
})
|
|
376
|
-
|
|
377
|
-
this.totalQuestionsMultipleChoice = multipleChoiceTotalQuestions
|
|
378
|
-
},
|
|
379
280
|
onAnswerDescription(question) {
|
|
380
281
|
//launches modal and displays anwer description
|
|
381
282
|
this.dialog = true
|
|
@@ -397,7 +298,6 @@ export default {
|
|
|
397
298
|
clonedQuestion.student_response = answer
|
|
398
299
|
|
|
399
300
|
if (answer.correctAnswer === true) {
|
|
400
|
-
this.studentAmountCorrect = this.studentAmountCorrect + 1
|
|
401
301
|
clonedQuestion.isStudentCorrect = true
|
|
402
302
|
} else {
|
|
403
303
|
clonedQuestion.isStudentCorrect = false
|