[v2.0.0-alpha.5] Merge pull request #18 from bridge-core/dev

data/preset/entity/bee/manifest.json

@@ -35,11 +35,6 @@
 			"RP/models/entity/{{IDENTIFIER}}.json",
 			{ "inject": ["IDENTIFIER"] }
 		],
-		[
-			"lootTable.json",
-			"BP/loot_tables/entities/{{IDENTIFIER}}.json",
-			{ "inject": ["IDENTIFIER"] }
-		],
 		[
 			"renderController.json",
 			"RP/render_controllers/{{IDENTIFIER}}.json",
@@ -52,17 +47,17 @@
 		],
 		[
 			"texture.png",
-			"RP/textures/entity/{{IDENTIFIER}}.json",
+			"RP/textures/entity/{{IDENTIFIER}}.png",
 			{ "inject": ["IDENTIFIER"] }
 		],
 		[
 			"textureAngry.png",
-			"RP/textures/entity/{{IDENTIFIER}}_angry.json",
+			"RP/textures/entity/{{IDENTIFIER}}_angry.png",
 			{ "inject": ["IDENTIFIER"] }
 		],
 		[
 			"textureAngryNectar.png",
-			"RP/textures/entity/{{IDENTIFIER}}_angry_nectar.json",
+			"RP/textures/entity/{{IDENTIFIER}}_angry_nectar.png",
 			{ "inject": ["IDENTIFIER"] }
 		],
 		[

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "bridge",
-	"version": "2.0.0-alpha.4",
+	"version": "2.0.0-alpha.5",
 	"private": true,
 	"scripts": {
 		"build:data": "node ./scripts/build.mjs",

src/App.ts

@@ -1,5 +1,6 @@
 import '@/components/Notifications/Errors'
 import '@/components/Languages/LanguageManager'
+import '@/components/App/ServiceWorker'
 
 import Vue from 'vue'
 import { EventSystem } from '@/components/Common/Event/EventSystem'
@@ -8,7 +9,7 @@ import { FileType } from '@/components/Data/FileType'
 import { ThemeManager } from '@/components/Extensions/Themes/ThemeManager'
 import { JSONDefaults } from '@/components/Data/JSONDefaults'
 import { FileSystem } from '@/components/FileSystem/FileSystem'
-import { setupFileSystem } from '@/components/FileSystem/setup'
+import { FileSystemSetup } from '@/components/FileSystem/FileSystemSetup'
 import { PackIndexer } from '@/components/PackIndexer/PackIndexer'
 import { setupSidebar } from '@/components/Sidebar/setup'
 import { TaskManager } from '@/components/TaskManager/TaskManager'
@@ -35,6 +36,7 @@ import { ProjectManager } from './components/Projects/ProjectManager'
 import { ContextMenu } from './components/ContextMenu/ContextMenu'
 
 export class App {
+	public static fileSystemSetup = new FileSystemSetup()
 	public static toolbar = new Toolbar()
 	public static readonly eventSystem = new EventSystem<any>([
 		'projectChanged',
@@ -156,7 +158,9 @@ export class App {
 		await this.instance.beforeStartUp()
 
 		// Try setting up the file system
-		const fileHandle = await setupFileSystem(this.instance)
+		const fileHandle = await this.fileSystemSetup.setupFileSystem(
+			this.instance
+		)
 		if (!fileHandle) return this.instance.windows.loadingWindow.close()
 
 		this.instance.fileSystem.setup(fileHandle)

src/appVersion.json

@@ -1,3 +1,3 @@
 {
-	"version": "2.0.0-alpha.4"
+	"version": "2.0.0-alpha.5"
 }

src/registerServiceWorker.ts → src/components/App/ServiceWorker.ts

@@ -1,7 +1,8 @@
 /* eslint-disable no-console */
 
 import { register } from 'register-service-worker'
-import { createNotification } from './components/Notifications/create'
+import { createNotification } from '@/components/Notifications/create'
+import { App } from '@/App'
 
 if (process.env.NODE_ENV === 'production') {
 	register(`${process.env.BASE_URL}service-worker.js`, {
@@ -23,25 +24,17 @@ if (process.env.NODE_ENV === 'production') {
 		updated(serviceWorker) {
 			console.log('New content is available; please refresh.')
 
-			createNotification({
-				icon: 'mdi-update',
-				color: 'primary',
-				message: 'sidebar.notifications.updateAvailable.message',
-				textColor: 'white',
-				onClick: () => {
-					if (serviceWorker.waiting)
-						serviceWorker.waiting.postMessage({
-							type: 'SKIP_WAITING',
-						})
-
-					navigator.serviceWorker.addEventListener(
-						'controllerchange',
-						() => {
-							window.location.reload()
-						}
-					)
-				},
-			})
+			if (App.fileSystemSetup.status === 'waiting') {
+				updateApp(serviceWorker)
+			} else {
+				createNotification({
+					icon: 'mdi-update',
+					color: 'primary',
+					message: 'sidebar.notifications.updateAvailable.message',
+					textColor: 'white',
+					onClick: () => updateApp(serviceWorker),
+				})
+			}
 		},
 		offline() {
 			console.log(
@@ -53,3 +46,14 @@ if (process.env.NODE_ENV === 'production') {
 		},
 	})
 }
+
+export function updateApp(serviceWorker: ServiceWorkerRegistration) {
+	if (serviceWorker.waiting)
+		serviceWorker.waiting.postMessage({
+			type: 'SKIP_WAITING',
+		})
+
+	navigator.serviceWorker.addEventListener('controllerchange', () => {
+		window.location.reload()
+	})
+}

src/components/Data/DataLoader.ts

@@ -7,7 +7,7 @@ import { FileSystem } from '../FileSystem/FileSystem'
 
 export class DataLoader extends Signal<void> {
 	async setup(app: App) {
-		app.windows.loadingWindow.open('Downloading new data...')
+		app.windows.loadingWindow.open('windows.loadingWindow.titles.downloadingData')
 		await app.fileSystem.fired
 
 		if (await this.isUpdateAvailable(app.fileSystem)) {

src/components/FileSystem/FileSystemSetup.ts

@@ -0,0 +1,82 @@
+import { App } from '@/App'
+import { get, set } from 'idb-keyval'
+import { createInformationWindow } from '../Windows/Common/CommonDefinitions'
+import { TWindow } from '../Windows/create'
+import { createSelectProjectFolderWindow } from '../Windows/Project/SelectFolder/definition'
+
+type TFileSystemSetupStatus = 'waiting' | 'userInteracted' | 'done'
+
+export class FileSystemSetup {
+	protected confirmPermissionWindow: TWindow | null = null
+	protected _status: TFileSystemSetupStatus = 'waiting'
+	get status() {
+		return this._status
+	}
+
+	setStatus(status: TFileSystemSetupStatus) {
+		this._status = status
+	}
+
+	async setupFileSystem(app: App) {
+		if (typeof window.showDirectoryPicker !== 'function') {
+			// The user's browser doesn't support the native file system API
+			app.windows.browserUnsupported.open()
+			return false
+		}
+
+		let fileHandle = await get<FileSystemDirectoryHandle | undefined>(
+			'bridgeBaseDir'
+		)
+		// Request permissions to current bridge folder
+		if (fileHandle) fileHandle = await this.verifyPermissions(fileHandle)
+
+		// There's currently no bridge folder yet/the bridge folder has been deleted
+		if (!fileHandle) {
+			await createSelectProjectFolderWindow(async chosenFileHandle => {
+				if (chosenFileHandle) {
+					await set('bridgeBaseDir', chosenFileHandle)
+					fileHandle = chosenFileHandle
+				}
+
+				await this.verifyPermissions(chosenFileHandle)
+			}).status.done
+		}
+
+		this._status = 'done'
+		return fileHandle
+	}
+	async verifyPermissions(fileHandle: FileSystemDirectoryHandle) {
+		const opts = { writable: true, mode: 'readwrite' } as const
+
+		if (
+			(await fileHandle.queryPermission(opts)) !== 'granted' &&
+			this.confirmPermissionWindow === null
+		) {
+			this.confirmPermissionWindow = createInformationWindow(
+				'windows.projectFolder.title',
+				'windows.projectFolder.content',
+				async () => {
+					this._status = 'userInteracted'
+					this.confirmPermissionWindow = null
+					// Check if we already have permission && request permission if not
+					if (
+						(await fileHandle.requestPermission(opts)) !== 'granted'
+					) {
+						await this.verifyPermissions(fileHandle)
+					}
+				}
+			)
+
+			await this.confirmPermissionWindow.status.done
+		}
+
+		// This checks whether the bridge directory still exists.
+		// Might get a more elegant API in the future but that's all we can do for now
+		try {
+			await fileHandle.getDirectoryHandle('data', { create: true })
+		} catch {
+			return undefined
+		}
+		return fileHandle
+	}
+}

src/components/Sidebar/Sidebar.vue

@@ -20,7 +20,7 @@
 			/>
 		</v-list>
 
-		<v-list v-if="Object.keys(NotificationStore).length > 0">
+		<v-list v-if="hasVisibleNotifications">
 			<v-divider class="mx-3 mb-6" />
 			<template v-for="notification in NotificationStore">
 				<SidebarButton
@@ -64,7 +64,6 @@ import { settingsState } from '@/components/Windows/Settings/SettingsState'
 import SidebarButton from './Button'
 import { SidebarState, getSelected } from './state'
 import { tasks } from '@/components/TaskManager/TaskManager'
-import { createInformationWindow } from '@/components/Windows/Common/CommonDefinitions'
 import { NotificationStore } from '@/components/Notifications/state'
 
 export default {
@@ -84,6 +83,11 @@ export default {
 		}
 	},
 	computed: {
+		hasVisibleNotifications() {
+			return Object.values(NotificationStore).some(
+				({ isVisible }) => isVisible
+			)
+		},
 		isSidebarRight() {
 			return (
 				this.settingsState &&

src/components/TabSystem/Tab.vue

@@ -1,7 +1,6 @@
 <template>
 	<div
 		class="px-3 py-2"
-		v-ripple="!tab.isSelected"
 		:class="{
 			selected: tab.isSelected,
 			'default-tab-style': true,
@@ -10,7 +9,7 @@
 			inactive: !isActive,
 		}"
 		ref="tabElement"
-		@mousedown="tab.select()"
+		@mousedown="hoverClose ? null : tab.select()"
 		@click.middle="tab.close()"
 		@click.right="tab.onContextMenu($event)"
 	>
@@ -22,7 +21,14 @@
 			{{ tab.name }}
 		</span>
 
-		<v-btn @click.stop="tab.close()" text icon small>
+		<v-btn 
+			@click.stop="tab.close()" 
+			text 
+			icon 
+			small 
+			@mouseenter="hoverClose = true" 
+			@mouseleave="hoverClose = false"
+		>
 			<v-icon small>mdi-close</v-icon>
 		</v-btn>
 	</div>
@@ -37,6 +43,9 @@ export default {
 		tab: Tab,
 		isActive: Boolean,
 	},
+	data: () => ({
+		hoverClose: false
+	}),
 	mounted() {
 		if (this.isSelected) {
 			this.$refs.tabElement.scrollIntoView({

src/components/TaskManager/WorkerTask.ts

@@ -33,6 +33,7 @@ class Progress<T, K> {
 export abstract class TaskService<T, K = void> extends EventDispatcher<
 	[number, number]
 > {
+	protected lastDispatch = 0
 	public fileSystem: FileSystem
 	public progress!: Progress<T, K>
 	constructor(
@@ -78,4 +79,14 @@ export abstract class TaskService<T, K = void> extends EventDispatcher<
 
 		return result
 	}
+
+	dispatch(data: [number, number]) {
+		// Always send last data batch
+		if (data[0] === data[1]) super.dispatch(data)
+		// Otherwise, first check that we don't send too many messages to the main thread
+		if (this.lastDispatch + 200 > Date.now()) return
+
+		super.dispatch(data)
+		this.lastDispatch = Date.now()
+	}
 }