@windward/games 0.3.0 → 0.5.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 (39) hide show
  1. package/components/content/CrudTable.vue +8 -4
  2. package/components/content/DatableEditor.vue +1 -0
  3. package/components/content/blocks/crosswordPuzzle/CrosswordPuzzle.vue +3 -2
  4. package/components/content/blocks/dragDrop/BucketGame.vue +9 -4
  5. package/components/content/blocks/dragDrop/SortingGame.vue +2 -1
  6. package/components/content/blocks/flashcards/CardFace.vue +48 -9
  7. package/components/content/blocks/flashcards/Flashcard.vue +26 -17
  8. package/components/content/blocks/flashcards/FlashcardSlides.vue +10 -5
  9. package/components/content/blocks/matchingGame/MatchingGame.vue +327 -304
  10. package/components/content/blocks/multipleChoice/MultipleChoice.vue +6 -2
  11. package/components/content/blocks/multipleChoice/QuestionDialog.vue +2 -0
  12. package/components/content/blocks/quizshowGame/AnswerPanel.vue +3 -1
  13. package/components/content/blocks/quizshowGame/Gridview.vue +1 -0
  14. package/components/content/blocks/quizshowGame/QuizShow.vue +6 -3
  15. package/components/content/blocks/sevenStrikes/SevenStikes.vue +8 -2
  16. package/components/content/blocks/slideshow/SlideShow.vue +31 -22
  17. package/components/content/blocks/wordJumble/WordJumble.vue +8 -3
  18. package/components/settings/BucketGameSettingsManager.vue +5 -1
  19. package/components/settings/CrosswordPuzzleSettingsManager.vue +1 -0
  20. package/components/settings/FlashCardSlidesManager.vue +165 -107
  21. package/components/settings/MatchingGameManager.vue +57 -27
  22. package/components/settings/MultipleChoiceSettingsManager.vue +1 -0
  23. package/components/settings/QuizShowSettingsManager.vue +3 -0
  24. package/components/settings/SevenStrikesSettingsManager.vue +1 -0
  25. package/components/settings/SlideShowManager.vue +32 -12
  26. package/components/settings/SortingGameSettingsManager.vue +1 -0
  27. package/components/settings/WordJumbleSettingsManager.vue +1 -0
  28. package/i18n/en-US/components/content/blocks/slideshow.ts +1 -3
  29. package/i18n/en-US/components/settings/matching_game.ts +4 -0
  30. package/i18n/en-US/components/settings/seven_strikes.ts +1 -1
  31. package/i18n/es-ES/components/content/blocks/slideshow.ts +0 -2
  32. package/i18n/es-ES/components/settings/matching_game.ts +4 -0
  33. package/i18n/es-ES/components/settings/seven_strikes.ts +1 -1
  34. package/i18n/sv-SE/components/content/blocks/slideshow.ts +0 -2
  35. package/i18n/sv-SE/components/settings/matching_game.ts +4 -0
  36. package/i18n/sv-SE/components/settings/seven_strikes.ts +1 -1
  37. package/package.json +1 -1
  38. package/test/blocks/flashcards/CardFace.spec.js +2 -0
  39. package/test/blocks/flashcards/Flashcard.spec.js +1 -0
@@ -1,7 +1,7 @@
1
1
  <template>
2
2
  <div>
3
3
  <div>
4
- <h3
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
- </h3>
13
+ </h2>
14
14
 
15
15
  <p tabindex="0">
16
16
  {{ block.metadata.config.instructions }}
@@ -23,309 +23,304 @@
23
23
  }}
24
24
  </p>
25
25
 
26
- <v-container fluid :class="status" class="pa-0">
27
- <br />
28
- <v-row>
29
- <v-col></v-col>
30
- <v-col class="d-flex justify-center">{{
31
- feedback
32
- ? feedback
33
- : $t(
34
- 'windward.games.components.content.blocks.bucket_game.form.feedback.feedback_here'
35
- )
36
- }}</v-col>
37
- <v-col class="d-flex justify-end pl-4">
38
- <v-btn
39
- v-if="status === 'successOutline'"
40
- class="success mr-5"
41
- @click="onContinueGame"
42
- >{{ $t('shared.forms.continue') }}
43
- </v-btn>
44
- <v-container
45
- v-if="status === 'errorOutline'"
46
- class="d-flex justify-end"
47
- @click="onExitFeedback"
48
- ><v-icon class="icon--error"
49
- >mdi-close-circle</v-icon
50
- >
51
- </v-container>
52
- </v-col>
26
+ <v-container fluid :class="status">
27
+ <v-row class="d-flex justify-center pa-2">{{
28
+ feedback
29
+ ? feedback
30
+ : $t(
31
+ 'windward.games.components.content.blocks.bucket_game.form.feedback.feedback_here'
32
+ )
33
+ }}</v-row>
34
+ <v-row class="d-flex justify-center pa-2">
35
+ <v-btn
36
+ v-if="status === 'successOutline'"
37
+ class="success mr-5"
38
+ elevation="0"
39
+ @click="onContinueGame"
40
+ >{{ $t('shared.forms.continue') }}
41
+ </v-btn>
42
+ <v-container
43
+ v-if="status === 'errorOutline'"
44
+ class="d-flex justify-center align-center"
45
+ @click="onExitFeedback"
46
+ ><v-icon class="icon--error">mdi-close-circle</v-icon>
47
+ </v-container>
53
48
  </v-row>
54
- <br />
55
49
  </v-container>
56
- <div>
57
- <v-container>
58
- <v-row>
59
- <draggable
60
- v-bind="dragOptions"
61
- class="d-flex justify-space-between flex-wrap col-md-12"
62
- :list="block.metadata.config.answerObjects"
63
- :disabled="!allowDrag"
64
- :group="{
65
- name: 'people',
66
- pull: 'clone',
67
- put: false,
68
- }"
69
- @end="onEnd"
70
- >
71
- <v-card
72
- v-for="(answer, aindex) in block.metadata.config
73
- .answerObjects"
74
- :key="aindex"
75
- class="pa-2 ma-2 answerCard container-outline"
76
- outlined
77
- >
78
- <v-icon>mdi-drag-vertical</v-icon>
79
- <span>
80
- {{ answer.display }}
81
- </span>
82
- </v-card>
83
- </draggable>
84
- </v-row>
85
- <v-row
86
- v-if="render"
87
- class="d-flex flex-wrap flex-row justify-center flex-fill"
50
+ <v-container class="pa-0">
51
+ <v-row>
52
+ <draggable
53
+ v-bind="dragOptions"
54
+ class="d-flex justify-space-between flex-wrap col-md-12"
55
+ :list="block.metadata.config.answerObjects"
56
+ :disabled="!allowDrag"
57
+ :group="{
58
+ name: 'people',
59
+ pull: 'clone',
60
+ put: false,
61
+ }"
62
+ @end="onEnd"
88
63
  >
89
- <v-row align="center" class="col-md-12">
90
- <v-card
91
- v-if="mainPrompt['textOrImage'] === 'text'"
92
- class="flex-fill bucket"
93
- min-height="5em"
94
- outlined
95
- tile
96
- color="secondary"
97
- >
98
- <v-card-text class="text-center">
99
- <draggable
100
- class="dragArea list-group"
101
- :key="mainPrompt['prompt']"
102
- v-bind="dragOptions"
103
- disabled
104
- group="people"
105
- tabindex="0"
106
- >
107
- <div
108
- class="card_text secondary"
109
- color="secondary"
110
- >
111
- {{ mainPrompt['prompt'] }}
112
- </div>
113
- </draggable>
114
- </v-card-text>
115
- </v-card>
116
- </v-row>
117
- <v-row align="center" class="col-md-10">
118
- <v-card
119
- v-if="mainPrompt['textOrImage'] === 'image'"
120
- class="pa-2 flex-fill bucket"
121
- min-height="5em"
122
- outlined
123
- tile
124
- >
125
- <v-card-text>
126
- <draggable
127
- v-if="mainPrompt['file']"
128
- class="dragArea list-group"
129
- :key="mainPrompt['prompt']"
130
- v-bind="dragOptions"
131
- disabled
132
- group="people"
133
- tabindex="0"
64
+ <v-card
65
+ v-for="(answer, aindex) in block.metadata.config
66
+ .answerObjects"
67
+ :key="aindex"
68
+ class="pa-2 ma-2 answerCard container-outline"
69
+ outlined
70
+ >
71
+ <v-icon>mdi-drag-vertical</v-icon>
72
+ <span>
73
+ {{ answer.display }}
74
+ </span>
75
+ </v-card>
76
+ </draggable>
77
+ </v-row>
78
+ <v-row
79
+ v-if="render"
80
+ class="d-flex flex-wrap flex-row justify-center flex-fill"
81
+ >
82
+ <v-row align="center" class="col-md-12">
83
+ <v-card
84
+ v-if="mainPrompt['textOrImage'] === 'text'"
85
+ class="flex-fill bucket"
86
+ min-height="5em"
87
+ outlined
88
+ tile
89
+ color="secondary"
90
+ >
91
+ <v-card-text class="text-center">
92
+ <draggable
93
+ class="dragArea list-group"
94
+ :key="mainPrompt['prompt']"
95
+ v-bind="dragOptions"
96
+ disabled
97
+ group="people"
98
+ tabindex="0"
99
+ >
100
+ <div
101
+ class="card_text secondary"
102
+ color="secondary"
134
103
  >
135
- <div
136
- :id="
137
- mainPrompt['file']['asset'][
138
- 'public_url'
139
- ]
140
- "
141
- >
142
- <v-img
143
- v-if="mainPrompt['file']"
144
- :aria-describedby="
104
+ {{ mainPrompt['prompt'] }}
105
+ </div>
106
+ </draggable>
107
+ </v-card-text>
108
+ </v-card>
109
+ </v-row>
110
+ <v-row align="center" class="col-md-10">
111
+ <v-card
112
+ v-if="mainPrompt['textOrImage'] === 'image'"
113
+ class="pa-2 flex-fill bucket"
114
+ min-height="5em"
115
+ outlined
116
+ tile
117
+ >
118
+ <v-card-text>
119
+ <draggable
120
+ v-if="mainPrompt.file"
121
+ class="dragArea list-group"
122
+ :key="mainPrompt['prompt']"
123
+ v-bind="dragOptions"
124
+ disabled
125
+ group="people"
126
+ tabindex="0"
127
+ >
128
+ <div :id="mainPrompt.file.id">
129
+ <v-img
130
+ :aria-describedby="
131
+ getFileAriaDescribedBy(
132
+ mainPrompt.file,
145
133
  mainPrompt[
146
134
  'ariaDescribedBy'
147
135
  ]
148
- "
149
- :alt="mainPrompt['altText']"
150
- :src="
151
- mainPrompt['file']['asset'][
152
- 'public_url'
153
- ]
154
- "
155
- ></v-img>
156
- </div>
157
- </draggable>
158
- </v-card-text>
159
- </v-card>
160
- </v-row>
136
+ )
137
+ "
138
+ :alt="
139
+ getFileAlt(
140
+ mainPrompt.file,
141
+ mainPrompt['altText']
142
+ )
143
+ "
144
+ :src="
145
+ getFilePublicUrl(
146
+ mainPrompt.file
147
+ )
148
+ "
149
+ ></v-img>
150
+ </div>
151
+ </draggable>
152
+ </v-card-text>
153
+ </v-card>
161
154
  </v-row>
162
- <v-row
163
- v-if="
164
- !render && block.metadata.config.prompts.length > 0
165
- "
166
- class="d-flex flex-wrap flex-row justify-center flex-fill"
167
- >
168
- <v-row align="center" class="col-md-12">
169
- <v-card
170
- v-if="
171
- block.metadata.config.prompts[
172
- startingIndex
173
- ][startingIndex].textOrImage === 'text'
174
- "
175
- class="pa-2 flex-fill bucket"
176
- min-height="5em"
177
- outlined
178
- tile
179
- color="secondary"
180
- >
181
- <v-card-text class="text-center">
182
- <draggable
183
- v-bind="dragOptions"
184
- class="dragArea list-group"
185
- disabled
186
- group="people"
187
- tabindex="0"
155
+ </v-row>
156
+ <v-row
157
+ v-if="!render && block.metadata.config.prompts.length > 0"
158
+ class="d-flex flex-wrap flex-row justify-center flex-fill"
159
+ >
160
+ <v-row align="center" class="col-md-12">
161
+ <v-card
162
+ v-if="
163
+ block.metadata.config.prompts[startingIndex][
164
+ startingIndex
165
+ ].textOrImage === 'text'
166
+ "
167
+ class="pa-2 flex-fill bucket"
168
+ min-height="5em"
169
+ outlined
170
+ tile
171
+ color="secondary"
172
+ >
173
+ <v-card-text class="text-center">
174
+ <draggable
175
+ v-bind="dragOptions"
176
+ class="dragArea list-group"
177
+ disabled
178
+ group="people"
179
+ tabindex="0"
180
+ >
181
+ <div
182
+ class="card_text secondary"
183
+ color="secondary"
188
184
  >
189
- <div
190
- class="card_text secondary"
191
- color="secondary"
192
- >
193
- {{
194
- block.metadata.config.prompts[
195
- startingIndex
196
- ][startingIndex].prompt
197
- }}
198
- </div>
199
- </draggable>
200
- </v-card-text>
201
- </v-card>
202
- </v-row>
203
- <v-row align="center" class="col-md-10">
204
- <v-card
205
- v-if="
206
- block.metadata.config.prompts[
207
- startingIndex
208
- ][startingIndex].textOrImage === 'image' &&
209
- block.metadata.config.prompts[
210
- startingIndex
211
- ][startingIndex].file
212
- "
213
- class="pa-2 flex-fill bucket"
214
- min-height="5em"
215
- outlined
216
- tile
217
- >
218
- <v-card-text>
219
- <draggable
220
- v-bind="dragOptions"
221
- class="dragArea list-group"
222
- :key="
185
+ {{
186
+ block.metadata.config.prompts[
187
+ startingIndex
188
+ ][startingIndex].prompt
189
+ }}
190
+ </div>
191
+ </draggable>
192
+ </v-card-text>
193
+ </v-card>
194
+ </v-row>
195
+ <v-row align="center" class="col-md-10">
196
+ <v-card
197
+ v-if="
198
+ block.metadata.config.prompts[startingIndex][
199
+ startingIndex
200
+ ].textOrImage === 'image' &&
201
+ block.metadata.config.prompts[startingIndex][
202
+ startingIndex
203
+ ].file
204
+ "
205
+ class="pa-2 flex-fill bucket"
206
+ min-height="5em"
207
+ outlined
208
+ tile
209
+ >
210
+ <v-card-text>
211
+ <draggable
212
+ v-bind="dragOptions"
213
+ class="dragArea list-group"
214
+ :key="
215
+ block.metadata.config.prompts[
216
+ startingIndex
217
+ ]['prompt']
218
+ "
219
+ disabled
220
+ group="people"
221
+ tabindex="0"
222
+ >
223
+ <div
224
+ :id="
223
225
  block.metadata.config.prompts[
224
226
  startingIndex
225
- ]['prompt']
227
+ ][startingIndex].file.id
226
228
  "
227
- disabled
228
- group="people"
229
- tabindex="0"
230
229
  >
231
- <div
232
- :id="
233
- block.metadata.config.prompts[
234
- startingIndex
235
- ][startingIndex].file.asset
236
- .public_url
237
- "
238
- >
239
- <v-img
240
- v-if="
230
+ <v-img
231
+ :aria-describedby="
232
+ getFileAriaDescribedBy(
241
233
  block.metadata.config
242
234
  .prompts[startingIndex][
243
235
  startingIndex
244
- ]['file']
245
- "
246
- :aria-describedby="
236
+ ].file,
247
237
  block.metadata.config
248
238
  .prompts[startingIndex][
249
239
  startingIndex
250
240
  ]['ariaDescribedBy']
251
- "
252
- :alt="
241
+ )
242
+ "
243
+ :alt="
244
+ getFileAlt(
245
+ block.metadata.config
246
+ .prompts[startingIndex][
247
+ startingIndex
248
+ ].file,
253
249
  block.metadata.config
254
250
  .prompts[startingIndex][
255
251
  startingIndex
256
252
  ]['altText']
257
- "
258
- :src="
253
+ )
254
+ "
255
+ :src="
256
+ getFilePublicUrl(
259
257
  block.metadata.config
260
258
  .prompts[startingIndex][
261
259
  startingIndex
262
- ]['file']['asset'][
263
- 'public_url'
264
- ]
265
- "
266
- ></v-img>
267
- </div>
268
- </draggable>
269
- </v-card-text>
270
- </v-card>
271
- </v-row>
260
+ ].file
261
+ )
262
+ "
263
+ ></v-img>
264
+ </div>
265
+ </draggable>
266
+ </v-card-text>
267
+ </v-card>
272
268
  </v-row>
273
- <v-container
274
- class="d-flex flex-wrap flex-row justify-center flex-fill"
275
- align="end"
276
- >
277
- <v-layout>
278
- <v-flex xs8></v-flex>
279
- <v-flex xs4>
280
- <v-row
281
- align="end"
282
- tabindex="0"
283
- :aria-label="
269
+ </v-row>
270
+ <v-container
271
+ class="d-flex flex-wrap flex-row justify-center flex-fill"
272
+ align="end"
273
+ >
274
+ <v-row>
275
+ <!-- <v-flex xs8></v-flex> -->
276
+ <v-col cols="12" lg="6" md="7" sm="6"></v-col>
277
+ <v-col cols="12" lg="6" md="5" sm="6">
278
+ <v-row
279
+ align="end"
280
+ tabindex="0"
281
+ :aria-label="
282
+ $t(
283
+ 'windward.games.components.content.blocks.matching_game.of_complete',
284
+ [completedAmount, totalAmountQuestions]
285
+ )
286
+ "
287
+ >
288
+ <v-col align="end" tabindex="0" class="pa-0">
289
+ {{
284
290
  $t(
285
- 'windward.games.components.content.blocks.matching_game.of_complete',
291
+ 'windward.games.components.content.blocks.matching_game.of_complete_text_area',
286
292
  [
287
293
  completedAmount,
288
294
  totalAmountQuestions,
289
295
  ]
290
296
  )
291
- "
292
- >
293
- <v-col align="end" tabindex="0">
294
- {{
297
+ }}
298
+ <v-progress-linear
299
+ v-model="completedPercent"
300
+ color="primary"
301
+ outlined
302
+ rounded
303
+ height="15"
304
+ style="pointer-events: none"
305
+ ></v-progress-linear>
306
+ <br />
307
+ <v-btn
308
+ color="primary"
309
+ outlined
310
+ elevation="0"
311
+ @click="onReset"
312
+ >{{
295
313
  $t(
296
- 'windward.games.components.content.blocks.matching_game.of_complete_text_area',
297
- [
298
- completedAmount,
299
- totalAmountQuestions,
300
- ]
314
+ 'windward.games.components.content.blocks.matching_game.reset'
301
315
  )
302
316
  }}
303
- <v-progress-linear
304
- v-model="completedPercent"
305
- color="primary"
306
- outlined
307
- rounded
308
- height="15"
309
- style="pointer-events: none"
310
- ></v-progress-linear>
311
- <br />
312
- <v-btn
313
- color="primary"
314
- outlined
315
- @click="onReset"
316
- >{{
317
- $t(
318
- 'windward.games.components.content.blocks.matching_game.reset'
319
- )
320
- }}
321
- </v-btn>
322
- </v-col>
323
- </v-row>
324
- </v-flex>
325
- </v-layout>
326
- </v-container>
317
+ </v-btn>
318
+ </v-col>
319
+ </v-row>
320
+ </v-col>
321
+ </v-row>
327
322
  </v-container>
328
- </div>
323
+ </v-container>
329
324
  </div>
330
325
  <br />
331
326
  </div>
@@ -359,12 +354,12 @@ export default {
359
354
  }
360
355
  if (_.isEmpty(this.block.metadata.config.feedback_correct)) {
361
356
  this.block.metadata.config.feedback_correct = this.$t(
362
- 'windward.games.components.settings.bucket_game.form.feedback.correct_default'
357
+ 'windward.games.components.settings.matching_game.form.correct_match'
363
358
  )
364
359
  }
365
360
  if (_.isEmpty(this.block.metadata.config.feedback_incorrect)) {
366
361
  this.block.metadata.config.feedback_incorrect = this.$t(
367
- 'windward.games.components.settings.bucket_game.form.feedback.incorrect_default'
362
+ 'windward.games.components.settings.matching_game.form.incorrect_match'
368
363
  )
369
364
  }
370
365
  if (_.isEmpty(this.block.metadata.config.prompts)) {
@@ -410,12 +405,7 @@ export default {
410
405
  mainPrompt: {
411
406
  altText: '',
412
407
  answer: {},
413
- file: {
414
- asset: {
415
- public_url: '',
416
- },
417
- name: '',
418
- },
408
+ file: null,
419
409
  prompt: '',
420
410
  textOrImage: 'text',
421
411
  },
@@ -464,48 +454,59 @@ export default {
464
454
  }
465
455
  },
466
456
  onEnd(evt, originalEvent) {
457
+ // if dragged to nowhere do not set target
458
+ const draggedToNowhere = evt.to === evt.from
467
459
  if (!this.render) {
468
460
  this.mainPrompt =
469
461
  this.block.metadata.config.prompts[this.startingIndex]
470
462
  }
471
463
  let draggedElement = ''
472
464
  let target = ''
473
- if (this.mainPrompt.textOrImage === 'text') {
474
- draggedElement =
475
- this.block.metadata.config.answerObjects[evt.oldIndex]
476
- this.block.metadata.config.prompts.forEach((outerElement) => {
477
- const getMain = outerElement.find((element) => {
478
- return (
479
- element.prompt ==
480
- evt.to.firstChild.textContent.trim()
481
- )
482
- })
483
- if (getMain) {
484
- target = getMain
485
- }
486
- })
487
- } else {
488
- draggedElement =
489
- this.block.metadata.config.answerObjects[evt.oldIndex]
490
- this.block.metadata.config.prompts.forEach((outerElement) => {
491
- const mainElement = outerElement.find((element) => {
492
- return (
493
- element.file?.asset.public_url ==
494
- evt.to.firstElementChild.id
495
- )
496
- })
497
- if (mainElement) {
498
- target = mainElement
499
- }
500
- })
465
+ if (!draggedToNowhere) {
466
+ if (this.mainPrompt.textOrImage === 'text') {
467
+ draggedElement =
468
+ this.block.metadata.config.answerObjects[evt.oldIndex]
469
+ this.block.metadata.config.prompts.forEach(
470
+ (outerElement) => {
471
+ const getMain = outerElement.find((element) => {
472
+ return (
473
+ element.prompt ==
474
+ evt.to.firstChild.textContent.trim()
475
+ )
476
+ })
477
+ if (getMain) {
478
+ target = getMain
479
+ }
480
+ }
481
+ )
482
+ } else {
483
+ draggedElement =
484
+ this.block.metadata.config.answerObjects[evt.oldIndex]
485
+ this.block.metadata.config.prompts.forEach(
486
+ (outerElement) => {
487
+ const mainElement = outerElement.find((element) => {
488
+ return (
489
+ element.file?.id ==
490
+ evt.to.firstElementChild.id
491
+ )
492
+ })
493
+ if (mainElement) {
494
+ target = mainElement
495
+ }
496
+ }
497
+ )
498
+ }
501
499
  }
500
+ //set feedback information here
502
501
  if (_.isUndefined(target) || _.isEmpty(target)) {
503
502
  console.log('dragged to nowhere')
504
503
  } else if (draggedElement.id !== target.answer.id) {
505
504
  this.feedback = this.block.metadata.config.feedback_incorrect
506
505
  this.status = 'errorOutline'
507
506
  } else if (draggedElement.id === target.answer.id) {
508
- this.feedback = this.block.metadata.config.feedback_correct
507
+ this.feedback = !_.isEmpty(target.matchExplanation)
508
+ ? target.matchExplanation
509
+ : this.block.metadata.config.feedback_correct
509
510
  this.solvedQuestions.push(target)
510
511
  this.status = 'successOutline'
511
512
  this.allowDrag = false
@@ -550,6 +551,28 @@ export default {
550
551
  )
551
552
  this.setMainPrompt()
552
553
  },
554
+ getFileAlt(file, defaultText = '') {
555
+ // If a default / override was defined
556
+ if (defaultText) {
557
+ return defaultText
558
+ }
559
+
560
+ file = this.resolveAsset(file)
561
+ return _.get(file, 'asset.metadata.props.alt', '')
562
+ },
563
+ getFileAriaDescribedBy(file, defaultText = '') {
564
+ // If a default / override was defined
565
+ if (defaultText) {
566
+ return defaultText
567
+ }
568
+
569
+ file = this.resolveAsset(file)
570
+ return _.get(file, 'asset.metadata.props.aria_describedby', '')
571
+ },
572
+ getFilePublicUrl(file) {
573
+ file = this.resolveAsset(file)
574
+ return _.get(file, 'asset.public_url', '')
575
+ },
553
576
  },
554
577
  }
555
578
  </script>