@windward/games 0.5.1 → 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 (17) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/bitbucket-pipelines.yml +14 -0
  3. package/components/content/blocks/matchingGame/MatchingGame.vue +31 -32
  4. package/components/settings/BucketGameSettingsManager.vue +246 -233
  5. package/components/settings/CrosswordPuzzleSettingsManager.vue +139 -109
  6. package/components/settings/FlashCardSlidesManager.vue +319 -332
  7. package/components/settings/MatchingGameManager.vue +326 -321
  8. package/components/settings/MultipleChoiceSettingsManager.vue +83 -67
  9. package/components/settings/QuizShowSettingsManager.vue +215 -203
  10. package/components/settings/SevenStrikesSettingsManager.vue +154 -126
  11. package/components/settings/SlideShowManager.vue +153 -132
  12. package/components/settings/SortingGameSettingsManager.vue +137 -108
  13. package/components/settings/WordJumbleSettingsManager.vue +156 -128
  14. package/i18n/en-US/shared/settings.ts +3 -0
  15. package/i18n/es-ES/shared/settings.ts +3 -0
  16. package/i18n/sv-SE/shared/settings.ts +3 -0
  17. package/package.json +1 -1
package/components/settings/MultipleChoiceSettingsManager.vue CHANGED
@@ -1,77 +1,75 @@
1
1
  <template>
2
2
  <div>
3
- <v-form ref="form">
4
- <v-container class="pa-0">
5
- <v-text-field
6
- v-model="block.metadata.config.title"
7
- outlined
8
- :counter="50"
9
- :autofocus="true"
10
- maxlength="50"
11
- :label="
12
- $t(
13
- 'windward.games.components.settings.multiple_choice.title_placeholder'
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
- :counter="255"
23
- maxlength="255"
24
- :label="
25
- $t(
26
- 'windward.games.components.settings.multiple_choice.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>
3
+ <v-container class="pa-0">
4
+ <v-text-field
5
+ v-model="block.metadata.config.title"
6
+ outlined
7
+ :autofocus="true"
8
+ :rules="validation.titleRule"
9
+ :counter="50"
10
+ :label="
11
+ $t(
12
+ 'windward.games.components.settings.multiple_choice.title_placeholder'
13
+ )
14
+ "
15
+ :disabled="render"
16
+ ></v-text-field>
17
+ <v-textarea
18
+ v-model="block.metadata.config.instructions"
19
+ outlined
20
+ :rules="validation.instructionRule"
21
+ auto-grow
22
+ :counter="255"
23
+ :label="
24
+ $t(
25
+ 'windward.games.components.settings.multiple_choice.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>
34
+ {{
35
+ $t(
36
+ 'windward.games.components.settings.multiple_choice.questions'
37
+ )
38
+ }}
39
+ </p>
40
+ <SortableExpansionPanel
41
+ v-model="block.metadata.config.questions"
42
+ :current-panel.sync="editingIndex"
43
+ :disabled="render"
44
+ @click="onOpenModal"
45
+ @click:close="onDelete($event)"
46
+ >
47
+ <template #header="{ item }">
35
48
  {{
36
- $t(
37
- 'windward.games.components.settings.multiple_choice.questions'
38
- )
49
+ item.body
50
+ ? item.body
51
+ : $t(
52
+ 'windward.games.components.settings.bucket_game.form.enter_text'
53
+ )
39
54
  }}
40
- </p>
41
- <SortableExpansionPanel
42
- v-model="block.metadata.config.questions"
43
- :current-panel.sync="editingIndex"
55
+ </template>
56
+ </SortableExpansionPanel>
57
+ <v-row justify="center" class="my-4">
58
+ <v-btn
59
+ color="primary"
60
+ elevation="0"
44
61
  :disabled="render"
45
62
  @click="onOpenModal"
46
- @click:close="onDelete($event)"
47
63
  >
48
- <template #header="{ item }">
49
- {{
50
- item.body
51
- ? item.body
52
- : $t(
53
- 'windward.games.components.settings.bucket_game.form.enter_text'
54
- )
55
- }}
56
- </template>
57
- </SortableExpansionPanel>
58
- <v-row justify="center" class="my-4">
59
- <v-btn
60
- color="primary"
61
- elevation="0"
62
- :disabled="render"
63
- @click="onOpenModal"
64
- >
65
- <v-icon>mdi-plus</v-icon>
66
- {{
67
- $t(
68
- 'windward.games.components.settings.multiple_choice.add_question'
69
- )
70
- }}
71
- </v-btn>
72
- </v-row>
73
- </v-container>
74
- </v-form>
64
+ <v-icon>mdi-plus</v-icon>
65
+ {{
66
+ $t(
67
+ 'windward.games.components.settings.multiple_choice.add_question'
68
+ )
69
+ }}
70
+ </v-btn>
71
+ </v-row>
72
+ </v-container>
75
73
  <DialogBox
76
74
  v-model="dialog"
77
75
  :trigger="false"
@@ -152,6 +150,24 @@ export default {
152
150
  isNotEditing: false,
153
151
  valid: true,
154
152
  loading: false,
153
+ validation: {
154
+ titleRule: [
155
+ (v) =>
156
+ v.length <= 50 ||
157
+ this.$t(
158
+ 'windward.games.shared.settings.errors.input_limitations',
159
+ [50]
160
+ ),
161
+ ],
162
+ instructionRule: [
163
+ (v) =>
164
+ v.length <= 255 ||
165
+ this.$t(
166
+ 'windward.games.shared.settings.errors.input_limitations',
167
+ [255]
168
+ ),
169
+ ],
170
+ },
155
171
  }
156
172
  },
157
173
  mounted() {
package/components/settings/QuizShowSettingsManager.vue CHANGED
@@ -1,212 +1,208 @@
1
1
  <template>
2
2
  <div>
3
+ <v-text-field
4
+ v-model="block.metadata.config.title"
5
+ :rules="validation.shortInputRules"
6
+ :counter="50"
7
+ outlined
8
+ :label="
9
+ $t(
10
+ 'windward.games.components.settings.quizshow_game.form.title'
11
+ )
12
+ "
13
+ :disabled="render"
14
+ ></v-text-field>
3
15
  <br />
4
- <v-form ref="form" v-if="!loading">
5
- <v-text-field
6
- v-model="block.metadata.config.title"
7
- :counter="50"
8
- maxlength="50"
9
- :label="
10
- $t(
11
- 'windward.games.components.settings.quizshow_game.form.title'
12
- )
13
- "
14
- :disabled="render"
15
- ></v-text-field>
16
- <br />
17
- <v-checkbox
18
- v-model="block.metadata.config.responsive"
19
- :label="
20
- $t(
21
- 'windward.games.components.settings.quizshow_game.form.responsive'
22
- )
23
- "
24
- :disabled="render"
25
- ></v-checkbox>
26
- <br />
27
- <v-textarea
28
- outlined
29
- auto-grow
30
- v-model="block.metadata.config.instructions"
31
- :counter="300"
32
- maxlength="300"
33
- :label="
34
- $t(
35
- 'windward.games.components.settings.multiple_choice.instructions'
36
- )
37
- "
38
- :disabled="render"
39
- ></v-textarea>
40
- <br />
41
- <v-expansion-panels outlined tile flat>
42
- <v-divider class="cardOutline primary"></v-divider>
43
- <v-expansion-panel>
44
- <v-expansion-panel-header>
45
- <template #default="{ open }">
46
- <v-row no-gutters class="text-capitalize">
47
- <h5>
48
- {{
49
- $t(
50
- 'windward.games.components.settings.quizshow_game.form.categories'
51
- )
52
- }}
53
- </h5>
54
- </v-row>
55
- </template>
56
- <template #actions>
57
- <v-icon> mdi-chevron-down </v-icon>
58
- </template>
59
- </v-expansion-panel-header>
60
- <v-expansion-panel-content>
61
- <v-card elevation="0">
62
- <v-container class="d-flex justify-center">
63
- <v-col>
64
- <v-row
65
- justify="center"
66
- align="center"
67
- v-for="index in Number(
68
- block.metadata.config.maxCategories
69
- )"
70
- :key="'maxcategories-row-' + index"
16
+ <v-checkbox
17
+ v-model="block.metadata.config.responsive"
18
+ :label="
19
+ $t(
20
+ 'windward.games.components.settings.quizshow_game.form.responsive'
21
+ )
22
+ "
23
+ :disabled="render"
24
+ ></v-checkbox>
25
+ <br />
26
+ <v-textarea
27
+ outlined
28
+ auto-grow
29
+ v-model="block.metadata.config.instructions"
30
+ :rules="validation.instructionRule"
31
+ :counter="255"
32
+ :label="
33
+ $t(
34
+ 'windward.games.components.settings.multiple_choice.instructions'
35
+ )
36
+ "
37
+ :disabled="render"
38
+ ></v-textarea>
39
+ <br />
40
+ <v-expansion-panels outlined tile flat>
41
+ <v-divider class="cardOutline primary"></v-divider>
42
+ <v-expansion-panel>
43
+ <v-expansion-panel-header>
44
+ <template #default="{ open }">
45
+ <v-row no-gutters class="text-capitalize">
46
+ <h5>
47
+ {{
48
+ $t(
49
+ 'windward.games.components.settings.quizshow_game.form.categories'
50
+ )
51
+ }}
52
+ </h5>
53
+ </v-row>
54
+ </template>
55
+ <template #actions>
56
+ <v-icon> mdi-chevron-down </v-icon>
57
+ </template>
58
+ </v-expansion-panel-header>
59
+ <v-expansion-panel-content>
60
+ <v-card elevation="0">
61
+ <v-container class="d-flex justify-center">
62
+ <v-col>
63
+ <v-row
64
+ justify="center"
65
+ align="center"
66
+ v-for="index in Number(
67
+ block.metadata.config.maxCategories
68
+ )"
69
+ :key="'maxcategories-row-' + index"
70
+ >
71
+ <v-text-field
72
+ :key="'cat' + index"
73
+ v-model="
74
+ block.metadata.config.categories[
75
+ index - 1
76
+ ]
77
+ "
78
+ :rules="validation.shortInputRules"
79
+ :counter="50"
80
+ :label="
81
+ $tc(
82
+ 'windward.games.components.settings.quizshow_game.form.category',
83
+ 1
84
+ ) +
85
+ ' ' +
86
+ index
87
+ "
88
+ outlined
89
+ :disabled="render"
90
+ @click:append="removeCategory(index)"
71
91
  >
72
- <v-text-field
73
- :key="'cat' + index"
74
- v-model="
92
+ <template #append>
93
+ <v-icon color="error"
94
+ >mdi-delete-outline</v-icon
95
+ >
96
+ </template>
97
+ </v-text-field>
98
+ </v-row>
99
+ <v-row justify="center" align="center">
100
+ <v-btn
101
+ v-show="
102
+ Number(
75
103
  block.metadata.config
76
- .categories[index - 1]
77
- "
78
- :counter="255"
79
- maxlength="255"
80
- :label="
81
- $tc(
82
- 'windward.games.components.settings.quizshow_game.form.category',
83
- 1
84
- ) +
85
- ' ' +
86
- index
87
- "
88
- outlined
89
- :disabled="render"
90
- @click:append="
91
- removeCategory(index)
92
- "
93
- >
94
- <template #append>
95
- <v-icon color="error"
96
- >mdi-delete-outline</v-icon
97
- >
98
- </template>
99
- </v-text-field>
100
- </v-row>
101
- <v-row justify="center" align="center">
102
- <v-btn
103
- v-show="
104
- Number(
105
- block.metadata.config
106
- .maxCategories
107
- ) < 6
108
- "
109
- elevation="0"
110
- color="primary"
111
- class="text-capitalize clickable"
112
- :disabled="render"
113
- @click="addCategory"
114
- >
115
- <v-icon>mdi-plus</v-icon>&nbsp;{{
116
- $t(
117
- 'windward.games.components.settings.quizshow_game.form.add_category'
118
- )
119
- }}</v-btn
120
- >
121
- </v-row>
122
- </v-col>
123
- </v-container>
124
- </v-card>
125
- </v-expansion-panel-content>
126
- </v-expansion-panel>
127
- <v-divider class="cardOutline primary"></v-divider>
128
- <v-expansion-panel>
129
- <v-expansion-panel-header>
130
- <template #default="{ open }">
131
- <v-row no-gutters class="text-capitalize">
132
- <h5>
133
- {{
134
- $t(
135
- 'windward.games.components.settings.quizshow_game.form.max_rows'
136
- )
137
- }}
138
- </h5>
139
- </v-row>
140
- </template>
141
- <template #actions>
142
- <v-icon> mdi-chevron-down </v-icon>
143
- </template>
144
- </v-expansion-panel-header>
145
- <v-expansion-panel-content>
146
- <v-card elevation="0">
147
- <v-container class="d-flex justify-center">
148
- <v-col>
149
- <v-row
150
- justify="center"
151
- align="center"
152
- v-for="index in Number(
153
- block.metadata.config.maxRows
154
- )"
155
- :key="'maxrows-row-' + index"
104
+ .maxCategories
105
+ ) < 6
106
+ "
107
+ elevation="0"
108
+ color="primary"
109
+ class="text-capitalize clickable"
110
+ :disabled="render"
111
+ @click="addCategory"
156
112
  >
157
- <v-text-field
158
- :key="'row' + index"
159
- v-model="
160
- block.metadata.config.points[
161
- index - 1
162
- ]
163
- "
164
- append-icon="mdi-delete-outline"
165
- type="number"
166
- min="1"
167
- max="9999"
168
- :label="
169
- $t(
170
- 'windward.games.components.settings.quizshow_game.form.row'
171
- ) +
172
- ' ' +
173
- index
174
- "
175
- outlined
176
- :disabled="render"
177
- @input="onPointsChange(index - 1)"
178
- @click:append="removeRow(index)"
179
- ></v-text-field>
180
- </v-row>
181
- <v-row justify="center" align="center">
182
- <v-btn
183
- v-show="
184
- Number(
185
- block.metadata.config
186
- .maxRows
187
- ) < 6
188
- "
189
- elevation="0"
190
- class="text-capitalize clickable"
191
- color="primary"
192
- :disabled="render"
193
- @click="addRow"
194
- >
195
- <v-icon>mdi-plus</v-icon>&nbsp;{{
196
- $t(
197
- 'windward.games.components.settings.quizshow_game.form.add_row'
198
- )
199
- }}</v-btn
200
- >
201
- </v-row>
202
- </v-col>
203
- </v-container>
204
- </v-card>
205
- </v-expansion-panel-content>
206
- </v-expansion-panel>
207
- <v-divider class="cardOutline primary"></v-divider>
208
- </v-expansion-panels>
209
- </v-form>
113
+ <v-icon>mdi-plus</v-icon>&nbsp;{{
114
+ $t(
115
+ 'windward.games.components.settings.quizshow_game.form.add_category'
116
+ )
117
+ }}</v-btn
118
+ >
119
+ </v-row>
120
+ </v-col>
121
+ </v-container>
122
+ </v-card>
123
+ </v-expansion-panel-content>
124
+ </v-expansion-panel>
125
+ <v-divider class="cardOutline primary"></v-divider>
126
+ <v-expansion-panel>
127
+ <v-expansion-panel-header>
128
+ <template #default="{ open }">
129
+ <v-row no-gutters class="text-capitalize">
130
+ <h5>
131
+ {{
132
+ $t(
133
+ 'windward.games.components.settings.quizshow_game.form.max_rows'
134
+ )
135
+ }}
136
+ </h5>
137
+ </v-row>
138
+ </template>
139
+ <template #actions>
140
+ <v-icon> mdi-chevron-down </v-icon>
141
+ </template>
142
+ </v-expansion-panel-header>
143
+ <v-expansion-panel-content>
144
+ <v-card elevation="0">
145
+ <v-container class="d-flex justify-center">
146
+ <v-col>
147
+ <v-row
148
+ justify="center"
149
+ align="center"
150
+ v-for="index in Number(
151
+ block.metadata.config.maxRows
152
+ )"
153
+ :key="'maxrows-row-' + index"
154
+ >
155
+ <v-text-field
156
+ :key="'row' + index"
157
+ v-model="
158
+ block.metadata.config.points[
159
+ index - 1
160
+ ]
161
+ "
162
+ append-icon="mdi-delete-outline"
163
+ type="number"
164
+ min="1"
165
+ max="9999"
166
+ :label="
167
+ $t(
168
+ 'windward.games.components.settings.quizshow_game.form.row'
169
+ ) +
170
+ ' ' +
171
+ index
172
+ "
173
+ outlined
174
+ :disabled="render"
175
+ @input="onPointsChange(index - 1)"
176
+ @click:append="removeRow(index)"
177
+ ></v-text-field>
178
+ </v-row>
179
+ <v-row justify="center" align="center">
180
+ <v-btn
181
+ v-show="
182
+ Number(
183
+ block.metadata.config.maxRows
184
+ ) < 6
185
+ "
186
+ elevation="0"
187
+ class="text-capitalize clickable"
188
+ color="primary"
189
+ :disabled="render"
190
+ @click="addRow"
191
+ >
192
+ <v-icon>mdi-plus</v-icon>&nbsp;{{
193
+ $t(
194
+ 'windward.games.components.settings.quizshow_game.form.add_row'
195
+ )
196
+ }}</v-btn
197
+ >
198
+ </v-row>
199
+ </v-col>
200
+ </v-container>
201
+ </v-card>
202
+ </v-expansion-panel-content>
203
+ </v-expansion-panel>
204
+ <v-divider class="cardOutline primary"></v-divider>
205
+ </v-expansion-panels>
210
206
  <div v-if="loading" class="text-center">
211
207
  <v-progress-circular
212
208
  :size="70"
@@ -276,6 +272,22 @@ export default {
276
272
  }
277
273
  },
278
274
  ],
275
+ shortInputRules: [
276
+ (v) =>
277
+ v.length <= 50 ||
278
+ this.$t(
279
+ 'windward.games.shared.settings.errors.input_limitations',
280
+ [50]
281
+ ),
282
+ ],
283
+ instructionRule: [
284
+ (v) =>
285
+ v.length <= 255 ||
286
+ this.$t(
287
+ 'windward.games.shared.settings.errors.input_limitations',
288
+ [255]
289
+ ),
290
+ ],
279
291
  },
280
292
  loading: false,
281
293
  cursor: 'changePointer',