@windward/games 0.0.8 → 0.0.9

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 (6) hide show
  1. package/components/content/blocks/quizshowGame/AnswerPanel.vue +73 -83
  2. package/components/content/blocks/quizshowGame/QuizShow.vue +40 -30
  3. package/components/settings/QuizShowSettingsManager.vue +228 -201
  4. package/i18n/en-US/components/content/blocks/quizshow_game.ts +1 -1
  5. package/i18n/en-US/components/settings/quizshow_game.ts +8 -2
  6. package/package.json +1 -1
package/components/content/blocks/quizshowGame/AnswerPanel.vue CHANGED
@@ -31,13 +31,15 @@
31
31
  v-if="editMode"
32
32
  v-model="question.text"
33
33
  :counter="255"
34
- maxlength="255"
35
34
  :label="
36
35
  $t(
37
36
  'plugin.games.components.content.blocks.quizshow_game.form.question'
38
37
  )
39
38
  "
40
39
  @input=""
40
+ prepend-inner-icon="mdi-help"
41
+ :autofocus="true"
42
+ rows="2"
41
43
  ></v-textarea>
42
44
  <v-card flat v-if="!editMode" v-html="question.text"></v-card>
43
45
  </v-row>
@@ -46,31 +48,31 @@
46
48
  justify="center"
47
49
  class="pa-4 mb-4 font-weight-bold text-capitalize"
48
50
  >
49
- <v-text-field
51
+ <v-textarea
50
52
  v-if="editMode"
51
53
  v-model="question.feedback"
52
54
  :counter="255"
53
- maxlength="255"
54
55
  :label="
55
56
  $t(
56
- 'plugin.games.components.content.blocks.quizshow_game.feedback.feedback'
57
+ 'plugin.games.components.content.blocks.quizshow_game.feedback.answer'
57
58
  )
58
59
  "
59
- ></v-text-field>
60
+ rows="2"
61
+ prepend-inner-icon="mdi-comment"
62
+ ></v-textarea>
60
63
  </v-row>
61
64
 
62
65
  <div class="d-flex flex-column">
63
66
  <v-row
64
67
  v-for="(choice, choice_index) in question.choices"
65
68
  :key="choice_index"
69
+ :class="!editMode ? 'pb-4' : ''"
66
70
  >
67
- <v-card
68
- v-ripple
69
- v-if="!editMode"
70
- @click="getUserInput(choice_index)"
71
- class="ma-1 pa-5 justify-start flex-fill"
72
- :class="generateButtonColor(choice_index)"
73
- :outlined="generateButtonOutline(choice_index)"
71
+ <v-col
72
+ cols="12"
73
+ md="2"
74
+ class="d-flex justify-end"
75
+ align-self="center"
74
76
  >
75
77
  <v-icon
76
78
  color="success"
@@ -81,8 +83,8 @@
81
83
  choice_index === userInput
82
84
  "
83
85
  >
84
- mdi-check-circle-outline</v-icon
85
- >
86
+ mdi-check-circle
87
+ </v-icon>
86
88
  <v-icon
87
89
  color="error"
88
90
  v-if="
@@ -92,42 +94,52 @@
92
94
  choice_index === userInput
93
95
  "
94
96
  >
95
- mdi-close-circle-outline</v-icon
97
+ mdi-close-circle
98
+ </v-icon>
99
+ <v-radio-group v-if="editMode" v-model="question.answer">
100
+ <v-radio
101
+ :ref="'checkbox' + choice_index"
102
+ :value="choice_index"
103
+ @click="onSetAnswer(choice_index)"
104
+ ></v-radio>
105
+ </v-radio-group>
106
+ </v-col>
107
+ <v-col cols="12" md="8" class="pa-0">
108
+ <v-card
109
+ v-ripple
110
+ v-if="!editMode"
111
+ @click="getUserInput(choice_index)"
112
+ class="pa-2 answer_display"
113
+ :class="generateButtonColor(choice_index)"
114
+ outlined
96
115
  >
97
- <span v-html="mathToHtml(choice.text)"></span>
98
- <v-icon
99
- class="info-icon"
100
- v-if="generateButtonColor(choice_index) === 'success'"
101
- @click="onFeedback"
102
- >mdi-information</v-icon
116
+ <span v-html="mathToHtml(choice.text)"></span>
117
+ <v-icon
118
+ class="info-icon"
119
+ v-if="
120
+ generateButtonColor(choice_index) === 'success'
121
+ "
122
+ @click="onFeedback"
123
+ >mdi-information
124
+ </v-icon>
125
+ </v-card>
126
+ <v-text-field
127
+ class="pa-0"
128
+ v-if="editMode"
129
+ v-model="question.choices[choice_index].text"
130
+ :label="
131
+ $t(
132
+ 'plugin.games.components.content.blocks.quizshow_game.form.choice'
133
+ )
134
+ "
135
+ outlined
136
+ @input=""
137
+ append-icon="mdi-delete-outline"
138
+ color="primary"
139
+ @click:append="deleteItem(choice)"
103
140
  >
104
- </v-card>
105
- <v-text-field
106
- v-if="editMode"
107
- v-model="question.choices[choice_index].text"
108
- :counter="255"
109
- maxlength="255"
110
- :label="
111
- $t(
112
- 'plugin.games.components.content.blocks.quizshow_game.form.choice'
113
- )
114
- "
115
- outlined
116
- @input=""
117
- ></v-text-field>
118
- <v-switch
119
- v-if="editMode"
120
- :disabled="
121
- !question.choices[choice_index].is_answer &&
122
- question.answer !== null
123
- "
124
- v-model="question.choices[choice_index].is_answer"
125
- :label="`is answer`"
126
- @click="setAnswer(choice_index)"
127
- ></v-switch>
128
- <v-icon v-if="editMode" @click="deleteItem(choice)">
129
- mdi-delete
130
- </v-icon>
141
+ </v-text-field>
142
+ </v-col>
131
143
  </v-row>
132
144
  </div>
133
145
  <v-row
@@ -139,7 +151,7 @@
139
151
  v-if="editMode"
140
152
  @click="addChoice"
141
153
  class="ma-1 pa-5 justify-start"
142
- color="secondary"
154
+ color="primary"
143
155
  outlined
144
156
  >
145
157
  {{
@@ -247,25 +259,9 @@ export default {
247
259
  userInput: this.userInput,
248
260
  })
249
261
  },
250
- generateButtonOutline(index) {
251
- if (this.userInput === null) {
252
- return true
253
- }
254
- if (this.question.choices[index].is_answer) {
255
- return false
256
- }
257
- if (
258
- this.userInput !== this.question.answer &&
259
- index === this.userInput
260
- ) {
261
- return false
262
- } else {
263
- return true
264
- }
265
- },
266
262
  generateButtonColor(index) {
267
263
  if (this.userInput === null) {
268
- return 'answer_display'
264
+ return ''
269
265
  }
270
266
  if (this.question.choices[index].is_answer) {
271
267
  return 'success'
@@ -276,7 +272,7 @@ export default {
276
272
  ) {
277
273
  return 'error'
278
274
  } else {
279
- return 'answer_display'
275
+ return ''
280
276
  }
281
277
  },
282
278
  click() {
@@ -294,12 +290,12 @@ export default {
294
290
  this.emitUserInput()
295
291
  }
296
292
  },
297
- setAnswer(index) {
298
- if (this.question.answer === null) {
299
- this.question.answer = index
300
- } else if (this.question.answer === index) {
301
- this.question.answer = null
302
- }
293
+ onSetAnswer(answerIndex) {
294
+ const context = this
295
+ this.question.choices.forEach(function (value, index) {
296
+ context.question.choices[index].is_answer = false
297
+ })
298
+ this.question.choices[answerIndex].is_answer = true
303
299
  },
304
300
  addChoice() {
305
301
  this.question.choices.push({ text: '', is_answer: false })
@@ -319,20 +315,14 @@ export default {
319
315
  </script>
320
316
 
321
317
  <style scoped>
322
- .bucket {
323
- box-shadow: 0px 2px 3px #0000004a;
324
- color: black;
325
- cursor: pointer;
326
- padding: 0.3em;
327
- margin: 0.3em;
328
- vertical-align: middle;
329
- display: inline-block;
330
- }
331
318
  .answer_display {
332
- outline: var(--v-secondary-base) solid 2px;
319
+ outline: var(--v-primary-base) solid 2px;
333
320
  }
334
321
  .info-icon {
335
322
  position: relative;
336
323
  float: right;
337
324
  }
325
+ .clickable {
326
+ cursor: pointer !important;
327
+ }
338
328
  </style>
package/components/content/blocks/quizshowGame/QuizShow.vue CHANGED
@@ -43,7 +43,7 @@
43
43
  .categories"
44
44
  :key="cat_index"
45
45
  class="flex-fill"
46
- outlined
46
+ elevation="0"
47
47
  tile
48
48
  :max-width="
49
49
  block.metadata.config.responsive
@@ -73,32 +73,41 @@
73
73
  class="flex-fill ma-2 pa-5"
74
74
  @click="quizshow(cat_index, point_index)"
75
75
  >
76
- <span class="text--primary">{{
77
- point
78
- }}</span>
79
- <feedback-icons
80
- v-if="!render"
81
- :success="
82
- editorFeedback(
83
- cat_index,
84
- point_index
85
- )
86
- "
87
- :icons="editorFeedbackIcons"
88
- />
89
- <feedback-icons
90
- v-if="
91
- render &&
92
- options.answers[cat_index][
93
- point_index
94
- ] !== null
95
- "
96
- :success="
97
- options.answers[cat_index][
98
- point_index
99
- ]
100
- "
101
- />
76
+ <v-row justify="space-between">
77
+ <v-col md="1" v-if="!render || ( render &&
78
+ options.answers[cat_index][
79
+ point_index
80
+ ] !== null)">
81
+ <feedback-icons
82
+ v-if="!render"
83
+ :success="
84
+ editorFeedback(
85
+ cat_index,
86
+ point_index
87
+ )
88
+ "
89
+ :icons="editorFeedbackIcons"
90
+ />
91
+ <feedback-icons
92
+ v-if="
93
+ render &&
94
+ options.answers[cat_index][
95
+ point_index
96
+ ] !== null
97
+ "
98
+ :success="
99
+ options.answers[cat_index][
100
+ point_index
101
+ ]
102
+ "
103
+ />
104
+ </v-col>
105
+ <v-col align-self="center"
106
+ ><span class="text--primary">{{
107
+ point
108
+ }}</span></v-col
109
+ ></v-row
110
+ >
102
111
  </v-btn>
103
112
  </v-row>
104
113
  </v-col>
@@ -127,8 +136,9 @@
127
136
  >
128
137
  <v-btn
129
138
  class="text-capitalize"
130
- color="secondary"
139
+ color="primary"
131
140
  @click="show = !show"
141
+ outlined
132
142
  >
133
143
  <v-icon>mdi-chevron-left</v-icon>
134
144
  {{
@@ -147,7 +157,7 @@
147
157
  <v-btn
148
158
  outlined
149
159
  class="text-capitalize"
150
- color="secondary"
160
+ color="primary"
151
161
  @click="resetGame"
152
162
  >
153
163
  {{ $t('shared.forms.reset') }}
@@ -506,7 +516,7 @@ export default {
506
516
  return 'error'
507
517
  }
508
518
  } else {
509
- return 'secondary'
519
+ return 'primary'
510
520
  }
511
521
  },
512
522
  },
package/components/settings/QuizShowSettingsManager.vue CHANGED
@@ -22,160 +22,174 @@
22
22
  "
23
23
  ></v-checkbox>
24
24
  <br />
25
- <textEditor v-model="block.metadata.config.instructions" />
26
- <br />
27
-
28
- <v-card elevation="0" outlined>
29
- <v-subheader
30
- >{{
31
- $t(
32
- 'plugin.games.components.settings.quizshow_game.form.max_categories'
33
- )
34
- }}
35
- </v-subheader>
36
- <v-slider
37
- v-model="block.metadata.config.maxCategories"
38
- :tick-labels="[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]"
39
- step="1"
40
- min="1"
41
- max="10"
42
- thumb-label
43
- ticks="always"
44
- tick-size="4"
45
- @change="onChange('categories')"
46
- ></v-slider>
47
- </v-card>
25
+ <v-textarea
26
+ outlined
27
+ auto-grow
28
+ v-model="block.metadata.config.instructions"
29
+ :counter="300"
30
+ maxlength="300"
31
+ :label="
32
+ $t(
33
+ 'plugin.games.components.settings.multiple_choice.instructions'
34
+ )
35
+ "
36
+ ></v-textarea>
48
37
  <br />
49
- <v-card elevation="0" outlined>
50
- <v-subheader
51
- >{{
52
- $t(
53
- 'plugin.games.components.settings.quizshow_game.form.max_rows'
54
- )
55
- }}
56
- </v-subheader>
57
- <v-slider
58
- v-model="block.metadata.config.maxRows"
59
- :tick-labels="[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]"
60
- step="1"
61
- min="1"
62
- max="10"
63
- thumb-label
64
- ticks="always"
65
- tick-size="4"
66
- @change="onChange('rows')"
67
- ></v-slider>
68
- </v-card>
69
38
  <v-expansion-panels outlined tile flat>
39
+ <v-divider class="cardOutline primary"></v-divider>
70
40
  <v-expansion-panel>
71
41
  <v-expansion-panel-header>
72
42
  <template v-slot:default="{ open }">
73
- <v-row no-gutters>
74
- {{
75
- $t(
76
- 'plugin.games.components.settings.quizshow_game.form.categories'
77
- )
78
- }}
43
+ <v-row no-gutters class="text-capitalize">
44
+ <h5>
45
+ {{
46
+ $t(
47
+ 'plugin.games.components.settings.quizshow_game.form.categories'
48
+ )
49
+ }}
50
+ </h5>
79
51
  </v-row>
80
52
  </template>
81
53
  <template v-slot:actions>
82
- <v-icon
83
- :color="
84
- expansionColor(
85
- block.metadata.config.categories,
86
- block.metadata.config.maxCategories
87
- )
88
- "
89
- >
90
- {{
91
- expansionIcon(
92
- block.metadata.config.categories,
93
- block.metadata.config.maxCategories
94
- )
95
- }}
96
- </v-icon>
54
+ <v-icon> mdi-chevron-down </v-icon>
97
55
  </template>
98
56
  </v-expansion-panel-header>
99
57
  <v-expansion-panel-content>
100
- <v-text-field
101
- v-for="index in Number(
102
- block.metadata.config.maxCategories
103
- )"
104
- :key="'cat' + index"
105
- v-model="
106
- block.metadata.config.categories[index - 1]
107
- "
108
- :counter="255"
109
- maxlength="255"
110
- :label="
111
- $t(
112
- 'plugin.games.components.settings.quizshow_game.form.category'
113
- ) +
114
- ' ' +
115
- index
116
- "
117
- outlined
118
- ></v-text-field>
58
+ <v-card elevation="0">
59
+ <v-container class="d-flex justify-center">
60
+ <v-col>
61
+ <v-row
62
+ justify="center"
63
+ align="center"
64
+ v-for="index in Number(
65
+ block.metadata.config.maxCategories
66
+ )"
67
+ >
68
+ <v-text-field
69
+ :key="'cat' + index"
70
+ v-model="
71
+ block.metadata.config
72
+ .categories[index - 1]
73
+ "
74
+ :counter="255"
75
+ append-icon="mdi-delete-outline"
76
+ maxlength="255"
77
+ :label="
78
+ $tc(
79
+ 'plugin.games.components.settings.quizshow_game.form.category',
80
+ 1
81
+ ) +
82
+ ' ' +
83
+ index
84
+ "
85
+ outlined
86
+ @click:append="
87
+ removeCategory(index)
88
+ "
89
+ ></v-text-field>
90
+ </v-row>
91
+ <v-row justify="center" align="center">
92
+ <v-btn
93
+ v-show="
94
+ Number(
95
+ block.metadata.config
96
+ .maxCategories
97
+ ) < 6
98
+ "
99
+ class="text-capitalize clickable"
100
+ @click="addCategory"
101
+ color="primary"
102
+ >
103
+ <v-icon>mdi-plus</v-icon>&nbsp{{
104
+ $t(
105
+ 'plugin.games.components.settings.quizshow_game.form.add_category'
106
+ )
107
+ }}</v-btn
108
+ >
109
+ </v-row>
110
+ </v-col>
111
+ </v-container>
112
+ </v-card>
119
113
  </v-expansion-panel-content>
120
114
  </v-expansion-panel>
121
-
122
- <br />
123
-
115
+ <v-divider class="cardOutline primary"></v-divider>
124
116
  <v-expansion-panel>
125
117
  <v-expansion-panel-header>
126
118
  <template v-slot:default="{ open }">
127
- <v-row no-gutters>
128
- {{
129
- $t(
130
- 'plugin.games.components.settings.quizshow_game.form.points_per_row'
131
- )
132
- }}
119
+ <v-row no-gutters class="text-capitalize">
120
+ <h5>
121
+ {{
122
+ $t(
123
+ 'plugin.games.components.settings.quizshow_game.form.max_rows'
124
+ )
125
+ }}
126
+ </h5>
133
127
  </v-row>
134
128
  </template>
135
129
  <template v-slot:actions>
136
- <v-icon
137
- :color="
138
- expansionColor(
139
- block.metadata.config.points,
140
- block.metadata.config.maxRows
141
- )
142
- "
143
- >
144
- {{
145
- expansionIcon(
146
- block.metadata.config.points,
147
- block.metadata.config.maxRows
148
- )
149
- }}
150
- </v-icon>
130
+ <v-icon> mdi-chevron-down </v-icon>
151
131
  </template>
152
132
  </v-expansion-panel-header>
153
133
  <v-expansion-panel-content>
154
- <v-text-field
155
- v-for="index in Number(
156
- block.metadata.config.maxRows
157
- )"
158
- :key="'row' + index"
159
- v-model="block.metadata.config.points[index - 1]"
160
- type="number"
161
- min="1"
162
- max="9999"
163
- @input="onPointsChange(index - 1)"
164
- :rules="validation.pointsRules"
165
- :label="
166
- $t(
167
- 'plugin.games.components.settings.quizshow_game.form.row'
168
- ) +
169
- ' ' +
170
- index
171
- "
172
- outlined
173
- ></v-text-field>
134
+ <v-card elevation="0">
135
+ <v-container class="d-flex justify-center">
136
+ <v-col>
137
+ <v-row
138
+ justify="center"
139
+ align="center"
140
+ v-for="index in Number(
141
+ block.metadata.config.maxRows
142
+ )"
143
+ >
144
+ <v-text-field
145
+ :key="'row' + index"
146
+ append-icon="mdi-delete-outline"
147
+ v-model="
148
+ block.metadata.config.points[
149
+ index - 1
150
+ ]
151
+ "
152
+ type="number"
153
+ min="1"
154
+ max="9999"
155
+ @input="onPointsChange(index - 1)"
156
+ :label="
157
+ $t(
158
+ 'plugin.games.components.settings.quizshow_game.form.row'
159
+ ) +
160
+ ' ' +
161
+ index
162
+ "
163
+ outlined
164
+ @click:append="removeRow(index)"
165
+ ></v-text-field>
166
+ </v-row>
167
+ <v-row justify="center" align="center">
168
+ <v-btn
169
+ v-show="
170
+ Number(
171
+ block.metadata.config
172
+ .maxRows
173
+ ) < 6
174
+ "
175
+ class="text-capitalize clickable"
176
+ @click="addRow"
177
+ color="primary"
178
+ >
179
+ <v-icon>mdi-plus</v-icon>&nbsp{{
180
+ $t(
181
+ 'plugin.games.components.settings.quizshow_game.form.add_row'
182
+ )
183
+ }}</v-btn
184
+ >
185
+ </v-row>
186
+ </v-col>
187
+ </v-container>
188
+ </v-card>
174
189
  </v-expansion-panel-content>
175
190
  </v-expansion-panel>
191
+ <v-divider class="cardOutline primary"></v-divider>
176
192
  </v-expansion-panels>
177
-
178
- <br />
179
193
  </v-form>
180
194
  <div v-if="loading" class="text-center">
181
195
  <v-progress-circular
@@ -248,13 +262,39 @@ export default {
248
262
  ],
249
263
  },
250
264
  loading: false,
265
+ cursor: 'changePointer',
251
266
  quizShowSettings: {
252
- title: '',
267
+ title: this.$t(
268
+ 'plugin.games.components.settings.quizshow_game.title'
269
+ ),
253
270
  responsive: true,
254
- instructions: '',
271
+ instructions: this.$t(
272
+ 'plugin.games.components.settings.quizshow_game.form.default_instructions'
273
+ ),
255
274
  maxCategories: 4,
256
275
  maxRows: 4,
257
- categories: [' ', ' ', ' ', ' '],
276
+ categories: [
277
+ this.$tc(
278
+ 'plugin.games.components.settings.quizshow_game.form.category',
279
+ 1,
280
+ { index: 1 }
281
+ ),
282
+ this.$tc(
283
+ 'plugin.games.components.settings.quizshow_game.form.category',
284
+ 1,
285
+ { index: 2 }
286
+ ),
287
+ this.$tc(
288
+ 'plugin.games.components.settings.quizshow_game.form.category',
289
+ 1,
290
+ { index: 3 }
291
+ ),
292
+ this.$tc(
293
+ 'plugin.games.components.settings.quizshow_game.form.category',
294
+ 1,
295
+ { index: 4 }
296
+ ),
297
+ ],
258
298
  points: ['100', '200', '300', '400'],
259
299
  },
260
300
  }
@@ -266,37 +306,9 @@ export default {
266
306
  }
267
307
  },
268
308
  methods: {
269
- expansionIcon(element, elementMax) {
270
- let icon = ''
271
- switch (element.length) {
272
- case 0:
273
- icon = 'mdi-alert-circle'
274
- break
275
-
276
- default:
277
- icon = 'mdi-chevron-down'
278
- }
279
-
280
- return icon
281
- },
282
- expansionColor(element, elementMax) {
283
- let color = ''
284
- switch (element.length) {
285
- case 0:
286
- color = 'error'
287
- break
288
- case elementMax:
289
- color = 'success'
290
- break
291
- default:
292
- color = ''
293
- }
294
-
295
- return color
296
- },
297
309
  changeMaxCategories() {
298
- if (this.block.metadata.config.maxCategories > 10) {
299
- this.block.metadata.config.maxCategories = 10
310
+ if (this.block.metadata.config.maxCategories > 6) {
311
+ this.block.metadata.config.maxCategories = 6
300
312
  } else if (
301
313
  !_.isNumber(this.block.metadata.config.maxCategories) ||
302
314
  this.block.metadata.config.maxCategories < 1
@@ -323,8 +335,8 @@ export default {
323
335
  )
324
336
  },
325
337
  changeMaxRows() {
326
- if (this.block.metadata.config.maxRows > 10) {
327
- this.block.metadata.config.maxRows = 10
338
+ if (this.block.metadata.config.maxRows > 6) {
339
+ this.block.metadata.config.maxRows = 6
328
340
  } else if (
329
341
  !_.isNumber(this.block.metadata.config.maxRows) ||
330
342
  this.block.metadata.config.maxRows < 1
@@ -363,46 +375,61 @@ export default {
363
375
  this.block.metadata.config.points[index] = 1
364
376
  }
365
377
  },
366
- onChange(input) {
367
- this.$toast.info(
378
+ addCategory() {
379
+ this.block.metadata.config.categories[
380
+ this.block.metadata.config.maxCategories
381
+ ] =
368
382
  this.$t(
369
- 'plugin.games.components.settings.quizshow_game.form.confirm_change_text'
370
- ),
371
- {
372
- icon: 'mdi-help',
373
- duration: null,
374
- action: [
375
- {
376
- text: this.$t('shared.forms.cancel'),
377
- onClick: (e, toastObject) => {
378
- toastObject.goAway(0)
379
- if (input === 'categories') {
380
- this.block.metadata.config.maxCategories =
381
- this.quizShowSettings.maxCategories
382
- } else if (input === 'rows') {
383
- this.block.metadata.config.maxRows =
384
- this.quizShowSettings.maxRows
385
- }
386
- },
387
- },
388
- {
389
- text: this.$t('shared.forms.confirm'),
390
- // router navigation
391
- onClick: (e, toastObject) => {
392
- if (input === 'categories') {
393
- this.changeMaxCategories()
394
- } else if (input === 'rows') {
395
- this.changeMaxRows()
396
- }
397
- toastObject.goAway(0)
398
- },
399
- },
400
- ],
401
- }
402
- )
383
+ 'plugin.games.components.settings.quizshow_game.form.new'
384
+ ) +
385
+ ' ' +
386
+ this.$tc(
387
+ 'plugin.games.components.settings.quizshow_game.form.category',
388
+ 1
389
+ )
390
+ this.block.metadata.config.maxCategories++
391
+ this.changeMaxCategories()
392
+ },
393
+ removeCategory(index) {
394
+ this.block.metadata.config.categories.splice(index - 1, 1)
395
+ this.block.metadata.config.maxCategories--
396
+ },
397
+ addRow() {
398
+ this.block.metadata.config.points[
399
+ this.block.metadata.config.maxRows
400
+ ] = 100
401
+ this.block.metadata.config.maxRows++
402
+ this.changeMaxRows()
403
+ },
404
+ removeRow(index) {
405
+ //
406
+ // this.block.metadata.config.points.splice(index, 1)
407
+ this.block.metadata.config.points.splice(index - 1, 1)
408
+ this.block.metadata.config.maxRows--
409
+ //this.changeMaxCategories()
410
+ },
411
+ onChange(input) {
412
+ if (input === 'categories') {
413
+ this.changeMaxCategories()
414
+ } else if (input === 'rows') {
415
+ this.changeMaxRows()
416
+ }
403
417
  },
404
418
  },
405
419
  }
406
420
  </script>
407
421
 
408
- <style scoped></style>
422
+ <style lang="scss" scoped>
423
+ .cardOutline {
424
+ border: 0.01rem solid;
425
+ }
426
+ .itemHeight {
427
+ display: flex;
428
+ align-content: center;
429
+ justify-content: space-between;
430
+ height: 60px;
431
+ }
432
+ .clickable {
433
+ cursor: pointer !important;
434
+ }
435
+ </style>
package/i18n/en-US/components/content/blocks/quizshow_game.ts CHANGED
@@ -16,7 +16,7 @@ export default {
16
16
  feedback: {
17
17
  correct: 'Correct',
18
18
  incorrect: 'Incorrect',
19
- feedback: 'Correct Answer Feedback',
19
+ answer: 'Answer Feedback',
20
20
  answer_description: 'Answer Description',
21
21
  placeholder: 'This is the correct choice!'
22
22
  },
package/i18n/en-US/components/settings/quizshow_game.ts CHANGED
@@ -1,14 +1,20 @@
1
1
  export default {
2
+ title: 'Quiz Show',
2
3
  form: {
3
4
  title: 'Title',
4
5
  instructions: 'Instructions',
5
6
  max_categories: '# of Categories',
6
- max_rows: '# of Questions Per Category',
7
- category: 'category',
7
+ new: 'new',
8
+ max_rows: 'points per questions',
9
+ category: 'no categories | category {index} | categories',
10
+ add_category: 'add category',
11
+ add_row: 'add question row',
8
12
  categories: 'Categories',
9
13
  points_per_row: 'Points per question',
10
14
  row: 'row',
11
15
  responsive: 'Responsive Columns',
12
16
  confirm_change_text: 'Are you sure you want to change this?',
17
+ default_instructions:
18
+ 'Drag and drop the correct word, statement, or image presented into the prompt container and watch for feedback. To begin, choose a question box on the quiz board to view a question worth the specified number of points. Select your response to receive immediate feedback. ',
13
19
  },
14
20
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@windward/games",
3
- "version": "0.0.8",
3
+ "version": "0.0.9",
4
4
  "description": "Windward UI Plugin Games",
5
5
  "main": "plugin.js",
6
6
  "scripts": {