@windward/games 0.22.0 → 0.23.0

package/components/settings/MatchingGameManager.vue

@@ -251,14 +251,18 @@
         <v-container class="pa-4 mb-6">
             <v-row>
                 <v-col cols="12">
-                    <GenerateAIQuestionButton
-                        :course="course"
-                        :content="content"
-                        :block="block"
-                        question-type="matching_game"
-                        :replace-existing-mode="replaceExisting"
-                        @click:generate="onGeneratedMatchingGame"
-                    ></GenerateAIQuestionButton>
+                    <PluginRef
+                        target="contentBlockSettingTool"
+                        :attrs="{
+                            value: block,
+                            course: course,
+                            content: currentContent,
+                        }"
+                        :on="{
+                            input: onPluginSetBlock,
+                            append: onPluginAppendBlock,
+                        }"
+                    ></PluginRef>
                 </v-col>
             </v-row>
         </v-container>
@@ -269,7 +273,7 @@
 import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
 import _ from 'lodash'
 import { mapGetters } from 'vuex'
-import { GenerateAIQuestionButton } from '@windward/core/utils'
+import PluginRef from '~/components/Core/PluginRef.vue'
 import BaseContentBlockSettings from '~/components/Content/Settings/BaseContentBlockSettings.vue'
 import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
 import Uuid from '~/helpers/Uuid'
@@ -282,7 +286,7 @@ export default {
         SortableExpansionPanel,
         ImageAssetSettings,
         BaseContentBlockSettings,
-        GenerateAIQuestionButton
+        PluginRef,
     },
     beforeMount() {
         if (_.isEmpty(this.block)) {
@@ -488,129 +492,220 @@ export default {
             // holder array now has new answer positions
             this.block.metadata.config.prompts = holderArray
         },
-        // Handler for receiving matching game data from GenerateAIQuestionButton
-        onGeneratedMatchingGame(activityData, replaceMode) {
-
+        // Handler for receiving matching 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.answerObjects &&
                     activityData.metadata.config.prompts &&
                     Array.isArray(activityData.metadata.config.answerObjects) &&
-                    Array.isArray(activityData.metadata.config.prompts)) {
-
-                    if (replaceMode) {
-                        // Replace mode: Clear existing answers and prompts
-                        this.block.metadata.config.answerObjects.splice(0, this.block.metadata.config.answerObjects.length)
-                        this.block.metadata.config.prompts.splice(0, this.block.metadata.config.prompts.length)
+                    Array.isArray(activityData.metadata.config.prompts)
+                ) {
+                    // Replace mode: Clear existing answers and prompts
+                    this.block.metadata.config.answerObjects.splice(
+                        0,
+                        this.block.metadata.config.answerObjects.length
+                    )
+                    this.block.metadata.config.prompts.splice(
+                        0,
+                        this.block.metadata.config.prompts.length
+                    )
 
-                        // Add all new answer objects and prompts
-                        activityData.metadata.config.answerObjects.forEach((answerObj, index) => {
+                    // Add all new answer objects and prompts
+                    activityData.metadata.config.answerObjects.forEach(
+                        (answerObj, index) => {
                             this.block.metadata.config.answerObjects.push({
-                                id: index.toString(),  // string id
-                                display: answerObj.display || ''
+                                id: index.toString(), // string id
+                                display: answerObj.display || '',
                             })
-                        })
+                        }
+                    )
 
-                        // Add all prompts - following the exact pattern from BucketGameSettingsManager
-                        activityData.metadata.config.prompts.forEach((promptArray, index) => {
+                    // Add all prompts - following the exact pattern from BucketGameSettingsManager
+                    activityData.metadata.config.prompts.forEach(
+                        (promptArray, index) => {
                             this.block.metadata.config.prompts[index] = []
                             if (Array.isArray(promptArray)) {
-                                promptArray.forEach(prompt => {
+                                promptArray.forEach((prompt) => {
                                     // Ensure the answer object reference is correct
-                                    const answerObj = this.block.metadata.config.answerObjects[index]
-                                    this.block.metadata.config.prompts[index].push({
-                                        id: index.toString(),  // string id
-                                        textOrImage: prompt.textOrImage || 'text',
+                                    const answerObj =
+                                        this.block.metadata.config
+                                            .answerObjects[index]
+                                    this.block.metadata.config.prompts[
+                                        index
+                                    ].push({
+                                        id: index.toString(), // string id
+                                        textOrImage:
+                                            prompt.textOrImage || 'text',
                                         prompt: prompt.prompt || '',
-                                        matchExplanation: prompt.matchExplanation || this.$t('windward.games.components.settings.matching_game.form.correct_match'),
+                                        matchExplanation:
+                                            prompt.matchExplanation ||
+                                            this.$t(
+                                                'windward.games.components.settings.matching_game.form.correct_match'
+                                            ),
                                         fileConfig: prompt.fileConfig || {
                                             hideBackground: true,
                                         },
-                                        answer: answerObj
+                                        answer: answerObj,
                                     })
                                 })
                             }
-                        })
-                    } else {
-                        // Merge mode: Add new terms and prompts to existing ones
-                        // Check if there's only one empty answer (the default one created on init)
-                        const hasOnlyEmptyAnswer = this.block.metadata.config.answerObjects.length === 1 && 
-                                                   this.block.metadata.config.answerObjects[0].display === '';
-                        
-                        if (hasOnlyEmptyAnswer) {
-                            // If there's only one empty answer, replace it instead of merging
-                            this.block.metadata.config.answerObjects.splice(0, 1);
-                            this.block.metadata.config.prompts.splice(0, 1);
                         }
-                        
-                        const existingAnswerCount = this.block.metadata.config.answerObjects.length
+                    )
 
-                        // Add new answer objects
-                        activityData.metadata.config.answerObjects.forEach((answerObj, index) => {
+                    // 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
+                    }
+
+                    if (activityData.metadata.config.instructions) {
+                        this.block.metadata.config.instructions =
+                            activityData.metadata.config.instructions
+                    }
+
+                    this.$toast.success(
+                        this.$t(
+                            'windward.games.components.settings.matching_game.form.replaced_successfully'
+                        ),
+                        { duration: 3000 }
+                    )
+                } else {
+                    this.$toast.error(
+                        this.$t(
+                            'windward.games.components.settings.matching_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.matching_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.answerObjects &&
+                    activityData.metadata.config.prompts &&
+                    Array.isArray(activityData.metadata.config.answerObjects) &&
+                    Array.isArray(activityData.metadata.config.prompts)
+                ) {
+                    // Merge mode: Add new terms and prompts to existing ones
+                    // Check if there's only one empty answer (the default one created on init)
+                    const hasOnlyEmptyAnswer =
+                        this.block.metadata.config.answerObjects.length === 1 &&
+                        this.block.metadata.config.answerObjects[0].display ===
+                            ''
+
+                    if (hasOnlyEmptyAnswer) {
+                        // If there's only one empty answer, replace it instead of merging
+                        this.block.metadata.config.answerObjects.splice(0, 1)
+                        this.block.metadata.config.prompts.splice(0, 1)
+                    }
+
+                    const existingAnswerCount =
+                        this.block.metadata.config.answerObjects.length
+
+                    // Add new answer objects
+                    activityData.metadata.config.answerObjects.forEach(
+                        (answerObj, index) => {
                             const newIndex = existingAnswerCount + index
                             this.block.metadata.config.answerObjects.push({
-                                id: newIndex.toString(),  // string id
-                                display: answerObj.display || ''
+                                id: newIndex.toString(), // string id
+                                display: answerObj.display || '',
                             })
-                        })
+                        }
+                    )
 
-                        // Add new prompts
-                        activityData.metadata.config.prompts.forEach((promptArray, index) => {
+                    // Add new prompts
+                    activityData.metadata.config.prompts.forEach(
+                        (promptArray, index) => {
                             const adjustedIndex = existingAnswerCount + index
-                            this.block.metadata.config.prompts[adjustedIndex] = []
+                            this.block.metadata.config.prompts[adjustedIndex] =
+                                []
                             if (Array.isArray(promptArray)) {
-                                promptArray.forEach(prompt => {
-                                    const answerObj = this.block.metadata.config.answerObjects[adjustedIndex]
-                                    this.block.metadata.config.prompts[adjustedIndex].push({
-                                        id: adjustedIndex.toString(),  // string id
-                                        textOrImage: prompt.textOrImage || 'text',
+                                promptArray.forEach((prompt) => {
+                                    const answerObj =
+                                        this.block.metadata.config
+                                            .answerObjects[adjustedIndex]
+                                    this.block.metadata.config.prompts[
+                                        adjustedIndex
+                                    ].push({
+                                        id: adjustedIndex.toString(), // string id
+                                        textOrImage:
+                                            prompt.textOrImage || 'text',
                                         prompt: prompt.prompt || '',
-                                        matchExplanation: prompt.matchExplanation || this.$t('windward.games.components.settings.matching_game.form.correct_match'),
+                                        matchExplanation:
+                                            prompt.matchExplanation ||
+                                            this.$t(
+                                                'windward.games.components.settings.matching_game.form.correct_match'
+                                            ),
                                         fileConfig: prompt.fileConfig || {
                                             hideBackground: true,
                                         },
-                                        answer: answerObj
+                                        answer: answerObj,
                                     })
                                 })
                             }
-                        })
-                    }
-
-                    // 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
-                        }
-                    }
+                    )
 
                     this.$toast.success(
-                        replaceMode
-                            ? this.$t('windward.games.components.settings.matching_game.form.replaced_successfully')
-                            : this.$t('windward.games.components.settings.matching_game.form.added_successfully'),
+                        this.$t(
+                            'windward.games.components.settings.matching_game.form.added_successfully'
+                        ),
                         { duration: 3000 }
                     )
                 } else {
-                    this.$toast.error(this.$t('windward.games.components.settings.matching_game.form.invalid_response'), {
-                        duration: 5000
-                    })
+                    this.$toast.error(
+                        this.$t(
+                            'windward.games.components.settings.matching_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.matching_game.form.failed_to_process')}: ${errorMessage}`, {
-                    duration: 5000
-                })
+                this.$toast.error(
+                    `${this.$t(
+                        'windward.games.components.settings.matching_game.form.failed_to_process'
+                    )}: ${errorMessage}`,
+                    {
+                        duration: 5000,
+                    }
+                )
             } finally {
                 this.loading = false
             }
-        }
+        },
     },
 }
 </script>

package/components/settings/MultipleChoiceSettingsManager.vue

@@ -47,6 +47,25 @@
                     }}
                 </v-btn>
             </v-row>
+            <!-- AI Assistant: Generate Questions (appears below Add Question) -->
+            <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>
         </v-container>
         <DialogBox
             v-model="dialog"
@@ -88,6 +107,7 @@
 </template>
 <script>
 import _ from 'lodash'
+import { mapGetters } from 'vuex'
 import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
 import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
 import DialogBox from '~/components/Core/DialogBox.vue'
@@ -95,6 +115,7 @@ import QuestionDialog from '../content/blocks/multipleChoice/QuestionDialog.vue'
 import Crypto from '~/helpers/Crypto'
 import BaseContentBlockSettings from '~/components/Content/Settings/BaseContentBlockSettings.vue'
 import Uuid from '~/helpers/Uuid'
+import PluginRef from '~/components/Core/PluginRef.vue'
 
 export default {
     name: 'MultipleChoiceSettingsManager',
@@ -104,6 +125,7 @@ export default {
         QuestionDialog,
         DialogBox,
         BaseContentBlockSettings,
+        PluginRef,
     },
     beforeMount() {
         if (_.isEmpty(this.block)) {
@@ -150,6 +172,12 @@ export default {
     mounted() {
         this.emittedQuestion = {}
     },
+    computed: {
+        ...mapGetters({
+            course: 'course/get',
+            currentContent: 'content/get',
+        }),
+    },
     methods: {
         stripHtml(htmlString) {
             if (htmlString) {
@@ -255,6 +283,110 @@ export default {
             this.dialog = false
             this.editingIndex = null
         },
+        // Handle AI Assistant replace (input) event
+        onPluginSetBlock(activityData) {
+            this.loading = true
+            try {
+                if (
+                    activityData &&
+                    activityData.metadata &&
+                    activityData.metadata.config &&
+                    Array.isArray(activityData.metadata.config.questions)
+                ) {
+                    const newConfig = activityData.metadata.config
+
+                    // Replace questions entirely
+                    this.$set(
+                        this.block.metadata.config,
+                        'questions',
+                        _.cloneDeep(newConfig.questions)
+                    )
+
+                    // Update title and instructions if provided
+                    if (newConfig.title) {
+                        this.$set(
+                            this.block.metadata.config,
+                            'title',
+                            newConfig.title
+                        )
+                    }
+                    if (newConfig.instructions) {
+                        this.$set(
+                            this.block.metadata.config,
+                            'instructions',
+                            newConfig.instructions
+                        )
+                    }
+
+                    this.$toast.success(
+                        this.$t(
+                            'windward.games.components.settings.multiple_choice.replaced_successfully'
+                        ),
+                        { duration: 3000 }
+                    )
+                } else {
+                    this.$toast.error(
+                        this.$t(
+                            'windward.games.components.settings.multiple_choice.invalid_response'
+                        ),
+                        { duration: 5000 }
+                    )
+                }
+            } catch (error) {
+                const errorMessage = error.message || 'Unknown error occurred'
+                this.$toast.error(
+                    `${this.$t(
+                        'windward.games.components.settings.multiple_choice.failed_to_process'
+                    )}: ${errorMessage}`,
+                    { duration: 5000 }
+                )
+            } finally {
+                this.loading = false
+            }
+        },
+        // Handle AI Assistant append event: add new questions to existing
+        onPluginAppendBlock(activityData) {
+            this.loading = true
+            try {
+                if (
+                    activityData &&
+                    activityData.metadata &&
+                    activityData.metadata.config &&
+                    Array.isArray(activityData.metadata.config.questions)
+                ) {
+                    const newQuestions = activityData.metadata.config.questions
+                    if (!Array.isArray(this.block.metadata.config.questions)) {
+                        this.$set(this.block.metadata.config, 'questions', [])
+                    }
+                    newQuestions.forEach((q) => {
+                        this.block.metadata.config.questions.push(_.cloneDeep(q))
+                    })
+                    this.$toast.success(
+                        this.$t(
+                            'windward.games.components.settings.multiple_choice.added_successfully'
+                        ),
+                        { duration: 3000 }
+                    )
+                } else {
+                    this.$toast.error(
+                        this.$t(
+                            'windward.games.components.settings.multiple_choice.invalid_response'
+                        ),
+                        { duration: 5000 }
+                    )
+                }
+            } catch (error) {
+                const errorMessage = error.message || 'Unknown error occurred'
+                this.$toast.error(
+                    `${this.$t(
+                        'windward.games.components.settings.multiple_choice.failed_to_process'
+                    )}: ${errorMessage}`,
+                    { duration: 5000 }
+                )
+            } finally {
+                this.loading = false
+            }
+        },
     },
 }
 </script>

package/components/settings/SevenStrikesSettingsManager.vue

@@ -112,17 +112,45 @@
                 :disabled="render"
             ></v-textarea>
         </v-row>
+        <div v-if="loading" class="text-center">
+            <v-progress-circular
+                :size="70"
+                :width="7"
+                color="primary"
+                indeterminate
+            ></v-progress-circular>
+        </div>
+        <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>
 </template>
 
 <script>
 import _ from 'lodash'
 import draggable from 'vuedraggable'
+import { mapGetters } from 'vuex'
 import BaseContentSettings from '~/components/Content/Settings/BaseContentSettings.js'
 import CrudTable from '../content/CrudTable.vue'
 import SortableExpansionPanel from '~/components/Core/SortableExpansionPanel.vue'
 import BaseContentBlockSettings from '~/components/Content/Settings/BaseContentBlockSettings.vue'
 import Uuid from '~/helpers/Uuid'
+import PluginRef from '~/components/Core/PluginRef.vue'
 
 export default {
     name: 'SevenStrikesSettingsManager',
@@ -132,6 +160,7 @@ export default {
         draggable,
         SortableExpansionPanel,
         BaseContentBlockSettings,
+        PluginRef,
     },
     beforeMount() {
         if (_.isEmpty(this.block)) {
@@ -186,6 +215,12 @@ export default {
             loading: false,
         }
     },
+    computed: {
+        ...mapGetters({
+            course: 'course/get',
+            currentContent: 'content/get',
+        }),
+    },
     methods: {
         onBeforeSave() {
             this.block.metadata.config.words.forEach((element) => {
@@ -220,6 +255,62 @@ export default {
             this.block.metadata.config.currentWord =
                 this.block.metadata.config.words.length - 1
         },
+        onPluginSetBlock(activityData) {
+            this.loading = true
+            try {
+                if (
+                    activityData &&
+                    activityData.metadata &&
+                    activityData.metadata.config &&
+                    Array.isArray(activityData.metadata.config.words)
+                ) {
+                    const newWords = activityData.metadata.config.words.map(
+                        (w) => ({
+                            value: w.value || '',
+                            hint: w.hint || '',
+                            expand: false,
+                            splitWord: '',
+                        })
+                    )
+                    this.block.metadata.config.words = newWords
+                    this.block.metadata.config.currentWord = 0
+
+                    if (activityData.metadata.config.title) {
+                        this.block.metadata.config.title =
+                            activityData.metadata.config.title
+                    }
+                    // Keep existing instructions (do not override)
+                }
+            } finally {
+                this.loading = false
+            }
+        },
+        onPluginAppendBlock(activityData) {
+            this.loading = true
+            try {
+                if (
+                    activityData &&
+                    activityData.metadata &&
+                    activityData.metadata.config &&
+                    Array.isArray(activityData.metadata.config.words)
+                ) {
+                    const appendWords = activityData.metadata.config.words.map(
+                        (w) => ({
+                            value: w.value || '',
+                            hint: w.hint || '',
+                            expand: false,
+                            splitWord: '',
+                        })
+                    )
+                    if (!Array.isArray(this.block.metadata.config.words)) {
+                        this.block.metadata.config.words = []
+                    }
+                    this.block.metadata.config.words.push(...appendWords)
+                }
+            } finally {
+                this.loading = false
+            }
+        },
     },
 }
 </script>