@windward/games 0.2.2 → 0.4.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/CrudTable.vue +8 -4
- package/components/content/DatableEditor.vue +1 -0
- package/components/content/blocks/crosswordPuzzle/CrosswordPuzzle.vue +2 -1
- package/components/content/blocks/dragDrop/BucketGame.vue +4 -3
- package/components/content/blocks/dragDrop/SortingGame.vue +37 -28
- package/components/content/blocks/flashcards/CardFace.vue +48 -9
- package/components/content/blocks/flashcards/Flashcard.vue +26 -17
- package/components/content/blocks/flashcards/FlashcardSlides.vue +10 -5
- package/components/content/blocks/matchingGame/MatchingGame.vue +76 -50
- package/components/content/blocks/multipleChoice/MultipleChoice.vue +13 -9
- package/components/content/blocks/multipleChoice/QuestionDialog.vue +27 -13
- package/components/content/blocks/quizshowGame/AnswerPanel.vue +2 -1
- package/components/content/blocks/quizshowGame/Gridview.vue +2 -1
- package/components/content/blocks/quizshowGame/QuizShow.vue +5 -2
- package/components/content/blocks/sevenStrikes/SevenStikes.vue +8 -2
- package/components/content/blocks/slideshow/SlideShow.vue +31 -22
- package/components/content/blocks/wordJumble/WordJumble.vue +8 -2
- package/components/settings/BucketGameSettingsManager.vue +25 -5
- package/components/settings/CrosswordPuzzleSettingsManager.vue +20 -10
- package/components/settings/FlashCardSlidesManager.vue +194 -115
- package/components/settings/MatchingGameManager.vue +57 -8
- package/components/settings/MultipleChoiceSettingsManager.vue +33 -77
- package/components/settings/QuizShowSettingsManager.vue +22 -11
- package/components/settings/SevenStrikesSettingsManager.vue +17 -5
- package/components/settings/SlideShowManager.vue +46 -15
- package/components/settings/SortingGameSettingsManager.vue +19 -8
- package/components/settings/WordJumbleSettingsManager.vue +22 -10
- package/i18n/en-US/components/content/blocks/slideshow.ts +1 -3
- package/i18n/en-US/components/settings/seven_strikes.ts +1 -1
- package/i18n/es-ES/components/content/blocks/slideshow.ts +0 -2
- package/i18n/es-ES/components/settings/seven_strikes.ts +1 -1
- package/i18n/sv-SE/components/content/blocks/slideshow.ts +0 -2
- package/i18n/sv-SE/components/settings/seven_strikes.ts +1 -1
- package/jest.config.js +0 -1
- package/package.json +2 -2
- package/test/__mocks__/componentsMock.js +3 -1
- package/test/__mocks__/modelMock.js +13 -84
- package/test/blocks/flashcards/CardFace.spec.js +2 -0
- package/test/blocks/flashcards/Flashcard.spec.js +1 -0
- package/test/blocks/multipleChoice/MultipleChoice.spec.js +1 -1
- package/test/settings/WordJumbleManager.spec.js +3 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div>
|
|
3
3
|
<div>
|
|
4
|
-
<
|
|
4
|
+
<h2
|
|
5
5
|
:aria-label="
|
|
6
6
|
$t(
|
|
7
7
|
'windward.games.components.content.blocks.matching_game.match_game_title'
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
tabindex="0"
|
|
11
11
|
>
|
|
12
12
|
{{ block.metadata.config.title }}
|
|
13
|
-
</
|
|
13
|
+
</h2>
|
|
14
14
|
|
|
15
15
|
<p tabindex="0">
|
|
16
16
|
{{ block.metadata.config.instructions }}
|
|
@@ -38,6 +38,7 @@
|
|
|
38
38
|
<v-btn
|
|
39
39
|
v-if="status === 'successOutline'"
|
|
40
40
|
class="success mr-5"
|
|
41
|
+
elevation="0"
|
|
41
42
|
@click="onContinueGame"
|
|
42
43
|
>{{ $t('shared.forms.continue') }}
|
|
43
44
|
</v-btn>
|
|
@@ -124,7 +125,7 @@
|
|
|
124
125
|
>
|
|
125
126
|
<v-card-text>
|
|
126
127
|
<draggable
|
|
127
|
-
v-if="mainPrompt
|
|
128
|
+
v-if="mainPrompt.file"
|
|
128
129
|
class="dragArea list-group"
|
|
129
130
|
:key="mainPrompt['prompt']"
|
|
130
131
|
v-bind="dragOptions"
|
|
@@ -132,25 +133,26 @@
|
|
|
132
133
|
group="people"
|
|
133
134
|
tabindex="0"
|
|
134
135
|
>
|
|
135
|
-
<div
|
|
136
|
-
:id="
|
|
137
|
-
mainPrompt['file']['asset'][
|
|
138
|
-
'public_url'
|
|
139
|
-
]
|
|
140
|
-
"
|
|
141
|
-
>
|
|
136
|
+
<div :id="mainPrompt.file.id">
|
|
142
137
|
<v-img
|
|
143
|
-
v-if="mainPrompt['file']"
|
|
144
138
|
:aria-describedby="
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
139
|
+
getFileAriaDescribedBy(
|
|
140
|
+
mainPrompt.file,
|
|
141
|
+
mainPrompt[
|
|
142
|
+
'ariaDescribedBy'
|
|
143
|
+
]
|
|
144
|
+
)
|
|
145
|
+
"
|
|
146
|
+
:alt="
|
|
147
|
+
getFileAlt(
|
|
148
|
+
mainPrompt.file,
|
|
149
|
+
mainPrompt['altText']
|
|
150
|
+
)
|
|
148
151
|
"
|
|
149
|
-
:alt="mainPrompt['altText']"
|
|
150
152
|
:src="
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
153
|
+
getFilePublicUrl(
|
|
154
|
+
mainPrompt.file
|
|
155
|
+
)
|
|
154
156
|
"
|
|
155
157
|
></v-img>
|
|
156
158
|
</div>
|
|
@@ -232,36 +234,45 @@
|
|
|
232
234
|
:id="
|
|
233
235
|
block.metadata.config.prompts[
|
|
234
236
|
startingIndex
|
|
235
|
-
][startingIndex].file.
|
|
236
|
-
.public_url
|
|
237
|
+
][startingIndex].file.id
|
|
237
238
|
"
|
|
238
239
|
>
|
|
239
240
|
<v-img
|
|
240
|
-
v-if="
|
|
241
|
-
block.metadata.config
|
|
242
|
-
.prompts[startingIndex][
|
|
243
|
-
startingIndex
|
|
244
|
-
]['file']
|
|
245
|
-
"
|
|
246
241
|
:aria-describedby="
|
|
247
|
-
|
|
248
|
-
.
|
|
249
|
-
|
|
250
|
-
|
|
242
|
+
getFileAriaDescribedBy(
|
|
243
|
+
block.metadata.config
|
|
244
|
+
.prompts[
|
|
245
|
+
startingIndex
|
|
246
|
+
][startingIndex].file,
|
|
247
|
+
block.metadata.config
|
|
248
|
+
.prompts[
|
|
249
|
+
startingIndex
|
|
250
|
+
][startingIndex][
|
|
251
|
+
'ariaDescribedBy'
|
|
252
|
+
]
|
|
253
|
+
)
|
|
251
254
|
"
|
|
252
255
|
:alt="
|
|
253
|
-
|
|
254
|
-
.
|
|
255
|
-
|
|
256
|
-
|
|
256
|
+
getFileAlt(
|
|
257
|
+
block.metadata.config
|
|
258
|
+
.prompts[
|
|
259
|
+
startingIndex
|
|
260
|
+
][startingIndex].file,
|
|
261
|
+
block.metadata.config
|
|
262
|
+
.prompts[
|
|
263
|
+
startingIndex
|
|
264
|
+
][startingIndex][
|
|
265
|
+
'altText'
|
|
266
|
+
]
|
|
267
|
+
)
|
|
257
268
|
"
|
|
258
269
|
:src="
|
|
259
|
-
|
|
260
|
-
.
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
270
|
+
getFilePublicUrl(
|
|
271
|
+
block.metadata.config
|
|
272
|
+
.prompts[
|
|
273
|
+
startingIndex
|
|
274
|
+
][startingIndex].file
|
|
275
|
+
)
|
|
265
276
|
"
|
|
266
277
|
></v-img>
|
|
267
278
|
</div>
|
|
@@ -312,6 +323,7 @@
|
|
|
312
323
|
<v-btn
|
|
313
324
|
color="primary"
|
|
314
325
|
outlined
|
|
326
|
+
elevation="0"
|
|
315
327
|
@click="onReset"
|
|
316
328
|
>{{
|
|
317
329
|
$t(
|
|
@@ -410,12 +422,7 @@ export default {
|
|
|
410
422
|
mainPrompt: {
|
|
411
423
|
altText: '',
|
|
412
424
|
answer: {},
|
|
413
|
-
file:
|
|
414
|
-
asset: {
|
|
415
|
-
public_url: '',
|
|
416
|
-
},
|
|
417
|
-
name: '',
|
|
418
|
-
},
|
|
425
|
+
file: null,
|
|
419
426
|
prompt: '',
|
|
420
427
|
textOrImage: 'text',
|
|
421
428
|
},
|
|
@@ -489,10 +496,7 @@ export default {
|
|
|
489
496
|
this.block.metadata.config.answerObjects[evt.oldIndex]
|
|
490
497
|
this.block.metadata.config.prompts.forEach((outerElement) => {
|
|
491
498
|
const mainElement = outerElement.find((element) => {
|
|
492
|
-
return
|
|
493
|
-
element.file?.asset.public_url ==
|
|
494
|
-
evt.to.firstElementChild.id
|
|
495
|
-
)
|
|
499
|
+
return element.file?.id == evt.to.firstElementChild.id
|
|
496
500
|
})
|
|
497
501
|
if (mainElement) {
|
|
498
502
|
target = mainElement
|
|
@@ -550,6 +554,28 @@ export default {
|
|
|
550
554
|
)
|
|
551
555
|
this.setMainPrompt()
|
|
552
556
|
},
|
|
557
|
+
getFileAlt(file, defaultText = '') {
|
|
558
|
+
// If a default / override was defined
|
|
559
|
+
if (defaultText) {
|
|
560
|
+
return defaultText
|
|
561
|
+
}
|
|
562
|
+
|
|
563
|
+
file = this.resolveAsset(file)
|
|
564
|
+
return _.get(file, 'asset.metadata.props.alt', '')
|
|
565
|
+
},
|
|
566
|
+
getFileAriaDescribedBy(file, defaultText = '') {
|
|
567
|
+
// If a default / override was defined
|
|
568
|
+
if (defaultText) {
|
|
569
|
+
return defaultText
|
|
570
|
+
}
|
|
571
|
+
|
|
572
|
+
file = this.resolveAsset(file)
|
|
573
|
+
return _.get(file, 'asset.metadata.props.aria_describedby', '')
|
|
574
|
+
},
|
|
575
|
+
getFilePublicUrl(file) {
|
|
576
|
+
file = this.resolveAsset(file)
|
|
577
|
+
return _.get(file, 'asset.public_url', '')
|
|
578
|
+
},
|
|
553
579
|
},
|
|
554
580
|
}
|
|
555
581
|
</script>
|
|
@@ -2,15 +2,16 @@
|
|
|
2
2
|
<v-container>
|
|
3
3
|
<v-row>
|
|
4
4
|
<v-col>
|
|
5
|
-
<
|
|
5
|
+
<h2>{{ block.metadata.config.title }}</h2>
|
|
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
10
|
<template #prev="{ on, attrs }">
|
|
11
11
|
<v-btn
|
|
12
12
|
variant="elevated"
|
|
13
13
|
color="primary"
|
|
14
|
+
elevation="0"
|
|
14
15
|
outlined
|
|
15
16
|
fab
|
|
16
17
|
small
|
|
@@ -23,6 +24,7 @@
|
|
|
23
24
|
<v-btn
|
|
24
25
|
variant="elevated"
|
|
25
26
|
color="primary"
|
|
27
|
+
elevation="0"
|
|
26
28
|
outlined
|
|
27
29
|
fab
|
|
28
30
|
small
|
|
@@ -38,7 +40,7 @@
|
|
|
38
40
|
<v-col class="d-flex justify-center">
|
|
39
41
|
<p>{{ question.body }}</p>
|
|
40
42
|
</v-col>
|
|
41
|
-
<v-container :key="updateKey">
|
|
43
|
+
<v-container :key="updateKey" class="pl-16 pr-16">
|
|
42
44
|
<v-row
|
|
43
45
|
v-for="answer in question.answer_options"
|
|
44
46
|
:key="answer.id"
|
|
@@ -97,6 +99,7 @@
|
|
|
97
99
|
<v-btn
|
|
98
100
|
color="primary"
|
|
99
101
|
text
|
|
102
|
+
elevation="0"
|
|
100
103
|
class="mr-4 btn-hint"
|
|
101
104
|
@click="onHint(question)"
|
|
102
105
|
>{{
|
|
@@ -108,6 +111,7 @@
|
|
|
108
111
|
<v-btn
|
|
109
112
|
color="primary"
|
|
110
113
|
text
|
|
114
|
+
elevation="0"
|
|
111
115
|
:disabled="
|
|
112
116
|
question.answer_options.length !== 4 ||
|
|
113
117
|
question.fiftyFifty
|
|
@@ -122,7 +126,7 @@
|
|
|
122
126
|
>
|
|
123
127
|
</v-row>
|
|
124
128
|
</v-col>
|
|
125
|
-
<v-layout
|
|
129
|
+
<v-layout>
|
|
126
130
|
<v-flex xs4></v-flex>
|
|
127
131
|
<v-flex xs4>
|
|
128
132
|
<v-col align="center" tabindex="0">
|
|
@@ -144,7 +148,7 @@
|
|
|
144
148
|
</v-flex>
|
|
145
149
|
<v-flex xs4></v-flex>
|
|
146
150
|
</v-layout>
|
|
147
|
-
<v-layout
|
|
151
|
+
<v-layout v-if="mountCourseCounter" class="mb-6">
|
|
148
152
|
<v-flex xs8></v-flex>
|
|
149
153
|
<v-flex xs4>
|
|
150
154
|
<v-col>
|
|
@@ -206,11 +210,11 @@
|
|
|
206
210
|
</v-container>
|
|
207
211
|
</template>
|
|
208
212
|
<script>
|
|
209
|
-
import BaseContentBlock from '~/components/Content/Blocks/BaseContentBlock'
|
|
210
|
-
import DialogBox from '~/components/DialogBox.vue'
|
|
211
213
|
import _ from 'lodash'
|
|
212
214
|
import Crypto from '~/helpers/Crypto'
|
|
213
215
|
import { mapGetters } from 'vuex'
|
|
216
|
+
import BaseContentBlock from '~/components/Content/Blocks/BaseContentBlock'
|
|
217
|
+
import DialogBox from '~/components/Core/DialogBox.vue'
|
|
214
218
|
import UserContentBlockState from '~/models/UserContentBlockState'
|
|
215
219
|
import ContentBlock from '~/models/ContentBlock'
|
|
216
220
|
import Course from '~/models/Course'
|
|
@@ -290,9 +294,9 @@ export default {
|
|
|
290
294
|
},
|
|
291
295
|
},
|
|
292
296
|
mounted() {
|
|
293
|
-
this.mountCourseCounter = false
|
|
297
|
+
//this.mountCourseCounter = false
|
|
294
298
|
this.onAmountCorrect()
|
|
295
|
-
this.onTotalAmountOfQuestions()
|
|
299
|
+
//this.onTotalAmountOfQuestions()
|
|
296
300
|
},
|
|
297
301
|
methods: {
|
|
298
302
|
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,22 +93,32 @@
|
|
|
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
|
+
elevation="0"
|
|
103
|
+
:disabled="disabled"
|
|
104
|
+
@click="onDelete(index)"
|
|
105
|
+
>
|
|
106
|
+
<v-icon color="error">mdi-delete-outline</v-icon>
|
|
107
|
+
<span class="d-sr-only">{{
|
|
108
|
+
$t('shared.forms.delete')
|
|
109
|
+
}}</span>
|
|
110
|
+
</v-btn>
|
|
103
111
|
</v-col>
|
|
104
112
|
</v-row>
|
|
105
113
|
</v-container>
|
|
106
114
|
<v-container class="d-flex justify-center" v-if="overLength">
|
|
107
|
-
<v-btn
|
|
115
|
+
<v-btn
|
|
116
|
+
:class="cursor"
|
|
117
|
+
color="primary"
|
|
118
|
+
elevation="0"
|
|
119
|
+
:disabled="disabled"
|
|
120
|
+
@click="onAddAnswer"
|
|
121
|
+
>
|
|
108
122
|
<v-icon>mdi-plus</v-icon>
|
|
109
123
|
{{
|
|
110
124
|
$t(
|
|
@@ -117,7 +131,7 @@
|
|
|
117
131
|
</v-form>
|
|
118
132
|
</template>
|
|
119
133
|
<script>
|
|
120
|
-
import Form from '~/components/Form'
|
|
134
|
+
import Form from '~/components/Core/Form'
|
|
121
135
|
import _ from 'lodash'
|
|
122
136
|
import Crypto from '~/helpers/Crypto'
|
|
123
137
|
export default {
|
|
@@ -156,6 +156,7 @@
|
|
|
156
156
|
<v-btn
|
|
157
157
|
v-if="editMode"
|
|
158
158
|
@click="addChoice"
|
|
159
|
+
elevation="0"
|
|
159
160
|
class="ma-1 pa-5 justify-start"
|
|
160
161
|
color="error"
|
|
161
162
|
>
|
|
@@ -211,7 +212,7 @@
|
|
|
211
212
|
</template>
|
|
212
213
|
|
|
213
214
|
<script>
|
|
214
|
-
import DialogBox from '~/components/DialogBox.vue'
|
|
215
|
+
import DialogBox from '~/components/Core/DialogBox.vue'
|
|
215
216
|
import { MathHelper } from '@windward/core/utils'
|
|
216
217
|
import TextEditor from '~/components/Text/TextEditor.vue'
|
|
217
218
|
import TextViewer from '~/components/Text/TextViewer.vue'
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
<v-spacer></v-spacer>
|
|
11
11
|
<v-btn
|
|
12
12
|
icon
|
|
13
|
+
elevation="0"
|
|
13
14
|
:aria-label="
|
|
14
15
|
$t(
|
|
15
16
|
'windward.games.components.content.blocks.quizshow_game.expand_button'
|
|
@@ -218,7 +219,7 @@
|
|
|
218
219
|
</template>
|
|
219
220
|
|
|
220
221
|
<script>
|
|
221
|
-
import DialogBox from '~/components/DialogBox.vue'
|
|
222
|
+
import DialogBox from '~/components/Core/DialogBox.vue'
|
|
222
223
|
import VueExcelEditor from 'vue-excel-editor/src/VueExcelEditor'
|
|
223
224
|
import VueExcelColumn from 'vue-excel-editor/src/VueExcelColumn'
|
|
224
225
|
import _ from 'lodash'
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
></v-switch>
|
|
13
13
|
<div v-if="!tableMode">
|
|
14
14
|
<div>
|
|
15
|
-
<
|
|
15
|
+
<h2
|
|
16
16
|
:aria-label="
|
|
17
17
|
$t(
|
|
18
18
|
'windward.games.components.content.blocks.quizshow_game.title'
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
tabindex="0"
|
|
22
22
|
>
|
|
23
23
|
{{ title }}
|
|
24
|
-
</
|
|
24
|
+
</h2>
|
|
25
25
|
|
|
26
26
|
<p tabindex="0">
|
|
27
27
|
<TextViewer v-model="block.metadata.config.instructions" />
|
|
@@ -67,6 +67,7 @@
|
|
|
67
67
|
<v-row align="center" justify="center">
|
|
68
68
|
<v-btn
|
|
69
69
|
outlined
|
|
70
|
+
elevation="0"
|
|
70
71
|
:color="
|
|
71
72
|
getButtonColor(cat_index, point_index)
|
|
72
73
|
"
|
|
@@ -143,6 +144,7 @@
|
|
|
143
144
|
<v-btn
|
|
144
145
|
class="text-capitalize"
|
|
145
146
|
color="primary"
|
|
147
|
+
elevation="0"
|
|
146
148
|
@click="show = !show"
|
|
147
149
|
outlined
|
|
148
150
|
>
|
|
@@ -162,6 +164,7 @@
|
|
|
162
164
|
>
|
|
163
165
|
<v-btn
|
|
164
166
|
outlined
|
|
167
|
+
elevation="0"
|
|
165
168
|
class="text-capitalize"
|
|
166
169
|
color="primary"
|
|
167
170
|
@click="resetGame"
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div>
|
|
3
3
|
<v-col class="pa-0">
|
|
4
|
-
<
|
|
4
|
+
<h2>
|
|
5
5
|
{{
|
|
6
6
|
block.metadata.config.title
|
|
7
7
|
? block.metadata.config.title
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
'windward.games.components.content.blocks.seven_strikes.title'
|
|
10
10
|
)
|
|
11
11
|
}}
|
|
12
|
-
</
|
|
12
|
+
</h2>
|
|
13
13
|
<p>{{ block.metadata.config.instructions }}</p>
|
|
14
14
|
</v-col>
|
|
15
15
|
<v-col class="pa-0">
|
|
@@ -22,6 +22,7 @@
|
|
|
22
22
|
<v-btn
|
|
23
23
|
variant="elevated"
|
|
24
24
|
color="primary"
|
|
25
|
+
elevation="0"
|
|
25
26
|
outlined
|
|
26
27
|
fab
|
|
27
28
|
small
|
|
@@ -34,6 +35,7 @@
|
|
|
34
35
|
<v-btn
|
|
35
36
|
variant="elevated"
|
|
36
37
|
color="primary"
|
|
38
|
+
elevation="0"
|
|
37
39
|
outlined
|
|
38
40
|
fab
|
|
39
41
|
small
|
|
@@ -76,6 +78,7 @@
|
|
|
76
78
|
"
|
|
77
79
|
class="mr-5"
|
|
78
80
|
color="success"
|
|
81
|
+
elevation="0"
|
|
79
82
|
@click="onChangeSlide(index + 1)"
|
|
80
83
|
>{{ $t('shared.forms.continue') }}
|
|
81
84
|
</v-btn>
|
|
@@ -155,6 +158,7 @@
|
|
|
155
158
|
color="primary"
|
|
156
159
|
class="ml-4"
|
|
157
160
|
outlined
|
|
161
|
+
elevation="0"
|
|
158
162
|
@click="onRevealAnswer"
|
|
159
163
|
>{{
|
|
160
164
|
$t(
|
|
@@ -166,6 +170,7 @@
|
|
|
166
170
|
color="primary"
|
|
167
171
|
class="ml-4"
|
|
168
172
|
outlined
|
|
173
|
+
elevation="0"
|
|
169
174
|
@click="onSlideChanged(index)"
|
|
170
175
|
>{{
|
|
171
176
|
$t(
|
|
@@ -176,6 +181,7 @@
|
|
|
176
181
|
<v-btn
|
|
177
182
|
@click="onChangeSlide(index + 1)"
|
|
178
183
|
color="primary ml-4"
|
|
184
|
+
elevation="0"
|
|
179
185
|
>{{
|
|
180
186
|
$t(
|
|
181
187
|
'windward.games.components.content.blocks.seven_strikes.next'
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div>
|
|
3
|
-
<div class="header-description">
|
|
4
|
-
<
|
|
3
|
+
<div class="header-description pa-0">
|
|
4
|
+
<h2
|
|
5
5
|
:aria-label="
|
|
6
6
|
$t(
|
|
7
7
|
'windward.games.components.content.blocks.slideshow.slideshow_title'
|
|
@@ -10,18 +10,11 @@
|
|
|
10
10
|
tabindex="0"
|
|
11
11
|
>
|
|
12
12
|
{{ block.metadata.config.title }}
|
|
13
|
-
</
|
|
13
|
+
</h2>
|
|
14
14
|
|
|
15
15
|
<p tabindex="0" class="pt-3">
|
|
16
16
|
{{ block.metadata.config.instructions }}
|
|
17
17
|
</p>
|
|
18
|
-
<p tabindex="0">
|
|
19
|
-
{{
|
|
20
|
-
$t(
|
|
21
|
-
'windward.games.components.content.blocks.slideshow.basic_instructions'
|
|
22
|
-
)
|
|
23
|
-
}}
|
|
24
|
-
</p>
|
|
25
18
|
</div>
|
|
26
19
|
<div>
|
|
27
20
|
<template v-if="block.metadata.config.slides.length !== 0">
|
|
@@ -30,6 +23,7 @@
|
|
|
30
23
|
<v-btn
|
|
31
24
|
variant="elevated"
|
|
32
25
|
color="primary"
|
|
26
|
+
elevation="0"
|
|
33
27
|
outlined
|
|
34
28
|
fab
|
|
35
29
|
small
|
|
@@ -42,6 +36,7 @@
|
|
|
42
36
|
<v-btn
|
|
43
37
|
variant="elevated"
|
|
44
38
|
color="primary"
|
|
39
|
+
elevation="0"
|
|
45
40
|
outlined
|
|
46
41
|
fab
|
|
47
42
|
small
|
|
@@ -57,23 +52,24 @@
|
|
|
57
52
|
>
|
|
58
53
|
<v-carousel-item>
|
|
59
54
|
<div class="fill-height d-flex flex-column">
|
|
60
|
-
<div>
|
|
61
|
-
<
|
|
62
|
-
{{ slide['header'] }}
|
|
63
|
-
</
|
|
55
|
+
<div class="pa-0 ma-0">
|
|
56
|
+
<h4 class="header-description">
|
|
57
|
+
{{ slide['header'] }}
|
|
58
|
+
</h4>
|
|
64
59
|
<p class="header-description">
|
|
65
60
|
{{ slide['description'] }}
|
|
66
61
|
</p>
|
|
67
62
|
</div>
|
|
68
|
-
<div style="overflow: auto">
|
|
63
|
+
<div style="overflow: auto" class="pl-15 pr-15">
|
|
69
64
|
<v-img
|
|
70
|
-
v-if="slide['
|
|
71
|
-
:src="
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
65
|
+
v-if="slide['imageAsset']"
|
|
66
|
+
:src="getImageUrl(slide['imageAsset'])"
|
|
67
|
+
:alt="
|
|
68
|
+
getImageAlt(
|
|
69
|
+
slide['imageAsset'],
|
|
70
|
+
slide['imageAlt']
|
|
71
|
+
)
|
|
75
72
|
"
|
|
76
|
-
:alt="slide['image_alt']"
|
|
77
73
|
height="100%"
|
|
78
74
|
contain
|
|
79
75
|
/>
|
|
@@ -129,7 +125,20 @@ export default {
|
|
|
129
125
|
this.block.metadata.config.currentSlide = 0
|
|
130
126
|
},
|
|
131
127
|
},
|
|
132
|
-
methods: {
|
|
128
|
+
methods: {
|
|
129
|
+
getImageUrl(file) {
|
|
130
|
+
file = this.resolveAsset(file)
|
|
131
|
+
return _.get(file, 'asset.public_url', '')
|
|
132
|
+
},
|
|
133
|
+
getImageAlt(file, defaultText = '') {
|
|
134
|
+
// If a default / override was defined
|
|
135
|
+
if (defaultText) {
|
|
136
|
+
return defaultText
|
|
137
|
+
}
|
|
138
|
+
file = this.resolveAsset(file)
|
|
139
|
+
return _.get(file, 'asset.metadata.props.alt', '')
|
|
140
|
+
},
|
|
141
|
+
},
|
|
133
142
|
}
|
|
134
143
|
</script>
|
|
135
144
|
<style scoped>
|