diff --git a/.gitignore b/.gitignore
index 4780c76fe..ddfa0195c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -11,6 +11,9 @@
 # nano
 .swp
 
+# vimlocal
+.vimlocal
+
 # Node.js
 node_modules
 report.*.json
diff --git a/packages/client/src/components/media-list.vue b/packages/client/src/components/media-list.vue
index f89ab262d..247f39817 100644
--- a/packages/client/src/components/media-list.vue
+++ b/packages/client/src/components/media-list.vue
@@ -6,7 +6,7 @@
 			<template v-for="media in mediaList.filter(media => previewable(media))">
 				<XVideo v-if="media.type.startsWith('video')" :key="media.id" :video="media"/>
 				<XImage v-else-if="media.type.startsWith('image')" :key="media.id" class="image" :data-id="media.id" :image="media" :raw="raw"/>
-        <XModPlayer v-else-if="isModule(media)" :key="media.id" :module="media"/>
+				<XModPlayer v-else-if="isModule(media)" :key="media.id" :module="media"/>
 			</template>
 		</div>
 	</div>
@@ -125,14 +125,14 @@ onMounted(() => {
 const previewable = (file: foundkey.entities.DriveFile): boolean => {
 	if (file.type === 'image/svg+xml') return true; // svgのwebpublic/thumbnailはpngなのでtrue
 	// FILE_TYPE_BROWSERSAFEに適合しないものはブラウザで表示するのに不適切
-  if (isModule(file)) return true;
+	if (isModule(file)) return true;
 	return (file.type.startsWith('video') || file.type.startsWith('image')) && FILE_TYPE_BROWSERSAFE.includes(file.type);
 };
 
 const isModule = (file: foundkey.entities.DriveFile): boolean => {
-  return FILE_EXT_TRACKER_MODULES.filter((ext) => {
-    return file.name.toLowerCase().endsWith("." + ext);
-  }).length > 0;
+	return FILE_EXT_TRACKER_MODULES.filter((ext) => {
+		return file.name.toLowerCase().endsWith("." + ext);
+	}).length > 0;
 };
 
 </script>
diff --git a/packages/client/src/components/mod-player.vue b/packages/client/src/components/mod-player.vue
index 290cb2a05..861bb38fb 100644
--- a/packages/client/src/components/mod-player.vue
+++ b/packages/client/src/components/mod-player.vue
@@ -1,30 +1,30 @@
 <template>
 <div class="mod-player-disabled" v-if="hide" @click="hide = false">
-    <div>
-        <b><i class="fas fa-exlamation-triangle"></i> {{ $ts.sensitive }}</b>
-        <span>{{ $ts.clickToShow }}</span>
-    </div>
+	<div>
+		<b><i class="fas fa-exlamation-triangle"></i> {{ $ts.sensitive }}</b>
+		<span>{{ $ts.clickToShow }}</span>
+	</div>
 </div>
 
 <div class="mod-player-enabled" v-else>
-    <div class="pattern-display">
-        <canvas class="pattern-canvas" ref="displayCanvas"></canvas>
-    </div>
-    <div class="controls">
-        <button class="play" title="play" accesskey="P" @click="playPause()">
-            <i class="fas fa-play" v-if="!playing"></i>
-            <i class="fas fa-pause" v-if="playing"></i>
-        </button>
-        <button class="stop" title="stop" accesskey="X" @click="stop()">
-            <i class="fas fa-stop"></i>
-        </button>
-        <progress min="0" max="100" value="0" ref="progress"></progress>
-        <input type="range" min="0" max="1" v-model="player.context.gain.value" step="0.1" ref="volume" title="volume"/>
-        <a class="download" title="download" :href="module.url">
-            <i class="fas fa-download"></i>
-        </a>
-    </div>
-    <i class="fas fa-eye-slash" @click="hide = true"></i>
+	<div class="pattern-display">
+		<canvas class="pattern-canvas" ref="displayCanvas"></canvas>
+	</div>
+	<div class="controls">
+		<button class="play" title="play" accesskey="P" @click="playPause()">
+			<i class="fas fa-play" v-if="!playing"></i>
+			<i class="fas fa-pause" v-if="playing"></i>
+		</button>
+		<button class="stop" title="stop" accesskey="X" @click="stop()">
+			<i class="fas fa-stop"></i>
+		</button>
+		<progress min="0" max="100" value="0" ref="progress"></progress>
+		<input type="range" min="0" max="1" v-model="player.context.gain.value" step="0.1" ref="volume" title="volume"/>
+		<a class="download" title="download" :href="module.url">
+			<i class="fas fa-download"></i>
+		</a>
+	</div>
+	<i class="fas fa-eye-slash" @click="hide = true"></i>
 </div>
 </template>
 
@@ -35,7 +35,7 @@ import { defaultStore } from '@/store';
 import { ChiptuneJsPlayer, ChiptuneJsConfig } from '@/scripts/chiptune2';
 
 const props = defineProps<{
-    module: foundkey.entities.DriveFile
+	module: foundkey.entities.DriveFile
 }>();
 
 let hide = ref((defaultStore.state.nsfw === 'force') ? true : props.module.isSensitive && (defaultStore.state.nsfw !== 'ignore'));
@@ -47,269 +47,269 @@ const player = ref(new ChiptuneJsPlayer(new ChiptuneJsConfig(1)));
 const rowBuffer = 24;
 let buffer = null;
 player.value.load(props.module.url).then((result) => {
-    buffer = result;
-    try {
-        player.value.play(buffer);
-        display();
+	buffer = result;
+	try {
+		player.value.play(buffer);
+		display();
     } catch (e) {
-        console.warn(e);
+		console.warn(e);
     }
-    player.value.stop();
+	player.value.stop();
 }).catch((error) => {
-    console.error(error);
+	console.error(error);
 });
 
 function playPause() {
-    player.value.addHandler('onRowChange', () => {
-        progress.value.max = player.value.duration();
-        progress.value.value = player.value.position() % player.value.duration();
-        display();
+	player.value.addHandler('onRowChange', () => {
+		progress.value.max = player.value.duration();
+		progress.value.value = player.value.position() % player.value.duration();
+		display();
     });
 
-    if (player.value.currentPlayingNode === null) {
-        player.value.play(buffer);
-        playing.value = true;
-    } else {
-        player.value.togglePause();
-        playing.value = !player.value.currentPlayingNode.paused;
-    }
+	if (player.value.currentPlayingNode === null) {
+		player.value.play(buffer);
+		playing.value = true;
+	} else {
+		player.value.togglePause();
+		playing.value = !player.value.currentPlayingNode.paused;
+	}
 }
 
 function stop() {
-    player.value.stop();
-    playing.value = false;
-    try {
-        player.value.play(buffer);
-        display();
-    } catch (e) {
-        console.warn(e);
-    }
-    player.value.stop();
-    progress.value.value = 0;
-    player.value.handlers = [];
+	player.value.stop();
+	playing.value = false;
+	try {
+		player.value.play(buffer);
+		display();
+	} catch (e) {
+		console.warn(e);
+	}
+	player.value.stop();
+	progress.value.value = 0;
+	player.value.handlers = [];
 }
 
 function display() {
-    if (!displayCanvas.value) {
-        stop();
-        return;
-    }
+	if (!displayCanvas.value) {
+		stop();
+		return;
+	}
 
-    const canvas = displayCanvas.value;
+	const canvas = displayCanvas.value;
 
-    const pattern = player.value.getPattern();
-    const row = player.value.getRow();
-    let nbChannels = 0;
-    if (player.value.currentPlayingNode) {
-        nbChannels = player.value.currentPlayingNode.nbChannels;
-    }
-    if (canvas.width !== 12 + 84 * nbChannels + 2) {
-        canvas.width = 12 + 84 * nbChannels + 2;
-        canvas.height = 12 * rowBuffer;
-    }
-    const nbRows = player.value.getPatternNumRows(pattern);
-    const ctx = canvas.getContext('2d');
-    ctx.font = '10px monospace';
-    ctx.fillStyle = 'black';
-    ctx.fillRect(0, 0, canvas.width, canvas.height);
-    ctx.fillStyle = 'gray';
-    for (let rowOffset = 0; rowOffset < rowBuffer; rowOffset++) {
-        const rowToDraw = row - rowBuffer / 2 + rowOffset;
-        if (rowToDraw >= 0 && rowToDraw < nbRows) {
-            let rowText = parseInt(rowToDraw).toString(16);
-            if (rowText.length === 1) {
-                rowText = '0' + rowText;
-            }
-            ctx.fillStyle = 'gray';
-            if (rowToDraw % 4 === 0) {
-                ctx.fillStyle = 'yellow';
-            }
-            if (rowToDraw === row) {
-                ctx.fillStyle = 'white';
-            }
-            ctx.fillText(rowText, 0, 10 + rowOffset * 12);
-            ctx.fillStyle = 'gray';
-            if (rowToDraw === row) {
-                ctx.fillStyle = 'white';
-            }
-            for (let channel = 0; channel < nbChannels; channel++) {
-                const part = player.value.getPatternRowChannel(pattern, rowToDraw, channel);
-                ctx.fillText("|" + part, 12 + 84 * channel, 10 + rowOffset * 12);
-            }
-        }
-    }
+	const pattern = player.value.getPattern();
+	const row = player.value.getRow();
+	let nbChannels = 0;
+	if (player.value.currentPlayingNode) {
+		nbChannels = player.value.currentPlayingNode.nbChannels;
+	}
+	if (canvas.width !== 12 + 84 * nbChannels + 2) {
+		canvas.width = 12 + 84 * nbChannels + 2;
+		canvas.height = 12 * rowBuffer;
+	}
+	const nbRows = player.value.getPatternNumRows(pattern);
+	const ctx = canvas.getContext('2d');
+	ctx.font = '10px monospace';
+	ctx.fillStyle = 'black';
+	ctx.fillRect(0, 0, canvas.width, canvas.height);
+	ctx.fillStyle = 'gray';
+	for (let rowOffset = 0; rowOffset < rowBuffer; rowOffset++) {
+		const rowToDraw = row - rowBuffer / 2 + rowOffset;
+		if (rowToDraw >= 0 && rowToDraw < nbRows) {
+			let rowText = parseInt(rowToDraw).toString(16);
+			if (rowText.length === 1) {
+				rowText = '0' + rowText;
+			}
+			ctx.fillStyle = 'gray';
+			if (rowToDraw % 4 === 0) {
+				ctx.fillStyle = 'yellow';
+			}
+			if (rowToDraw === row) {
+				ctx.fillStyle = 'white';
+			}
+			ctx.fillText(rowText, 0, 10 + rowOffset * 12);
+			ctx.fillStyle = 'gray';
+			if (rowToDraw === row) {
+				ctx.fillStyle = 'white';
+			}
+			for (let channel = 0; channel < nbChannels; channel++) {
+				const part = player.value.getPatternRowChannel(pattern, rowToDraw, channel);
+				ctx.fillText("|" + part, 12 + 84 * channel, 10 + rowOffset * 12);
+			}
+		}
+	}
 }
 
 </script>
 
 <style lang="scss" scoped>
 .mod-player-enabled {
-  position: relative;
-  display: flex;
-  flex-direction: column;
+	position: relative;
+	display: flex;
+	flex-direction: column;
 
-  > i {
-    display: block;
-    position: absolute;
-    border-radius: 6px;
-    background-color: var(--fg);
-    color: var(--accentLighten);
-    font-size: 14px;
-    opacity: .5;
-    padding: 3px 6px;
-    text-align: center;
-    cursor: pointer;
-    top: 12px;
-    right: 12px;
-  }
+	> i {
+		display: block;
+		position: absolute;
+		border-radius: 6px;
+		background-color: var(--fg);
+		color: var(--accentLighten);
+		font-size: 14px;
+		opacity: .5;
+		padding: 3px 6px;
+		text-align: center;
+		cursor: pointer;
+		top: 12px;
+		right: 12px;
+	}
 
-  > .pattern-display {
-    width: 100%;
-    height: 100%;
-    overflow-x: scroll;
-    overflow-y: hidden;
-    background-color: black;
-    text-align: center;
-    .pattern-canvas {
-      background-color: black;
-      height: 100%;
-    }
-  }
+	> .pattern-display {
+		width: 100%;
+		height: 100%;
+		overflow-x: scroll;
+		overflow-y: hidden;
+		background-color: black;
+		text-align: center;
+		.pattern-canvas {
+			background-color: black;
+			height: 100%;
+		}
+	}
 
-  > .controls {
-    display: flex;
-    width: 100%;
-    background-color: var(--bg);
+	> .controls {
+		display: flex;
+		width: 100%;
+		background-color: var(--bg);
 
-    > * {
-      padding: 4px 8px;
-    }
+		> * {
+			padding: 4px 8px;
+		}
 
-    > button, a {
-      border: none;
-      background-color: transparent;
-      color: var(--accent);
-      
-      &:hover {
-        background-color: var(--fg);
-      }
-    }
+		> button, a {
+			border: none;
+			background-color: transparent;
+			color: var(--accent);
 
-    > input[type=range] {
-      height: 21px;
-      -webkit-appearance: none;
-      width: 90px;
-      padding: 0;
-      margin: 4px 8px;
+			&:hover {
+				background-color: var(--fg);
+			}
+		}
 
-      &:focus {
-        outline: none;
-        
-        &::-webkit-slider-runnable-track {
-          background: var(--bg);
-        }
+		> input[type=range] {
+			height: 21px;
+			-webkit-appearance: none;
+			width: 90px;
+			padding: 0;
+			margin: 4px 8px;
 
-        &::-ms-fill-lower, &::-ms-fill-upper {
-          background: var(--bg);
-        }
-      }
+			&:focus {
+				outline: none;
 
-      &::-webkit-slider-runnable-track {
-        width: 100%;
-        height: 100%;
-        cursor: pointer;
-        border-radius: 0;
-        animate: 0.2s;
-        background: var(--bg);
-        border: 1px solid var(--fg);
-      }
+				&::-webkit-slider-runnable-track {
+					background: var(--bg);
+				}
 
-      &::-webkit-slider-thumb {
-        border: none;
-        height: 100%;
-        width: 14px;
-        border-radius: 0;
-        background: var(--accent);
-        cursor: pointer;
-        -webkit-appearance: none;
-        margin-top: -0.5px;
-      }
+				&::-ms-fill-lower, &::-ms-fill-upper {
+					background: var(--bg);
+				}
+			}
 
-      &::-moz-range-track {
-        width: 100%;
-        height: 100%;
-        cursor: pointer;
-        border-radius: 0;
-        animate: 0.2s;
-        background: var(--bg);
-        border: 1px solid var(--fg);
-      }
+			&::-webkit-slider-runnable-track {
+				width: 100%;
+				height: 100%;
+				cursor: pointer;
+				border-radius: 0;
+				animate: 0.2s;
+				background: var(--bg);
+				border: 1px solid var(--fg);
+			}
 
-      &::-moz-range-thumb {
-        border: none;
-        height: 100%;
-        border-radius: 0;
-        width: 14px;
-        background: var(--accent);
-        cursoer: pointer;
-      }
+			&::-webkit-slider-thumb {
+				border: none;
+				height: 100%;
+				width: 14px;
+				border-radius: 0;
+				background: var(--accent);
+				cursor: pointer;
+				-webkit-appearance: none;
+				margin-top: -0.5px;
+			}
 
-      &::-ms-track {
-        width: 100%;
-        height: 100%;
-        cursor: pointer;
-        border-radius: 0;
-        animate: 0.2s;
-        background: transparent;
-        border-color: transparent;
-        color: transparent;
-      }
+			&::-moz-range-track {
+				width: 100%;
+				height: 100%;
+				cursor: pointer;
+				border-radius: 0;
+				animate: 0.2s;
+				background: var(--bg);
+				border: 1px solid var(--fg);
+			}
 
-      &::-ms-fill-lower, &::-ms-fill-upper {
-        background: var(--bg);
-        border: 1px solid var(--fg);
-        border-radius: 0;
-      }
+			&::-moz-range-thumb {
+				border: none;
+				height: 100%;
+				border-radius: 0;
+				width: 14px;
+				background: var(--accent);
+				cursor: pointer;
+			}
 
-      &::-ms-thumb {
-        margin-top: 1px;
-        border: none;
-        height: 100%;
-        width: 14px;
-        border-radius: 0;
-        background: var(--accent);
-        cursor: pointer;
-      }
-    }
+			&::-ms-track {
+				width: 100%;
+				height: 100%;
+				cursor: pointer;
+				border-radius: 0;
+				animate: 0.2s;
+				background: transparent;
+				border-color: transparent;
+				color: transparent;
+			}
 
-    > progress {
-      padding: unset;
-      margin: 4px 8px;
-      flex-grow: 1;
-      background-color: var(--bg);
+			&::-ms-fill-lower, &::-ms-fill-upper {
+				background: var(--bg);
+				border: 1px solid var(--fg);
+				border-radius: 0;
+			}
 
-      &::-moz-progress-bar, &::-webkit-progress-value {
-        background-color: var(--accent);
-      }
-    }
-  }
+			&::-ms-thumb {
+				margin-top: 1px;
+				border: none;
+				height: 100%;
+				width: 14px;
+				border-radius: 0;
+				background: var(--accent);
+				cursor: pointer;
+			}
+		}
+
+		> progress {
+			padding: unset;
+			margin: 4px 8px;
+			flex-grow: 1;
+			background-color: var(--bg);
+
+			&::-moz-progress-bar, &::-webkit-progress-value {
+				background-color: var(--accent);
+			}
+		}
+	}
 }
 
 .mod-player-disabled {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  background: #111;
-  color: #fff;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	background: #111;
+	color: #fff;
 
-  > div {
-    display: table-cell;
-    text-align: center;
-    font-size: 12px;
+	> div {
+		display: table-cell;
+		text-align: center;
+		font-size: 12px;
 
-    > b {
-      display: block;
-    }
-  }
+		> b {
+			display: block;
+		}
+	}
 }
 </style>
diff --git a/packages/client/src/const.ts b/packages/client/src/const.ts
index 6db6faf20..16744c64b 100644
--- a/packages/client/src/const.ts
+++ b/packages/client/src/const.ts
@@ -48,41 +48,41 @@ export const FILE_TYPE_BROWSERSAFE = [
 ];
 
 export const FILE_EXT_TRACKER_MODULES = [
-  'mod',
-  's3m',
-  'xm',
-  'it',
-  'mptm',
-  'stm',
-  'nst',
-  'm15',
-  'stk',
-  'wow',
-  'ult',
-  '669',
-  'mtm',
-  'med',
-  'far',
-  'mdl',
-  'ams',
-  'dsm',
-  'amf',
-  'okt',
-  'dmf',
-  'ptm',
-  'psm',
-  'mt2',
-  'dbm',
-  'digi',
-  'imf',
-  'j2b',
-  'gdm',
-  'umx',
-  'plm',
-  'mo3',
-  'xpk',
-  'ppm',
-  'mmcmp'
+	'mod',
+	's3m',
+	'xm',
+	'it',
+	'mptm',
+	'stm',
+	'nst',
+	'm15',
+	'stk',
+	'wow',
+	'ult',
+	'669',
+	'mtm',
+	'med',
+	'far',
+	'mdl',
+	'ams',
+	'dsm',
+	'amf',
+	'okt',
+	'dmf',
+	'ptm',
+	'psm',
+	'mt2',
+	'dbm',
+	'digi',
+	'imf',
+	'j2b',
+	'gdm',
+	'umx',
+	'plm',
+	'mo3',
+	'xpk',
+	'ppm',
+	'mmcmp'
 ];
 /*
 https://github.com/sindresorhus/file-type/blob/main/supported.js
diff --git a/packages/client/src/scripts/chiptune2.ts b/packages/client/src/scripts/chiptune2.ts
index 97701c664..5e9a88de0 100644
--- a/packages/client/src/scripts/chiptune2.ts
+++ b/packages/client/src/scripts/chiptune2.ts
@@ -109,7 +109,7 @@ ChiptuneJsPlayer.prototype.load = function (input) {
 };
 
 ChiptuneJsPlayer.prototype.play = function (buffer: ArrayBuffer) {
-  this.unlock();
+	this.unlock();
 	this.stop();
 	const processNode = this.createLibopenmptNode(buffer, this.buffer);
 	if (processNode === null) {