Add ability to save files

This commit is contained in:
Jordan Goulder 2025-02-03 23:08:26 -05:00
parent 734fc9a33e
commit c79655a467

View File

@ -1,6 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import { FloppyDisk } from '@/floppy/disk.ts' import { FloppyDisk } from '@/floppy/disk.ts'
import { computed, ref } from 'vue' import { computed, onUnmounted, ref } from 'vue'
import HexDump from '@/components/HexDump.vue' import HexDump from '@/components/HexDump.vue'
import TextDump from '@/components/TextDump.vue' import TextDump from '@/components/TextDump.vue'
@ -10,6 +10,20 @@ const currentPath = ref([''])
const currentFileData = ref(new ArrayBuffer(0)) const currentFileData = ref(new ArrayBuffer(0))
const currentFileObjectUrl = computed<string>((previous) => {
if (previous?.startsWith('blob')) {
URL.revokeObjectURL(previous)
}
if (currentFileData.value.byteLength === 0) {
return ''
}
return URL.createObjectURL(
new Blob([currentFileData.value], { type: 'application/octet-stream' }),
)
})
const currentFileName = ref<string>('') const currentFileName = ref<string>('')
const dataView = ref('hex-dump') const dataView = ref('hex-dump')
@ -55,6 +69,12 @@ const files = computed(() => {
.sort() .sort()
}) })
onUnmounted(() => {
if (currentFileObjectUrl.value?.startsWith('blob')) {
URL.revokeObjectURL(currentFileObjectUrl.value)
}
})
function arraysEqual<T>(a1: T[], a2: T[]): boolean { function arraysEqual<T>(a1: T[], a2: T[]): boolean {
return a1.length === a2.length && a1.every((value, index) => value === a2[index]) return a1.length === a2.length && a1.every((value, index) => value === a2[index])
} }
@ -100,11 +120,14 @@ function loadFile(name: string, firstCluster: number, size: number) {
</li> </li>
</ul> </ul>
</div> </div>
<div> <div class="current-file-controls">
<select v-model="dataView"> <select v-model="dataView">
<option value="hex-dump">Hex Dump</option> <option value="hex-dump">Hex Dump</option>
<option value="text-dump">Text</option> <option value="text-dump">Text</option>
</select> </select>
<a v-show="currentFileObjectUrl" :download="currentFileName" :href="currentFileObjectUrl"
>Download File</a
>
</div> </div>
<div class="current-file-view"> <div class="current-file-view">
<TextDump v-if="dataView === 'text-dump'" :buffer="currentFileData" /> <TextDump v-if="dataView === 'text-dump'" :buffer="currentFileData" />
@ -132,6 +155,14 @@ div.file-list {
overflow-y: auto; overflow-y: auto;
padding: 1em 1em 0; padding: 1em 1em 0;
border: 1px solid rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.2);
flex: 1 0 auto;
}
.current-file-controls {
display: flex;
flex-direction: column;
gap: 1em;
flex: 1 0 auto;
} }
.directories a { .directories a {