import { fs_get_node } from "./FilesystemAPI";
import { fs_encode_path, fs_split_path } from "./FilesystemUtil";

export class Navigator {
	// Parts of the raw API response
	path = []
	base_index = 0
	children = []
	permissions = {}

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

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

	shuffle = false
	loading = false

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

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

		// If history logging is enabled we capture the popstate event, which
		// fires when the user uses the back and forward buttons in the browser.
		// Instead of reloading the page we use the navigator to navigate to the
		// new page
		if (history_enabled) {
			window.onpopstate = () => {
				// Get the part of the URL after the fs root and navigate to it
				const path = document.location.pathname.replace("/d/", "")
				this.navigate(decodeURIComponent(path), false)
			}
		}
	}

	// The Navigator 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 = []
	subscribe(sub_func) {
		// 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)
		}
	}

	async navigate(path, push_history) {
		if (path[0] !== "/") {
			path = "/" + path
		}

		this.loading = true
		console.debug("Navigating to path", path, push_history)

		try {
			const resp = await fs_get_node(path)
			this.open_node(resp, push_history)
		} catch (err) {
			if (err.value && 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.message) {
				console.error(err)
				alert("Error: " + err.message)
			} else {
				console.error(err)
				alert("Error: " + err)
			}
		} finally {
			this.loading = false
		}
	}

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

	async reload() {
		await this.navigate(this.base.path, false)
	}

	open_node(node, push_history) {
		// 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 + " ~ pixeldrain"
			const url = "/d" + fs_encode_path(node.path[node.base_index].path)
			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)

		// 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.initialized = true

		console.debug("Opened node", node)

		// Signal to our subscribers that the new node is loaded. This triggers
		// the reactivity
		for (let i = 0; i < this.subscribers.length; i++) {
			this.subscribers[i](this)
		}

		// Remove spinner
		this.loading = false
	}

	// 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 = null

	async get_siblings() {
		// 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)

			// 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
	async open_sibling(offset) {
		if (this.path.length <= 1) {
			return
		}

		this.loading = true

		let siblings
		try {
			siblings = await this.get_siblings()
		} catch (err) {
			console.error(err)
			alert(err)
			this.loading = false
			return
		}

		let next_sibling = 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)
			this.navigate(next_sibling.path, true)
		} else {
			console.debug("No siblings found")
			this.loading = false
		}
	}
}

const sort_children = (children) => {
	children.sort((a, b) => {
		// Sort directories before files
		if (a.type !== b.type) {
			return a.type === "dir" ? -1 : 1
		}
		return a.name.localeCompare(b.name, undefined, { numeric: true })
	})
}