Fix progress bar issues

Author: SnaveSutit

exporters/datapackExporter/exporter/gen/datapack.ts

@@ -98,9 +98,12 @@ export async function generateDatapack(exportData: ExportData) {
 	console.log(folders.datapack)
 
 	const writeProgress = new AnimatedJava.API.ProgressBarController(
-		'Writing datapack to disk',
+		'Writing Data Pack to disk',
 		folders.datapack.childCount
 	)
-	await folders.datapack.writeChildrenToDisk(G.DATAPACK_EXPORT_PATH, { skipEmptyFolders: true })
+	await folders.datapack.writeChildrenToDisk(G.DATAPACK_EXPORT_PATH, {
+		progress: writeProgress,
+		skipEmptyFolders: true,
+	})
 	writeProgress.finish()
 }

src/global.d.ts

@@ -6,6 +6,7 @@ import type { addTranslations, translate } from './util/translation'
 import type { formatStr, roundTo, roundToN } from './util/misc'
 import type { ProgressBarController } from './util/progress'
 import type { VariantsContainer } from './variants'
+import { Writable } from 'svelte/store'
 
 declare global {
 	type NotUndefined<T> = T extends undefined ? never : T
@@ -25,6 +26,8 @@ declare global {
 		loaded?: boolean
 		docClick: (link: string) => void
 		events: typeof import('./events')
+		progress: Writable<number>
+		progress_text: Writable<string>
 
 		API: {
 			Exporter: typeof AnimatedJavaExporter

src/index.ts

@@ -50,6 +50,7 @@ import { openUnexpectedErrorDialog } from './ui/popups/unexpectedError'
 import * as minecraft from './minecraft'
 import { openAJExportInProgressDialog } from './ui/ajExportInProgress'
 import { AJMetaFile } from './ajmeta'
+import { writable } from 'svelte/store'
 
 Prism.languages.mcfunction = {}
 
@@ -75,6 +76,8 @@ globalThis.AnimatedJava = {
 	events,
 	openUnexpectedErrorDialog,
 	openAJExportInProgressDialog,
+	progress: writable<number>(),
+	progress_text: writable<string>(),
 
 	API: {
 		addTranslations,

src/resourcePackExporter.ts

@@ -310,16 +310,16 @@ export async function exportResources(
 		progress.finish()
 	} else {
 		console.log('Writing Resource Pack to Disk')
-		const progress = new ProgressBarController(
-			'Writing Resource Pack to Disk',
-			assetsFolder.childCount
-		)
-		progress.update()
 
 		const filePaths = resourcePackFolder.getAllFilePaths()
 
 		await processAJMeta(filePaths)
 
+		const progress = new ProgressBarController(
+			'Writing Resource Pack to Disk',
+			assetsFolder.childCount
+		)
+
 		await assetsFolder.writeToDisk(resourcePackPath, { progress, skipEmptyFolders: true })
 
 		progress.finish()

src/ui/components/exportInProgress.svelte

@@ -5,6 +5,8 @@
 
 <script lang="ts">
 	import { onDestroy } from 'svelte'
+	let text = AnimatedJava.progress_text
+	let value = AnimatedJava.progress
 
 	jQuery('.dialog_close_button').remove()
 
@@ -14,8 +16,9 @@
 	})
 
 	const interval = setInterval(() => {
-		// @ts-ignore
-		progress.set(Prop.progress)
+		if ($value < $progress) {
+			progress.set($value, { duration: 0 })
+		} else progress.set($value)
 	}, 16)
 
 	onDestroy(() => {
@@ -24,16 +27,18 @@
 </script>
 
 <div class="progress-bar-container">
+	<p>{$text || 'Exporting...'}</p>
 	<progress value={$progress} />
 </div>
 
 <style>
 	.progress-bar-container {
 		display: flex;
-		flex-direction: row;
+		flex-direction: column;
 		align-items: center;
 	}
 	progress {
 		flex-grow: 1;
+		width: 100%;
 	}
 </style>

src/util/progress.ts

@@ -2,25 +2,26 @@ export class ProgressBarController {
 	progress: number
 	constructor(public message: string, public total: number) {
 		this.progress = 0
-		Blockbench.setStatusBarText(message)
+		AnimatedJava.progress.set(0)
+		AnimatedJava.progress_text.set(message)
 	}
 
 	add(change: number) {
 		this.progress += change
 	}
 
 	update() {
-		Blockbench.setProgress(this.progress / this.total)
+		AnimatedJava.progress.set(this.progress / this.total)
 	}
 
 	setMessage(message: string) {
 		this.message = message
-		Blockbench.setStatusBarText(message)
+		AnimatedJava.progress_text.set(message)
 	}
 
 	finish() {
 		this.progress = 0
-		Blockbench.setProgress(0)
-		Blockbench.setStatusBarText()
+		AnimatedJava.progress.set(0)
+		AnimatedJava.progress_text.set('')
 	}
 }

src/util/virtualFileSystem.ts

@@ -182,6 +182,8 @@ export class VirtualFolder extends VirtualNode {
 	}
 
 	async writeToDisk(outputFolder: string, writeOptions: VirtualFileSystemWriteOptions) {
+		// await new Promise(resolve => setTimeout(resolve, 100))
+
 		if (writeOptions.skipEmptyFolders && this.children.length === 0) return
 		const path = PathModule.join(outputFolder, this.name)
 		await fs.promises.mkdir(path, { recursive: true })
@@ -233,6 +235,8 @@ export class VirtualFile extends VirtualNode {
 	}
 
 	async writeToDisk(outputFolder: string, writeOptions: VirtualFileSystemWriteOptions) {
+		// await new Promise(resolve => setTimeout(resolve, 100))
+
 		const path = PathModule.join(outputFolder, this.fileName)
 
 		let content: string | Buffer | Uint8Array