feat: calculate magnification depth based on width

istudyatuni · May 13, 2022 · 9959f44 · 9959f44
1 parent 6b2b621
commit 9959f44
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/src/components/Canvas.svelte b/src/components/Canvas.svelte
@@ -44,8 +44,6 @@
 		drawStore.set('yc', coords.yc)
 
 		draw()
-
-		drawStore.set('depth', $drawStore.depth + 1)
 	}
 
 	onMount(init)

diff --git a/src/components/Settings.svelte b/src/components/Settings.svelte
@@ -14,6 +14,10 @@
 </script>
 
 <script>
+	// calculate how many times viewport was scaled by 2
+	// 4 is initial width between [-3, 1], rx - lx == total width of x axis
+	$: magnification_depth = Math.log2(4 / ($drawStore.rx - $drawStore.lx))
+
 	function toggleShow() {
 		settings.set('show_settings', !$settings.show_settings)
 	}
@@ -24,7 +28,6 @@
 		drawStore.set('lx', -3)
 		drawStore.set('rx', 1)
 		drawStore.set('yc', 0)
-		drawStore.set('depth', 0)
 		resetHash()
 	}
 </script>
@@ -54,7 +57,7 @@
 		</div>
 
 		<div class="mb-2">
-			<p>Depth: {$drawStore.depth}</p>
+			<p>Magnification depth: {magnification_depth}</p>
 		</div>
 
 		<div class="flex mb-2">

diff --git a/src/stores/settings.js b/src/stores/settings.js
@@ -13,7 +13,6 @@ export const draw = sessionStore('draw-settings', {
 	lx: -3,
 	rx: 1,
 	yc: 0,
-	depth: 0,
 })
 
 export const settings = sessionStore('settings', {
-Original file line number
+Diff line change
@@ Expand Up / @@ -44,8 +44,6 @@ @@
     		drawStore.set('yc', coords.yc)
     		draw()
-    		drawStore.set('depth', $drawStore.depth + 1)
     	}
     	onMount(init)
@@ Expand Down @@