import { browser } from '$app/environment';
import { derived, writable } from 'svelte/store';

export const canvas = writable({x: 0, y: 0});

export const topLeft = derived(canvas, ($canvas) => {
  if (browser) {
    return {
      x: $canvas.x - window.screen.width/2,
      y: $canvas.y - window.screen.height/2
    };
  }
  return {x: 0, y: 0}
});

export const bottomRight = derived(canvas, ($canvas) => {
  if (browser) {
    return {
      x: $canvas.x + window.screen.width/2,
      y: $canvas.y + window.screen.height/2
    };
  }
  return {x: 0, y: 0}
});