<script setup lang="ts">
const props = defineProps<{
  x: number;
  y: number;
}>();

const settingsStore = useSettingsStore();

const { assets } = useAssets();

const isAnyOtherMenuOpen = computed(() =>
  settingsStore.isAnyOtherMenuOpen("touchScreen"),
);

useRender((ctx) => {
  if (isAnyOtherMenuOpen.value) {
    ctx.drawImage(
      assets.settings.topScreen.touchScreen.touchScreenDisabled,
      props.x,
      props.y,
    );
  } else {
    ctx.drawImage(
      assets.settings.topScreen.touchScreen.touchScreen,
      props.x,
      props.y,
    );
  }
});

defineOptions({
  render: () => null,
});
</script>
