<script setup>
import { onMounted, onUnmounted } from 'vue';

onMounted(() => {
  const preventZoom = (event) => {
    if (event.touches.length > 1) {
      const chartContainer = document.querySelector('.chart-container');
      if (!chartContainer || !chartContainer.contains(event.target)) {
        event.preventDefault();
      }
    }
  };

  document.addEventListener('touchstart', preventZoom, { passive: false });
  document.addEventListener('touchmove', preventZoom, { passive: false });
  document.addEventListener('touchend', preventZoom, { passive: false });

  onUnmounted(() => {
    document.removeEventListener('touchstart', preventZoom);
    document.removeEventListener('touchmove', preventZoom);
    document.removeEventListener('touchend', preventZoom);
  });
});
window.$('body').virtualkeyboard();
</script>

<template>
  <router-view></router-view>
</template>

<style scoped></style>
