@windward/games 0.2.1 → 0.3.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/components/content/DatableEditor.vue +1 -1
- package/components/content/blocks/crosswordPuzzle/CrosswordPuzzle.vue +1 -0
- package/components/content/blocks/dragDrop/BucketGame.vue +2 -2
- package/components/content/blocks/dragDrop/SortingGame.vue +38 -36
- package/components/content/blocks/flashcards/FlashcardSlides.vue +5 -12
- package/components/content/blocks/matchingGame/MatchingGame.vue +8 -13
- package/components/content/blocks/multipleChoice/MultipleChoice.vue +34 -10
- package/components/content/blocks/multipleChoice/QuestionDialog.vue +25 -21
- package/components/content/blocks/quizshowGame/AnswerPanel.vue +2 -3
- package/components/content/blocks/quizshowGame/Gridview.vue +3 -2
- package/components/content/blocks/sevenStrikes/SevenStikes.vue +31 -3
- package/components/content/blocks/slideshow/SlideShow.vue +5 -12
- package/components/content/blocks/wordJumble/WordJumble.vue +25 -1
- package/components/settings/BucketGameSettingsManager.vue +20 -4
- package/components/settings/CrosswordPuzzleSettingsManager.vue +19 -10
- package/components/settings/FlashCardSlidesManager.vue +121 -83
- package/components/settings/MatchingGameManager.vue +77 -43
- package/components/settings/MultipleChoiceSettingsManager.vue +33 -78
- package/components/settings/QuizShowSettingsManager.vue +26 -13
- package/components/settings/SevenStrikesSettingsManager.vue +16 -5
- package/components/settings/SlideShowManager.vue +15 -4
- package/components/settings/SortingGameSettingsManager.vue +18 -8
- package/components/settings/WordJumbleSettingsManager.vue +21 -10
- package/jest.config.js +0 -1
- package/package.json +2 -2
- package/plugin.js +6 -6
- package/test/__mocks__/componentsMock.js +3 -1
- package/test/__mocks__/modelMock.js +13 -84
- package/test/blocks/multipleChoice/MultipleChoice.spec.js +1 -1
- package/test/settings/WordJumbleManager.spec.js +3 -0
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
<v-row class="col-md-10">
|
|
64
64
|
<v-card
|
|
65
65
|
v-if="mainAnswer[0]"
|
|
66
|
-
class="pa-2 d-flex justify-center flex-fill"
|
|
66
|
+
class="pa-2 d-flex justify-center flex-fill container-outline"
|
|
67
67
|
outlined
|
|
68
68
|
tile
|
|
69
69
|
>
|
|
@@ -139,7 +139,7 @@
|
|
|
139
139
|
startingIndex
|
|
140
140
|
]
|
|
141
141
|
"
|
|
142
|
-
class="pa-2 d-flex justify-center flex-fill"
|
|
142
|
+
class="pa-2 d-flex justify-center flex-fill container-outline"
|
|
143
143
|
outlined
|
|
144
144
|
tile
|
|
145
145
|
>
|
|
@@ -16,12 +16,12 @@
|
|
|
16
16
|
}}</v-col>
|
|
17
17
|
<v-col cols="2">
|
|
18
18
|
<v-row
|
|
19
|
-
v-if="
|
|
19
|
+
v-if="onFail() || onSuccess()"
|
|
20
20
|
class="d-flex justify-end"
|
|
21
21
|
>
|
|
22
22
|
<v-container
|
|
23
|
-
v-if="
|
|
24
|
-
@click="
|
|
23
|
+
v-if="onFail()"
|
|
24
|
+
@click="onContinueGame"
|
|
25
25
|
class="d-flex justify-end"
|
|
26
26
|
><v-icon class="icon--error"
|
|
27
27
|
>mdi-close-circle</v-icon
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
v-bind="dragOptions"
|
|
41
41
|
@change="onDragChange"
|
|
42
42
|
>
|
|
43
|
-
<v-row v-for="index in input.length" :key="'
|
|
43
|
+
<v-row v-for="index in input.length" :key="'sortable_' + index">
|
|
44
44
|
<v-col cols="1" md="1" class="d-flex justify-end pa-0">
|
|
45
45
|
<v-icon v-if="success[index - 1]" class="icon--success"
|
|
46
46
|
>mdi-check-circle
|
|
@@ -52,8 +52,8 @@
|
|
|
52
52
|
<v-col cols="10">
|
|
53
53
|
<v-card
|
|
54
54
|
:class="
|
|
55
|
-
'pa-2 flex-fill
|
|
56
|
-
|
|
55
|
+
'pa-2 flex-fill container-outline ' +
|
|
56
|
+
sortableStateClass(index)
|
|
57
57
|
"
|
|
58
58
|
outlined
|
|
59
59
|
tile
|
|
@@ -69,11 +69,15 @@
|
|
|
69
69
|
</draggable>
|
|
70
70
|
<v-container class="mt-3">
|
|
71
71
|
<v-row
|
|
72
|
-
v-if="!
|
|
72
|
+
v-if="!onFail() && !onSuccess()"
|
|
73
73
|
class="d-flex justify-center"
|
|
74
74
|
>
|
|
75
75
|
<v-spacer class="col-lg-1" />
|
|
76
|
-
<v-btn
|
|
76
|
+
<v-btn
|
|
77
|
+
color="primary"
|
|
78
|
+
elevation="0"
|
|
79
|
+
@click="onCheckAnswers"
|
|
80
|
+
>
|
|
77
81
|
{{
|
|
78
82
|
$t(
|
|
79
83
|
'windward.games.components.content.blocks.sorting_game.check_answers'
|
|
@@ -82,17 +86,21 @@
|
|
|
82
86
|
</v-btn>
|
|
83
87
|
</v-row>
|
|
84
88
|
<v-row
|
|
85
|
-
v-if="
|
|
89
|
+
v-if="onFail() || onSuccess()"
|
|
86
90
|
class="d-flex justify-center"
|
|
87
91
|
>
|
|
88
92
|
<v-btn
|
|
89
|
-
v-if="
|
|
93
|
+
v-if="onFail()"
|
|
90
94
|
color="primary"
|
|
91
|
-
|
|
92
|
-
@click="
|
|
95
|
+
text
|
|
96
|
+
@click="onContinueGame"
|
|
93
97
|
>{{ $t('shared.forms.try_again') }} </v-btn
|
|
94
98
|
>
|
|
95
|
-
<v-btn
|
|
99
|
+
<v-btn
|
|
100
|
+
color="primary"
|
|
101
|
+
elevation="0"
|
|
102
|
+
@click="onReset"
|
|
103
|
+
outlined
|
|
96
104
|
>{{ $t('shared.forms.reset') }}
|
|
97
105
|
</v-btn>
|
|
98
106
|
</v-row>
|
|
@@ -110,7 +118,7 @@
|
|
|
110
118
|
<v-row
|
|
111
119
|
class="justify-center align-center"
|
|
112
120
|
v-for="index in block.metadata.config.answer.length"
|
|
113
|
-
:key="'
|
|
121
|
+
:key="'sortable_' + index"
|
|
114
122
|
>
|
|
115
123
|
<v-col cols="1" v-if="graded">
|
|
116
124
|
<v-icon v-if="success[index - 1]" color="success"
|
|
@@ -123,8 +131,8 @@
|
|
|
123
131
|
<v-col cols="11">
|
|
124
132
|
<v-card
|
|
125
133
|
:class="
|
|
126
|
-
'pa-2 flex-fill
|
|
127
|
-
|
|
134
|
+
'pa-2 flex-fill container-outline ' +
|
|
135
|
+
sortableStateClass(index)
|
|
128
136
|
"
|
|
129
137
|
elevation="0"
|
|
130
138
|
outlined
|
|
@@ -253,7 +261,7 @@ export default {
|
|
|
253
261
|
resolve(true)
|
|
254
262
|
})
|
|
255
263
|
},
|
|
256
|
-
|
|
264
|
+
onReset() {
|
|
257
265
|
this.disabled = false
|
|
258
266
|
this.graded = false
|
|
259
267
|
this.success = []
|
|
@@ -264,7 +272,7 @@ export default {
|
|
|
264
272
|
this.feedback = this.block.metadata.config.feedback_default
|
|
265
273
|
this.seed = Math.floor(Math.random() * 100)
|
|
266
274
|
},
|
|
267
|
-
|
|
275
|
+
onContinueGame() {
|
|
268
276
|
this.disabled = false
|
|
269
277
|
this.graded = false
|
|
270
278
|
this.success = []
|
|
@@ -272,7 +280,7 @@ export default {
|
|
|
272
280
|
this.feedback = this.block.metadata.config.feedback_default
|
|
273
281
|
this.seed = Math.floor(Math.random() * 100)
|
|
274
282
|
},
|
|
275
|
-
|
|
283
|
+
onSuccess() {
|
|
276
284
|
let result = false
|
|
277
285
|
let successCounter = 0
|
|
278
286
|
this.success.forEach(function (item) {
|
|
@@ -285,7 +293,7 @@ export default {
|
|
|
285
293
|
}
|
|
286
294
|
return result
|
|
287
295
|
},
|
|
288
|
-
|
|
296
|
+
onFail() {
|
|
289
297
|
let result = false
|
|
290
298
|
this.fail.forEach(function (item) {
|
|
291
299
|
if (item === true) {
|
|
@@ -296,15 +304,15 @@ export default {
|
|
|
296
304
|
},
|
|
297
305
|
feedbackClass() {
|
|
298
306
|
let result = ''
|
|
299
|
-
if (this.
|
|
307
|
+
if (this.onSuccess()) {
|
|
300
308
|
result = 'container-feedback-success '
|
|
301
309
|
}
|
|
302
|
-
if (this.
|
|
310
|
+
if (this.onFail()) {
|
|
303
311
|
result = 'container-feedback-error '
|
|
304
312
|
}
|
|
305
313
|
return result
|
|
306
314
|
},
|
|
307
|
-
|
|
315
|
+
onCheckAnswers() {
|
|
308
316
|
const self = this
|
|
309
317
|
this.disabled = true
|
|
310
318
|
|
|
@@ -318,22 +326,22 @@ export default {
|
|
|
318
326
|
}
|
|
319
327
|
})
|
|
320
328
|
|
|
321
|
-
if (this.
|
|
329
|
+
if (this.onSuccess()) {
|
|
322
330
|
this.feedback = this.block.metadata.config.feedback_correct
|
|
323
331
|
this.emitCompleted()
|
|
324
332
|
}
|
|
325
|
-
if (this.
|
|
333
|
+
if (this.onFail()) {
|
|
326
334
|
this.feedback = this.block.metadata.config.feedback_incorrect
|
|
327
335
|
}
|
|
328
336
|
this.graded = true
|
|
329
337
|
this.seed = Math.floor(Math.random() * 100)
|
|
330
338
|
},
|
|
331
|
-
|
|
339
|
+
sortableStateClass(index) {
|
|
332
340
|
if (this.success[index - 1]) {
|
|
333
|
-
return '
|
|
341
|
+
return 'sortable--success'
|
|
334
342
|
}
|
|
335
343
|
if (this.fail[index - 1]) {
|
|
336
|
-
return '
|
|
344
|
+
return 'sortable--error'
|
|
337
345
|
}
|
|
338
346
|
return ''
|
|
339
347
|
},
|
|
@@ -356,17 +364,11 @@ export default {
|
|
|
356
364
|
border: 4px solid var(--v-error-base);
|
|
357
365
|
color: var(--v-error-base);
|
|
358
366
|
}
|
|
359
|
-
.
|
|
360
|
-
border: solid 1px black;
|
|
361
|
-
border-radius: 4px !important;
|
|
362
|
-
cursor: pointer;
|
|
363
|
-
font-weight: bold;
|
|
364
|
-
}
|
|
365
|
-
.bucket--error {
|
|
367
|
+
.sortable--error {
|
|
366
368
|
background-color: var(--v-error-base);
|
|
367
369
|
color: white;
|
|
368
370
|
}
|
|
369
|
-
.
|
|
371
|
+
.sortable--success {
|
|
370
372
|
background-color: var(--v-success-base);
|
|
371
373
|
color: white;
|
|
372
374
|
}
|
|
@@ -8,16 +8,14 @@
|
|
|
8
8
|
{{ block.metadata.config.instructions }}
|
|
9
9
|
</p>
|
|
10
10
|
<br />
|
|
11
|
-
<v-carousel
|
|
12
|
-
v-model="block.metadata.config.currentSlide"
|
|
13
|
-
hide-delimiters
|
|
14
|
-
>
|
|
11
|
+
<v-carousel v-model="block.metadata.config.currentSlide">
|
|
15
12
|
<template #prev="{ on, attrs }">
|
|
16
13
|
<v-btn
|
|
17
14
|
variant="elevated"
|
|
18
15
|
color="primary"
|
|
16
|
+
outlined
|
|
19
17
|
fab
|
|
20
|
-
|
|
18
|
+
small
|
|
21
19
|
v-bind="attrs"
|
|
22
20
|
v-on="on"
|
|
23
21
|
><v-icon>mdi-chevron-left</v-icon></v-btn
|
|
@@ -27,8 +25,9 @@
|
|
|
27
25
|
<v-btn
|
|
28
26
|
variant="elevated"
|
|
29
27
|
color="primary"
|
|
28
|
+
outlined
|
|
30
29
|
fab
|
|
31
|
-
|
|
30
|
+
small
|
|
32
31
|
v-bind="attrs"
|
|
33
32
|
v-on="on"
|
|
34
33
|
><v-icon>mdi-chevron-right</v-icon></v-btn
|
|
@@ -49,12 +48,6 @@
|
|
|
49
48
|
</v-sheet>
|
|
50
49
|
</v-carousel-item>
|
|
51
50
|
</v-carousel>
|
|
52
|
-
|
|
53
|
-
<v-row justify="center" align="center">
|
|
54
|
-
<div class="pa-3 text-center">
|
|
55
|
-
{{ slide }}/{{ block.metadata.config.cards.length }}
|
|
56
|
-
</div></v-row
|
|
57
|
-
>
|
|
58
51
|
</div>
|
|
59
52
|
</template>
|
|
60
53
|
|
|
@@ -72,10 +72,8 @@
|
|
|
72
72
|
v-for="(answer, aindex) in block.metadata.config
|
|
73
73
|
.answerObjects"
|
|
74
74
|
:key="aindex"
|
|
75
|
-
class="pa-2 ma-2 answerCard"
|
|
75
|
+
class="pa-2 ma-2 answerCard container-outline"
|
|
76
76
|
outlined
|
|
77
|
-
tile
|
|
78
|
-
color="primary"
|
|
79
77
|
>
|
|
80
78
|
<v-icon>mdi-drag-vertical</v-icon>
|
|
81
79
|
<span>
|
|
@@ -90,7 +88,7 @@
|
|
|
90
88
|
>
|
|
91
89
|
<v-row align="center" class="col-md-12">
|
|
92
90
|
<v-card
|
|
93
|
-
v-if="
|
|
91
|
+
v-if="mainPrompt['textOrImage'] === 'text'"
|
|
94
92
|
class="flex-fill bucket"
|
|
95
93
|
min-height="5em"
|
|
96
94
|
outlined
|
|
@@ -118,7 +116,7 @@
|
|
|
118
116
|
</v-row>
|
|
119
117
|
<v-row align="center" class="col-md-10">
|
|
120
118
|
<v-card
|
|
121
|
-
v-if="mainPrompt['
|
|
119
|
+
v-if="mainPrompt['textOrImage'] === 'image'"
|
|
122
120
|
class="pa-2 flex-fill bucket"
|
|
123
121
|
min-height="5em"
|
|
124
122
|
outlined
|
|
@@ -170,9 +168,9 @@
|
|
|
170
168
|
<v-row align="center" class="col-md-12">
|
|
171
169
|
<v-card
|
|
172
170
|
v-if="
|
|
173
|
-
|
|
171
|
+
block.metadata.config.prompts[
|
|
174
172
|
startingIndex
|
|
175
|
-
][startingIndex].
|
|
173
|
+
][startingIndex].textOrImage === 'text'
|
|
176
174
|
"
|
|
177
175
|
class="pa-2 flex-fill bucket"
|
|
178
176
|
min-height="5em"
|
|
@@ -207,7 +205,7 @@
|
|
|
207
205
|
v-if="
|
|
208
206
|
block.metadata.config.prompts[
|
|
209
207
|
startingIndex
|
|
210
|
-
][startingIndex].
|
|
208
|
+
][startingIndex].textOrImage === 'image' &&
|
|
211
209
|
block.metadata.config.prompts[
|
|
212
210
|
startingIndex
|
|
213
211
|
][startingIndex].file
|
|
@@ -419,7 +417,7 @@ export default {
|
|
|
419
417
|
name: '',
|
|
420
418
|
},
|
|
421
419
|
prompt: '',
|
|
422
|
-
|
|
420
|
+
textOrImage: 'text',
|
|
423
421
|
},
|
|
424
422
|
startingIndex: 0,
|
|
425
423
|
flattenedPrompts: '',
|
|
@@ -472,10 +470,7 @@ export default {
|
|
|
472
470
|
}
|
|
473
471
|
let draggedElement = ''
|
|
474
472
|
let target = ''
|
|
475
|
-
if (
|
|
476
|
-
this.mainPrompt.toggle === false ||
|
|
477
|
-
!_.isBoolean(this.mainPrompt.toggle)
|
|
478
|
-
) {
|
|
473
|
+
if (this.mainPrompt.textOrImage === 'text') {
|
|
479
474
|
draggedElement =
|
|
480
475
|
this.block.metadata.config.answerObjects[evt.oldIndex]
|
|
481
476
|
this.block.metadata.config.prompts.forEach((outerElement) => {
|
|
@@ -6,7 +6,31 @@
|
|
|
6
6
|
<p class="mb-0">{{ block.metadata.config.instructions }}</p>
|
|
7
7
|
</v-col>
|
|
8
8
|
</v-row>
|
|
9
|
-
<v-carousel height="
|
|
9
|
+
<v-carousel height="auto">
|
|
10
|
+
<template #prev="{ on, attrs }">
|
|
11
|
+
<v-btn
|
|
12
|
+
variant="elevated"
|
|
13
|
+
color="primary"
|
|
14
|
+
outlined
|
|
15
|
+
fab
|
|
16
|
+
small
|
|
17
|
+
v-bind="attrs"
|
|
18
|
+
v-on="on"
|
|
19
|
+
><v-icon>mdi-chevron-left</v-icon></v-btn
|
|
20
|
+
>
|
|
21
|
+
</template>
|
|
22
|
+
<template #next="{ on, attrs }">
|
|
23
|
+
<v-btn
|
|
24
|
+
variant="elevated"
|
|
25
|
+
color="primary"
|
|
26
|
+
outlined
|
|
27
|
+
fab
|
|
28
|
+
small
|
|
29
|
+
v-bind="attrs"
|
|
30
|
+
v-on="on"
|
|
31
|
+
><v-icon>mdi-chevron-right</v-icon></v-btn
|
|
32
|
+
>
|
|
33
|
+
</template>
|
|
10
34
|
<v-carousel-item
|
|
11
35
|
v-for="question in block.metadata.config.questions"
|
|
12
36
|
:key="question.id"
|
|
@@ -14,7 +38,7 @@
|
|
|
14
38
|
<v-col class="d-flex justify-center">
|
|
15
39
|
<p>{{ question.body }}</p>
|
|
16
40
|
</v-col>
|
|
17
|
-
<v-container :key="updateKey">
|
|
41
|
+
<v-container :key="updateKey" class="pl-16 pr-16">
|
|
18
42
|
<v-row
|
|
19
43
|
v-for="answer in question.answer_options"
|
|
20
44
|
:key="answer.id"
|
|
@@ -72,7 +96,7 @@
|
|
|
72
96
|
<v-row class="d-flex justify-center">
|
|
73
97
|
<v-btn
|
|
74
98
|
color="primary"
|
|
75
|
-
|
|
99
|
+
text
|
|
76
100
|
class="mr-4 btn-hint"
|
|
77
101
|
@click="onHint(question)"
|
|
78
102
|
>{{
|
|
@@ -83,7 +107,7 @@
|
|
|
83
107
|
>
|
|
84
108
|
<v-btn
|
|
85
109
|
color="primary"
|
|
86
|
-
|
|
110
|
+
text
|
|
87
111
|
:disabled="
|
|
88
112
|
question.answer_options.length !== 4 ||
|
|
89
113
|
question.fiftyFifty
|
|
@@ -98,7 +122,7 @@
|
|
|
98
122
|
>
|
|
99
123
|
</v-row>
|
|
100
124
|
</v-col>
|
|
101
|
-
<v-layout
|
|
125
|
+
<v-layout>
|
|
102
126
|
<v-flex xs4></v-flex>
|
|
103
127
|
<v-flex xs4>
|
|
104
128
|
<v-col align="center" tabindex="0">
|
|
@@ -120,7 +144,7 @@
|
|
|
120
144
|
</v-flex>
|
|
121
145
|
<v-flex xs4></v-flex>
|
|
122
146
|
</v-layout>
|
|
123
|
-
<v-layout
|
|
147
|
+
<v-layout v-if="mountCourseCounter" class="mb-6">
|
|
124
148
|
<v-flex xs8></v-flex>
|
|
125
149
|
<v-flex xs4>
|
|
126
150
|
<v-col>
|
|
@@ -182,11 +206,11 @@
|
|
|
182
206
|
</v-container>
|
|
183
207
|
</template>
|
|
184
208
|
<script>
|
|
185
|
-
import BaseContentBlock from '~/components/Content/Blocks/BaseContentBlock'
|
|
186
|
-
import DialogBox from '~/components/DialogBox.vue'
|
|
187
209
|
import _ from 'lodash'
|
|
188
210
|
import Crypto from '~/helpers/Crypto'
|
|
189
211
|
import { mapGetters } from 'vuex'
|
|
212
|
+
import BaseContentBlock from '~/components/Content/Blocks/BaseContentBlock'
|
|
213
|
+
import DialogBox from '~/components/Core/DialogBox.vue'
|
|
190
214
|
import UserContentBlockState from '~/models/UserContentBlockState'
|
|
191
215
|
import ContentBlock from '~/models/ContentBlock'
|
|
192
216
|
import Course from '~/models/Course'
|
|
@@ -266,9 +290,9 @@ export default {
|
|
|
266
290
|
},
|
|
267
291
|
},
|
|
268
292
|
mounted() {
|
|
269
|
-
this.mountCourseCounter = false
|
|
293
|
+
//this.mountCourseCounter = false
|
|
270
294
|
this.onAmountCorrect()
|
|
271
|
-
this.onTotalAmountOfQuestions()
|
|
295
|
+
//this.onTotalAmountOfQuestions()
|
|
272
296
|
},
|
|
273
297
|
methods: {
|
|
274
298
|
async onAmountCorrect() {
|
|
@@ -13,6 +13,7 @@
|
|
|
13
13
|
rows="2"
|
|
14
14
|
:rules="validation.textRules"
|
|
15
15
|
prepend-inner-icon="mdi-help"
|
|
16
|
+
:disabled="disabled"
|
|
16
17
|
></v-textarea>
|
|
17
18
|
<v-textarea
|
|
18
19
|
v-model="question.hint"
|
|
@@ -24,6 +25,7 @@
|
|
|
24
25
|
rows="2"
|
|
25
26
|
:rules="validation.textRules"
|
|
26
27
|
prepend-inner-icon="mdi-lightbulb-on-10"
|
|
28
|
+
:disabled="disabled"
|
|
27
29
|
></v-textarea>
|
|
28
30
|
<v-textarea
|
|
29
31
|
v-model="question.answer_description"
|
|
@@ -35,6 +37,7 @@
|
|
|
35
37
|
rows="2"
|
|
36
38
|
:rules="validation.textRules"
|
|
37
39
|
prepend-inner-icon="mdi-comment"
|
|
40
|
+
:disabled="disabled"
|
|
38
41
|
></v-textarea>
|
|
39
42
|
<br />
|
|
40
43
|
<h4 class="pb-2">
|
|
@@ -67,18 +70,19 @@
|
|
|
67
70
|
<v-radio-group v-model="question.correctAnswer">
|
|
68
71
|
<v-radio
|
|
69
72
|
:ref="'checkbox' + index"
|
|
70
|
-
v-on:keydown.enter="onSetAnswer(answer, true)"
|
|
71
73
|
:value="answer.id"
|
|
74
|
+
:disabled="disabled"
|
|
75
|
+
v-on:keydown.enter="onSetAnswer(answer, true)"
|
|
72
76
|
@click="onSetAnswer(answer)"
|
|
73
77
|
></v-radio>
|
|
74
78
|
</v-radio-group>
|
|
75
79
|
</v-col>
|
|
76
80
|
<v-col cols="12" md="10">
|
|
77
81
|
<v-textarea
|
|
82
|
+
v-model="answer.value"
|
|
78
83
|
flat
|
|
79
84
|
solo
|
|
80
85
|
:autofocus="answer.focus"
|
|
81
|
-
v-model="answer.value"
|
|
82
86
|
:outlined="setOutline(answer)"
|
|
83
87
|
hide-details
|
|
84
88
|
:class="getCorrectAnswer(answer)"
|
|
@@ -89,43 +93,43 @@
|
|
|
89
93
|
"
|
|
90
94
|
rows="2"
|
|
91
95
|
:rules="validation.textRules"
|
|
96
|
+
:disabled="disabled"
|
|
92
97
|
></v-textarea>
|
|
93
98
|
</v-col>
|
|
94
|
-
<v-col
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
99
|
+
<v-col cols="12" md="1" class="d-flex justify-center">
|
|
100
|
+
<v-btn
|
|
101
|
+
text
|
|
102
|
+
:disabled="disabled"
|
|
103
|
+
@click="onDelete(index)"
|
|
104
|
+
>
|
|
105
|
+
<v-icon color="error">mdi-delete-outline</v-icon>
|
|
106
|
+
<span class="d-sr-only">{{
|
|
107
|
+
$t('shared.forms.delete')
|
|
108
|
+
}}</span>
|
|
109
|
+
</v-btn>
|
|
103
110
|
</v-col>
|
|
104
111
|
</v-row>
|
|
105
112
|
</v-container>
|
|
106
113
|
<v-container class="d-flex justify-center" v-if="overLength">
|
|
107
|
-
<
|
|
108
|
-
@mouseover="onHover"
|
|
109
|
-
@mouseleave="onHoverLeave"
|
|
110
|
-
@click="onAddAnswer"
|
|
111
|
-
v-on:keyup.enter="onAddAnswer"
|
|
112
|
-
class="fullWidth"
|
|
114
|
+
<v-btn
|
|
113
115
|
:class="cursor"
|
|
114
|
-
|
|
116
|
+
color="primary"
|
|
117
|
+
:disabled="disabled"
|
|
118
|
+
@click="onAddAnswer"
|
|
115
119
|
>
|
|
116
|
-
<v-icon
|
|
120
|
+
<v-icon>mdi-plus</v-icon>
|
|
117
121
|
{{
|
|
118
122
|
$t(
|
|
119
123
|
'windward.games.components.settings.multiple_choice.add_answer'
|
|
120
124
|
)
|
|
121
125
|
}}
|
|
122
|
-
</
|
|
126
|
+
</v-btn>
|
|
123
127
|
</v-container>
|
|
124
128
|
</v-row>
|
|
125
129
|
</v-form>
|
|
126
130
|
</template>
|
|
127
131
|
<script>
|
|
128
|
-
import Form from '~/components/Form'
|
|
132
|
+
import Form from '~/components/Core/Form'
|
|
129
133
|
import _ from 'lodash'
|
|
130
134
|
import Crypto from '~/helpers/Crypto'
|
|
131
135
|
export default {
|
|
@@ -157,8 +157,7 @@
|
|
|
157
157
|
v-if="editMode"
|
|
158
158
|
@click="addChoice"
|
|
159
159
|
class="ma-1 pa-5 justify-start"
|
|
160
|
-
color="
|
|
161
|
-
outlined
|
|
160
|
+
color="error"
|
|
162
161
|
>
|
|
163
162
|
{{
|
|
164
163
|
$tc(
|
|
@@ -212,7 +211,7 @@
|
|
|
212
211
|
</template>
|
|
213
212
|
|
|
214
213
|
<script>
|
|
215
|
-
import DialogBox from '~/components/DialogBox.vue'
|
|
214
|
+
import DialogBox from '~/components/Core/DialogBox.vue'
|
|
216
215
|
import { MathHelper } from '@windward/core/utils'
|
|
217
216
|
import TextEditor from '~/components/Text/TextEditor.vue'
|
|
218
217
|
import TextViewer from '~/components/Text/TextViewer.vue'
|
|
@@ -16,8 +16,9 @@
|
|
|
16
16
|
)
|
|
17
17
|
"
|
|
18
18
|
@click="expand"
|
|
19
|
+
text
|
|
19
20
|
>
|
|
20
|
-
<v-icon>mdi-arrow-expand-all</v-icon>
|
|
21
|
+
<v-icon color="primary">mdi-arrow-expand-all</v-icon>
|
|
21
22
|
</v-btn>
|
|
22
23
|
</v-toolbar>
|
|
23
24
|
<vue-excel-editor v-model="jsondata" @update="emitData" filter-row>
|
|
@@ -217,7 +218,7 @@
|
|
|
217
218
|
</template>
|
|
218
219
|
|
|
219
220
|
<script>
|
|
220
|
-
import DialogBox from '~/components/DialogBox.vue'
|
|
221
|
+
import DialogBox from '~/components/Core/DialogBox.vue'
|
|
221
222
|
import VueExcelEditor from 'vue-excel-editor/src/VueExcelEditor'
|
|
222
223
|
import VueExcelColumn from 'vue-excel-editor/src/VueExcelColumn'
|
|
223
224
|
import _ from 'lodash'
|
|
@@ -18,6 +18,30 @@
|
|
|
18
18
|
v-model="block.metadata.config.currentWord"
|
|
19
19
|
@change="onSlideChanged($event)"
|
|
20
20
|
>
|
|
21
|
+
<template #prev="{ on, attrs }">
|
|
22
|
+
<v-btn
|
|
23
|
+
variant="elevated"
|
|
24
|
+
color="primary"
|
|
25
|
+
outlined
|
|
26
|
+
fab
|
|
27
|
+
small
|
|
28
|
+
v-bind="attrs"
|
|
29
|
+
v-on="on"
|
|
30
|
+
><v-icon>mdi-chevron-left</v-icon></v-btn
|
|
31
|
+
>
|
|
32
|
+
</template>
|
|
33
|
+
<template #next="{ on, attrs }">
|
|
34
|
+
<v-btn
|
|
35
|
+
variant="elevated"
|
|
36
|
+
color="primary"
|
|
37
|
+
outlined
|
|
38
|
+
fab
|
|
39
|
+
small
|
|
40
|
+
v-bind="attrs"
|
|
41
|
+
v-on="on"
|
|
42
|
+
><v-icon>mdi-chevron-right</v-icon></v-btn
|
|
43
|
+
>
|
|
44
|
+
</template>
|
|
21
45
|
<v-carousel-item
|
|
22
46
|
v-for="(word, index) in block.metadata.config.words"
|
|
23
47
|
:key="index"
|
|
@@ -117,7 +141,7 @@
|
|
|
117
141
|
<keyboard
|
|
118
142
|
v-if="!showFeedback"
|
|
119
143
|
:key="index"
|
|
120
|
-
:keyboardClass="keyBoardClass + index"
|
|
144
|
+
:keyboardClass="keyBoardClass + '-' + index"
|
|
121
145
|
@onChange="onChange"
|
|
122
146
|
@onKeyPress="onKeyPress"
|
|
123
147
|
:input="input"
|
|
@@ -128,7 +152,9 @@
|
|
|
128
152
|
v-if="showFeedback"
|
|
129
153
|
>
|
|
130
154
|
<v-btn
|
|
131
|
-
color="primary
|
|
155
|
+
color="primary"
|
|
156
|
+
class="ml-4"
|
|
157
|
+
outlined
|
|
132
158
|
@click="onRevealAnswer"
|
|
133
159
|
>{{
|
|
134
160
|
$t(
|
|
@@ -137,7 +163,9 @@
|
|
|
137
163
|
}}</v-btn
|
|
138
164
|
>
|
|
139
165
|
<v-btn
|
|
140
|
-
color="primary
|
|
166
|
+
color="primary"
|
|
167
|
+
class="ml-4"
|
|
168
|
+
outlined
|
|
141
169
|
@click="onSlideChanged(index)"
|
|
142
170
|
>{{
|
|
143
171
|
$t(
|