// Copyright (c) 2015, JINGROW and Contributors
// MIT License. See license.txt

jingrow.ui.is_liked = function (pg) {
	return jingrow.ui.get_liked_by(pg).includes(jingrow.session.user);
};

jingrow.ui.get_liked_by = function (pg) {
	return pg._liked_by ? JSON.parse(pg._liked_by) : [];
};

jingrow.ui.toggle_like = function ($btn, pagetype, name, callback) {
	const add = $btn.hasClass("not-liked") ? "Yes" : "No";
	// disable click
	$btn.css("pointer-events", "none");

	jingrow.call({
		method: "jingrow.desk.like.toggle_like",
		quiet: true,
		args: {
			pagetype: pagetype,
			name: name,
			add: add,
		},
		callback: function (r) {
			// renable click
			$btn.css("pointer-events", "auto");

			if (r.exc) {
				return;
			}

			$btn.toggleClass("not-liked", add === "No");
			$btn.toggleClass("liked", add === "Yes");

			// update in locals (form)
			const pg = locals[pagetype] && locals[pagetype][name];
			if (pg) {
				let liked_by = jingrow.ui.get_liked_by(pg);

				if (add === "Yes" && !liked_by.includes(jingrow.session.user)) {
					liked_by.push(jingrow.session.user);
				}

				if (add === "No" && liked_by.includes(jingrow.session.user)) {
					liked_by = liked_by.filter((user) => user !== jingrow.session.user);
				}

				pg._liked_by = JSON.stringify(liked_by);
			}

			if (callback) {
				callback();
			}
		},
	});
};

jingrow.ui.click_toggle_like = function () {
	console.warn("`jingrow.ui.click_toggle_like` is deprecated and has no effect.");
};

jingrow.ui.setup_like_popover = ($parent, selector) => {
	if (jingrow.dom.is_touchscreen()) {
		return;
	}

	$parent.on("mouseover", selector, function () {
		const target_element = $(this);
		target_element.popover({
			animation: true,
			placement: "bottom",
			trigger: "manual",
			template: `<div class="liked-by-popover popover">
				<div class="arrow"></div>
				<div class="popover-body popover-content"></div>
			</div>`,
			content: () => {
				let liked_by = target_element.parents(".liked-by").attr("data-liked-by");
				liked_by = liked_by ? decodeURI(liked_by) : "[]";
				liked_by = JSON.parse(liked_by);

				if (!liked_by.length) {
					return "";
				}

				let liked_by_list = $(`<ul class="list-unstyled"></ul>`);

				// to show social profile of the user
				let link_base = "/app/user-profile/";

				liked_by.forEach((user) => {
					// append user list item
					liked_by_list.append(`
						<li data-user=${user}>${jingrow.avatar(user, "avatar-xs")}
							<span>${jingrow.user.full_name(user)}</span>
						</li>
					`);
				});

				liked_by_list.children("li").click((ev) => {
					let user = ev.currentTarget.dataset.user;
					target_element.popover("hide");
					jingrow.set_route(link_base + user);
				});

				return liked_by_list;
			},
			html: true,
			container: "body",
		});

		target_element.popover("show");

		$(".popover").on("mouseleave", () => {
			target_element.popover("hide");
		});

		target_element.on("mouseout", () => {
			setTimeout(() => {
				if (!$(".popover:hover").length) {
					target_element.popover("hide");
				}
			}, 100);
		});
	});
};
