import "./assign_to";
import "./attachments";
import "./share";
import "./review";
import "./page_follow";
import "./user_image";
import "./form_sidebar_users";
import { get_user_link, get_user_message } from "../footer/version_timeline_content_builder";

jingrow.ui.form.Sidebar = class {
	constructor(opts) {
		$.extend(this, opts);
	}

	make() {
		var sidebar_content = jingrow.render_template("form_sidebar", {
			pagetype: this.frm.pagetype,
			frm: this.frm,
			can_write: jingrow.model.can_write(this.frm.pagetype, this.frm.pagename),
		});

		this.sidebar = $('<div class="form-sidebar overlay-sidebar hidden-xs hidden-sm"></div>')
			.html(sidebar_content)
			.appendTo(this.page.sidebar.empty());

		this.comments = this.sidebar.find(".form-sidebar-stats .comments");
		this.user_actions = this.sidebar.find(".user-actions");
		this.image_section = this.sidebar.find(".sidebar-image-section");
		this.image_wrapper = this.image_section.find(".sidebar-image-wrapper");
		this.make_assignments();
		this.make_attachments();
		this.make_review();
		this.make_shared();

		this.make_tags();
		this.make_like();
		this.make_follow();

		this.bind_events();
		this.setup_keyboard_shortcuts();
		this.show_auto_repeat_status();
		jingrow.ui.form.setup_user_image_event(this.frm);

		this.refresh();
	}

	bind_events() {
		var me = this;

		// scroll to comments
		this.comments.on("click", function () {
			jingrow.utils.scroll_to(me.frm.footer.wrapper.find(".comment-box"), true);
		});

		this.like_icon.on("click", function () {
			jingrow.ui.toggle_like(me.like_wrapper, me.frm.pagetype, me.frm.pg.name, function () {
				me.refresh_like();
			});
		});
	}

	setup_keyboard_shortcuts() {
		// add assignment shortcut
		let assignment_link = this.sidebar.find(".add-assignment");
		jingrow.ui.keys.get_shortcut_group(this.page).add(assignment_link);
	}

	refresh() {
		if (this.frm.pg.__islocal) {
			this.sidebar.toggle(false);
			this.page.sidebar.addClass("hide-sidebar");
		} else {
			this.page.sidebar.removeClass("hide-sidebar");
			this.sidebar.toggle(true);
			this.frm.assign_to.refresh();
			this.frm.attachments.refresh();
			this.frm.shared.refresh();

			this.frm.tags && this.frm.tags.refresh(this.frm.get_pageinfo().tags);

			if (this.frm.pg.route && cint(jingrow.boot.website_tracking_enabled)) {
				let route = this.frm.pg.route;
				jingrow.utils.get_page_view_count(route).then((res) => {
					this.sidebar
						.find(".pageview-count")
						.html(__("{0} Web page views", [String(res.message).bold()]));
				});
			}

			this.sidebar
				.find(".modified-by")
				.html(
					get_user_message(
						this.frm.pg.modified_by,
						__("You last edited this", null),
						__("{0} last edited this", [get_user_link(this.frm.pg.modified_by)])
					) +
						" · " +
						comment_when(this.frm.pg.modified)
				);
			this.sidebar
				.find(".created-by")
				.html(
					get_user_message(
						this.frm.pg.owner,
						__("You created this", null),
						__("{0} created this", [get_user_link(this.frm.pg.owner)])
					) +
						" · " +
						comment_when(this.frm.pg.creation)
				);

			this.refresh_like();
			this.refresh_follow();
			this.refresh_comments_count();
			jingrow.ui.form.set_user_image(this.frm);
		}
	}

	show_auto_repeat_status() {
		if (this.frm.meta.allow_auto_repeat && this.frm.pg.auto_repeat) {
			const me = this;
			jingrow.call({
				method: "jingrow.client.get_value",
				args: {
					pagetype: "Auto Repeat",
					filters: {
						name: this.frm.pg.auto_repeat,
					},
					fieldname: ["frequency"],
				},
				callback: function (res) {
					me.sidebar
						.find(".auto-repeat-status")
						.html(__("Repeats {0}", [__(res.message.frequency)]));
					me.sidebar.find(".auto-repeat-status").on("click", function () {
						jingrow.set_route("Form", "Auto Repeat", me.frm.pg.auto_repeat);
					});
				},
			});
		}
	}

	make_tags() {
		if (this.frm.meta.issingle) {
			this.sidebar.find(".form-tags").toggle(false);
			return;
		}

		let tags_parent = this.sidebar.find(".form-tags");

		this.frm.tags = new jingrow.ui.TagEditor({
			parent: tags_parent,
			add_button: tags_parent.find(".add-tags-btn"),
			frm: this.frm,
			on_change: function (user_tags) {
				this.frm.tags && this.frm.tags.refresh(user_tags);
			},
		});
	}

	make_attachments() {
		var me = this;
		this.frm.attachments = new jingrow.ui.form.Attachments({
			parent: me.sidebar.find(".form-attachments"),
			frm: me.frm,
		});
	}

	make_assignments() {
		this.frm.assign_to = new jingrow.ui.form.AssignTo({
			parent: this.sidebar.find(".form-assignments"),
			frm: this.frm,
		});
	}

	make_shared() {
		this.frm.shared = new jingrow.ui.form.Share({
			frm: this.frm,
			parent: this.sidebar.find(".form-shared"),
		});
	}

	add_user_action(label, click) {
		return $("<a>")
			.html(label)
			.appendTo(
				$('<li class="user-action-row">').appendTo(this.user_actions.removeClass("hidden"))
			)
			.on("click", click);
	}

	clear_user_actions() {
		this.user_actions.addClass("hidden");
		this.user_actions.find(".user-action-row").remove();
	}

	make_like() {
		this.like_wrapper = this.sidebar.find(".liked-by");
		this.like_icon = this.sidebar.find(".liked-by .like-icon");
		this.like_count = this.sidebar.find(".liked-by .like-count");
		jingrow.ui.setup_like_popover(this.sidebar.find(".form-stats-likes"), ".like-icon");
	}

	make_follow() {
		this.follow_button = this.sidebar.find(".form-sidebar-stats .form-follow");

		this.follow_button.on("click", () => {
			let is_followed = this.frm.get_pageinfo().is_document_followed;
			jingrow
				.call("jingrow.desk.form.page_follow.update_follow", {
					pagetype: this.frm.pagetype,
					pg_name: this.frm.pg.name,
					following: !is_followed,
				})
				.then(() => {
					jingrow.model.set_pageinfo(
						this.frm.pagetype,
						this.frm.pg.name,
						"is_document_followed",
						!is_followed
					);
					this.refresh_follow(!is_followed);
				});
		});
	}

	refresh_follow(follow) {
		if (follow == null) {
			follow = this.frm.get_pageinfo().is_document_followed;
		}
		this.follow_button.text(follow ? __("Unfollow") : __("Follow"));
	}

	refresh_like() {
		if (!this.like_icon) {
			return;
		}

		this.like_wrapper.attr("data-liked-by", this.frm.pg._liked_by);
		const liked = jingrow.ui.is_liked(this.frm.pg);
		this.like_wrapper
			.toggleClass("not-liked", !liked)
			.toggleClass("liked", liked)
			.attr("data-pagetype", this.frm.pagetype)
			.attr("data-name", this.frm.pg.name);

		this.like_count && this.like_count.text(JSON.parse(this.frm.pg._liked_by || "[]").length);
	}

	refresh_comments_count() {
		let count = (this.frm.get_pageinfo().comments || []).length;
		this.comments.find(".comments-count").html(count);
	}

	refresh_image() {}

	make_review() {
		const review_wrapper = this.sidebar.find(".form-reviews");
		if (jingrow.boot.energy_points_enabled && !this.frm.is_new()) {
			this.frm.reviews = new jingrow.ui.form.Review({
				parent: review_wrapper,
				frm: this.frm,
			});
		} else {
			review_wrapper.remove();
		}
	}

	reload_pageinfo(callback) {
		jingrow.call({
			method: "jingrow.desk.form.load.get_pageinfo",
			args: {
				pagetype: this.frm.pagetype,
				name: this.frm.pagename,
			},
			callback: (r) => {
				// pageinfo will be synced
				if (callback) callback(r.pageinfo);
				this.frm.timeline && this.frm.timeline.refresh();
				this.frm.assign_to.refresh();
				this.frm.attachments.refresh();
			},
		});
	}
};
