convert stock images to new vue bootstrapping mechanism, fixes #4305

Closes #4305

Merge request studip/studip!3185

4 files changed, 9 insertions, 30 deletions

diff --git a/resources/assets/javascripts/bootstrap/stock-images.js b/resources/assets/javascripts/bootstrap/stock-images.js
deleted file mode 100644
index 6ed6edf..0000000
--- a/resources/assets/javascripts/bootstrap/stock-images.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import StockImages from '../lib/stock-images.js';
-
-STUDIP.domReady(() => {
-    StockImages.init();
-});
diff --git a/resources/assets/javascripts/bootstrap/vue.js b/resources/assets/javascripts/bootstrap/vue.js
index ce1aa0d..551daca 100644
--- a/resources/assets/javascripts/bootstrap/vue.js
+++ b/resources/assets/javascripts/bootstrap/vue.js
@@ -3,6 +3,7 @@ STUDIP.ready(() => {
         const config = Object.assign(
             {
                 components: [],
+                plugins: {},
                 stores: {}
             },
             JSON.parse(node.dataset.vueApp)
@@ -37,7 +38,7 @@ STUDIP.ready(() => {
             };
         });
 
-        STUDIP.Vue.load().then(async ({createApp, store}) => {
+        STUDIP.Vue.load().then(async ({createApp, store, Vue}) => {
             for (const [index, name] of Object.entries(config.stores)) {
                 import(`../../../vue/store/${name}.js`).then(storeConfig => {
                     store.registerModule(index, storeConfig.default);
@@ -53,6 +54,13 @@ STUDIP.ready(() => {
                     }
                 });
             }
+
+            for (const [plugin, filename] of Object.entries(config.plugins)) {
+                import(`../../../vue/plugins/${filename}.js`)
+                    .then((temp) => Vue.use(temp[plugin], { store }));
+            }
+
+
             createApp({
                 components,
                 store,
diff --git a/resources/assets/javascripts/entry-base.js b/resources/assets/javascripts/entry-base.js
index 3c2223e..7a382b8 100644
--- a/resources/assets/javascripts/entry-base.js
+++ b/resources/assets/javascripts/entry-base.js
@@ -77,7 +77,6 @@ import "./bootstrap/scroll_to_top.js"
 import "./bootstrap/admin-courses.js"
 import "./bootstrap/oer.js"
 import "./bootstrap/courseware.js"
-import "./bootstrap/stock-images.js"
 import "./bootstrap/external_pages.js"
 
 import "./mvv_course_wizard.js"
diff --git a/resources/assets/javascripts/lib/stock-images.js b/resources/assets/javascripts/lib/stock-images.js
deleted file mode 100644
index 330fbc9..0000000
--- a/resources/assets/javascripts/lib/stock-images.js
+++ /dev/null
@@ -1,23 +0,0 @@
-const StockImages = {
-    init() {
-        const stockImagesPage = document.querySelector('div.stock-images');
-        if (stockImagesPage !== null) {
-            Promise.all([window.STUDIP.Vue.load(), StockImages.plugin()]).then(
-                ([{ Vue, createApp, store }, StockImagesPlugin]) => {
-                    Vue.use(StockImagesPlugin, { store });
-                    createApp({
-                        el: stockImagesPage,
-                        render: (h) => {
-                            return h(Vue.component('StockImagesPage'), { props: {} });
-                        },
-                    });
-                }
-            );
-        }
-    },
-    plugin() {
-        return import('@/vue/plugins/stock-images.js').then(({ StockImagesPlugin }) => StockImagesPlugin);
-    },
-};
-
-export default StockImages;