fcad-core-dragon 2.0.0-beta.2 → 2.0.0-beta.3

package/vite.config.js

@@ -0,0 +1,27 @@
+// vite.config.js
+import { resolve } from 'path'
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  build: {
+    lib: {
+      // Could also be a dictionary or array of multiple entry points
+      entry: resolve(__dirname, 'lib/main.js'),
+      name: 'FcadLib',
+      // the proper extensions will be added
+      fileName: 'fcad-lib'
+    },
+    rollupOptions: {
+      // make sure to externalize deps that shouldn't be bundled
+      // into your library
+      external: ['vue'],
+      output: {
+        // Provide global variables to use in the UMD build
+        // for externalized deps
+        globals: {
+          vue: 'Vue'
+        }
+      }
+    }
+  }
+})

package/src/components/AppCompInputDropdown.vue

@@ -1,182 +0,0 @@
-<template>
-  <div class="input-box">
-    <div
-      v-for="singleDropdown in inputData"
-      :key="singleDropdown.id"
-      :class="`dropdownlist-${singleDropdown.id} ${classInput(singleDropdown.id)}`"
-    >
-      <label
-        :for="`${inputDataId}_${singleDropdown.id}`"
-        v-html="singleDropdown.ennonce"
-      ></label>
-      <b-form-select
-        :id="inputDataId + '_' + singleDropdown.id"
-        v-model="quizSelectedValue[singleDropdown.id]"
-        :options="singleDropdown.option"
-        :disabled="quizCompleted"
-      ></b-form-select>
-    </div>
-  </div>
-</template>
-<script>
-import $extendsQuiz from '../mixins/$quizMixins'
-export default {
-  name: 'AppCompInputDropdown',
-  mixins: [$extendsQuiz],
-
-  props: {
-    inputType: {
-      type: String,
-      default: ''
-    },
-    inputDataId: {
-      type: String,
-      default: ''
-    },
-    inputData: {
-      type: Array,
-      default: () => []
-    },
-    quizCompleted: {
-      type: Boolean,
-      default: false
-    },
-    solution: {
-      type: Array,
-      default: () => []
-    },
-    showSolution: {
-      type: Boolean,
-      default: false
-    },
-    shuffleAnswers: {
-      type: Boolean,
-      default: false
-    },
-    quizSelected: {
-      type: Array,
-      default: () => []
-    }, //use to pass the value of the input
-    quizSubmit: {
-      type: Boolean,
-      default: false
-    } //use to call a submit
-  },
-
-  data() {
-    return {
-      quizSelectedValue: [] //not using quizSelected because quizSelected is a prop
-    }
-  },
-
-  computed: {},
-
-  watch: {
-    /**
-     * @description to pass value to AppCompQuiz
-     * @emits input-change
-     */
-    quizSelectedValue(newValue) {
-      this.$emit('input-change', newValue)
-    },
-
-    /**
-     * @description to pass the value from AppCompQuiz
-     */
-    quizSelected(newValue) {
-      this.quizSelectedValue = newValue
-    }
-  },
-
-  mounted() {
-    if (this.solution !== null)
-      this.solution.sort(function (a, b) {
-        return a.question_id - b.question_id
-      })
-    //to show the defaultAnswer
-    const defaultAnswer = {
-      value: null,
-      disabled: true,
-      text: this.$t('message.first_option_dropdown')
-    }
-    let selectedChoices = []
-    for (let i = 0; i < this.inputData.length; i++) {
-      let singleDropdown
-      if (this.shuffleAnswers) {
-        singleDropdown = this.inputData[i]
-        singleDropdown.option = this.shuffleArray(singleDropdown.option)
-      } else {
-        singleDropdown = this.inputData[i]
-      }
-      if (
-        this.inputData[i].option[0].text !==
-        this.$t('message.first_option_dropdown')
-      ) {
-        singleDropdown.option.unshift(defaultAnswer)
-      }
-      selectedChoices.push(null)
-    }
-    if (this.quizSelected.length == 0) {
-      this.quizSelectedValue = selectedChoices
-    } else {
-      this.quizSelectedValue = this.quizSelected
-    }
-  },
-
-  methods: {
-    /**
-     * @description used by the dropdown quiz
-     * @param {Array} answers what the user has answered
-     * @param {Array} solution the correct choices
-     * @returns {Boolean}
-     * @todo Add a catching for error if the 2 question_id dont match
-     */
-    compareSelectedAnswers(answers, solution) {
-      for (let index = 0; index < answers.length; index++) {
-        const elementAnswers = answers[index]
-        const elementSolution = solution[index]
-        if (elementAnswers.question_id == elementSolution.question_id) {
-          if (elementAnswers.reponse_id !== elementSolution.reponse_id) {
-            return false
-          }
-        } else {
-          return //if it return nothing there is a bug since this means the 2 question_id dont match
-        }
-      }
-      return true
-    },
-
-    /**
-     * @description check if a values exists in a array
-     * @param {Array} array
-     * @param value
-     * @returns {Boolean}
-     */
-    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}
-     */
-    shuffleArray(array) {
-      let newArray = []
-      let newArray2 = []
-
-      for (let i = 0; i < array.length; i++) {
-        const element = array[i]
-        //todo remove null values
-        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
-    }
-  }
-}
-</script>

package/src/components/AppCompInputTextTable.vue

@@ -1,158 +0,0 @@
-<template>
-  <div>
-    <div v-for="textInput in inputDataValue" :key="textInput.id">
-      <label
-        :id="`${inputDataId}_${textInput.id}-label`"
-        aria-hidden="true"
-        v-html="textInput.ennonce"
-      ></label>
-      <div class="cnt-input" :class="classInput(textInput.id)">
-        <b-form-input
-          :id="`${inputDataId}_${textInput.id}-champ`"
-          v-model="quizTextTableValue[textInput.id]"
-          :placeholder="$t('text.place_holder.for_textarea')"
-          :disabled="quizCompleted"
-          rows="1"
-          no-resize
-          :aria-describedby="`${inputDataId}_${textInput.id}-msg-erreur`"
-          :aria-labelledby="`${inputDataId}_${textInput.id}-label`"
-        ></b-form-input>
-      </div>
-      <span :id="`${inputDataId}_${textInput.id}-msg-erreur`" class="sr-only">
-        {{ messageAccessibility(textInput.id) }}
-      </span>
-    </div>
-  </div>
-</template>
-<script>
-import $extendsQuiz from '../mixins/$quizMixins'
-export default {
-  name: 'AppCompInputTextTable',
-  mixins: [$extendsQuiz],
-
-  props: {
-    inputType: {
-      type: String,
-      default: ''
-    },
-    inputDataId: {
-      type: String,
-      default: ''
-    },
-    inputData: {
-      type: Array,
-      default: () => []
-    },
-    quizCompleted: {
-      type: Boolean,
-      default: false
-    },
-    solution: {
-      type: Array,
-      default: () => []
-    },
-    showSolution: {
-      type: Boolean,
-      default: false
-    },
-    shuffleAnswers: {
-      type: Boolean,
-      default: false
-    },
-    quizTextTable: {
-      type: Array,
-      default: () => []
-    }, //use to pass the value of the input
-    quizSubmit: {
-      type: Boolean,
-      default: false
-    } //use to call a submit
-  },
-
-  data() {
-    return {
-      inputDataValue: [],
-      quizTextTableValue: [] //not using quizTextTable because quizTextTable is a prop
-    }
-  },
-
-  computed: {},
-
-  watch: {
-    /**
-     * @description to pass value to AppCompQuiz
-     * @fires input-change to AppCompQuiz.vue
-     */
-    quizTextTableValue(newValue) {
-      this.$emit('input-change', newValue)
-    },
-
-    /**
-     * @description to pass the value from AppCompQuiz
-     */
-    quizTextTable(newValue) {
-      this.quizTextTableValue = newValue
-    }
-  },
-
-  mounted() {
-    if (this.solution !== null) {
-      this.solution.sort(function (a, b) {
-        return a.question_id - b.question_id
-      })
-    }
-    let textChoices = []
-
-    for (let i = 0; i < this.inputData.length; i++) {
-      textChoices.push('')
-    }
-    //apply previous answers
-    if (this.quizTextTable && this.quizTextTable.length == 0) {
-      this.quizTextTableValue = textChoices
-    } else {
-      this.quizTextTableValue = this.quizTextTable
-    }
-
-    if (this.shuffleAnswers) {
-      this.inputDataValue = this.shuffleArray(this.inputData)
-    } else {
-      this.inputDataValue = this.inputData
-    }
-  },
-
-  methods: {
-    /**
-     * @description check if a values exists in a array
-     * @param {Array} array
-     * @param value
-     * @returns {Boolean}
-     */
-    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}
-     */
-    shuffleArray(array) {
-      let newArray = []
-      let newArray2 = []
-
-      for (let i = 0; i < array.length; i++) {
-        const element = array[i]
-        //todo remove null values
-        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
-    }
-  }
-}
-</script>
-<style lang="scss" scoped></style>

package/src/components/AppCompInputTextToFillDropdown.vue

@@ -1,257 +0,0 @@
-<template>
-  <div>
-    <div
-      v-for="singleDropdown in theInputData"
-      :key="singleDropdown.id"
-      class="texteatrou"
-    >
-      <span v-if="!singleDropdown.type" v-html="singleDropdown.content"></span>
-      <label
-        :for="`${inputDataId}_${singleDropdown.id}-champ`"
-        style="display: none"
-      >
-        {{ $t('text.quiz') }}
-      </label>
-      <div class="cnt-input" :class="classInput(singleDropdown.id)">
-        <b-form-select
-          v-if="singleDropdown.type == 'dropdown'"
-          :id="`${inputDataId}_${singleDropdown.id}-champ`"
-          v-model="quizSelectedValue[singleDropdown.id]"
-          :options="singleDropdown.option"
-          :disabled="quizCompleted"
-          :aria-describedby="`${inputDataId}_${singleDropdown.id}-msg-erreur`"
-        ></b-form-select>
-      </div>
-
-      <span
-        v-if="showSolution"
-        :id="`${inputDataId}_${singleDropdown.id}-msg-erreur`"
-        class="sr-only"
-      >
-        {{ messageAccessibility(singleDropdown.id) }}
-      </span>
-    </div>
-  </div>
-</template>
-<script>
-import $extendsQuiz from '../mixins/$quizMixins'
-export default {
-  name: 'AppCompInputTextToFillDropdown',
-  mixins: [$extendsQuiz],
-
-  props: {
-    inputType: {
-      type: String,
-      default: ''
-    },
-    inputDataId: {
-      type: String,
-      default: ''
-    },
-    inputData: {
-      type: Array,
-      default: () => []
-    },
-    textBase: {
-      type: String,
-      default: ''
-    },
-    quizCompleted: {
-      type: Boolean,
-      default: false
-    },
-    solution: {
-      type: Array,
-      default: () => []
-    },
-    showSolution: {
-      type: Boolean,
-      default: false
-    },
-    shuffleAnswers: {
-      type: Boolean,
-      default: false
-    },
-    quizSelected: {
-      type: Array,
-      default: () => []
-    }, //use to pass the value of the input
-    quizSubmit: {
-      type: Boolean,
-      default: false
-    } //use to call a submit
-  },
-
-  data() {
-    return {
-      quizSelectedValue: [], //not using quizSelected because quizSelected is a prop
-      theInputData: [] //to create the list of drop down and text mixed togeter
-    }
-  },
-
-  computed: {},
-
-  watch: {
-    /**
-     * @description to pass value to AppCompQuiz
-     * @fires input-change to AppCompQuiz.vue
-     */
-    quizSelectedValue(newValue) {
-      this.$emit('input-change', newValue)
-    },
-
-    /**
-     * @description to pass the value from AppCompQuiz
-     */
-    quizSelected(newValue) {
-      this.quizSelectedValue = newValue
-    }
-  },
-
-  mounted() {
-    if (this.solution !== null) {
-      this.solution.sort(function (a, b) {
-        return a.question_id - b.question_id
-      })
-    }
-    //to show the defaultAnswer
-    const defaultAnswer = {
-      value: null,
-      disabled: true,
-      text: this.$t('message.first_option_dropdown')
-    }
-    let selectedChoices = []
-    for (let i = 0; i < this.inputData.length; i++) {
-      let singleDropdown = {}
-      if (this.shuffleAnswers) {
-        singleDropdown = this.inputData[i]
-        singleDropdown[Object.keys(this.inputData[i])[0].toString()] =
-          this.shuffleArray(Object.values(this.inputData[i])[0])
-      } else {
-        singleDropdown = this.inputData[i]
-      }
-      for (
-        let index = 0;
-        index < Object.values(singleDropdown)[0].length;
-        index++
-      ) {
-        const element = Object.values(singleDropdown)[0][index]
-        if (
-          element.text &&
-          element.text == this.$t('message.first_option_dropdown')
-        ) {
-          Object.values(singleDropdown)[0].splice(index, 1)
-        }
-      }
-      Object.values(singleDropdown)[0].unshift(defaultAnswer)
-
-      selectedChoices.push(null)
-    }
-    if (this.quizSelected.length == 0) {
-      this.quizSelectedValue = selectedChoices
-    } else {
-      this.quizSelectedValue = this.quizSelected
-    }
-
-    this.createTextWithInput(this.textBase)
-  },
-
-  methods: {
-    /**
-     * @description create the object to genate the text and inputs
-     * @param {String} str the text with holes to fill
-     */
-    createTextWithInput(str) {
-      const regex = /\$%\S*%\$/g // regex pattern to match exp: $%number%$
-      let matchAll = str.split(regex)
-      let listInput = []
-      for (let i = 0; i < this.inputData.length; i++) {
-        const element = this.inputData[i]
-        listInput.push({ id: 't' + i, content: matchAll[i] })
-        listInput.push({
-          id: i,
-          type: 'dropdown',
-          option: Object.values(element)[0]
-        })
-      }
-      let lastItem = matchAll.length - 1
-      listInput.push({ id: 't' + lastItem, content: matchAll[lastItem] })
-      this.theInputData = listInput
-    },
-    /**
-     * @description used by the dropdown quiz
-     * @param {Array} answers what the user has answered
-     * @param {Array} solution the correct choices
-     * @returns {Boolean}
-     * @todo Add a catching for error if the 2 question_id dont match
-     */
-    compareSelectedAnswers(answers, solution) {
-      for (let index = 0; index < answers.length; index++) {
-        const elementAnswers = answers[index]
-        const elementSolution = solution[index]
-        if (elementAnswers.question_id == elementSolution.question_id) {
-          if (elementAnswers.reponse_id !== elementSolution.reponse_id) {
-            return false
-          }
-        } else {
-          return //if it return nothing there is a bug since this means the 2 question_id dont match
-        }
-      }
-      return true
-    },
-
-    /**
-     * @description check if a values exists in a array
-     * @param {Array} array
-     * @param value
-     * @returns {Boolean}
-     */
-    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}
-     */
-    shuffleArray(array) {
-      let newArray = []
-      let newArray2 = []
-
-      for (let i = 0; i < array.length; i++) {
-        const element = array[i]
-        //todo remove null values
-        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
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-select {
-  &.custom-select {
-    background-image: inherit;
-
-    &:focus {
-      border-color: inherit;
-      box-shadow: inherit;
-    }
-  }
-}
-
-/***** style dev  *****/
-.texteatrou {
-  display: inline;
-}
-.texteatrou > select {
-  display: inline;
-  width: auto;
-}
-</style>