(function ($) {
	"use strict";

	$(document).on("init.editor", function (event) {
		var target = event.target;
		var editor;

		CKEDITOR.replace(target.id, {
			contentsCss: ["../reference/bootstrap-3.4.1/css/bootstrap.min.css", "./css/ckeditor.css"],
			extraPlugins: ["drawio", "requirement", "linkeddoc", "accordion", "fixed"],
			allowedContent: true,
			removePlugins: ["resize", "image"],
			autoGrow_minHeight: 650,
			autoGrow_bottomSpace: 50,
			autoGrow_onStartup: true,
			clipboard_handleImages: false,
			image2_alignClasses: ["image-left", "image-center", "image-right"],
			image2_captionedClass: "image-captioned",
			uploadUrl: "/auth-user/api/arms/wiki/imageUpload.do",
			readOnly: true,
			on: {
				instanceReady: function (event) {
					editor = event.editor;
					var docHead = editor.document.getHead();

					function loadScript(src, callback) {
						var script = new CKEDITOR.dom.element("script");
						script.setAttribute("type", "text/javascript");
						script.setAttribute("src", src);

						if (callback) {
							script.on("load", callback);
						}

						docHead.append(script);
					}

					loadScript("../reference/lightblue4/docs/lib/jquery/dist/jquery.min.js", function () {
						loadScript("../reference/bootstrap-3.4.1/js/bootstrap.min.js");
					});
				},
				dataReady: function (event) {
					var iframeWindow = event.editor.document.getWindow().$;
					var $ = iframeWindow.jQuery;

					if ($) {
						var $body = $(event.editor.document.getBody().$);

						$body.on("click.bs.collapse.data-api", '[data-toggle="collapse"]', function (e) {
							var $this = $(this);

							if (!$this.attr("data-target")) e.preventDefault();

							var href;
							var $target = $(
								$this.attr("data-target") || ((href = $this.attr("href")) && href.replace(/.*(?=#[^\s]+$)/, ""))
							);

							var data = $target.data("bs.collapse");
							var option = data ? "toggle" : $this.data();

							if (!$target.hasClass("in")) {
								$.ajax({
									type: "GET",
									url: "/auth-user/api/arms/wiki/" + $target.attr("id") + "/getWiki.do",
									contentType: "application/json;charset=UTF-8",
									dataType: "json",
									success: function (data) {
										$target.find(".panel-body").html(data.contents);
									}
								});
							}

							$.fn.collapse.call($target, option);
						});
					}

					buildTableOfContents(event.editor);
				},
				fileUploadResponse: function (event) {
					event.stop();

					var xhr = event.data.fileLoader.xhr;
					var response = JSON.parse(xhr.responseText);

					if (Array.isArray(response)) {
						response = response[0];
					}

					if (response.url) {
						event.data.url = response.url;
						event.data.alt = response.fileName || "";
					} else {
						event.data.message = response.error || "업로드 실패";
						event.cancel();
					}
				},
				saveDiagram: function (diagram) {
					var base64ToBlob = function (base64) {
						var parts = base64.split(";base64,");
						var contentType = parts[0].split(":")[1];
						var raw = window.atob(parts[1]);
						var rawLength = raw.length;
						var uInt8Array = new Uint8Array(rawLength);

						for (var i = 0; i < rawLength; i++) {
							uInt8Array[i] = raw.charCodeAt(i);
						}

						return new Blob([uInt8Array], { type: contentType });
					};

					var imageBlob = base64ToBlob(diagram.data.img);

					var formData = new FormData();
					formData.append("file", imageBlob, getWikiId() + "_" + "diagram.png");

					$.ajax({
						url: "/auth-user/api/arms/wiki/imageUpload.do",
						type: "POST",
						data: formData,
						processData: false,
						contentType: false,
						success: function (data) {
							var image = '<img src="' + data[0].url + '" alt="draw.io Diagram" />';

							editor.insertHtml(image);
							editor.widgets.checkWidgets();
						}
					});
				},
				editDiagram: function (imgSrc) {
					$.ajax({
						url: imgSrc.data,
						type: "GET",
						xhrFields: {
							responseType: "blob"
						},
						success: function (data) {
							var reader = new FileReader();
							reader.onloadend = function () {
								var base64data = reader.result;
								editor.execCommand("drawio", { src: base64data });
							};
							reader.readAsDataURL(data);
						}
					});
				},
				createRequirement: function (requirement) {
					var requirementModal = $("#requirement_modal");

					requirementModal.modal("show");
					requirementModal.on("shown.bs.modal", function () {
						var selectedPdServiceText = $("#selected_pdService").select2("data")[0].text;
						var datepickerOption = {
							theme: "dark",
							lang: "kr",
							format: "Y/m/d",
							formatDate: "Y/m/d",
							value: null,
							scrollInput: false
						};

						$("#addview_req_pdservice_name").val(selectedPdServiceText);
						$("#add_multi_version").multipleSelect("uncheckAll");
						$("#addview_req_title").val(requirement.data.reqTitle);
						$("#addview_req_writer").val("[" + userName + "]" + " - " + userID);
						$("#addview_req_reviewers").val(null).trigger("change");

						$("#addview_req_start_date").val(null);
						$("#addview_req_end_date").val(null);
						$("#addview_req_start_date").datetimepicker(datepickerOption);
						$("#addview_req_end_date").datetimepicker(datepickerOption);

						$("#addview_req_priority").children(".btn.active").removeClass("active");
						$("#addview_req_urgency").children(".btn.active").removeClass("active");
						$("#addview_req_importance").children(".btn.active").removeClass("active");
						$("#addview_req_difficulty").children(".btn.active").removeClass("active");
						$("#addview_req_state").children(".btn.active").removeClass("active");

						// ------------------------- drawio start  --------------------------------//
						var selectedProductServiceId = $("#selected_pdService").val();
						if (
							localStorage.getItem("req-create-drawio-" + selectedProductServiceId) &&
							localStorage.getItem("req-create-drawio-time-" + selectedProductServiceId)
						) {
							changeBtnText("#btn_modal_req_add_drawio", "drawio 등록 완료");
							changeBtnText(
								"#modal_req_add_drawio_time",
								localStorage.getItem("req-create-drawio-time-" + selectedProductServiceId)
							);
						}
						if (localStorage.getItem("req-create-drawio-image-raw-" + selectedProductServiceId)) {
							setDrawioImage(
								"req-create-drawio-image-raw-" + selectedProductServiceId,
								localStorage.getItem("req-create-drawio-image-raw-" + selectedProductServiceId),
								"create"
							);
						}
						// ------------------------- drawio end  --------------------------------//

						// ------------------------- drawdb start  --------------------------------//
						selectByIndexedDB("create-reqadd-" + selectedProductServiceId)
							.then((result) => {
								if (result) {
									var armsThumbnail = result.armsThumbnail;
									var lastModified = result.lastModified;
									var seoulTime = convertToSeoulTimeWithMeridiem(lastModified);
									setDrawdbImage("create-reqadd-" + selectedProductServiceId, armsThumbnail, "create");
									changeBtnText("#btn_modal_req_add_drawdb", "drawdb 등록 완료");
									changeBtnText("#modal_req_add_drawdb_time", seoulTime);
								}
							})
							.catch((e) => {
								console.log("REQADD :: create :: selectByIndexedDB :: 조회 실패", e);
							});
						// ------------------------- drawdb end  --------------------------------//

						CKEDITOR.instances.add_tabmodal_editor.setData($("<p />").text("요구사항 내용을 기록합니다."));
					});
				}
				// selectionChange: function (evt) {
				// 	var selection = evt.data.selection;
				// 	var element = selection.getStartElement();
				// 	var path = element.getParents(true);

				// 	console.log("Cursor position changed");
				// 	console.log("Current element:", element);
				// 	console.log(
				// 		"Path:",
				// 		path.map((el) => el)
				// 	);
				// }
			}
		});
	});
})(window.jQuery);