import { loading_finish, loading_start } from "lib/Loading";
import { fs_get_node, fs_encode_path, fs_split_path } from "lib/FilesystemAPI.svelte";
import type { FSNode, FSPath, FSPermissions, FSContext } from "lib/FilesystemAPI.svelte";

export class FSNavigator {
	// Parts of the raw API response
	path: Array<FSNode> = []
	base_index: number = 0
	children: Array<FSNode> = []
	permissions: FSPermissions = <FSPermissions>{}
	context: FSContext = <FSContext>{}

	// base equals path[base_index]. It's updated every time the path updates
	base: FSNode = <FSNode>{}

	// Initialized will be set to true when the first file or directory is loaded
	initialized = false
	shuffle = false

	// Whether navigation events should update the browser history
	history_enabled = true

	constructor(history_enabled = true) {
		this.history_enabled = history_enabled
	}

	// The popstate event can be used to listen for navigation events. Register
	// this event listener on the <svelte:window> in the parent element. When
	// the user presses the back or forward buttons in the browser we'll catch
	// the event and navigate to the proper directory
	popstate = (e: PopStateEvent) => {
		// Get the part of the URL after the fs root and navigate to it
		const path = window.location.pathname.replace(/^\/d/, "")
		this.navigate(decodeURI(path), false)
	}

	// The FSNavigator acts as a svelte store. This allows for DOM reactivity.
	// This works by implementing the store contract:
	// https://svelte.dev/docs/svelte-components#script-4-prefix-stores-with-$-to-access-their-values
	subscribers: Array<(nav: FSNavigator) => void> = []
	subscribe = (sub_func: (nav: FSNavigator) => void) => {
		// Immediately return the current value
		sub_func(this)

		this.subscribers.push(sub_func)

		// Return the unsubscribe function
		return () => this.subscribers.splice(this.subscribers.indexOf(sub_func), 1)
	}
	notify_subscribers = () => {
		for (let i = 0; i < this.subscribers.length; i++) {
			this.subscribers[i](this)
		}
	}

	last_requested_path: string = ""
	navigation_error: string = ""
	navigate = async (path: string, push_history: boolean) => {
		if (path === this.last_requested_path) {
			console.debug("FSNavigator: Requested path ", path, " is equal to current path. Debouncing")
			return
		}
		this.last_requested_path = path

		if (path[0] !== "/") {
			path = "/" + path
		}

		console.debug("FSNavigator: Navigating to path", path, push_history)

		try {
			loading_start()
			const resp = await fs_get_node(path)
			this.open_node(resp, push_history)
		} catch (err: any) {
			if (err.value !== undefined && err.value === "path_not_found") {
				if (path !== this.path[0].path && path !== "/" && path !== "") {
					console.debug("Path", path, "was not found, trying to navigate to parent")
					this.navigate(fs_split_path(path).parent, push_history)
				}
			} else if (err.value !== undefined) {
				this.navigation_error = err.value
				this.notify_subscribers()
			} else {
				console.error(err)
				alert("Error: " + err)
			}
		} finally {
			loading_finish()
		}
	}

	navigate_up = async () => {
		if (this.path.length > 1) {
			await this.navigate(this.path[this.path.length - 2].path, false)
		}
	}

	reload = async () => {
		this.last_requested_path = ""
		await this.navigate(this.base.path, false)
	}

	open_node = (node: FSPath, push_history: boolean) => {
		// Update window title and navigation history. If push_history is false
		// we still replace the URL with replaceState. This way the user is not
		// greeted to a 404 page when refreshing after renaming a file
		if (this.history_enabled) {
			window.document.title = node.path[node.base_index].name + " / Nova"
			const url = "/d" + fs_encode_path(node.path[node.base_index].path) + window.location.hash
			if (push_history) {
				window.history.pushState({}, window.document.title, url)
			} else {
				window.history.replaceState({}, window.document.title, url)
			}
		}

		// If the new node is a child of the previous node we save the parent's
		// children array
		if (node.path.length > 1 && node.path[node.path.length - 2].path === this.base.path) {
			console.debug("Current parent path and new node path match. Saving siblings")

			this.cached_siblings_path = node.path[node.path.length - 1].path
			this.cached_siblings = this.children
		}

		// Sort directory children
		sort_children(node.children, this.sort_last_field, this.sort_asc)

		// Update shared state
		this.path = node.path
		this.base_index = node.base_index
		this.base = node.path[node.base_index]
		this.children = node.children
		this.permissions = node.permissions
		this.context = node.context
		this.navigation_error = "" // Clear the error value
		this.initialized = true

		console.debug("Opened node", node)

		// Signal to our subscribers that the new node is loaded. This triggers
		// the reactivity
		this.notify_subscribers()
	}

	// These are used to navigate forward and backward within a directory (using
	// the previous and next buttons on the toolbar). The cached siblings will
	// be used so that we don't need to make an extra request to the parent
	// directory. The siblings_path variable is used to verify that the parent
	// directory is still the same. If it's different the siblings array is not
	// used
	cached_siblings_path = ""
	cached_siblings: Array<FSNode> | null = null

	get_siblings = async () => {
		// If this node is a filesystem root then there are no siblings
		if (this.path.length < 2) {
			return []
		}

		// Check if we already have siblings cached
		if (
			this.cached_siblings === null ||
			this.cached_siblings_path !== this.path[this.path.length - 2].path
		) {
			console.debug("Cached siblings not available. Fetching new")
			const resp = await fs_get_node(this.path[this.path.length - 2].path)

			// Sort directory children to make sure the order is consistent
			sort_children(resp.children, this.sort_last_field, this.sort_asc)

			// Save new siblings in navigator state
			this.cached_siblings_path = this.path[this.path.length - 2].path
			this.cached_siblings = resp.children
		}

		return this.cached_siblings
	}

	// Opens a sibling of the currently open file. The offset is relative to the
	// file which is currently open. Give a positive number to move forward and
	// a negative number to move backward
	open_sibling = async (offset: number) => {
		if (this.path.length <= 1) {
			return
		}

		let siblings: Array<FSNode>
		try {
			loading_start()
			siblings = await this.get_siblings()
		} catch (err) {
			console.error(err)
			alert(err)
			return
		} finally {
			loading_finish()
		}

		let next_sibling: FSNode | null = null

		if (this.shuffle) {
			// Shuffle is on, pick a random sibling
			for (let i = 0; i < 10; i++) {
				next_sibling = siblings[Math.floor(Math.random() * siblings.length)]

				// If we selected the same sibling we already have open we try
				// again. Else we break the loop
				if (next_sibling.name !== this.base.name) {
					break
				}
			}
		} else {
			// Loop over the parent node's children to find the one which is
			// currently open. Then, if possible, we save the one which comes before
			// or after it
			for (let i = 0; i < siblings.length; i++) {
				if (
					siblings[i].name === this.base.name &&
					i + offset >= 0 && // Prevent underflow
					i + offset < siblings.length // Prevent overflow
				) {
					next_sibling = siblings[i + offset]
					break
				}
			}
		}

		// If we found a sibling we open it
		if (next_sibling !== null) {
			console.debug("Opening sibling", next_sibling.path)
			await this.navigate(next_sibling.path, true)
		} else {
			console.debug("No siblings found")
		}
	}

	sort_last_field: string = "name"
	sort_asc: boolean = true
	sort_children = (field: string) => {
		// If the field is the same as last time we invert the direction
		if (field !== "" && field === this.sort_last_field) {
			this.sort_asc = !this.sort_asc
		}
		// If the field is empty we reuse the last field
		if (field === "") {
			field = this.sort_last_field
		}
		this.sort_last_field = field

		sort_children(this.children, field, this.sort_asc)

		// Signal to our subscribers that the order has changed. This triggers
		// the reactivity
		this.notify_subscribers()
	}
}

const sort_children = (children: FSNode[], field: string, asc: boolean) => {
	console.log("Sorting directory children by", field, "asc", asc)
	children.sort((a, b) => {
		// Sort directories before files
		if (a.type !== b.type) {
			return a.type === "dir" ? -1 : 1
		}

		// If sort is descending we swap the arguments
		if (asc === false) {
			[a, b] = [b, a]
		}

		if (field === "size") {
			// When doing a size comparison we also take the recursive directory
			// size into account
			return (a.type === "dir" ? a.recursive_size : a.file_size) -
				(b.type === "dir" ? b.recursive_size : b.file_size)
		} else if (a[field] === b[field]) {
			// If the two values are equal then we force sort by name, since
			// names are always unique
			return a.name.localeCompare(b.name, undefined, { numeric: true })
		} else if (typeof (a[field]) === "number") {
			// Sort ints from high to low
			return a[field] - b[field]
		} else {
			// Sort strings alphabetically
			return a[field].localeCompare(b[field], undefined, { numeric: true })
		}
	})
}

export let global_navigator = new FSNavigator(true)



export const path_link = (node: HTMLAnchorElement, data: { nav: FSNavigator, node: FSNode }) => {
	// Set url
	node.href = "/d" + fs_encode_path(data.node.path)

	// Override click handler
	const click = (e: MouseEvent) => {
		e.preventDefault()
		data.nav.navigate(data.node.path, true)
	}

	node.addEventListener("click", click)
	return {
		destroy() {
			node.removeEventListener("click", click)
		}
	}
}
