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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (90) hide show
  1. package/.editorconfig +33 -33
  2. package/.eslintignore +29 -29
  3. package/.eslintrc.cjs +81 -81
  4. package/CHANGELOG +13 -0
  5. package/README.md +71 -71
  6. package/bk.scss +117 -117
  7. package/package.json +8 -8
  8. package/src/$locales/en.json +145 -143
  9. package/src/$locales/fr.json +107 -105
  10. package/src/assets/data/onboardingMessages.json +47 -47
  11. package/src/components/AppBase.vue +1150 -1054
  12. package/src/components/AppBaseButton.test.js +22 -0
  13. package/src/components/AppBaseButton.vue +93 -87
  14. package/src/components/AppBaseErrorDisplay.vue +438 -438
  15. package/src/components/AppBaseFlipCard.vue +84 -84
  16. package/src/components/AppBaseModule.vue +1657 -1673
  17. package/src/components/AppBasePage.vue +742 -779
  18. package/src/components/AppBasePopover.vue +41 -41
  19. package/src/components/AppCompAudio.vue +265 -234
  20. package/src/components/AppCompBranchButtons.vue +556 -552
  21. package/src/components/AppCompButtonProgress.vue +121 -126
  22. package/src/components/AppCompCarousel.vue +328 -298
  23. package/src/components/AppCompInputCheckBoxNext.vue +200 -195
  24. package/src/components/AppCompInputDropdownNext.vue +201 -159
  25. package/src/components/AppCompInputRadioNext.vue +152 -152
  26. package/src/components/AppCompInputTextNext.vue +125 -106
  27. package/src/components/AppCompInputTextTableNext.vue +142 -141
  28. package/src/components/AppCompInputTextToFillDropdownNext.vue +238 -230
  29. package/src/components/AppCompInputTextToFillNext.vue +171 -171
  30. package/src/components/AppCompJauge.vue +74 -74
  31. package/src/components/AppCompMenu.vue +25 -10
  32. package/src/components/AppCompMenuItem.vue +228 -228
  33. package/src/components/AppCompNavigation.vue +972 -960
  34. package/src/components/AppCompNoteCall.vue +159 -133
  35. package/src/components/AppCompNoteCredit.vue +490 -292
  36. package/src/components/AppCompPlayBar.vue +1217 -1218
  37. package/src/components/AppCompPlayBarNext.vue +2060 -2052
  38. package/src/components/AppCompPlayBarProgress.vue +82 -82
  39. package/src/components/AppCompPopUpNext.vue +500 -503
  40. package/src/components/AppCompQuizNext.vue +2908 -2904
  41. package/src/components/AppCompQuizRecall.vue +298 -276
  42. package/src/components/AppCompSVGNext.vue +347 -347
  43. package/src/components/AppCompSettingsMenu.vue +172 -172
  44. package/src/components/AppCompTableOfContent.vue +386 -387
  45. package/src/components/AppCompTranscript.vue +24 -24
  46. package/src/components/AppCompVideoPlayer.vue +368 -368
  47. package/src/components/BaseModule.vue +55 -72
  48. package/src/components/tests__/AppBaseButton.spec.js +53 -0
  49. package/src/composables/useQuiz.js +206 -206
  50. package/src/externalComps/ModuleView.vue +22 -22
  51. package/src/externalComps/SummaryView.vue +91 -91
  52. package/src/main.js +272 -272
  53. package/src/mixins/$mediaMixins.js +819 -819
  54. package/src/mixins/timerMixin.js +155 -155
  55. package/src/module/stores/appStore.js +954 -893
  56. package/src/module/xapi/ADL.js +380 -376
  57. package/src/module/xapi/Crypto/Hasher.js +241 -241
  58. package/src/module/xapi/Crypto/WordArray.js +278 -278
  59. package/src/module/xapi/Crypto/algorithms/BufferedBlockAlgorithm.js +103 -103
  60. package/src/module/xapi/Crypto/algorithms/C_algo.js +315 -315
  61. package/src/module/xapi/Crypto/algorithms/HMAC.js +9 -9
  62. package/src/module/xapi/Crypto/algorithms/SHA1.js +9 -9
  63. package/src/module/xapi/Crypto/encoders/Base.js +105 -105
  64. package/src/module/xapi/Crypto/encoders/Base64.js +99 -99
  65. package/src/module/xapi/Crypto/encoders/Hex.js +61 -61
  66. package/src/module/xapi/Crypto/encoders/Latin1.js +61 -61
  67. package/src/module/xapi/Crypto/encoders/Utf8.js +45 -45
  68. package/src/module/xapi/Statement/agent.js +55 -55
  69. package/src/module/xapi/Statement/index.js +259 -259
  70. package/src/module/xapi/Statement/statement.js +253 -253
  71. package/src/module/xapi/launch.js +157 -157
  72. package/src/module/xapi/utils.js +167 -167
  73. package/src/module/xapi/verbs.js +294 -294
  74. package/src/module/xapi/wrapper.js +1963 -1963
  75. package/src/module/xapi/xapiStatement.js +444 -444
  76. package/src/plugins/bus.js +8 -8
  77. package/src/plugins/gsap.js +14 -14
  78. package/src/plugins/helper.js +355 -308
  79. package/src/plugins/i18n.js +44 -44
  80. package/src/plugins/idb.js +227 -219
  81. package/src/plugins/save.js +37 -37
  82. package/src/plugins/scorm.js +287 -287
  83. package/src/plugins/xapi.js +11 -11
  84. package/src/public/index.html +33 -33
  85. package/src/router/index.js +48 -43
  86. package/src/router/routes.js +312 -312
  87. package/src/shared/generalfuncs.js +210 -210
  88. package/src/shared/validators.js +926 -1069
  89. package/vitest.config.js +19 -0
  90. package/vite.config.js +0 -27
@@ -1,44 +1,44 @@
1
- import _ from 'lodash'
2
- /**
3
- * Merge locales message in project.
4
- * @summary To merge the locales dictionnary of this library with the locales that user will create
5
- * @param {Object} i18n - vue-i18n internalization object.
6
- */
7
- export default function mergeLocales(i18n) {
8
- //const deep = import('lodash') // provide deep merge of Object cf: https://attacomsian.com/blog/javascript-merge-objects
9
-
10
- /* I18n internal methods for mutating messages property
11
- * mergeLocaleMessage: ƒ mergeLocaleMessage(locale, message)// will merge message with new message object. But does not do a deep merge of object
12
- * setLocaleMessage: ƒ setLocaleMessage(locale, message)// set the message with new message object
13
- */
14
-
15
- // This library locales files
16
- // const thisLocales = require.context(
17
- // '../$locales',
18
- // true,
19
- // /[A-Za-z0-9-_,\s]+\.json$/i
20
- // )
21
-
22
- const thisLocales = import.meta.glob('../$locales/*.json', { eager: true })
23
- for (const path in thisLocales) {
24
- const matched = path.match(/([A-Za-z0-9-_]+)\./i)
25
- if (matched && matched.length > 1) {
26
- const locale = matched[1]
27
- // Using lodash to deeply merge objects
28
- const messagesDeepCopy = JSON.parse(JSON.stringify(i18n.messages[locale]))
29
- const mergedMessages = _.merge(messagesDeepCopy, thisLocales[path])
30
- // Since merLocalMessage will do a shallow merge of the object. We will use setLocalMessage to replace the message with new message object
31
- i18n.setLocaleMessage(locale, mergedMessages)
32
- }
33
- }
34
- // thisLocales.keys().forEach((key) => {
35
- // const matched = key.match(/([A-Za-z0-9-_]+)\./i)
36
- // if (matched && matched.length > 1) {
37
- // const locale = matched[1]
38
- // // Using lodash to deeply merge objects
39
- // const mergedMessages = deep.merge(i18n.messages[locale], thisLocales(key))
40
- // // Since merLocalMessage will do a shallow merge of the object. We will use setLocalMessage to replace the message with new message object
41
- // i18n.setLocaleMessage(locale, mergedMessages)
42
- // }
43
- // })
44
- }
1
+ import _ from 'lodash'
2
+ /**
3
+ * Merge locales message in project.
4
+ * @summary To merge the locales dictionnary of this library with the locales that user will create
5
+ * @param {Object} i18n - vue-i18n internalization object.
6
+ */
7
+ export default function mergeLocales(i18n) {
8
+ //const deep = import('lodash') // provide deep merge of Object cf: https://attacomsian.com/blog/javascript-merge-objects
9
+
10
+ /* I18n internal methods for mutating messages property
11
+ * mergeLocaleMessage: ƒ mergeLocaleMessage(locale, message)// will merge message with new message object. But does not do a deep merge of object
12
+ * setLocaleMessage: ƒ setLocaleMessage(locale, message)// set the message with new message object
13
+ */
14
+
15
+ // This library locales files
16
+ // const thisLocales = require.context(
17
+ // '../$locales',
18
+ // true,
19
+ // /[A-Za-z0-9-_,\s]+\.json$/i
20
+ // )
21
+
22
+ const thisLocales = import.meta.glob('../$locales/*.json', { eager: true })
23
+ for (const path in thisLocales) {
24
+ const matched = path.match(/([A-Za-z0-9-_]+)\./i)
25
+ if (matched && matched.length > 1) {
26
+ const locale = matched[1]
27
+ // Using lodash to deeply merge objects
28
+ const messagesDeepCopy = JSON.parse(JSON.stringify(i18n.messages[locale]))
29
+ const mergedMessages = _.merge(messagesDeepCopy, thisLocales[path])
30
+ // Since merLocalMessage will do a shallow merge of the object. We will use setLocalMessage to replace the message with new message object
31
+ i18n.setLocaleMessage(locale, mergedMessages)
32
+ }
33
+ }
34
+ // thisLocales.keys().forEach((key) => {
35
+ // const matched = key.match(/([A-Za-z0-9-_]+)\./i)
36
+ // if (matched && matched.length > 1) {
37
+ // const locale = matched[1]
38
+ // // Using lodash to deeply merge objects
39
+ // const mergedMessages = deep.merge(i18n.messages[locale], thisLocales(key))
40
+ // // Since merLocalMessage will do a shallow merge of the object. We will use setLocalMessage to replace the message with new message object
41
+ // i18n.setLocaleMessage(locale, mergedMessages)
42
+ // }
43
+ // })
44
+ }
@@ -1,219 +1,227 @@
1
- /*
2
- * idb library by jakearchibald: https://github.com/jakearchibald/idb
3
- */
4
- import { openDB } from 'idb'
5
- import $_ from 'lodash'
6
- //import { createApp } from 'vue'
7
- //import {*} from "idb";
8
- let dataBase = null
9
- let dbName = '$crsDataBase' //test
10
- let storeName = '$lessonsStore' //test
11
- //openDB, deleteDB, wrap, unwrap
12
- //$_id
13
- //const app = createApp({})
14
- export const $idb = {
15
- install(app) {
16
- app.config.globalProperties.$idb = {
17
- /*
18
- * @ Description: create a indexedDB database
19
- * Open a data base in indexedDB if does not exist and create a store for the lessons package
20
- *@ return Promise
21
- */
22
- async openDB() {
23
- try {
24
- if (!window.indexedDB) {
25
- console.log(
26
- "Your browser doesn't support a stable version of IndexedDB. Saving feature of your progress will not be available."
27
- )
28
- return
29
- } else {
30
- const db = await openDB(dbName, 1, {
31
- upgrade(db) {
32
- // Create a store of objects
33
- const store = db.createObjectStore(storeName, {
34
- keyPath: '_$id',
35
- autoIncrement: true
36
- })
37
- // Create an index for the data
38
- store.createIndex('$idb_id', '$idb_id', { unique: true })
39
- // Create an index for the data
40
- store.createIndex('$record', '$record', { unique: false })
41
-
42
- //Create an index that is not unique (two person can have the same age)
43
- store.createIndex('$last_edit', '$last_edit', { unique: false })
44
- }
45
- })
46
- dataBase = db
47
- //return (dataBase = db);
48
- }
49
- } catch (err) {
50
- console.log('==> Erro ', err)
51
- }
52
- },
53
-
54
- /*
55
- * @Description: wrapper to insert new data in the store (entry is entered if doesn't already exist in db)
56
- * @Params storeName {String}: name of the store
57
- * @Params data {object}: new value to enter
58
- * @Return promise
59
- */
60
- async insertDataInDB(data) {
61
- try {
62
- //Index param
63
- const searchIndex = '$idb_id'
64
- //search by package Id index
65
- const value = await dataBase.getFromIndex(
66
- storeName,
67
- searchIndex,
68
- data[searchIndex]
69
- )
70
-
71
- //Add entry to database if does not exist
72
- if (!value) {
73
- const addedItem = await dataBase.add(storeName, $_.cloneDeep(data))
74
-
75
- return addedItem
76
- }
77
- } catch (err) {
78
- console.log('Error..', err)
79
- }
80
- },
81
-
82
- /*@Description - Helper to get all data existing in the store
83
- @Param storeName {String} - Name of the store
84
- *@Return Promise {array} of all entries
85
- */
86
- async getAllFromDB() {
87
- try {
88
- //Get all from the storeName order by last edit
89
- const entryList = await dataBase.getAllFromIndex(
90
- storeName,
91
- 'lastEdit'
92
- )
93
- return entryList
94
- } catch (err) {
95
- console.log('error...', err)
96
- }
97
- },
98
-
99
- /*
100
- *@Description - Helper to get one entry from the store
101
- *@Param target {String} - id of the entry
102
- *@Return Promise {array} of all entries
103
- */
104
- async getFromDB(target) {
105
- try {
106
- //Index param
107
- const searchIndex = '$idb_id'
108
- //search by package Id index
109
- const entry = await dataBase.getFromIndex(
110
- storeName,
111
- searchIndex,
112
- target
113
- )
114
- return entry
115
- } catch (err) {
116
- console.log('error...', err)
117
- }
118
- },
119
-
120
- /*
121
- *@Description - Helper to update data in a store
122
- * @Params storeName {String} - name of the store
123
- * @Params index {String} - name of the index
124
- * @Params target {String| num} - id of the element to update
125
- * @Params newValue {Object} - new value to enter
126
- *@return Promise
127
- */
128
- async updateDataInDB(target, newValue) {
129
- try {
130
- //Index param
131
- const searchIndex = '$idb_id'
132
-
133
- //search by package Id index
134
- const existingRecord = await dataBase.getFromIndex(
135
- storeName,
136
- searchIndex,
137
- target
138
- )
139
- //If there is an existing record update the record with new data
140
- if (existingRecord) {
141
- existingRecord.$record = newValue
142
- existingRecord.$last_edit = Date.now()
143
- const updatedItem = await dataBase.put(
144
- storeName,
145
- $_.cloneDeep(existingRecord)
146
- )
147
- //await this.getAllFromDB(storeName)
148
- return updatedItem
149
- }
150
- } catch (err) {
151
- console.log('Error: ', err)
152
- }
153
- },
154
- /*
155
- * @Description - Heleper to delete entry from the store
156
- * @Params storeName {String} - name of the store
157
- * @Params index {String} - name of the index
158
- * @Params target {String| num} - id of the element to remove
159
- * @Return reference of deleted item
160
- */
161
- async deleteDataInDB(target) {
162
- try {
163
- //Index param
164
- const searchIndex = '$idb_id'
165
-
166
- //search by package Id index
167
- const existingRecord = await dataBase.getFromIndex(
168
- storeName,
169
- searchIndex,
170
- target
171
- )
172
- //If there is an existing delete it from the store
173
- if (existingRecord) {
174
- const deletedItem = await dataBase.delete(
175
- storeName,
176
- existingRecord._$id
177
- )
178
-
179
- return deletedItem
180
- }
181
- } catch (err) {
182
- console.log('Error: ', err)
183
- }
184
- },
185
- /**
186
- * @description creating a small save plug-in to save store state in the localStorage
187
- * the plugin listen for changes made to the Pinia store store to store them in the browser storage.
188
- * Since the The handler is called after every actions we want to limit the saving of data to storage only
189
- * when the changes are affecting the user interaction.
190
- * This prevent resetting the store to initial state when the browser refreshes
191
- * @param {Object} store Pinia Store
192
- * @param {String} item package $idb_id
193
- */
194
- async saveState(store, item) {
195
- store.$onAction(async ({ name, store, args, after }) => {
196
- //Should only track changes actions on userMetadata
197
- if (!['updateUserMetaData', 'setUserMetaData'].includes(name)) return
198
-
199
- // Open DB with a store
200
- const search = await this.getFromDB(item)
201
-
202
- if (Object.entries(store.$state.userMetaData).length && search) {
203
- // Update the db store
204
- await this.updateDataInDB(item, store.$state.userMetaData)
205
- //==================================================
206
- } else {
207
- //Add Entry to db store
208
- await this.insertDataInDB({
209
- $idb_id: item,
210
- $record: store.$state.userMetaData,
211
- $last_edit: Date.now()
212
- })
213
- }
214
- //})
215
- })
216
- }
217
- }
218
- }
219
- }
1
+ /*
2
+ * idb library by jakearchibald: https://github.com/jakearchibald/idb
3
+ */
4
+ import { openDB } from 'idb'
5
+ import $_ from 'lodash'
6
+ //import { createApp } from 'vue'
7
+ //import {*} from "idb";
8
+ let dataBase = null
9
+ let dbName = '$crsDataBase' //test
10
+ let storeName = '$lessonsStore' //test
11
+ //openDB, deleteDB, wrap, unwrap
12
+ //$_id
13
+ //const app = createApp({})
14
+ export const $idb = {
15
+ install(app) {
16
+ app.config.globalProperties.$idb = {
17
+ /*
18
+ * @ Description: create a indexedDB database
19
+ * Open a data base in indexedDB if does not exist and create a store for the lessons package
20
+ *@ return Promise
21
+ */
22
+ async openDB() {
23
+ try {
24
+ if (!window.indexedDB) {
25
+ console.log(
26
+ "Your browser doesn't support a stable version of IndexedDB. Saving feature of your progress will not be available."
27
+ )
28
+ return
29
+ } else {
30
+ const db = await openDB(dbName, 1, {
31
+ upgrade(db) {
32
+ // Create a store of objects
33
+ const store = db.createObjectStore(storeName, {
34
+ keyPath: '_$id',
35
+ autoIncrement: true
36
+ })
37
+ // Create an index for the data
38
+ store.createIndex('$idb_id', '$idb_id', { unique: true })
39
+ // Create an index for the data
40
+ store.createIndex('$record', '$record', { unique: false })
41
+
42
+ //Create an index that is not unique (two person can have the same age)
43
+ store.createIndex('$last_edit', '$last_edit', { unique: false })
44
+ }
45
+ })
46
+ dataBase = db
47
+ //return (dataBase = db);
48
+ }
49
+ } catch (err) {
50
+ console.log('==> Erro ', err)
51
+ }
52
+ },
53
+
54
+ /*
55
+ * @Description: wrapper to insert new data in the store (entry is entered if doesn't already exist in db)
56
+ * @Params storeName {String}: name of the store
57
+ * @Params data {object}: new value to enter
58
+ * @Return promise
59
+ */
60
+ async insertDataInDB(data) {
61
+ try {
62
+ //Index param
63
+ const searchIndex = '$idb_id'
64
+ //search by package Id index
65
+ const value = await dataBase.getFromIndex(
66
+ storeName,
67
+ searchIndex,
68
+ data[searchIndex]
69
+ )
70
+
71
+ //Add entry to database if does not exist
72
+ if (!value) {
73
+ const addedItem = await dataBase.add(storeName, $_.cloneDeep(data))
74
+
75
+ return addedItem
76
+ }
77
+ } catch (err) {
78
+ console.log('Error..', err)
79
+ }
80
+ },
81
+
82
+ /*@Description - Helper to get all data existing in the store
83
+ @Param storeName {String} - Name of the store
84
+ *@Return Promise {array} of all entries
85
+ */
86
+ async getAllFromDB() {
87
+ try {
88
+ //Get all from the storeName order by last edit
89
+ const entryList = await dataBase.getAllFromIndex(
90
+ storeName,
91
+ 'lastEdit'
92
+ )
93
+ return entryList
94
+ } catch (err) {
95
+ console.log('error...', err)
96
+ }
97
+ },
98
+
99
+ /*
100
+ *@Description - Helper to get one entry from the store
101
+ *@Param target {String} - id of the entry
102
+ *@Return Promise {array} of all entries
103
+ */
104
+ async getFromDB(target) {
105
+ try {
106
+ //Index param
107
+ const searchIndex = '$idb_id'
108
+ //search by package Id index
109
+ const entry = await dataBase.getFromIndex(
110
+ storeName,
111
+ searchIndex,
112
+ target
113
+ )
114
+ return entry
115
+ } catch (err) {
116
+ console.log('error...', err)
117
+ }
118
+ },
119
+
120
+ /*
121
+ *@Description - Helper to update data in a store
122
+ * @Params storeName {String} - name of the store
123
+ * @Params index {String} - name of the index
124
+ * @Params target {String| num} - id of the element to update
125
+ * @Params newValue {Object} - new value to enter
126
+ *@return Promise
127
+ */
128
+ async updateDataInDB(target, newValue) {
129
+ try {
130
+ //Index param
131
+ const searchIndex = '$idb_id'
132
+
133
+ //search by package Id index
134
+ const existingRecord = await dataBase.getFromIndex(
135
+ storeName,
136
+ searchIndex,
137
+ target
138
+ )
139
+ //If there is an existing record update the record with new data
140
+ if (existingRecord) {
141
+ existingRecord.$record = newValue
142
+ existingRecord.$last_edit = Date.now()
143
+ const updatedItem = await dataBase.put(
144
+ storeName,
145
+ $_.cloneDeep(existingRecord)
146
+ )
147
+ //await this.getAllFromDB(storeName)
148
+ return updatedItem
149
+ }
150
+ } catch (err) {
151
+ console.log('Error: ', err)
152
+ }
153
+ },
154
+ /*
155
+ * @Description - Heleper to delete entry from the store
156
+ * @Params storeName {String} - name of the store
157
+ * @Params index {String} - name of the index
158
+ * @Params target {String| num} - id of the element to remove
159
+ * @Return reference of deleted item
160
+ */
161
+ async deleteDataInDB(target) {
162
+ try {
163
+ //Index param
164
+ const searchIndex = '$idb_id'
165
+
166
+ //search by package Id index
167
+ const existingRecord = await dataBase.getFromIndex(
168
+ storeName,
169
+ searchIndex,
170
+ target
171
+ )
172
+ //If there is an existing delete it from the store
173
+ if (existingRecord) {
174
+ const deletedItem = await dataBase.delete(
175
+ storeName,
176
+ existingRecord._$id
177
+ )
178
+
179
+ return deletedItem
180
+ }
181
+ } catch (err) {
182
+ console.log('Error: ', err)
183
+ }
184
+ },
185
+ /**
186
+ * @description creating a small save plug-in to save store state in the localStorage
187
+ * the plugin listen for changes made to the Pinia store store to store them in the browser storage.
188
+ * Since the The handler is called after every actions we want to limit the saving of data to storage only
189
+ * when the changes are affecting the user interaction.
190
+ * This prevent resetting the store to initial state when the browser refreshes
191
+ * @param {Object} store Pinia Store
192
+ * @param {String} item package $idb_id
193
+ */
194
+ async saveState(store, item) {
195
+ store.$onAction(async ({ name, store, args, after }) => {
196
+ //Should only track changes actions on userMetadata
197
+ if (!['updateUserMetaData', 'setUserMetaData'].includes(name)) return
198
+
199
+ // Open DB with a store
200
+ const search = await this.getFromDB(item)
201
+
202
+ if (Object.entries(store.$state.userMetaData).length && search) {
203
+ // Update the db store
204
+ await this.updateDataInDB(item, {
205
+ progress: store.$state.userMetaData,
206
+ userSettings: store.$state.applicationSettings,
207
+ routeHistory: store.getRouteHistory
208
+ })
209
+ //==================================================
210
+ } else {
211
+ //Add Entry to db store
212
+ await this.insertDataInDB({
213
+ $idb_id: item,
214
+ $record: {
215
+ progress: store.$state.userMetaData,
216
+ userSettings: store.$state.applicationSettings,
217
+ routeHistory: store.getRouteHistory
218
+ },
219
+ $last_edit: Date.now()
220
+ })
221
+ }
222
+ //})
223
+ })
224
+ }
225
+ }
226
+ }
227
+ }
@@ -1,37 +1,37 @@
1
- /* creating a small save plug-in to save store state in the localStorage
2
- * the plugin listen for mutations made to the Pinia store and store them in the local browser storage.
3
- * This prevent reseting the store to initial state when the browser refreshes
4
- * Note: the plugin is used in the store.js
5
- */
6
- export function saveStatePlugin(store) {
7
- store.subscribe((mutation, state) => {
8
- // save the user data
9
- if (Object.entries(state.$appStore.userMetaData).length) {
10
- localStorage.setItem(
11
- 'userData',
12
- JSON.stringify(state.$appStore.userMetaData)
13
- )
14
- } else if (
15
- !localStorage.getItem('userData') &&
16
- !Object.entries(state.$appStore.userMetaData).length
17
- ) {
18
- localStorage.setItem('userData', JSON.stringify({}))
19
- }
20
- })
21
- }
22
-
23
- /**
24
- * creating a small save plug-in to get stored state from the localStorage
25
- */
26
- export function getSavedStatePlugin(type, id) {
27
- if (localStorage.getItem('thisModule')) {
28
- const savedData = JSON.parse(localStorage.getItem('thisModule'))
29
-
30
- if (type === 'module' && savedData.id === id) return savedData
31
- if (type === 'page' && savedData.children.length) {
32
- return savedData.children.find((p) => id === p.id)
33
- }
34
- return JSON.parse(localStorage.getItem('thisModule'))
35
- }
36
- return null
37
- }
1
+ /* creating a small save plug-in to save store state in the localStorage
2
+ * the plugin listen for mutations made to the Pinia store and store them in the local browser storage.
3
+ * This prevent reseting the store to initial state when the browser refreshes
4
+ * Note: the plugin is used in the store.js
5
+ */
6
+ export function saveStatePlugin(store) {
7
+ store.subscribe((mutation, state) => {
8
+ // save the user data
9
+ if (Object.entries(state.$appStore.userMetaData).length) {
10
+ localStorage.setItem(
11
+ 'userData',
12
+ JSON.stringify(state.$appStore.userMetaData)
13
+ )
14
+ } else if (
15
+ !localStorage.getItem('userData') &&
16
+ !Object.entries(state.$appStore.userMetaData).length
17
+ ) {
18
+ localStorage.setItem('userData', JSON.stringify({}))
19
+ }
20
+ })
21
+ }
22
+
23
+ /**
24
+ * creating a small save plug-in to get stored state from the localStorage
25
+ */
26
+ export function getSavedStatePlugin(type, id) {
27
+ if (localStorage.getItem('thisModule')) {
28
+ const savedData = JSON.parse(localStorage.getItem('thisModule'))
29
+
30
+ if (type === 'module' && savedData.id === id) return savedData
31
+ if (type === 'page' && savedData.children.length) {
32
+ return savedData.children.find((p) => id === p.id)
33
+ }
34
+ return JSON.parse(localStorage.getItem('thisModule'))
35
+ }
36
+ return null
37
+ }