@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.
Files changed (30) hide show
  1. package/components/content/DatableEditor.vue +1 -1
  2. package/components/content/blocks/crosswordPuzzle/CrosswordPuzzle.vue +1 -0
  3. package/components/content/blocks/dragDrop/BucketGame.vue +2 -2
  4. package/components/content/blocks/dragDrop/SortingGame.vue +38 -36
  5. package/components/content/blocks/flashcards/FlashcardSlides.vue +5 -12
  6. package/components/content/blocks/matchingGame/MatchingGame.vue +8 -13
  7. package/components/content/blocks/multipleChoice/MultipleChoice.vue +34 -10
  8. package/components/content/blocks/multipleChoice/QuestionDialog.vue +25 -21
  9. package/components/content/blocks/quizshowGame/AnswerPanel.vue +2 -3
  10. package/components/content/blocks/quizshowGame/Gridview.vue +3 -2
  11. package/components/content/blocks/sevenStrikes/SevenStikes.vue +31 -3
  12. package/components/content/blocks/slideshow/SlideShow.vue +5 -12
  13. package/components/content/blocks/wordJumble/WordJumble.vue +25 -1
  14. package/components/settings/BucketGameSettingsManager.vue +20 -4
  15. package/components/settings/CrosswordPuzzleSettingsManager.vue +19 -10
  16. package/components/settings/FlashCardSlidesManager.vue +121 -83
  17. package/components/settings/MatchingGameManager.vue +77 -43
  18. package/components/settings/MultipleChoiceSettingsManager.vue +33 -78
  19. package/components/settings/QuizShowSettingsManager.vue +26 -13
  20. package/components/settings/SevenStrikesSettingsManager.vue +16 -5
  21. package/components/settings/SlideShowManager.vue +15 -4
  22. package/components/settings/SortingGameSettingsManager.vue +18 -8
  23. package/components/settings/WordJumbleSettingsManager.vue +21 -10
  24. package/jest.config.js +0 -1
  25. package/package.json +2 -2
  26. package/plugin.js +6 -6
  27. package/test/__mocks__/componentsMock.js +3 -1
  28. package/test/__mocks__/modelMock.js +13 -84
  29. package/test/blocks/multipleChoice/MultipleChoice.spec.js +1 -1
  30. package/test/settings/WordJumbleManager.spec.js +3 -0
package/components/content/blocks/slideshow/SlideShow.vue CHANGED
@@ -30,8 +30,9 @@
30
30
  <v-btn
31
31
  variant="elevated"
32
32
  color="primary"
33
+ outlined
33
34
  fab
34
- class="nav-buttons"
35
+ small
35
36
  v-bind="attrs"
36
37
  v-on="on"
37
38
  ><v-icon>mdi-chevron-left</v-icon></v-btn
@@ -41,8 +42,9 @@
41
42
  <v-btn
42
43
  variant="elevated"
43
44
  color="primary"
45
+ outlined
44
46
  fab
45
- class="nav-buttons"
47
+ small
46
48
  v-bind="attrs"
47
49
  v-on="on"
48
50
  ><v-icon>mdi-chevron-right</v-icon></v-btn
@@ -125,7 +127,7 @@ export default {
125
127
  watch: {
126
128
  render(newValue) {
127
129
  this.block.metadata.config.currentSlide = 0
128
- }
130
+ },
129
131
  },
130
132
  methods: {},
131
133
  }
@@ -165,15 +167,6 @@ export default {
165
167
  .ten {
166
168
  height: 10% !important;
167
169
  }
168
- .nav-buttons {
169
- font-size: 34px;
170
- font-weight: 340;
171
- }
172
- </style>
173
- <style>
174
- .v-carousel__controls {
175
- background: var(--v-primary-base) !important;
176
- }
177
170
  .header-description {
178
171
  padding-left: 75px;
179
172
  padding-right: 75px;
package/components/content/blocks/wordJumble/WordJumble.vue CHANGED
@@ -15,10 +15,33 @@
15
15
  <v-col class="pa-0">
16
16
  <template>
17
17
  <v-carousel
18
- hide-delimiters
19
18
  v-model="block.metadata.config.currentWord"
20
19
  @change="onSlideChanged()"
21
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>
22
45
  <v-carousel-item
23
46
  v-for="(word, index) in block.metadata.config.words"
24
47
  :key="index"
@@ -114,6 +137,7 @@
114
137
  <v-btn
115
138
  :disabled="disableButtons"
116
139
  color="primary"
140
+ outlined
117
141
  @click="onRevealAnswer"
118
142
  >{{
119
143
  $t(
package/components/settings/BucketGameSettingsManager.vue CHANGED
@@ -3,6 +3,7 @@
3
3
  <v-form ref="form" v-model="valid" v-if="!loading">
4
4
  <v-container class="pa-0">
5
5
  <v-text-field
6
+ ref="title"
6
7
  v-model="block.metadata.config.title"
7
8
  outlined
8
9
  :counter="50"
@@ -12,7 +13,7 @@
12
13
  'windward.games.components.settings.bucket_game.form.title'
13
14
  )
14
15
  "
15
- ref="title"
16
+ :disabled="render"
16
17
  ></v-text-field>
17
18
  <v-textarea
18
19
  v-model="block.metadata.config.instructions"
@@ -24,6 +25,7 @@
24
25
  'windward.games.components.settings.bucket_game.form.instructions'
25
26
  )
26
27
  "
28
+ :disabled="render"
27
29
  ></v-textarea>
28
30
  </v-container>
29
31
  <v-divider class="my-4 primary"></v-divider>
@@ -40,6 +42,7 @@
40
42
  @change="onDragged"
41
43
  @click:close="onConfirmDeleteBucket($event)"
42
44
  :copy="false"
45
+ :disabled="render"
43
46
  >
44
47
  <template #header="{ item }">
45
48
  {{
@@ -66,6 +69,7 @@
66
69
  index
67
70
  ].title
68
71
  "
72
+ :disabled="render"
69
73
  ></TextEditor>
70
74
  </v-flex>
71
75
  <v-flex xs12>
@@ -88,6 +92,7 @@
88
92
  show-swatches
89
93
  :swatches="swatches"
90
94
  swatches-max-height="130"
95
+ :disabled="render"
91
96
  ></v-color-picker>
92
97
  </v-flex>
93
98
  <v-flex xs12>
@@ -111,6 +116,7 @@
111
116
  "
112
117
  @click:close="onConfirmDelete($event, index)"
113
118
  :copy="false"
119
+ :disabled="render"
114
120
  >
115
121
  <template #header="{ item }">
116
122
  {{
@@ -138,6 +144,7 @@
138
144
  answerIndex
139
145
  ].display
140
146
  "
147
+ :disabled="render"
141
148
  ></TextEditor>
142
149
  <p class="p-label mb-0">
143
150
  {{
@@ -154,6 +161,7 @@
154
161
  ].display_value
155
162
  "
156
163
  outlined
164
+ :disabled="render"
157
165
  ></v-text-field>
158
166
  <p class="p-label mb-0">
159
167
  {{
@@ -170,6 +178,7 @@
170
178
  ].feedback
171
179
  "
172
180
  outlined
181
+ :disabled="render"
173
182
  ></v-text-field>
174
183
  </v-flex>
175
184
  </v-container>
@@ -179,6 +188,7 @@
179
188
  <v-row justify="center" class="my-4">
180
189
  <v-btn
181
190
  color="primary"
191
+ :disabled="render"
182
192
  @click="onAddBucketAnswer(index)"
183
193
  >
184
194
  <v-icon>mdi-plus</v-icon>
@@ -194,7 +204,11 @@
194
204
  </v-container>
195
205
  <v-container class="pa-0">
196
206
  <v-row justify="center" class="my-4">
197
- <v-btn color="primary" @click="onAddBucket">
207
+ <v-btn
208
+ color="primary"
209
+ :disabled="render"
210
+ @click="onAddBucket"
211
+ >
198
212
  <v-icon>mdi-plus</v-icon>
199
213
  {{
200
214
  $t(
@@ -214,6 +228,7 @@
214
228
  'windward.games.components.settings.bucket_game.form.feedback.correct'
215
229
  )
216
230
  "
231
+ :disabled="render"
217
232
  ></v-textarea>
218
233
  <v-textarea
219
234
  v-model="block.metadata.config.feedback_incorrect"
@@ -225,6 +240,7 @@
225
240
  'windward.games.components.settings.bucket_game.form.feedback.incorrect'
226
241
  )
227
242
  "
243
+ :disabled="render"
228
244
  ></v-textarea>
229
245
  </v-container>
230
246
  </v-form>
@@ -249,8 +265,8 @@ import {
249
265
  import colors from 'vuetify/lib/util/colors'
250
266
  import TextEditor from '~/components/Text/TextEditor'
251
267
  import Crypto from '~/helpers/Crypto'
252
- import BaseContentSettings from '~/components/Content/Tool/BaseContentSettings.js'
253
- import SortableExpansionPanel from '~/components/SortableExpansionPanel.vue'
268
+ import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
269
+ import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
254
270
 
255
271
  export default {
256
272
  name: 'BucketGameSettingsManager',
package/components/settings/CrosswordPuzzleSettingsManager.vue CHANGED
@@ -3,6 +3,7 @@
3
3
  <v-form ref="form" v-model="valid" v-if="!loading">
4
4
  <v-container class="pa-0">
5
5
  <v-text-field
6
+ ref="title"
6
7
  v-model="block.metadata.config.title"
7
8
  :counter="50"
8
9
  outlined
@@ -12,7 +13,7 @@
12
13
  'windward.games.components.settings.bucket_game.form.title'
13
14
  )
14
15
  "
15
- ref="title"
16
+ :disabled="render"
16
17
  ></v-text-field>
17
18
  <v-textarea
18
19
  outlined
@@ -24,6 +25,7 @@
24
25
  'windward.games.components.settings.bucket_game.form.instructions'
25
26
  )
26
27
  "
28
+ :disabled="render"
27
29
  ></v-textarea>
28
30
  </v-container>
29
31
  <v-divider class="my-4 primary"></v-divider>
@@ -44,6 +46,7 @@
44
46
  </p>
45
47
  <SortableExpansionPanel
46
48
  v-model="block.metadata.config.words"
49
+ :disabled="render"
47
50
  @click:close="onDelete($event)"
48
51
  >
49
52
  <template #header="{ item, index }">
@@ -65,14 +68,15 @@
65
68
  }}
66
69
  </p>
67
70
  <v-textarea
71
+ v-model="
72
+ block.metadata.config.words[index].word
73
+ "
68
74
  outlined
69
75
  :counter="20"
70
76
  maxlength="20"
71
77
  :autofocus="true"
72
78
  class="pt-4"
73
- v-model="
74
- block.metadata.config.words[index].word
75
- "
79
+ :disabled="render"
76
80
  ></v-textarea>
77
81
  <p class="p-label mb-0">
78
82
  {{
@@ -82,20 +86,25 @@
82
86
  }}
83
87
  </p>
84
88
  <v-textarea
89
+ v-model="
90
+ block.metadata.config.words[index].clue
91
+ "
85
92
  outlined
86
93
  :counter="155"
87
94
  maxlength="155"
88
95
  class="pt-4"
89
- v-model="
90
- block.metadata.config.words[index].clue
91
- "
96
+ :disabled="render"
92
97
  ></v-textarea>
93
98
  </v-container>
94
99
  </template>
95
100
  </SortableExpansionPanel>
96
101
  <v-container class="pa-0">
97
102
  <v-row justify="center" class="my-4">
98
- <v-btn color="primary" @click="onAddElement">
103
+ <v-btn
104
+ color="primary"
105
+ :disabled="render"
106
+ @click="onAddElement"
107
+ >
99
108
  <v-icon>mdi-plus</v-icon>
100
109
  {{
101
110
  $t(
@@ -120,8 +129,8 @@
120
129
 
121
130
  <script>
122
131
  import _ from 'lodash'
123
- import BaseContentSettings from '~/components/Content/Tool/BaseContentSettings.js'
124
- import SortableExpansionPanel from '~/components/SortableExpansionPanel.vue'
132
+ import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
133
+ import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
125
134
 
126
135
  export default {
127
136
  name: 'CrosswordPuzzleSettingsManager',
package/components/settings/FlashCardSlidesManager.vue CHANGED
@@ -3,6 +3,7 @@
3
3
  <v-form ref="outer-form" v-model="valid" v-if="!loading">
4
4
  <v-container class="pa-0">
5
5
  <v-text-field
6
+ ref="title"
6
7
  v-model="block.metadata.config.title"
7
8
  outlined
8
9
  :counter="50"
@@ -11,17 +12,18 @@
11
12
  'windward.games.components.settings.bucket_game.form.title'
12
13
  )
13
14
  "
14
- ref="title"
15
+ :disabled="render"
15
16
  ></v-text-field>
16
17
  <v-textarea
18
+ v-model="block.metadata.config.instructions"
17
19
  outlined
18
20
  auto-grow
19
- v-model="block.metadata.config.instructions"
20
21
  :label="
21
22
  $t(
22
23
  'windward.games.components.settings.bucket_game.form.instructions'
23
24
  )
24
25
  "
26
+ :disabled="render"
25
27
  ></v-textarea>
26
28
  </v-container>
27
29
  <v-divider class="my-4 primary"></v-divider>
@@ -35,10 +37,11 @@
35
37
  </p>
36
38
  <SortableExpansionPanel
37
39
  v-model="block.metadata.config.cards"
38
- @click:close="onDelete($event)"
39
40
  v-bind:currentPanel.sync="
40
41
  block.metadata.config.currentSlide
41
42
  "
43
+ :disabled="render"
44
+ @click:close="onDelete($event)"
42
45
  >
43
46
  <template #header="{ item, index }">
44
47
  {{
@@ -50,49 +53,62 @@
50
53
  <template #body="{ item, index }">
51
54
  <v-container>
52
55
  <v-row
53
- class="d-flex justify-space-around pt-8"
56
+ class="d-flex justify-space-around"
54
57
  align="center"
55
58
  justify="center"
56
- ><v-btn
57
- @click="flipCardFront(index)"
58
- color="primary"
59
- :outlined="
60
- !block.metadata.config.cards[index].side
61
- "
59
+ >
60
+ <v-container
61
+ class="d-flex justify-center align-center"
62
62
  >{{
63
63
  $t(
64
- 'windward.games.components.settings.flashcard.form.front'
65
- )
66
- }}</v-btn
64
+ 'windward.games.components.settings.flashcard.form.card'
65
+ ) +
66
+ ' ' +
67
+ (index + 1) +
68
+ ' ' +
69
+ (block.metadata.config.cards[index].side
70
+ ? $t(
71
+ 'windward.games.components.settings.flashcard.form.front'
72
+ )
73
+ : $t(
74
+ 'windward.games.components.settings.flashcard.form.back'
75
+ ))
76
+ }}</v-container
67
77
  >
68
- {{
69
- $t(
70
- 'windward.games.components.settings.flashcard.form.card'
71
- ) +
72
- ' ' +
73
- (index + 1) +
74
- ' ' +
75
- (block.metadata.config.cards[index].side
76
- ? $t(
77
- 'windward.games.components.settings.flashcard.form.front'
78
- )
79
- : $t(
80
- 'windward.games.components.settings.flashcard.form.back'
81
- ))
82
- }}<v-btn
83
- @click="flipCardBack(index)"
84
- color="primary"
85
- :outlined="
78
+ <v-btn-toggle
79
+ v-model="
86
80
  block.metadata.config.cards[index].side
87
81
  "
88
82
  >
89
- {{
90
- $t(
91
- 'windward.games.components.settings.flashcard.form.back'
92
- )
93
- }}</v-btn
94
- ></v-row
95
- ><br />
83
+ <v-btn
84
+ :value="true"
85
+ :outlined="
86
+ !block.metadata.config.cards[index]
87
+ .side
88
+ "
89
+ :disabled="render"
90
+ >{{
91
+ $t(
92
+ 'windward.games.components.settings.flashcard.form.front'
93
+ )
94
+ }}</v-btn
95
+ ><v-btn
96
+ :value="false"
97
+ :outlined="
98
+ block.metadata.config.cards[index]
99
+ .side
100
+ "
101
+ :disabled="render"
102
+ >
103
+ {{
104
+ $t(
105
+ 'windward.games.components.settings.flashcard.form.back'
106
+ )
107
+ }}</v-btn
108
+ >
109
+ </v-btn-toggle>
110
+ </v-row>
111
+ <br />
96
112
  <v-form ref="form">
97
113
  <br />
98
114
 
@@ -100,12 +116,12 @@
100
116
  v-if="
101
117
  !block.metadata.config.cards[index].side
102
118
  "
103
- outlined
104
- auto-grow
105
119
  v-model="
106
120
  block.metadata.config.cards[index].back
107
121
  .header
108
122
  "
123
+ outlined
124
+ auto-grow
109
125
  :counter="255"
110
126
  :label="
111
127
  $t(
@@ -113,6 +129,7 @@
113
129
  )
114
130
  "
115
131
  required
132
+ :disabled="render"
116
133
  />
117
134
  <v-card
118
135
  elevation="0"
@@ -127,22 +144,23 @@
127
144
  )
128
145
  }}
129
146
  </v-card-title>
130
- <textEditor
131
- outlined
132
- auto-grow
133
- menubar="edit"
134
- toolbar="undo redo | italic underline strikethrough removeformat | mathButton"
147
+ <TextEditor
135
148
  v-model="
136
149
  block.metadata.config.cards[index]
137
150
  .front.text
138
151
  "
152
+ outlined
153
+ auto-grow
154
+ menubar="edit"
155
+ toolbar="undo redo | italic underline strikethrough removeformat | mathButton"
139
156
  :label="
140
157
  $t(
141
158
  'windward.games.components.settings.flashcard.form.text'
142
159
  )
143
160
  "
144
161
  required
145
- />
162
+ :disabled="render"
163
+ ></TextEditor>
146
164
  </v-card>
147
165
  <v-card
148
166
  outlined
@@ -157,18 +175,19 @@
157
175
  )
158
176
  }}
159
177
  </v-card-text>
160
- <textEditor
161
- outlined
162
- auto-grow
163
- menubar="edit"
164
- toolbar="undo redo | italic underline strikethrough removeformat | mathButton"
178
+ <TextEditor
165
179
  v-model="
166
180
  block.metadata.config.cards[index]
167
181
  .back.text
168
182
  "
183
+ outlined
184
+ auto-grow
185
+ menubar="edit"
186
+ toolbar="undo redo | italic underline strikethrough removeformat | mathButton"
169
187
  label="Text"
170
188
  required
171
- />
189
+ :disabled="render"
190
+ ></TextEditor>
172
191
  </v-card>
173
192
  <br />
174
193
  <ContentBlockAsset
@@ -180,6 +199,7 @@
180
199
  .img
181
200
  "
182
201
  mimes="image/png,image/jpeg"
202
+ :disabled="render"
183
203
  @click:file="onImageSelect"
184
204
  >
185
205
  <template #title>
@@ -206,6 +226,7 @@
206
226
  .img
207
227
  "
208
228
  mimes="image/png,image/jpeg"
229
+ :disabled="render"
209
230
  @click:file="onImageSelect"
210
231
  >
211
232
  <template #title>
@@ -229,13 +250,14 @@
229
250
  v-show="
230
251
  block.metadata.config.cards[index].side
231
252
  "
232
- outlined
233
253
  v-model="
234
254
  block.metadata.config.cards[index].front
235
255
  .altText
236
256
  "
237
- label="Alt Text"
257
+ outlined
258
+ :label="$t('shared.accessibility.alt_text')"
238
259
  required
260
+ :disabled="render"
239
261
  ></v-textarea>
240
262
  <v-textarea
241
263
  auto-grow
@@ -247,42 +269,49 @@
247
269
  block.metadata.config.cards[index].back
248
270
  .altText
249
271
  "
250
- label="Alt Text"
272
+ :label="$t('shared.accessibility.alt_text')"
251
273
  required
274
+ :disabled="render"
252
275
  ></v-textarea>
253
276
  <v-row
254
277
  class="d-flex justify-space-around pt-8"
255
278
  align="center"
256
279
  justify="center"
257
- ><v-btn
258
- @click="flipCardFront(index)"
259
- color="primary"
260
- :outlined="
261
- !block.metadata.config.cards[index]
262
- .side
263
- "
264
- >{{
265
- $t(
266
- 'windward.games.components.settings.flashcard.form.front'
267
- )
268
- }}</v-btn
269
- >
270
-
271
- <v-btn
272
- @click="flipCardBack(index)"
273
- color="primary"
274
- :outlined="
280
+ >
281
+ <v-btn-toggle
282
+ v-model="
275
283
  block.metadata.config.cards[index]
276
284
  .side
277
285
  "
278
286
  >
279
- {{
280
- $t(
281
- 'windward.games.components.settings.flashcard.form.back'
282
- )
283
- }}</v-btn
284
- ></v-row
285
- >
287
+ <v-btn
288
+ :value="true"
289
+ :outlined="
290
+ !block.metadata.config.cards[
291
+ index
292
+ ].side
293
+ "
294
+ >{{
295
+ $t(
296
+ 'windward.games.components.settings.flashcard.form.front'
297
+ )
298
+ }}</v-btn
299
+ ><v-btn
300
+ :value="false"
301
+ :outlined="
302
+ block.metadata.config.cards[
303
+ index
304
+ ].side
305
+ "
306
+ >
307
+ {{
308
+ $t(
309
+ 'windward.games.components.settings.flashcard.form.back'
310
+ )
311
+ }}</v-btn
312
+ >
313
+ </v-btn-toggle>
314
+ </v-row>
286
315
  <br />
287
316
  </v-form>
288
317
  </v-container>
@@ -291,7 +320,11 @@
291
320
  </v-container>
292
321
  <v-container class="pa-0">
293
322
  <v-row justify="center" class="my-4">
294
- <v-btn color="primary" @click="onAddCard">
323
+ <v-btn
324
+ color="primary"
325
+ :disabled="render"
326
+ @click="onAddCard"
327
+ >
295
328
  <v-icon>mdi-plus</v-icon>
296
329
  {{
297
330
  $t(
@@ -320,10 +353,10 @@ import {
320
353
  MathLiveWrapper,
321
354
  ContentViewer,
322
355
  } from '@windward/core/utils'
323
- import BaseContentSettings from '~/components/Content/Tool/BaseContentSettings.js'
356
+ import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
324
357
  import ContentBlockAsset from '~/components/Content/ContentBlockAsset.vue'
325
358
  import TextEditor from '~/components/Text/TextEditor.vue'
326
- import SortableExpansionPanel from '~/components/SortableExpansionPanel.vue'
359
+ import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
327
360
 
328
361
  export default {
329
362
  name: 'FlashCardSlidesManager',
@@ -389,6 +422,11 @@ export default {
389
422
  },
390
423
  },
391
424
  methods: {
425
+ onBeforeSave() {
426
+ this.block.metadata.config.cards.forEach((element) => {
427
+ element.side = true
428
+ })
429
+ },
392
430
  onAddCard() {
393
431
  this.block.metadata.config.cards.forEach((element) => {
394
432
  element.expand = false