fcad-core-dragon 2.0.0-beta.7 → 2.0.0-beta.8

package/src/composables/useQuiz.js

@@ -1,206 +1,206 @@
-//This composable sould Extend the functionality of a the quiz
-
-import i18n from '@/i18n' //Must import directly the local from project app because vue-18in does not work in legacy mode with composable
-
-export function useQuiz(quiz) {
-  const { quizType, solution, showSolution, quizInputType } = quiz
-  const { t } = i18n.global
-
-  // /**
-  //  * @param {String} inputId
-  //  * @returns {Array} the class
-  //  */
-  function classInput(inputId, optSelected = null) {
-    let theClass = []
-
-    switch (true) {
-      case ['choix_unique', 'reponse_ouverte'].includes(quizType.value):
-        if (inputId == quizInputType.value) {
-          theClass.push('reponseSelectionner')
-        }
-        break
-
-      case quizType.value == 'choix_mult':
-        if (containsValue(quizInputType.value, inputId)) {
-          theClass.push('reponseSelectionner')
-        }
-    }
-
-    if (showSolution.value) {
-      if (solution.value !== null) {
-        switch (true) {
-          case ['choix_unique', 'reponse_ouverte'].includes(quizType.value):
-            if (inputId == solution.value) {
-              theClass.push('correct_answer')
-            } else {
-              theClass.push('wrong_answer')
-            }
-            break
-
-          case quizType.value == 'choix_mult':
-            if (containsValue(solution.value, inputId)) {
-              theClass.push('correct_answer')
-            } else {
-              theClass.push('wrong_answer')
-            }
-            break
-          case quizType.value == 'dropdown':
-            if (!optSelected || !optSelected[inputId]) return
-            if (solution.value[inputId] == optSelected[inputId]) {
-              theClass.push('correct_answer')
-            } else {
-              theClass.push('wrong_answer')
-            }
-            break
-
-          case quizType.value == 'texte_troue_select':
-            if (typeof optSelected[inputId] !== 'undefined') {
-              if (
-                Object.values(solution.value[inputId])[0] ==
-                optSelected[inputId]
-              ) {
-                theClass.push('correct_answer')
-              } else {
-                theClass.push('wrong_answer')
-              }
-            }
-            break
-
-          case quizType.value == 'texte_tableau':
-            if (
-              containsValue(
-                solution.value[inputId].reponse_value,
-                optSelected[inputId]
-              )
-            ) {
-              theClass.push('correct_answer')
-            } else {
-              theClass.push('wrong_answer')
-            }
-            break
-          case quizType.value == 'texte_troue':
-            if (typeof optSelected[inputId] !== 'undefined') {
-              if (
-                containsValue(
-                  Object.values(solution.value[inputId])[0],
-                  optSelected[inputId]
-                )
-              ) {
-                theClass.push('correct_answer')
-              } else {
-                theClass.push('wrong_answer')
-              }
-            }
-            break
-        }
-      }
-    }
-    return theClass
-  }
-
-  function messageAccessibility(inputId, optSelected = null) {
-    let mess = ''
-    if (showSolution.value) {
-      if (solution.value !== null) {
-        switch (true) {
-          case ['choix_unique', 'reponse_ouverte'].includes(quizType.value):
-            if (inputId == solution.value) {
-              mess = `${t('quizState.goodAnswer')}`
-            } else {
-              mess = `${t('quizState.badAnswer')}`
-            }
-            break
-
-          case quizType.value == 'choix_mult':
-            if (containsValue(solution.value, inputId)) {
-              mess = `${t('quizState.goodAnswer')}`
-            } else {
-              mess = `${t('quizState.badAnswer')}`
-            }
-            break
-          case quizType.value == 'dropdown':
-            if (solution[inputId.value] == optSelected[inputId.value]) {
-              mess = `${t('quizState.goodAnswer')}`
-            } else {
-              mess = `${t('quizState.badAnswer')}`
-            }
-            break
-
-          case quizType.value == 'texte_troue_select':
-            if (typeof optSelected[inputId] !== 'undefined') {
-              if (
-                Object.values(solution.value[inputId])[0] ==
-                optSelected[inputId]
-              ) {
-                mess = `${t('quizState.goodAnswer')}`
-              } else {
-                mess = `${t('quizState.badAnswer')}`
-              }
-            }
-            break
-
-          case quizType.value == 'texte_tableau':
-            if (
-              containsValue(
-                solution.value[inputId].reponse_value,
-                optSelected[inputId]
-              )
-            ) {
-              mess = `${t('quizState.goodAnswer')}`
-            } else {
-              mess = `${t('quizState.badAnswer')}`
-            }
-            break
-          case quizType.value == 'texte_troue':
-            if (typeof optSelected[inputId] !== 'undefined') {
-              if (
-                containsValue(
-                  Object.values(solution.value[inputId])[0],
-                  optSelected[inputId]
-                )
-              ) {
-                mess = `${t('quizState.goodAnswer')}`
-              } else {
-                mess = `${t('quizState.badAnswer')}`
-              }
-            }
-            break
-        }
-      }
-    }
-    return mess
-  }
-
-  /**
-   * @description check if a values exists in a array
-   * @param {Array} array
-   * @param value
-   * @returns {Boolean}
-   */
-  function containsValue(array, value) {
-    return array.includes(value)
-  }
-
-  /**
-   * @description shuffles an array used to randomized the option order if shuffleAnswers is true
-   * @param {Array} array
-   * @returns {Array}
-   */
-  function shuffleArray(array) {
-    let newArray = []
-    let newArray2 = []
-
-    for (let i = 0; i < array.length; i++) {
-      const element = array[i]
-      newArray.push(element)
-    }
-    while (newArray.length > 0) {
-      let pos = Math.floor(newArray.length * Math.random())
-      newArray2.push(newArray[pos])
-      newArray.splice(pos, 1)
-    }
-    return newArray2
-  }
-
-  return { containsValue, shuffleArray, classInput, messageAccessibility }
-}
+//This composable sould Extend the functionality of a the quiz
+
+import i18n from '@/i18n' //Must import directly the local from project app because vue-18in does not work in legacy mode with composable
+
+export function useQuiz(quiz) {
+  const { quizType, solution, showSolution, quizInputType } = quiz
+  const { t } = i18n.global
+
+  // /**
+  //  * @param {String} inputId
+  //  * @returns {Array} the class
+  //  */
+  function classInput(inputId, optSelected = null) {
+    let theClass = []
+
+    switch (true) {
+      case ['choix_unique', 'reponse_ouverte'].includes(quizType.value):
+        if (inputId == quizInputType.value) {
+          theClass.push('reponseSelectionner')
+        }
+        break
+
+      case quizType.value == 'choix_mult':
+        if (containsValue(quizInputType.value, inputId)) {
+          theClass.push('reponseSelectionner')
+        }
+    }
+
+    if (showSolution.value) {
+      if (solution.value !== null) {
+        switch (true) {
+          case ['choix_unique', 'reponse_ouverte'].includes(quizType.value):
+            if (inputId == solution.value) {
+              theClass.push('correct_answer')
+            } else {
+              theClass.push('wrong_answer')
+            }
+            break
+
+          case quizType.value == 'choix_mult':
+            if (containsValue(solution.value, inputId)) {
+              theClass.push('correct_answer')
+            } else {
+              theClass.push('wrong_answer')
+            }
+            break
+          case quizType.value == 'dropdown':
+            if (!optSelected || !optSelected[inputId]) return
+            if (solution.value[inputId] == optSelected[inputId]) {
+              theClass.push('correct_answer')
+            } else {
+              theClass.push('wrong_answer')
+            }
+            break
+
+          case quizType.value == 'texte_troue_select':
+            if (typeof optSelected[inputId] !== 'undefined') {
+              if (
+                Object.values(solution.value[inputId])[0] ==
+                optSelected[inputId]
+              ) {
+                theClass.push('correct_answer')
+              } else {
+                theClass.push('wrong_answer')
+              }
+            }
+            break
+
+          case quizType.value == 'texte_tableau':
+            if (
+              containsValue(
+                solution.value[inputId].reponse_value,
+                optSelected[inputId]
+              )
+            ) {
+              theClass.push('correct_answer')
+            } else {
+              theClass.push('wrong_answer')
+            }
+            break
+          case quizType.value == 'texte_troue':
+            if (typeof optSelected[inputId] !== 'undefined') {
+              if (
+                containsValue(
+                  Object.values(solution.value[inputId])[0],
+                  optSelected[inputId]
+                )
+              ) {
+                theClass.push('correct_answer')
+              } else {
+                theClass.push('wrong_answer')
+              }
+            }
+            break
+        }
+      }
+    }
+    return theClass
+  }
+
+  function messageAccessibility(inputId, optSelected = null) {
+    let mess = ''
+    if (showSolution.value) {
+      if (solution.value !== null) {
+        switch (true) {
+          case ['choix_unique', 'reponse_ouverte'].includes(quizType.value):
+            if (inputId == solution.value) {
+              mess = `${t('quizState.goodAnswer')}`
+            } else {
+              mess = `${t('quizState.badAnswer')}`
+            }
+            break
+
+          case quizType.value == 'choix_mult':
+            if (containsValue(solution.value, inputId)) {
+              mess = `${t('quizState.goodAnswer')}`
+            } else {
+              mess = `${t('quizState.badAnswer')}`
+            }
+            break
+          case quizType.value == 'dropdown':
+            if (solution[inputId.value] == optSelected[inputId.value]) {
+              mess = `${t('quizState.goodAnswer')}`
+            } else {
+              mess = `${t('quizState.badAnswer')}`
+            }
+            break
+
+          case quizType.value == 'texte_troue_select':
+            if (typeof optSelected[inputId] !== 'undefined') {
+              if (
+                Object.values(solution.value[inputId])[0] ==
+                optSelected[inputId]
+              ) {
+                mess = `${t('quizState.goodAnswer')}`
+              } else {
+                mess = `${t('quizState.badAnswer')}`
+              }
+            }
+            break
+
+          case quizType.value == 'texte_tableau':
+            if (
+              containsValue(
+                solution.value[inputId].reponse_value,
+                optSelected[inputId]
+              )
+            ) {
+              mess = `${t('quizState.goodAnswer')}`
+            } else {
+              mess = `${t('quizState.badAnswer')}`
+            }
+            break
+          case quizType.value == 'texte_troue':
+            if (typeof optSelected[inputId] !== 'undefined') {
+              if (
+                containsValue(
+                  Object.values(solution.value[inputId])[0],
+                  optSelected[inputId]
+                )
+              ) {
+                mess = `${t('quizState.goodAnswer')}`
+              } else {
+                mess = `${t('quizState.badAnswer')}`
+              }
+            }
+            break
+        }
+      }
+    }
+    return mess
+  }
+
+  /**
+   * @description check if a values exists in a array
+   * @param {Array} array
+   * @param value
+   * @returns {Boolean}
+   */
+  function containsValue(array, value) {
+    return array.includes(value)
+  }
+
+  /**
+   * @description shuffles an array used to randomized the option order if shuffleAnswers is true
+   * @param {Array} array
+   * @returns {Array}
+   */
+  function shuffleArray(array) {
+    let newArray = []
+    let newArray2 = []
+
+    for (let i = 0; i < array.length; i++) {
+      const element = array[i]
+      newArray.push(element)
+    }
+    while (newArray.length > 0) {
+      let pos = Math.floor(newArray.length * Math.random())
+      newArray2.push(newArray[pos])
+      newArray.splice(pos, 1)
+    }
+    return newArray2
+  }
+
+  return { containsValue, shuffleArray, classInput, messageAccessibility }
+}

package/src/externalComps/ModuleView.vue

@@ -1,22 +1,22 @@
-<template>
-  <app-base-module :module-config="$data" />
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      id: 'module_99',
-      consigneBehavior: 'onHover', //Controle the behavior of desplaying instruction
-      bookmarkActive: true, // Controle the use of saved point
-      allowNavigationToActivity: null
-
-      //main:''// Edit to define the ID of the node that will be main. When skipping to main content in the page.
-    }
-  },
-  created() {
-    this.allowNavigationToActivity =
-      this.$helper.getSettingsFromStore('auto_next_activity')
-  }
-}
-</script>
+<template>
+  <app-base-module :module-config="$data" />
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      id: 'module_99',
+      consigneBehavior: 'onHover', //Controle the behavior of desplaying instruction
+      bookmarkActive: true, // Controle the use of saved point
+      allowNavigationToActivity: null
+
+      //main:''// Edit to define the ID of the node that will be main. When skipping to main content in the page.
+    }
+  },
+  created() {
+    this.allowNavigationToActivity =
+      this.$helper.getSettingsFromStore('auto_next_activity')
+  }
+}
+</script>

package/src/externalComps/SummaryView.vue

@@ -1,91 +1,91 @@
-<template>
-  <div>
-    <app-comp-menu></app-comp-menu>
-    <!-- <h6>normal</h6>
-    <div class="t normal"></div>
-    <h6>red</h6>
-    <div class="t red"></div>
-    <h6>green</h6>
-    <div class="t green"></div>
-    <h6>hue</h6>
-    <div class="t hue"></div>
-    <h6>Saturation</h6>
-    <div class="t saturation"></div>
-    <h6>desaturation</h6>
-    <div class="t desaturation"></div>
-    <h6>lighteness</h6>
-    <div class="t lighteness"></div>
-    <h6>darkness</h6>
-    <div class="t darkness"></div>
-    <h6>whiteness</h6>
-    <div class="t whiteness"></div>
-    <h6>blackness</h6>
-    <div class="t blackness"></div> -->
-  </div>
-</template>
-
-<script>
-export default {
-  data() {
-    return {}
-  }
-}
-</script>
-<!-- <style lang="scss">
-@use 'sass:color';
-$color: #f11532;
-$color-red: color.change($color, $red: 155);
-$color-green: color.change($color, $green: 255);
-$color-hue: adjust-hue($color, -30deg);
-$color-saturation: color.scale($color, $saturation: 100%);
-$color-desaturate: color.scale($color, $saturation: -50%);
-$color-lighteness: color.scale($color, $lightness: 50%);
-$color-darkness: color.scale($color, $lightness: -50%);
-$color-whiteness: color.scale($color, $whiteness: 50%);
-$color-blackness: color.scale($color, $blackness: 50%);
-
-.t {
-  width: 50px;
-  height: 50px;
-
-  &.normal {
-    background: $color;
-  }
-
-  &.red {
-    background: $color-red;
-  }
-
-  &.green {
-    background: $color-green;
-  }
-
-  &.hue {
-    background: $color-hue;
-  }
-
-  &.saturation {
-    background: $color-saturation;
-  }
-
-  &.desaturation {
-    background: $color-desaturate;
-  }
-
-  &.lighteness {
-    background: $color-lighteness;
-  }
-
-  &.darkness {
-    background: $color-darkness;
-  }
-
-  &.whiteness {
-    background: $color-whiteness;
-  }
-
-  &.blackness {
-    background: $color-blackness;
-  }
-}
-</style> -->
+<template>
+  <div>
+    <app-comp-menu></app-comp-menu>
+    <!-- <h6>normal</h6>
+    <div class="t normal"></div>
+    <h6>red</h6>
+    <div class="t red"></div>
+    <h6>green</h6>
+    <div class="t green"></div>
+    <h6>hue</h6>
+    <div class="t hue"></div>
+    <h6>Saturation</h6>
+    <div class="t saturation"></div>
+    <h6>desaturation</h6>
+    <div class="t desaturation"></div>
+    <h6>lighteness</h6>
+    <div class="t lighteness"></div>
+    <h6>darkness</h6>
+    <div class="t darkness"></div>
+    <h6>whiteness</h6>
+    <div class="t whiteness"></div>
+    <h6>blackness</h6>
+    <div class="t blackness"></div> -->
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {}
+  }
+}
+</script>
+<!-- <style lang="scss">
+@use 'sass:color';
+$color: #f11532;
+$color-red: color.change($color, $red: 155);
+$color-green: color.change($color, $green: 255);
+$color-hue: adjust-hue($color, -30deg);
+$color-saturation: color.scale($color, $saturation: 100%);
+$color-desaturate: color.scale($color, $saturation: -50%);
+$color-lighteness: color.scale($color, $lightness: 50%);
+$color-darkness: color.scale($color, $lightness: -50%);
+$color-whiteness: color.scale($color, $whiteness: 50%);
+$color-blackness: color.scale($color, $blackness: 50%);
+
+.t {
+  width: 50px;
+  height: 50px;
+
+  &.normal {
+    background: $color;
+  }
+
+  &.red {
+    background: $color-red;
+  }
+
+  &.green {
+    background: $color-green;
+  }
+
+  &.hue {
+    background: $color-hue;
+  }
+
+  &.saturation {
+    background: $color-saturation;
+  }
+
+  &.desaturation {
+    background: $color-desaturate;
+  }
+
+  &.lighteness {
+    background: $color-lighteness;
+  }
+
+  &.darkness {
+    background: $color-darkness;
+  }
+
+  &.whiteness {
+    background: $color-whiteness;
+  }
+
+  &.blackness {
+    background: $color-blackness;
+  }
+}
+</style> -->