@windward/games 0.22.0 → 0.24.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## Release [0.24.0] - 2025-10-23
+
+* Merged in feature/LE-2034/generate-crossword (pull request #262)
+* Merged in bugfix/LE-2020-the-quiz-show-manager-panel-does (pull request #263)
+
+
+## Release [0.23.0] - 2025-09-16
+
+* Merged in feature/LE-2035/seven-strikes (pull request #259)
+* Merged in feature/LE-1998/MC-games (pull request #258)
+* Merged in feature/LE-1853-multiple-choice-block-optional-h (pull request #257)
+* Merged in bugfix/MIND-6075-decouple-generateaiquestionbut (pull request #254)
+* Merged in feature/LE-2091-multiple-choice-block-add-space- (pull request #253)
+* Merged release/0.22.0 into feature/LE-2091-multiple-choice-block-add-space-
+
+
 ## Release [0.22.0] - 2025-08-28
 
 * Merged in feature/LE-2036/update-core-package-v (pull request #252)

package/components/content/blocks/multipleChoice/MultipleChoice.vue

@@ -81,7 +81,7 @@
                                 <div class="d-flex justify-space-between">
                                     <div class="d-flex">
                                         <p
-                                            class="mb-0"
+                                            class="mb-0 mr-1"
                                             :aria-labelledby="answer.value"
                                         >
                                             {{
@@ -147,6 +147,7 @@
                             text
                             elevation="0"
                             class="mr-4 btn-hint"
+                            :disabled="hasHint(question)"
                             @click="onHint(question)"
                             >{{
                                 $t(
@@ -318,6 +319,12 @@ export default {
         },
     },
     methods: {
+        hasHint(question) {
+            if (_.isEmpty(question.hint)) {
+                return true
+            }
+            return false
+        },
         onAnswerDescription(question, answer) {
             this.activeQuestion = question
             this.activeAnswer = answer

package/components/content/blocks/multipleChoice/QuestionDialog.vue

@@ -18,15 +18,6 @@
                     @input="onCheckValidation"
                 ></TextEditor>
             </v-col>
-            <v-col xl="3" lg="3" md="4" sm="12" cols="12" v-if="false">
-                <GenerateAIQuestionButton
-                    :course="course"
-                    :content="content"
-                    :block="block"
-                    :question-type="questionType"
-                    @click:generate="onQuestionGenerated"
-                ></GenerateAIQuestionButton>
-            </v-col>
             <v-col cols="12">
                 <ImageAssetSettings
                     v-model="question.question_metadata.body_asset"

package/components/content/blocks/quizshowGame/feedbackIcons.vue

@@ -31,10 +31,10 @@ export default {
         icons: {
             type: Object,
             required: false,
-            default: {
+            default: () => ({
                 success: 'mdi-check-circle-outline',
                 error: 'mdi-close-circle-outline',
-            },
+            }),
         },
     },
 }

package/components/settings/BucketGameSettingsManager.vue

@@ -196,14 +196,18 @@
         <v-container class="pa-4 mb-6">
             <v-row>
                 <v-col cols="12">
-                    <GenerateAIQuestionButton
-                        :course="course"
-                        :content="currentContent"
-                        :block="block"
-                        question-type="bucket_game"
-                        :replace-existing-mode="replaceExisting"
-                        @click:generate="onGeneratedBucketGame"
-                    ></GenerateAIQuestionButton>
+                    <PluginRef
+                        target="contentBlockSettingTool"
+                        :attrs="{
+                            value: block,
+                            course: course,
+                            content: currentContent,
+                        }"
+                        :on="{
+                            input: onPluginSetBlock,
+                            append: onPluginAppendBlock,
+                        }"
+                    ></PluginRef>
                 </v-col>
             </v-row>
         </v-container>
@@ -217,7 +221,6 @@ import {
     MathExpressionEditor,
     MathLiveWrapper,
     ContentViewer,
-    GenerateAIQuestionButton
 } from '@windward/core/utils'
 import colors from 'vuetify/lib/util/colors'
 import TextEditor from '~/components/Text/TextEditor'
@@ -225,6 +228,7 @@ import BaseContentBlockSettings from '~/components/Content/Settings/BaseContentB
 import Crypto from '~/helpers/Crypto'
 import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
 import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
+import PluginRef from '~/components/Core/PluginRef.vue'
 import Uuid from '~/helpers/Uuid'
 
 export default {
@@ -237,9 +241,9 @@ export default {
         SortableExpansionPanel,
         BaseContentBlockSettings,
         TextEditor,
-        GenerateAIQuestionButton,
+        PluginRef,
     },
-    beforeMount() {   
+    beforeMount() {
         if (_.isEmpty(this.block)) {
             this.block = {}
         }
@@ -424,125 +428,161 @@ export default {
                 return htmlString.replace(/(<([^>]+)>)/gi, '')
             }
         },
-        // Handler for receiving bucket game data from GenerateAIQuestionButton
-        onGeneratedBucketGame(activityData, replaceMode) {
+        // Handler for receiving bucket game data from Plugins
+        onPluginSetBlock(activityData) {
             this.loading = true
             try {
                 // Process the activity data
-                if (activityData && activityData.metadata &&
+                if (
+                    activityData &&
+                    activityData.metadata &&
                     activityData.metadata.config &&
                     activityData.metadata.config.bucket_titles &&
                     activityData.metadata.config.bucket_answers &&
                     Array.isArray(activityData.metadata.config.bucket_titles) &&
-                    Array.isArray(activityData.metadata.config.bucket_answers)) {
-
+                    Array.isArray(activityData.metadata.config.bucket_answers)
+                ) {
                     // Save new buckets and answers
-                    const newBuckets = activityData.metadata.config.bucket_titles
-                    const newAnswers = activityData.metadata.config.bucket_answers
+                    const newBuckets =
+                        activityData.metadata.config.bucket_titles
+                    const newAnswers =
+                        activityData.metadata.config.bucket_answers
 
-                    if (replaceMode) {
-                        // Replace mode: Clear existing buckets and answers
-                        this.block.metadata.config.bucket_titles.splice(0, this.block.metadata.config.bucket_titles.length)
-                        this.block.metadata.config.bucket_answers.splice(0, this.block.metadata.config.bucket_answers.length)
+                    // Replace mode: Clear existing buckets and answers
+                    this.block.metadata.config.bucket_titles.splice(
+                        0,
+                        this.block.metadata.config.bucket_titles.length
+                    )
+                    this.block.metadata.config.bucket_answers.splice(
+                        0,
+                        this.block.metadata.config.bucket_answers.length
+                    )
 
-                        // Add all new buckets
-                        newBuckets.forEach(bucket => {
-                            this.block.metadata.config.bucket_titles.push({
-                                title: bucket.title || '',
-                                color: bucket.color || colors.blueGrey.lighten5,
-                                expand: false
-                            })
+                    // Add all new buckets
+                    newBuckets.forEach((bucket) => {
+                        this.block.metadata.config.bucket_titles.push({
+                            title: bucket.title || '',
+                            color: bucket.color || colors.blueGrey.lighten5,
+                            expand: false,
                         })
+                    })
 
-                        // Add all new answers
-                        newAnswers.forEach((bucketAnswers, index) => {
-                            this.block.metadata.config.bucket_answers[index] = []
-                            if (Array.isArray(bucketAnswers)) {
-                                bucketAnswers.forEach(answer => {
-                                    this.block.metadata.config.bucket_answers[index].push({
-                                        bucket_index: index,
-                                        display: answer.display || '',
-                                        feedback: answer.feedback || '',
-                                        expand: false,
-                                        id: Crypto.id()
-                                    })
+                    // Add all new answers
+                    newAnswers.forEach((bucketAnswers, index) => {
+                        this.block.metadata.config.bucket_answers[index] = []
+                        if (Array.isArray(bucketAnswers)) {
+                            bucketAnswers.forEach((answer) => {
+                                this.block.metadata.config.bucket_answers[
+                                    index
+                                ].push({
+                                    bucket_index: index,
+                                    display: answer.display || '',
+                                    feedback: answer.feedback || '',
+                                    expand: false,
+                                    id: Crypto.id(),
                                 })
-                            }
-                        })
-                    } else {
-                        // Merge mode: Add new buckets and answers to existing ones
-                        const existingBucketCount = this.block.metadata.config.bucket_titles.length
-
-                        // Add new buckets
-                        newBuckets.forEach(bucket => {
-                            this.block.metadata.config.bucket_titles.push({
-                                title: bucket.title || '',
-                                color: bucket.color || colors.blueGrey.lighten5,
-                                expand: false
                             })
-                        })
+                        }
+                    })
 
-                        // Add new answers with adjusted bucket indices
-                        newAnswers.forEach((bucketAnswers, index) => {
-                            const adjustedIndex = existingBucketCount + index
-                            if (!this.block.metadata.config.bucket_answers[adjustedIndex]) {
-                                this.block.metadata.config.bucket_answers[adjustedIndex] = []
-                            }
-                            if (Array.isArray(bucketAnswers)) {
-                                bucketAnswers.forEach(answer => {
-                                    this.block.metadata.config.bucket_answers[adjustedIndex].push({
-                                        bucket_index: adjustedIndex,
-                                        display: answer.display || '',
-                                        feedback: answer.feedback || '',
-                                        expand: false,
-                                        id: Crypto.id()
-                                    })
-                                })
-                            }
-                        })
+                    // Update title and instructions if provided and we're in replace mode
+                    if (activityData.metadata.config.title) {
+                        this.block.metadata.config.title =
+                            activityData.metadata.config.title
                     }
 
-                    // Update title and instructions if provided and we're in replace mode
-                    if (replaceMode) {
-                        if (activityData.metadata.config.title) {
-                            this.block.metadata.config.title = activityData.metadata.config.title
-                        }
+                    if (activityData.metadata.config.instructions) {
+                        this.block.metadata.config.instructions =
+                            activityData.metadata.config.instructions
+                    }
 
-                        if (activityData.metadata.config.instructions) {
-                            this.block.metadata.config.instructions = activityData.metadata.config.instructions
-                        }
+                    // Update feedback messages if provided
+                    if (activityData.metadata.config.feedback_correct) {
+                        this.block.metadata.config.feedback_correct =
+                            activityData.metadata.config.feedback_correct
+                    }
 
-                        // Update feedback messages if provided
-                        if (activityData.metadata.config.feedback_correct) {
-                            this.block.metadata.config.feedback_correct = activityData.metadata.config.feedback_correct
-                        }
+                    if (activityData.metadata.config.feedback_incorrect) {
+                        this.block.metadata.config.feedback_incorrect =
+                            activityData.metadata.config.feedback_incorrect
+                    }
 
-                        if (activityData.metadata.config.feedback_incorrect) {
-                            this.block.metadata.config.feedback_incorrect = activityData.metadata.config.feedback_incorrect
+                    this.$toast.success(
+                        this.$t(
+                            'windward.games.components.settings.bucket_game.form.replaced_successfully'
+                        ),
+                        { duration: 3000 }
+                    )
+                } else {
+                    this.$toast.error(
+                        this.$t(
+                            'windward.games.components.settings.bucket_game.form.invalid_response'
+                        ),
+                        {
+                            duration: 5000,
                         }
+                    )
+                }
+            } catch (error) {
+                // Extract error message from the response
+                const errorMessage = error.message || 'Unknown error occurred'
+                this.$toast.error(
+                    `${this.$t(
+                        'windward.games.components.settings.bucket_game.form.failed_to_process'
+                    )}: ${errorMessage}`,
+                    {
+                        duration: 5000,
                     }
+                )
+            } finally {
+                this.loading = false
+            }
+        },
 
+        onPluginAppendBlock(activityData) {
+            this.loading = true
+            try {
+                // Process the activity data
+                if (
+                    activityData &&
+                    activityData.metadata &&
+                    activityData.metadata.config &&
+                    activityData.metadata.config.bucket_titles &&
+                    activityData.metadata.config.bucket_answers &&
+                    Array.isArray(activityData.metadata.config.bucket_titles) &&
+                    Array.isArray(activityData.metadata.config.bucket_answers)
+                ) {
                     this.$toast.success(
-                        replaceMode
-                            ? this.$t('windward.games.components.settings.bucket_game.form.replaced_successfully')
-                            : this.$t('windward.games.components.settings.bucket_game.form.added_successfully'),
+                        this.$t(
+                            'windward.games.components.settings.bucket_game.form.added_successfully'
+                        ),
                         { duration: 3000 }
                     )
                 } else {
-                    this.$toast.error(this.$t('windward.games.components.settings.bucket_game.form.invalid_response'), {
-                        duration: 5000
-                    })
+                    this.$toast.error(
+                        this.$t(
+                            'windward.games.components.settings.bucket_game.form.invalid_response'
+                        ),
+                        {
+                            duration: 5000,
+                        }
+                    )
                 }
             } catch (error) {
                 // Extract error message from the response
                 const errorMessage = error.message || 'Unknown error occurred'
-                this.$toast.error(`${this.$t('windward.games.components.settings.bucket_game.form.failed_to_process')}: ${errorMessage}`, {
-                    duration: 5000
-                })
+                this.$toast.error(
+                    `${this.$t(
+                        'windward.games.components.settings.bucket_game.form.failed_to_process'
+                    )}: ${errorMessage}`,
+                    {
+                        duration: 5000,
+                    }
+                )
             } finally {
                 this.loading = false
             }
-        }
+        },
     },
 }
 </script>

package/components/settings/CrosswordPuzzleSettingsManager.vue

@@ -90,6 +90,24 @@
                 </v-row>
             </v-container>
         </v-container>
+        <v-container class="pa-4 mb-6">
+            <v-row>
+                <v-col cols="12">
+                    <PluginRef
+                        target="contentBlockSettingTool"
+                        :attrs="{
+                            value: block,
+                            course: course,
+                            content: currentContent,
+                        }"
+                        :on="{
+                            input: onPluginSetBlock,
+                            append: onPluginAppendBlock,
+                        }"
+                    ></PluginRef>
+                </v-col>
+            </v-row>
+        </v-container>
         <div v-if="loading" class="text-center">
             <v-progress-circular
                 :size="70"
@@ -103,15 +121,17 @@
 
 <script>
 import _ from 'lodash'
+import { mapGetters } from 'vuex'
 import BaseContentBlockSettings from '~/components/Content/Settings/BaseContentBlockSettings.vue'
 import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
 import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
+import PluginRef from '~/components/Core/PluginRef.vue'
 import Uuid from '~/helpers/Uuid'
 
 export default {
     name: 'CrosswordPuzzleSettingsManager',
     extends: BaseContentSettings,
-    components: { SortableExpansionPanel, BaseContentBlockSettings },
+    components: { SortableExpansionPanel, BaseContentBlockSettings, PluginRef },
     beforeMount() {
         if (_.isEmpty(this.block)) {
             this.block = {}
@@ -186,6 +206,12 @@ export default {
             },
         }
     },
+    computed: {
+        ...mapGetters({
+            course: 'course/get',
+            currentContent: 'content/get',
+        }),
+    },
     methods: {
         onAddElement() {
             // pushes in new crossword object
@@ -207,6 +233,227 @@ export default {
                 this.onAddElement()
             }
         },
+        onPluginSetBlock(activityData) {
+            this.loading = true
+            try {
+                const result = this.processGeneratedCrossword(activityData)
+                if (!result) {
+                    this.showInvalidResponseToast()
+                    return
+                }
+
+                this.$set(
+                    this.block.metadata,
+                    'config',
+                    this.block.metadata.config || {}
+                )
+
+                this.$set(
+                    this.block.metadata.config,
+                    'words',
+                    result.words.map((item, index) => ({
+                        id: index,
+                        word: item.word,
+                        clue: item.clue,
+                        expand: false,
+                    }))
+                )
+
+                if (result.title) {
+                    this.block.metadata.config.title = result.title
+                }
+
+                this.$toast.success(
+                    this.$t(
+                        'windward.games.components.settings.crossword.replaced_successfully'
+                    ),
+                    { duration: 3000 }
+                )
+            } catch (error) {
+                console.error('Failed to process generated crossword items', error)
+                this.$toast.error(
+                    this.$t(
+                        'windward.games.components.settings.crossword.failed_to_process'
+                    ),
+                    { duration: 5000 }
+                )
+            } finally {
+                this.loading = false
+            }
+        },
+        onPluginAppendBlock(activityData) {
+            this.loading = true
+            try {
+                const result = this.processGeneratedCrossword(activityData)
+                if (!result) {
+                    this.showInvalidResponseToast()
+                    return
+                }
+
+                if (!Array.isArray(this.block.metadata.config.words)) {
+                    this.$set(this.block.metadata.config, 'words', [])
+                }
+
+                const startingIndex = this.block.metadata.config.words.length
+
+                result.words.forEach((item, index) => {
+                    this.block.metadata.config.words.push({
+                        id: startingIndex + index,
+                        word: item.word,
+                        clue: item.clue,
+                        expand: false,
+                    })
+                })
+
+                this.renumberWordIds()
+
+                if (result.title) {
+                    const defaultTitle = this.$t(
+                        'windward.games.components.content.blocks.crossword.crossword'
+                    )
+                    if (
+                        !this.block.metadata.config.title ||
+                        this.block.metadata.config.title === defaultTitle
+                    ) {
+                        this.block.metadata.config.title = result.title
+                    }
+                }
+
+                this.$toast.success(
+                    this.$t(
+                        'windward.games.components.settings.crossword.added_successfully'
+                    ),
+                    { duration: 3000 }
+                )
+            } catch (error) {
+                console.error('Failed to append generated crossword items', error)
+                this.$toast.error(
+                    this.$t(
+                        'windward.games.components.settings.crossword.failed_to_process'
+                    ),
+                    { duration: 5000 }
+                )
+            } finally {
+                this.loading = false
+            }
+        },
+        processGeneratedCrossword(activityData) {
+            const config = _.get(activityData, 'metadata.config', null)
+            const words = _.get(config, 'words', [])
+
+            if (!Array.isArray(words) || words.length === 0) {
+                return null
+            }
+
+            const sanitizedWords = words
+                .map((item) => {
+                    const sanitizedWord = this.normalizeWord(item?.word)
+                    const sanitizedClue = this.normalizeClue(item?.clue)
+
+                    if (!sanitizedWord || !sanitizedClue) {
+                        return null
+                    }
+
+                    return {
+                        word: sanitizedWord,
+                        clue: sanitizedClue,
+                        expand: false,
+                    }
+                })
+                .filter((item) => item !== null)
+
+            if (sanitizedWords.length < 2) {
+                return null
+            }
+
+            const limitedWords = sanitizedWords.slice(0, 10)
+
+            const normalizedTitle = this.normalizeTitle(_.get(config, 'title', ''))
+
+            return {
+                title: normalizedTitle,
+                words: limitedWords,
+            }
+        },
+        normalizeWord(word) {
+            if (!word) {
+                return ''
+            }
+
+            const formatted = word
+                .toString()
+                .normalize('NFKD')
+                .replace(/[^A-Za-z]/g, '')
+                .toUpperCase()
+                .slice(0, 20)
+
+            return formatted
+        },
+        normalizeClue(clue) {
+            if (!clue) {
+                return ''
+            }
+
+            let normalized = clue
+                .toString()
+                .replace(/\s+/g, ' ')
+                .trim()
+
+            if (!normalized) {
+                return ''
+            }
+
+            if (normalized.endsWith('?')) {
+                normalized = normalized.slice(0, -1).trim()
+            }
+
+            const maxLength = 155
+            if (normalized.length > maxLength) {
+                normalized = normalized.slice(0, maxLength).trim()
+            }
+
+            if (normalized && !/[.!]$/.test(normalized)) {
+                if (normalized.length >= maxLength) {
+                    normalized = normalized.slice(0, maxLength - 1).trim()
+                }
+                normalized += '.'
+            }
+
+            return normalized
+        },
+        normalizeTitle(title) {
+            if (!title) {
+                return ''
+            }
+
+            let normalized = title
+                .toString()
+                .replace(/\s+/g, ' ')
+                .trim()
+
+            if (!normalized) {
+                return ''
+            }
+
+            if (normalized.length > 100) {
+                normalized = normalized.slice(0, 100).trim()
+            }
+
+            return normalized
+        },
+        renumberWordIds() {
+            this.block.metadata.config.words.forEach((item, index) => {
+                item.id = index
+            })
+        },
+        showInvalidResponseToast() {
+            this.$toast.error(
+                this.$t(
+                    'windward.games.components.settings.crossword.invalid_response'
+                ),
+                { duration: 5000 }
+            )
+        },
     },
 }
 </script>