chore: cleanup unnecessary things and reformat codes

package.json

@@ -17,8 +17,7 @@
 		"@steeze-ui/heroicons": "^2.3.0",
 		"@steeze-ui/svelte-icon": "^1.5.0",
 		"idb": "^8.0.0",
-		"mini-svg-data-uri": "^1.4.4",
-		"soundfont-player": "^0.12.0"
+		"mini-svg-data-uri": "^1.4.4"
 	},
 	"devDependencies": {
 		"@sveltejs/adapter-auto": "^3.1.0",

postcss.config.js

@@ -1,6 +1,6 @@
 export default {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-}
+	plugins: {
+		tailwindcss: {},
+		autoprefixer: {}
+	}
+};

pwa-assets.config.ts

@@ -2,7 +2,7 @@ import { defineConfig, minimal2023Preset as preset } from '@vite-pwa/assets-gene
 
 export default defineConfig({
 	headLinkOptions: {
-		preset: '2023',
+		preset: '2023'
 	},
 	preset,
 	images: ['static/vite.svg']

src/app.d.ts

@@ -1,5 +1,5 @@
-import 'vite-plugin-pwa/svelte';
 import 'vite-plugin-pwa/info';
+import 'vite-plugin-pwa/svelte';
 import 'vite-plugin-pwa/types';
 
 // See https://kit.svelte.dev/docs/types#app
@@ -20,4 +20,4 @@ declare global {
 	}
 }
 
-export {};
+export { };

src/lib/canvas/core/events.ts

@@ -1,6 +1,5 @@
 type PickByValue<T, Value> = { [P in keyof T as T[P] extends Value | undefined ? P : never]: T[P] };
 export interface PointerEventMap extends PickByValue<HTMLElementEventMap, PointerEvent> {}
-// const m: PointerEventMap = {};
 export const pointerEventTypes: (keyof PointerEventMap)[] = [
 	'gotpointercapture',
 	'lostpointercapture',
@@ -218,7 +217,7 @@ export class CanvasEventHandler {
 
 			pointerInfo.hitCode = unpolledInfo.hitCode;
 			pointerInfo.position = unpolledInfo.position;
-			
+
 			hitEventTypes.forEach(([type, button]) => {
 				if (onHit)
 					onHit({

src/lib/canvas/elements/HitRegion.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { createEventDispatcher } from 'svelte';
-	import { onCanvasHit } from '../core/hooks';
 	import type { CanvasPointerEvent } from '../core/events';
+	import { onCanvasHit } from '../core/hooks';
 
 	export let active: boolean = true;
 	export let render: (ctx: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D) => any;

src/lib/canvas/index.ts

@@ -1,9 +1,9 @@
-import Line from './elements/Line.svelte';
-import Circle from './elements/Circle.svelte';
 import Canvas from './Canvas.svelte';
+import { onCanvasRender } from './core/hooks';
+import Circle from './elements/Circle.svelte';
 import Clip from './elements/Clip.svelte';
+import Crop from './elements/Crop.svelte';
 import Ellipse from './elements/Ellipse.svelte';
+import Line from './elements/Line.svelte';
 import Text from './elements/Text.svelte';
-import Crop from './elements/Crop.svelte';
-import { onCanvasRender } from './core/hooks';
-export { Line, Circle, Canvas, Clip, Ellipse, Text, onCanvasRender, Crop };
+export { Canvas, Circle, Clip, Crop, Ellipse, Line, Text, onCanvasRender };

src/lib/device/metronome/metronome.ts

@@ -23,7 +23,6 @@ class Metronome {
 		this.beatPerBar = beatPerBar;
 		this.bpm = bpm;
 		this.timer.signatureUnit = signatureUnit;
-		console.log(beatPerBar);
 		this.timer.onTick(this.#onTick.bind(this));
 		this.timer.onAudioTick(this.#scheduleAudio.bind(this));
 	}
@@ -32,7 +31,6 @@ class Metronome {
 		return this.timer.beatPerBar;
 	}
 	set beatPerBar(value: number) {
-		console.log('set', value);
 		this.timer.beatPerBar = value;
 		this.#onOptionChangeCallbacks.forEach((cb) => cb(this.state));
 		this.restart();

src/lib/guitar/finger-board/FingerBoard.svelte

@@ -41,13 +41,13 @@
 </script>
 
 <script lang="ts">
+	import Clip from '$/lib/canvas/elements/Clip.svelte';
+	import HitRegion from '$/lib/canvas/elements/HitRegion.svelte';
 	import { Canvas, Circle, Crop, Text } from '$lib/canvas';
 	import { createEventDispatcher } from 'svelte';
 	import FingerBoardBackground from './components/FingerBoardBackground.svelte';
 	import FingerBoardPoisitionIndicator from './components/FingerBoardPoisitionIndicator.svelte';
 	import { getXFromFretNumber, getYFromStringNumber, setFingerBoardContext } from './context';
-	import HitRegion from '$/lib/canvas/elements/HitRegion.svelte';
-	import Clip from '$/lib/canvas/elements/Clip.svelte';
 
 	const dispatch = createEventDispatcher<{ click: FingerPosition; hover: FingerPosition }>();
 

src/lib/notation/ChordNotation.svelte

@@ -1,16 +1,12 @@
 <script lang="ts">
-  import {
-    getChordNotations,
-    type ChordName,
-    type ChordRoot,
-  } from "$/utils/music/chords";
+	import { getChordNotations, type ChordName, type ChordRoot } from '$/utils/music/chords';
 
-  export let root: ChordRoot;
-  export let name: ChordName;
+	export let root: ChordRoot;
+	export let name: ChordName;
 
-  $: chordNotations = getChordNotations(root, name);
+	$: chordNotations = getChordNotations(root, name);
 </script>
 
 <span class="font-chord">
-  {chordNotations.default.short}
+	{chordNotations.default.short}
 </span>

src/lib/notation/PitchNotation.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { getChordNotations, type ChordName, type ChordRoot } from '$/utils/music/chords';
+	import { getChordNotations, type ChordRoot } from '$/utils/music/chords';
 
 	export let note: ChordRoot;
 	export let octave: number;

src/lib/practice/RandomBox/RandomBox.ts

@@ -55,7 +55,6 @@ export class RandomBox<T> {
 				this.#indexSelected = [...this.#remains][RandomBox.getRandomInt(0, this.#remains.size)];
 				selected = this.#items[this.#indexSelected];
 				this.#remains.delete(this.#indexSelected);
-				console.log([...this.#remains]);
 				break;
 		}
 		return selected;

src/lib/practice/RandomBox/RandomBoxProvider.svelte

@@ -1,7 +1,7 @@
 <script lang="ts" generics="T">
 	import { onDestroy } from 'svelte';
-	import { setRandomBoxContext } from './context';
 	import { RandomBox } from './RandomBox';
+	import { setRandomBoxContext } from './context';
 
 	export let items: T[] = [];
 

src/routes/+page.svelte

@@ -7,6 +7,6 @@
 	<br /> I hope it'll open soon :)
 </p>
 <a
-	class="cursor-pointer underline text-indigo hover:text-indigo-600"
+	class="text-indigo cursor-pointer underline hover:text-indigo-600"
 	href="{base}/practice/render-sample">Here's Sample</a
 >

src/routes/practice/+page.svelte

@@ -1 +1 @@
-hi
+hi

src/routes/tools/render-sample/+page.svelte

@@ -45,10 +45,9 @@
 			}
 		};
 	}) as FingerInfo[];
-	// $: console.log(nextNotes);
 
 	function scheduleScore(score: PracticeScore) {
-		/** Now scheduleing */
+		/** Now scheduling */
 
 		// 1. board replacement
 		score.boards.map((board) => {

src/types/geometry.ts

@@ -1,11 +1,11 @@
 export interface Point {
-  x: number;
-  y: number;
+	x: number;
+	y: number;
 }
 
 export interface Rect {
-  x: number;
-  y: number;
-  width: number;
-  height: number;
+	x: number;
+	y: number;
+	width: number;
+	height: number;
 }