fcad-core-dragon 2.0.0-beta.0 → 2.0.0-beta.1

package/src/components/AppCompNoteCall.vue

@@ -0,0 +1,126 @@
+<!--
+  ----------------- MUST DO STYLE!! -----------------------
+ @ Description:
+ @ What it does:
+-->
+
+<template>
+  <div
+    :id="`rnt_${stripRefNote}`"
+    :ref="`#rnt_${stripRefNote}`"
+    class="callEndNote"
+    :dataRef="`nt_${stripRefNote}`"
+  >
+    <b-link
+      v-if="!error"
+      class="nrlm"
+      tabindex="0"
+      :title="$t('text.title_link_call')"
+      @click="openNote()"
+    >
+      <sup>{{ stripRefNote }}</sup>
+    </b-link>
+
+    <div v-else>
+      <sup>error</sup>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    refNote: {
+      type: String,
+      default: ' '
+    }
+  },
+  data() {
+    return {
+      route: this.$route.meta.activity_ref,
+      notes: null,
+      jsons: null
+    }
+  },
+  computed: {
+    // Return the number for the note
+    stripRefNote() {
+      let ref = this.refNote
+      let newRef
+      let toStrip = ref.indexOf('_')
+      newRef = this.refNote.substr(toStrip + 1)
+
+      return newRef
+    },
+    error() {
+      /////  -------------------------- MUST REDO INFORMATION NOT FROM JSON ANYMORE
+      let er = false
+      // let info = this.jsons
+
+      // if (info) {
+      //   if (Object.keys(info.note).length === 0) {
+      //     er = true
+      //     console.warn(
+      //       '%c WARNING!>>> AppCompNoteCall: Your note file is empty, note cannot be call',
+      //       'background: orange; color: white; display: block; margin:5px;'
+      //     )
+      //   } else if (
+      //     info.note.value[this.stripRefNote - 1] === ' ' ||
+      //     info.note.value[this.stripRefNote - 1] === undefined
+      //   ) {
+      //     er = true
+      //     console.warn(
+      //       '%c WARNING!>>> AppCompNoteCall: The note you try to call doesnt existe.',
+      //       'background: orange; color: white; display: block; margin:5px;'
+      //     )
+      //   } else {
+      //     //check if value are the same :
+      //     ///https://stackoverflow.com/questions/7376598/in-javascript-how-do-i-check-if-an-array-has-duplicate-values
+      //     const items = [...document.getElementsByClassName('callEndNote')]
+
+      //     let cltn = []
+      //     items.forEach((element) => {
+      //       cltn.push(element.getAttribute('dataref'))
+      //     })
+      //     const l = cltn.some((e, i) => cltn.indexOf(e) < i)
+      //     if (l) {
+      //       er = true
+      //       console.warn(
+      //         '%c WARNING!>>> AppCompNoteCall: You call this note twice',
+      //         'background: orange; color: white; display: block; margin:5px;'
+      //       )
+      //     }
+      //   }
+      // }
+
+      return er
+    }
+  },
+  mounted() {},
+  methods: {
+    //open the widget and give information to highlight
+    openNote() {
+      this.$bus.$emit('note-to-show', this.$el)
+    },
+    lookForElement(elId) {
+      let clcn = document.getElementsByClassName('endNoteLink')
+
+      for (let element of clcn) {
+        if (element.id === elId) {
+          return element
+        }
+      }
+    }
+  }
+}
+</script>
+<style lang="scss">
+.callEndNote {
+  display: inline-block;
+  margin-left: -4px;
+
+  &.b {
+    margin-left: 0 !important ;
+    margin-right: -4px !important ;
+  }
+}
+</style>

package/src/components/AppCompNoteCredit.vue

@@ -0,0 +1,164 @@
+<!--
+  ----------------- MUST ADD ERROR GESTION ------------------
+  ----------------- MUST ADD css ------------------
+
+ @ Description:
+ @ What it does:
+-->
+<template>
+  <div class="noteCredit" :class="{ openW: showWidget }">
+    <app-base-button id="close-toc" @click="close()">X</app-base-button>
+
+    <div>
+      <p>{{ $t('text.title_credit') }}</p>
+
+      <ul v-if="credits != null">
+        <li
+          v-for="(credit, index) of credits"
+          :key="`note_${index}`"
+          :ref="`#nt_${index + 1}`"
+          v-html="credit"
+        ></li>
+      </ul>
+      <p v-else>{{ $t('text.no_credit') }}</p>
+    </div>
+    <div>
+      <p>{{ $t('text.title_note') }}</p>
+      <ul v-if="notes != null">
+        <li
+          v-for="(note, index) of notes"
+          :id="`nt_${index + 1}`"
+          :key="`note_${index}`"
+          :dataRef="`rnt_${index + 1}`"
+          class="widget-note"
+        >
+          <button
+            :noteRef="`rnt_${index + 1}`"
+            class="btn backToNoteRef"
+            @click="focusNote($event)"
+          >
+            <span v-html="note"></span>
+          </button>
+        </li>
+      </ul>
+
+      <p v-else>{{ $t('text.no_note') }}</p>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      notes: null,
+      credits: null,
+      current: false,
+      jsons: null,
+      showWidget: false
+    }
+  },
+  computed: {
+    error() {
+      // ---------------- MUST BE REDO BECAUSE INFO CHANGE ----------------------
+      let er = false
+      // let info = this.jsons
+      // if (info) {
+      //   if (Object.keys(info.note).length === 0) {
+      //     er = true
+      //     console.warn(
+      //       '%c WARNING!>>> AppCompNoteFin: Your note file is empty.',
+      //       'background: orange; color: white; display: block; margin:5px;'
+      //     )
+      //   }
+      // }
+      return er
+    }
+  },
+  async created() {},
+  mounted() {
+    this.$bus.$on('credit-note', (data) => {
+      this.notes = data.note
+      this.credits = data.credit
+    })
+
+    // close or open widget depending which btn was click
+    this.$bus.$on('toggle-widget', (data) => {
+      if (data == 'noteCredit') this.showWidget = !this.showWidget
+      else this.showWidget = false
+    })
+
+    //close widget
+    this.$bus.$on('close-widget', (data) => {
+      this.showWidget = false
+    })
+
+    // show widget when note click and higligth note
+    this.$bus.$on('note-to-show', (el) => {
+      this.showWidget = true
+
+      if (el) {
+        let ref = el.getAttribute('dataRef')
+
+        this.removefocus()
+
+        let elAtt = document.getElementsByClassName('widget-note')
+        var arr = Array.from(elAtt)
+
+        for (let element of arr) {
+          if (ref == element.getAttribute('id')) {
+            element.setAttribute('dataCurrent', true)
+          }
+        }
+      }
+    })
+  },
+  methods: {
+    //close widget
+    close() {
+      this.showWidget = !this.showWidget
+    },
+    removefocus() {
+      let elAtt = document.querySelectorAll("[dataCurrent='true']")
+
+      var arr = Array.from(elAtt)
+
+      for (let element of arr) {
+        element.setAttribute('dataCurrent', false)
+      }
+    },
+    focusNote(el) {
+      let e = document.getElementsByClassName('callEndNote')
+      let t = el.target.getAttribute('noteref')
+      for (let element of e) {
+        element.setAttribute('dataCurrentnote', false)
+        if (element.id === t) {
+          element.setAttribute('dataCurrentnote', true)
+        }
+      }
+    }
+  }
+}
+</script>
+<style lang="scss">
+.noteCredit {
+  position: absolute;
+  top: 0;
+  left: 200%;
+  display: none;
+  opacity: 0;
+
+  &.openW {
+    display: block;
+    opacity: 1;
+  }
+
+  span {
+    pointer-events: none;
+  }
+
+  .overlay-w {
+    width: 100%;
+    height: 100%;
+  }
+}
+</style>