@windward/games 0.5.0 → 0.6.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 (22) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/bitbucket-pipelines.yml +14 -0
  3. package/components/content/blocks/flashcards/FlashcardSlides.vue +35 -2
  4. package/components/content/blocks/matchingGame/MatchingGame.vue +31 -32
  5. package/components/content/blocks/multipleChoice/MultipleChoice.vue +30 -1
  6. package/components/content/blocks/sevenStrikes/SevenStikes.vue +33 -1
  7. package/components/content/blocks/slideshow/SlideShow.vue +41 -3
  8. package/components/content/blocks/wordJumble/WordJumble.vue +32 -0
  9. package/components/settings/BucketGameSettingsManager.vue +246 -233
  10. package/components/settings/CrosswordPuzzleSettingsManager.vue +139 -109
  11. package/components/settings/FlashCardSlidesManager.vue +319 -332
  12. package/components/settings/MatchingGameManager.vue +326 -321
  13. package/components/settings/MultipleChoiceSettingsManager.vue +83 -67
  14. package/components/settings/QuizShowSettingsManager.vue +215 -203
  15. package/components/settings/SevenStrikesSettingsManager.vue +171 -141
  16. package/components/settings/SlideShowManager.vue +153 -132
  17. package/components/settings/SortingGameSettingsManager.vue +137 -108
  18. package/components/settings/WordJumbleSettingsManager.vue +175 -145
  19. package/i18n/en-US/shared/settings.ts +3 -0
  20. package/i18n/es-ES/shared/settings.ts +3 -0
  21. package/i18n/sv-SE/shared/settings.ts +3 -0
  22. package/package.json +1 -1
package/components/settings/SevenStrikesSettingsManager.vue CHANGED
@@ -1,138 +1,140 @@
1
1
  <template>
2
2
  <div>
3
- <v-form ref="form" v-model="valid" v-if="!loading">
4
- <v-container class="pa-0">
5
- <v-text-field
6
- ref="title"
7
- v-model="block.metadata.config.title"
8
- outlined
9
- :counter="50"
10
- :autofocus="true"
11
- :label="
12
- $t(
13
- 'windward.games.components.settings.bucket_game.form.title'
14
- )
15
- "
16
- :disabled="render"
17
- ></v-text-field>
18
- <v-textarea
19
- v-model="block.metadata.config.instructions"
20
- outlined
21
- auto-grow
22
- :label="
23
- $t(
24
- 'windward.games.components.settings.bucket_game.form.instructions'
25
- )
26
- "
27
- :disabled="render"
28
- ></v-textarea>
29
- </v-container>
30
- <v-divider class="my-4 primary"></v-divider>
31
- <v-container class="pa-0">
32
- <p>
3
+ <v-container class="pa-0">
4
+ <v-text-field
5
+ ref="title"
6
+ v-model="block.metadata.config.title"
7
+ :rules="validation.shortInputRules"
8
+ outlined
9
+ :counter="50"
10
+ :autofocus="true"
11
+ :label="
12
+ $t(
13
+ 'windward.games.components.settings.bucket_game.form.title'
14
+ )
15
+ "
16
+ :disabled="render"
17
+ ></v-text-field>
18
+ <v-textarea
19
+ v-model="block.metadata.config.instructions"
20
+ :counter="255"
21
+ :rules="validation.instructionRule"
22
+ outlined
23
+ auto-grow
24
+ :label="
25
+ $t(
26
+ 'windward.games.components.settings.bucket_game.form.instructions'
27
+ )
28
+ "
29
+ :disabled="render"
30
+ ></v-textarea>
31
+ </v-container>
32
+ <v-divider class="my-4 primary"></v-divider>
33
+ <v-container class="pa-0">
34
+ <p>
35
+ {{
36
+ $t('windward.games.components.settings.seven_strikes.items')
37
+ }}
38
+ </p>
39
+ <SortableExpansionPanel
40
+ v-model="block.metadata.config.words"
41
+ v-bind:currentPanel.sync="block.metadata.config.currentWord"
42
+ :disabled="render"
43
+ @click:close="onDelete($event)"
44
+ >
45
+ <template #header="{ item, index }">
33
46
  {{
34
- $t(
35
- 'windward.games.components.settings.seven_strikes.items'
36
- )
47
+ item.value
48
+ ? block.metadata.config.words[index].value
49
+ : $t(
50
+ 'windward.games.components.settings.bucket_game.form.enter_text'
51
+ )
37
52
  }}
38
- </p>
39
- <SortableExpansionPanel
40
- v-model="block.metadata.config.words"
41
- v-bind:currentPanel.sync="block.metadata.config.currentWord"
53
+ </template>
54
+ <template #body="{ item, index }">
55
+ <v-container>
56
+ <v-flex xs12>
57
+ <p class="p-label">
58
+ {{
59
+ $t(
60
+ 'windward.games.components.settings.seven_strikes.word'
61
+ )
62
+ }}
63
+ </p>
64
+ <v-textarea
65
+ v-model="
66
+ block.metadata.config.words[index].value
67
+ "
68
+ :rules="validation.shortInputRules"
69
+ :counter="50"
70
+ outlined
71
+ :autofocus="true"
72
+ :disabled="render"
73
+ ></v-textarea>
74
+ <p class="p-label">
75
+ {{
76
+ $t(
77
+ 'windward.games.components.settings.seven_strikes.hint'
78
+ )
79
+ }}
80
+ </p>
81
+ <v-textarea
82
+ v-model="
83
+ block.metadata.config.words[index].hint
84
+ "
85
+ :rules="validation.clueRule"
86
+ :counter="155"
87
+ outlined
88
+ class="pt-4"
89
+ :disabled="render"
90
+ ></v-textarea>
91
+ </v-flex>
92
+ </v-container>
93
+ </template>
94
+ </SortableExpansionPanel>
95
+ </v-container>
96
+ <v-container class="pa-0">
97
+ <v-row justify="center" class="my-4">
98
+ <v-btn
99
+ color="primary"
100
+ elevation="0"
42
101
  :disabled="render"
43
- @click:close="onDelete($event)"
102
+ @click="onAddElement"
44
103
  >
45
- <template #header="{ item, index }">
46
- {{
47
- item.value
48
- ? block.metadata.config.words[index].value
49
- : $t(
50
- 'windward.games.components.settings.bucket_game.form.enter_text'
51
- )
52
- }}
53
- </template>
54
- <template #body="{ item, index }">
55
- <v-container>
56
- <v-flex xs12>
57
- <p class="p-label">
58
- {{
59
- $t(
60
- 'windward.games.components.settings.seven_strikes.word'
61
- )
62
- }}
63
- </p>
64
- <v-textarea
65
- v-model="
66
- block.metadata.config.words[index].value
67
- "
68
- outlined
69
- :autofocus="true"
70
- :disabled="render"
71
- ></v-textarea>
72
- <p class="p-label">
73
- {{
74
- $t(
75
- 'windward.games.components.settings.seven_strikes.hint'
76
- )
77
- }}
78
- </p>
79
- <v-textarea
80
- v-model="
81
- block.metadata.config.words[index].hint
82
- "
83
- outlined
84
- class="pt-4"
85
- :disabled="render"
86
- ></v-textarea>
87
- </v-flex>
88
- </v-container>
89
- </template>
90
- </SortableExpansionPanel>
91
- </v-container>
92
- <v-container class="pa-0">
93
- <v-row justify="center" class="my-4">
94
- <v-btn
95
- color="primary"
96
- elevation="0"
97
- :disabled="render"
98
- @click="onAddElement"
99
- >
100
- <v-icon>mdi-plus</v-icon>
101
- {{
102
- $t(
103
- 'windward.games.components.content.blocks.sorting_game.add_element'
104
- )
105
- }}
106
- </v-btn>
107
- </v-row>
108
- </v-container>
109
- <v-row class="mt-3">
110
- <v-textarea
111
- ref="title"
112
- v-model="block.metadata.config.feedback_correct"
113
- outlined
114
- auto-grow
115
- :counter="50"
116
- :label="
117
- $t(
118
- 'windward.games.components.settings.word_jumble.feedback_correct'
119
- )
120
- "
121
- :disabled="render"
122
- ></v-textarea>
123
- <v-textarea
124
- v-model="block.metadata.config.feedback_incorrect"
125
- outlined
126
- auto-grow
127
- :label="
104
+ <v-icon>mdi-plus</v-icon>
105
+ {{
128
106
  $t(
129
- 'windward.games.components.settings.word_jumble.feedback_incorrect'
107
+ 'windward.games.components.content.blocks.sorting_game.add_element'
130
108
  )
131
- "
132
- :disabled="render"
133
- ></v-textarea>
109
+ }}
110
+ </v-btn>
134
111
  </v-row>
135
- </v-form>
112
+ </v-container>
113
+ <v-row class="mt-3">
114
+ <v-textarea
115
+ ref="title"
116
+ v-model="block.metadata.config.feedback_correct"
117
+ outlined
118
+ auto-grow
119
+ :label="
120
+ $t(
121
+ 'windward.games.components.settings.word_jumble.feedback_correct'
122
+ )
123
+ "
124
+ :disabled="render"
125
+ ></v-textarea>
126
+ <v-textarea
127
+ v-model="block.metadata.config.feedback_incorrect"
128
+ outlined
129
+ auto-grow
130
+ :label="
131
+ $t(
132
+ 'windward.games.components.settings.word_jumble.feedback_incorrect'
133
+ )
134
+ "
135
+ :disabled="render"
136
+ ></v-textarea>
137
+ </v-row>
136
138
  </div>
137
139
  </template>
138
140
 
@@ -195,28 +197,56 @@ export default {
195
197
  return {
196
198
  valid: true,
197
199
  loading: false,
200
+ validation: {
201
+ shortInputRules: [
202
+ (v) =>
203
+ v.length <= 50 ||
204
+ this.$t(
205
+ 'windward.games.shared.settings.errors.input_limitations',
206
+ [50]
207
+ ),
208
+ ],
209
+ instructionRule: [
210
+ (v) =>
211
+ v.length <= 255 ||
212
+ this.$t(
213
+ 'windward.games.shared.settings.errors.input_limitations',
214
+ [255]
215
+ ),
216
+ ],
217
+ clueRule: [
218
+ (v) =>
219
+ v.length <= 155 ||
220
+ this.$t(
221
+ 'windward.games.shared.settings.errors.input_limitations',
222
+ [155]
223
+ ),
224
+ ],
225
+ },
198
226
  }
199
227
  },
200
228
  methods: {
201
229
  onBeforeSave() {
202
230
  this.block.metadata.config.words.forEach((element) => {
203
231
  // check against lowercase keyboard inputs
204
- element.value = element.value.toLowerCase()
205
- element.splitWord = element.value.split('')
206
- element.splitWord.forEach((letter) => {
207
- const letterIndex = element.splitWord.indexOf(letter)
208
- if (letter !== ' ') {
209
- element.splitWord[letterIndex] = {
210
- letter: letter,
211
- show: false,
212
- }
213
- } else {
214
- element.splitWord[letterIndex] = {
215
- letter: letter,
216
- show: true,
232
+ if (element.value) {
233
+ element.value = element.value.toLowerCase()
234
+ element.splitWord = element.value.split('')
235
+ element.splitWord.forEach((letter) => {
236
+ const letterIndex = element.splitWord.indexOf(letter)
237
+ if (letter !== ' ') {
238
+ element.splitWord[letterIndex] = {
239
+ letter: letter,
240
+ show: false,
241
+ }
242
+ } else {
243
+ element.splitWord[letterIndex] = {
244
+ letter: letter,
245
+ show: true,
246
+ }
217
247
  }
218
- }
219
- })
248
+ })
249
+ }
220
250
  })
221
251
  },
222
252
  onAddElement() {
package/components/settings/SlideShowManager.vue CHANGED
@@ -1,146 +1,141 @@
1
1
  <template>
2
2
  <div>
3
- <v-form ref="form" v-model="valid" v-if="!loading">
4
- <v-container class="pa-0">
5
- <v-text-field
6
- v-model="block.metadata.config.title"
7
- outlined
8
- :counter="50"
9
- maxlength="50"
10
- :label="
11
- $t(
12
- 'windward.games.components.settings.slideshow.form.title'
13
- )
14
- "
15
- :disabled="render"
16
- ></v-text-field>
17
- <v-textarea
18
- v-model="block.metadata.config.instructions"
19
- outlined
20
- auto-grow
21
- :counter="255"
22
- maxlength="255"
23
- :label="
24
- $t(
25
- 'windward.games.components.settings.slideshow.form.instructions'
26
- )
27
- "
28
- :disabled="render"
29
- ></v-textarea>
30
- </v-container>
31
- <v-divider class="my-4 primary"></v-divider>
32
- <v-container class="pa-0">
33
- <p>
3
+ <v-container class="pa-0">
4
+ <v-text-field
5
+ v-model="block.metadata.config.title"
6
+ outlined
7
+ :rules="validation.shortInputRules"
8
+ :counter="50"
9
+ :label="
10
+ $t(
11
+ 'windward.games.components.settings.slideshow.form.title'
12
+ )
13
+ "
14
+ :disabled="render"
15
+ ></v-text-field>
16
+ <v-textarea
17
+ v-model="block.metadata.config.instructions"
18
+ outlined
19
+ auto-grow
20
+ :rules="validation.instructionRule"
21
+ :counter="255"
22
+ :label="
23
+ $t(
24
+ 'windward.games.components.settings.slideshow.form.instructions'
25
+ )
26
+ "
27
+ :disabled="render"
28
+ ></v-textarea>
29
+ </v-container>
30
+ <v-divider class="my-4 primary"></v-divider>
31
+ <v-container class="pa-0">
32
+ <p>
33
+ {{
34
+ $t(
35
+ 'windward.games.components.settings.slideshow.form.items'
36
+ )
37
+ }}
38
+ </p>
39
+ <SortableExpansionPanel
40
+ v-model="block.metadata.config.slides"
41
+ v-bind:currentPanel.sync="block.metadata.config.currentSlide"
42
+ :disabled="render"
43
+ @click:close="onDeleteSlide($event)"
44
+ >
45
+ <template #header="{ item, index }">
34
46
  {{
35
- $t(
36
- 'windward.games.components.settings.slideshow.form.items'
37
- )
47
+ item.header
48
+ ? item.header
49
+ : $t(
50
+ 'windward.games.components.content.blocks.slideshow.slides.slide',
51
+ [index + 1]
52
+ )
38
53
  }}
39
- </p>
40
- <SortableExpansionPanel
41
- v-model="block.metadata.config.slides"
42
- v-bind:currentPanel.sync="
43
- block.metadata.config.currentSlide
44
- "
45
- :disabled="render"
46
- @click:close="onDeleteSlide($event)"
47
- >
48
- <template #header="{ item, index }">
49
- {{
50
- item.header
51
- ? item.header
52
- : $t(
53
- 'windward.games.components.content.blocks.slideshow.slides.slide',
54
- [index + 1]
55
- )
56
- }}
57
- </template>
58
- <template #body="{ item, index }">
59
- <v-container>
60
- <v-text-field
61
- v-model="
62
- block.metadata.config.slides[index].header
63
- "
64
- :autofocus="true"
65
- outlined
66
- :label="
67
- $t(
68
- 'windward.games.components.content.blocks.slideshow.slides.slide_header'
69
- )
70
- "
71
- :disabled="render"
72
- ></v-text-field>
73
- <v-text-field
74
- v-model="
75
- block.metadata.config.slides[index]
76
- .description
77
- "
78
- outlined
79
- :label="
80
- $t(
81
- 'windward.games.components.content.blocks.slideshow.slides.slide_description'
82
- )
83
- "
84
- :disabled="render"
85
- ></v-text-field>
54
+ </template>
55
+ <template #body="{ item, index }">
56
+ <v-container>
57
+ <v-text-field
58
+ v-model="block.metadata.config.slides[index].header"
59
+ :rules="validation.shortInputRules"
60
+ :counter="50"
61
+ :autofocus="true"
62
+ outlined
63
+ :label="
64
+ $t(
65
+ 'windward.games.components.content.blocks.slideshow.slides.slide_header'
66
+ )
67
+ "
68
+ :disabled="render"
69
+ ></v-text-field>
70
+ <v-textarea
71
+ v-model="
72
+ block.metadata.config.slides[index].description
73
+ "
74
+ :rules="validation.clueRule"
75
+ :counter="155"
76
+ outlined
77
+ :label="
78
+ $t(
79
+ 'windward.games.components.content.blocks.slideshow.slides.slide_description'
80
+ )
81
+ "
82
+ :disabled="render"
83
+ ></v-textarea>
86
84
 
87
- <ContentBlockAsset
88
- id="content-block-asset"
89
- v-model="
90
- block.metadata.config.slides[index]
91
- .imageAsset
92
- "
93
- :assets.sync="block.assets"
94
- mimes="image/png,image/jpeg"
95
- :disabled="render"
96
- ></ContentBlockAsset>
85
+ <ContentBlockAsset
86
+ id="content-block-asset"
87
+ v-model="
88
+ block.metadata.config.slides[index].imageAsset
89
+ "
90
+ :assets.sync="block.assets"
91
+ mimes="image/png,image/jpeg"
92
+ :disabled="render"
93
+ ></ContentBlockAsset>
97
94
 
98
- <v-text-field
99
- v-if="
95
+ <v-text-field
96
+ v-if="
97
+ block.metadata.config.slides[index].imageAsset
98
+ "
99
+ v-model="
100
+ block.metadata.config.slides[index].imageAlt
101
+ "
102
+ class="mt-4"
103
+ outlined
104
+ :placeholder="
105
+ getImageAlt(
100
106
  block.metadata.config.slides[index]
101
107
  .imageAsset
102
- "
103
- v-model="
104
- block.metadata.config.slides[index].imageAlt
105
- "
106
- class="mt-4"
107
- outlined
108
- :placeholder="
109
- getImageAlt(
110
- block.metadata.config.slides[index]
111
- .imageAsset
112
- )
113
- "
114
- persistent-placeholder
115
- :label="
116
- $t(
117
- 'windward.games.components.content.blocks.slideshow.slides.image_alt'
118
- )
119
- "
120
- :disabled="render"
121
- ></v-text-field>
122
- </v-container>
123
- </template>
124
- </SortableExpansionPanel>
125
- <v-container>
126
- <v-row justify="center" class="my-4">
127
- <v-btn
128
- color="primary"
129
- elevation="0"
130
- :disabled="render"
131
- @click="onAddSlide"
132
- >
133
- <v-icon>mdi-plus</v-icon>
134
- {{
108
+ )
109
+ "
110
+ persistent-placeholder
111
+ :label="
135
112
  $t(
136
- 'windward.games.components.content.blocks.slideshow.add_slide'
113
+ 'windward.games.components.content.blocks.slideshow.slides.image_alt'
137
114
  )
138
- }}
139
- </v-btn>
140
- </v-row>
141
- </v-container>
115
+ "
116
+ :disabled="render"
117
+ ></v-text-field>
118
+ </v-container>
119
+ </template>
120
+ </SortableExpansionPanel>
121
+ <v-container>
122
+ <v-row justify="center" class="my-4">
123
+ <v-btn
124
+ color="primary"
125
+ elevation="0"
126
+ :disabled="render"
127
+ @click="onAddSlide"
128
+ >
129
+ <v-icon>mdi-plus</v-icon>
130
+ {{
131
+ $t(
132
+ 'windward.games.components.content.blocks.slideshow.add_slide'
133
+ )
134
+ }}
135
+ </v-btn>
136
+ </v-row>
142
137
  </v-container>
143
- </v-form>
138
+ </v-container>
144
139
  <div v-if="loading" class="text-center">
145
140
  <v-progress-circular
146
141
  :size="70"
@@ -203,6 +198,32 @@ export default {
203
198
  valid: true,
204
199
  debounce: null,
205
200
  loading: false,
201
+ validation: {
202
+ shortInputRules: [
203
+ (v) =>
204
+ (v.length <= 50) ||
205
+ this.$t(
206
+ 'windward.games.shared.settings.errors.input_limitations',
207
+ [50]
208
+ ),
209
+ ],
210
+ instructionRule: [
211
+ (v) =>
212
+ (v.length <= 255) ||
213
+ this.$t(
214
+ 'windward.games.shared.settings.errors.input_limitations',
215
+ [255]
216
+ ),
217
+ ],
218
+ clueRule: [
219
+ (v) =>
220
+ (v.length <= 155) ||
221
+ this.$t(
222
+ 'windward.games.shared.settings.errors.input_limitations',
223
+ [155]
224
+ ),
225
+ ],
226
+ },
206
227
  }
207
228
  },
208
229
  methods: {