import { createApp } from 'vue';
import { createPinia } from 'pinia';
import router from '../router/router';
import Modale from '../vuejs/Modale.vue';
import AnimationToggle from '../vuejs/AnimationToggle.vue';
import VueImageZoomer from 'vue-image-zoomer';
import 'vue-image-zoomer/dist/style.css';

import { useContentStore } from '../stores/content';
import { useMapStore } from '../stores/map';

export function initVueContentModale() {
    const pinia = createPinia();

    const app = createApp(Modale)
      .use(pinia)
      .use(router)
      .use(VueImageZoomer);

    const store = useContentStore();
    const mapStore = useMapStore();
    app.mount('#content-modale');

    const animationToggle = createApp(AnimationToggle)
      .use(pinia)
      .mount('#animation-toggle');

  return { store, mapStore, router };
}