// Copyright (c) 2017 kroppy. All rights reserved.
// Use of this source code is governed by a Attribution-NonCommercial-NoDerivatives 4.0 International (CC BY-NC-ND 4.0) license
// that can be found at https://creativecommons.org/licenses/by-nc-nd/4.0/

// **********      OPTIONS       ***************

var current_theme = "";
var themes = [];
var SelectedTheme = Object.assign({}, DefaultTheme);
var dragged_button;
active_group = "tab_list";

document.addEventListener("DOMContentLoaded", function() {
	document.title = "Tree Tabs";
	chrome.runtime.sendMessage({command: "get_preferences"}, function(response) {
		opt = Object.assign({}, response);
		chrome.storage.local.get(null, function(items) {
			if (items["themes"]) {
				for (var themeName in items["themes"]) {
					themes.push(themeName);
				}
			}
			if (items["current_theme"]) {
				current_theme = items["current_theme"];
				LoadTheme(items["current_theme"]);
			}
			GetOptions();
			RefreshFields();
			SetEvents();
			SetToolbarShelfToggle("click");
			AppendGroupToList("tab_list", caption_ungrouped_group, "");
			AppendGroupToList("tab_list2", caption_noname_group, "");
			AppendSampleTabs();
		});
	});
});

// document events
function GetOptions() {
	// get language labels
	$(".label").each(function() {
		$(this).text(chrome.i18n.getMessage(this.id));
	});
	// get language for color pick labels
	$(".cpl").each(function() {
		$(this).text(chrome.i18n.getMessage(this.id));
	});
	// get language for menu labels
	$(".menu_item").each(function() {
		$(this).text(chrome.i18n.getMessage("options_example_menu_item"));
	});
	
	// get checkboxes from saved states
	$(".opt_checkbox").each(function() {
		$(this)[0].checked = opt[this.id];
	});
	$(".set_button").each(function() {
		$(this)[0].textContent = chrome.i18n.getMessage(this.id);
	});
	
	// get language dropdown menus
	$(".bg_opt_drop_down_menu").each(function() {
		$(this)[0].textContent = chrome.i18n.getMessage(this.id);
	});

	// get language for color pick labels
	$("#close_x, #close_hover_x").each(function() {
		$(this).attr("title", chrome.i18n.getMessage(this.id));
	});
	$(".color_border").each(function() {
		$(this).attr("title", chrome.i18n.getMessage("options_color_pick_border"));
	});
	$(".color_bucket").each(function() {
		$(this).attr("title", chrome.i18n.getMessage("options_color_pick_background"));
	});
	$(".pick_col_hover").each(function() {
		$(this).attr("title", chrome.i18n.getMessage("options_color_pick_hover"));
	});
	$(".font_color").each(function() {
		$(this).attr("title", chrome.i18n.getMessage("options_color_pick_font"));
	});

	$(".options_button_minus, .options_button_plus").each(function() {
		$(this).attr("title", chrome.i18n.getMessage(this.id));
	});
	$("#filter_clear_icon").each(function() {
		$(this).attr("title", chrome.i18n.getMessage("options_color_pick_filter_clear_icon"));
	});
	
	// get options for append child tab
	for (var i = 0; i < $("#append_child_tab")[0].options.length; i++) {
		if ($("#append_child_tab")[0].options[i].value === opt.append_child_tab) {
			$("#append_child_tab")[0].selectedIndex = i;
			break;
		}
	}

	// get options for append child tab after limit
	for (var i = 0; i < $("#append_child_tab_after_limit")[0].options.length; i++) {
		if ($("#append_child_tab_after_limit")[0].options[i].value === opt.append_child_tab_after_limit) {
			$("#append_child_tab_after_limit")[0].selectedIndex = i;
			break;
		}
	}
	
	// get options for append orphan tab
	for (var i = 0; i < $("#append_orphan_tab")[0].options.length; i++) {
		if ($("#append_orphan_tab")[0].options[i].value === opt.append_orphan_tab) {
			$("#append_orphan_tab")[0].selectedIndex = i;
			break;
		}
	}
	
	// get options for action after closing active tab
	for (var i = 0; i < $("#after_closing_active_tab")[0].options.length; i++) {
		if ($("#after_closing_active_tab")[0].options[i].value === opt.after_closing_active_tab) {
			$("#after_closing_active_tab")[0].selectedIndex = i;
			break;
		}
	}

	// get options for tabs tree depth option
	$("#max_tree_depth")[0].value = opt.max_tree_depth;

	// append themes to dropdown menu
	for (var i = 0; i < themes.length; i++) {
		var t_list = document.getElementById("theme_list");
		var	theme_name = document.createElement("option");
			theme_name.value = themes[i];
			theme_name.text = themes[i];
		t_list.add(theme_name);
	}
	
	// select current theme in dropdown list
	for (var i = 0; i < $("#theme_list")[0].options.length; i++) {
		if ($("#theme_list")[0].options[i].value == current_theme) {
			$("#theme_list")[0].selectedIndex = i;
			break;
		}
	}
}

function RemoveRedPreview() {
	if (document.styleSheets[document.styleSheets.length-1].cssRules.length) {
		document.styleSheets[document.styleSheets.length-1].deleteRule(document.styleSheets[document.styleSheets.length-1].cssRules.length-1);
	}
}


// document events
function SetEvents() {
// --------------------------------DONATIONS------------------------------------------------------------------------------
	
	// Donate
	$(document).on("click", "#options_share_theme_link", function(event) {
		chrome.tabs.create({url: "https://drive.google.com/drive/folders/0B3jXQpRtOfvSelFrTEVHZEx3Nms?usp=sharing"});
	});
	
	$(document).on("click", "#donate_paypal", function(event) {
		chrome.tabs.create({url: "https://www.paypal.me/KarolJagiello/1"});
	});
	
	$(document).on("click", "#donate_bitcoin", function(event) {
		copyStringToClipboard("19Z8w1RJEcBQpKSdiWa3UTBuKRJUkr96nJ");
		alert(chrome.i18n.getMessage("options_copied_wallet_address"));
	});
	
	$(document).on("click", "#donate_ethereum", function(event) {
		copyStringToClipboard("0x70B05eAD03bF08220d5aF4E1E868C351bfe145D6");
		alert(chrome.i18n.getMessage("options_copied_wallet_address"));
	});
	
	
// --------------------------------COPY VIVALDI LINK----------------------------------------------------------------------	
	
	$(document).on("click", "#copy_vivaldi_url_for_web_panel", function(event) {
		copyStringToClipboard(chrome.runtime.getURL("sidebar.html"));
		alert(chrome.i18n.getMessage("options_vivaldi_copied_url"));
	});

// --------------------------------ADD RED PREVIEW------------------------------------------------------------------------	

	$(document).on("mouseenter", ".pick_col, #filter_box_font", function(event) {
		document.styleSheets[document.styleSheets.length-1].insertRule("body { --"+this.id+": red; }", document.styleSheets[document.styleSheets.length-1].cssRules.length);
	});
	$(document).on("mouseenter", ".font_weight_normal", function(event) {
		document.styleSheets[document.styleSheets.length-1].insertRule("body { --"+this.id+": normal; }", document.styleSheets[document.styleSheets.length-1].cssRules.length);
	});
	$(document).on("mouseenter", ".font_weight_bold", function(event) {
		document.styleSheets[document.styleSheets.length-1].insertRule("body { --"+this.id+": bold; }", document.styleSheets[document.styleSheets.length-1].cssRules.length);
	});
	
	$(document).on("mouseenter", ".font_style_normal", function(event) {
		document.styleSheets[document.styleSheets.length-1].insertRule("body { --"+this.id+": normal; }", document.styleSheets[document.styleSheets.length-1].cssRules.length);
	});
	$(document).on("mouseenter", ".font_style_italic", function(event) {
		document.styleSheets[document.styleSheets.length-1].insertRule("body { --"+this.id+": italic; }", document.styleSheets[document.styleSheets.length-1].cssRules.length);
	});
	
	$(document).on("mouseleave", ".pick_col, .font_weight_normal, .font_weight_bold, .font_style_normal, .font_style_italic, #filter_box_font", function(event) {
		RemoveRedPreview();
	});
	
	$(document).on("mouseenter", "#scrollbar_thumb_hover", function(event) {
		$("#group_scrollbar_thumb, #pin_list_scrollbar_thumb").addClass("hover_blinking");
	});
	
	$(document).on("mouseleave", "#scrollbar_thumb_hover", function(event) {
		$("#group_scrollbar_thumb, #pin_list_scrollbar_thumb").removeClass("hover_blinking");
	});
	
	$(document).on("mouseenter", "#group_list_button_hover_background", function(event) {
		$("#_tab_list2").addClass("hover_blinking");
	});
	
	$(document).on("mouseleave", "#group_list_button_hover_background", function(event) {
		$("#_tab_list2").removeClass("hover_blinking");
	});
	
	$(document).on("mouseenter", "#button_hover_background", function(event) {
		$(".button").addClass("hover_blinking");
	});
	$(document).on("mouseleave", "#button_hover_background", function(event) {
		$(".button").removeClass("hover_blinking");
	});
	
	$(document).on("mouseenter", "#button_icons_hover", function(event) {
		$(".button_img").addClass("hover_blinking");
	});
	$(document).on("mouseleave", "#button_icons_hover", function(event) {
		$(".button_img").removeClass("hover_blinking");
	});
	
	$(document).on("mouseenter", "#button_hover_border", function(event) {
		$(".button").addClass("hover_border_blinking");
	});
	$(document).on("mouseleave", "#button_hover_border", function(event) {
		$(".button").removeClass("hover_border_blinking");
	});
	
	
	
	// filter_box_font 

	$(document).on("mouseenter", "#options_tab_list_scrollbar_width_up, #options_tab_list_scrollbar_width_down", function(event) {
		$("#group_scrollbar, #group_scrollbar_thumb").css({ "background-color": "red" });
	});
	$(document).on("mouseleave", "#options_tab_list_scrollbar_width_up, #options_tab_list_scrollbar_width_down", function(event) {
		$("#group_scrollbar, #group_scrollbar_thumb").css({ "background-color": "" });
	});
	
	$(document).on("mouseenter", "#options_tab_list_scrollbar_height_up, #options_tab_list_scrollbar_height_down", function(event) {
		$("#pin_list_scrollbar, #pin_list_scrollbar_thumb").css({ "background-color": "red" });
	});
	$(document).on("mouseleave", "#options_tab_list_scrollbar_height_up, #options_tab_list_scrollbar_height_down", function(event) {
		$("#pin_list_scrollbar, #pin_list_scrollbar_thumb").css({ "background-color": "" });
	});
	


// --------------------------------------COLOR PICKER---------------------------------------------------------------------	
	
	// change fonts weight
	$(document).on("mousedown", ".font_weight_normal, .font_weight_bold", function(event) {
		event.stopPropagation();
		SelectedTheme["ColorsSet"][this.id] = $(this).is(".font_weight_normal") ? "normal" : "bold";
		ApplyColorsSet(SelectedTheme["ColorsSet"]);
		SaveTheme($("#theme_list").val());
	});
	
	// change fonts style
	$(document).on("mousedown", ".font_style_normal, .font_style_italic", function(event) {
		event.stopPropagation();
		SelectedTheme["ColorsSet"][this.id] = $(this).is(".font_style_normal") ? "normal" : "italic";
		ApplyColorsSet(SelectedTheme["ColorsSet"]);
		SaveTheme($("#theme_list").val());
	});
	
	
	// show color picker
	$(document).on("click", ".pick_col", function(event) {
		RemoveRedPreview();
		event.stopPropagation();
		PickColor = this.id;
		let bod = document.getElementById("body");
		let color = window.getComputedStyle(bod, null).getPropertyValue("--"+this.id);
		$("#color_picker")[0].value = color.replace(" ", "");
		$("#color_picker").click();
	});
	$(document).on("input", "#color_picker", function(event) {
		event.stopPropagation();
		SelectedTheme["ColorsSet"][PickColor] = $("#color_picker")[0].value;
		ApplyColorsSet(SelectedTheme["ColorsSet"]);
		SaveTheme($("#theme_list").val());
	});	
	
	
// ----------------------------------EVENTS FOR CHECKBOXES AND DROPDOWN MENUS---------------------------------------------	
	// set checkbox options on/off and save
	$(document).on("click", ".bg_opt", function(event) {
		opt[this.id] = $(this)[0].checked ? true : false;
		SavePreferences();
	});

	// options that need reload
	$(document).on("click", "#syncro_tabbar_tabs_order, #allow_pin_close, #switch_with_scroll, #always_show_close, #never_show_close, #close_other_trees, #show_counter_tabs, #show_counter_tabs_hints, #syncro_tabbar_tabs_order, #syncro_tabbar_groups_tabs_order", function(event) {
		chrome.runtime.sendMessage({command: "reload_sidebar"});
	});
	
	// options that need a total reload
	$(document).on("click", "#groups_toolbar_default", function(event) {
		chrome.runtime.sendMessage({command: "reload"});
		chrome.runtime.sendMessage({command: "reload_sidebar"});
		location.reload();
	});

	// set dropdown menu options
	$("#append_child_tab, #append_child_tab_after_limit, #after_closing_active_tab, #append_orphan_tab").change(function() {
		opt[this.id] = $(this).val();
		SavePreferences();
	});

	
	// set tabs tree depth option
	$(document).on("input", "#max_tree_depth", function(event) {
		opt.max_tree_depth = $(this)[0].value;
		SavePreferences();
	});

	
	// set toolbar on/off and show/hide all toolbar options
	$(document).on("click", "#show_toolbar", function(event) {
		SelectedTheme.ToolbarShow = $("#show_toolbar")[0].checked ? true : false;
		SaveTheme($("#theme_list").val());
		LoadTheme($("#theme_list").val());
	});

	
// ------------------------------OTHER------------------------------------------------------------------------------------	

	// block system dragging
	$(document).bind("drop dragover", function(event) {
		event.preventDefault();
	});

// ----------------------------TOOLBAR CUSTOMIZATION----------------------------------------------------------------------	


	$(document).on("mousedown", ".button", function(event) {
		$("#button_filter_clear").css({"opacity": "1", "position": "absolute"});
		if ($(this).is("#button_filter_type, #filter_search_go_prev, #filter_search_go_next")) {
			return;
		}
		$(this).attr("draggable", "true");
		dragged_button = this;
	});
	
	// set dragged button node
	$(document).on("dragstart", ".button", function(event) {
		event.originalEvent.dataTransfer.setData(" "," ");
		event.originalEvent.dataTransfer.setDragImage(document.getElementById("DragImage"), 0, 0);
	});
	
	// remove draggable attribute to clean html which will be saved in the toolbar
	$(document).on("mouseleave", ".button", function(event) {
		$(".button").removeAttr("draggable");
	});
	
	
	
	// drag&drop buttons to lists
	$(document).on("dragenter", "#toolbar_main, .toolbar_shelf, #toolbar_unused_buttons", function(event) {
		if ($(dragged_button).is("#button_tools, #button_search, #button_groups, #button_backup, #button_folders") && $(this).is(".toolbar_shelf")) {
			return;
		}
		if (dragged_button.parentNode.id != this.id) {
			// if ($(dragged_button).is("#button_tools, #button_search, #button_groups, #button_backup, #button_folders") && $(this).is("#toolbar_unused_buttons")) {
				// $(".on").removeClass("on");
			// }
			$("#"+dragged_button.id).appendTo($(this));
		}
	});

	// move (flip) buttons
	$(document).on("dragenter", ".button", function(event) {
		if ($(dragged_button).is("#button_tools, #button_search, #button_groups, #button_backup, #button_folders") && $(this).parent().is(".toolbar_shelf")) {
			return;
		}
		if ($(this).parent().is("#toolbar_search, #toolbar_search_buttons")) {
			return;
		}
		if ( $(this).index() <= $("#"+dragged_button.id).index()) {
			$("#"+dragged_button.id).insertBefore($(this));
		} else {
			$("#"+dragged_button.id).insertAfter($(this));
		}
	});

	// save toolbar
	$(document).on("dragend", ".button", function(event) {
		$("#button_filter_clear").css({"opacity": "0"});

		SelectedTheme.toolbar = $("#toolbar").html();
		SelectedTheme.unused_buttons = $("#toolbar_unused_buttons").html();
		SaveTheme($("#theme_list").val());
		$("#button_filter_clear").css({"opacity": "1"});
	});
	
	// reset toolbar
	$(document).on("click", "#options_reset_toolbar_button", function(event) {
		SelectedTheme["toolbar"] = DefaultToolbar;
		SelectedTheme["unused_buttons"] = "";
		$("#toolbar").html(DefaultToolbar);
		$("#toolbar_unused_buttons").html("");
		SaveTheme($("#theme_list").val());
		$(".on").removeClass("on");
		RefreshGUI();
	});


// --------------------------------------THEME BUTTONS--------------------------------------------------------------------	


	// add new theme preset button
	$(document).on("click", "#options_add_theme_button", function(event) {
		AddNewTheme();
	});

	// remove theme preset button
	$(document).on("click", "#options_remove_theme_button", function(event) {
		DeleteSelectedTheme();
	});
	
	// select theme from list
	$("#theme_list").change(function() {
		LoadTheme($(this).val());
		chrome.storage.local.set({current_theme: $(this).val()});
	});

	// import theme preset button
	$(document).on("click", "#options_import_theme_button", function(event) {
		ShowOpenFileDialog("import_theme", ".tt_theme");
	});
	$(document).on("change", "#import_theme", function(event) {
		ImportTheme();
	});
	
	// export theme preset button
	$(document).on("click", "#options_export_theme_button", function(event) {
		if ($("#theme_list")[0].options.length == 0) {
			alert(chrome.i18n.getMessage("options_no_theme_to_export"));
		} else {
			SaveFile($("#theme_list").val() + ".tt_theme", SelectedTheme);
		}
	});

	// rename theme preset button
	$(document).on("click", "#options_rename_theme_button", function(event) {
		RenameSelectedTheme();
	});


// -------------------------------INDENTATION ADJUSTMENT------------------------------------------------------------------	

	// change tabs size preset(down)
	$(document).on("click", "#options_tabs_indentation_down", function(event) {
		let bod = document.getElementById("body");
		var indentation = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--children_padding_left")).replace("p","").replace("x",""));
		if (indentation > 0) {
			indentation--;
			SelectedTheme["ColorsSet"]["children_padding_left"] = indentation+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});

	// change tabs size preset(up)
	$(document).on("click", "#options_tabs_indentation_up", function(event) {
		let bod = document.getElementById("body");
		var indentation = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--children_padding_left")).replace("p","").replace("x",""));
		if (indentation < 50) {
			indentation++;
			SelectedTheme["ColorsSet"]["children_padding_left"] = indentation+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});
	
	
// --------------------------TABS ROUNDNESS ADJUSTMENT--------------------------------------------------------------------	

	// change tabs roundness preset(down)
	$(document).on("click", "#options_tabs_roundness_down", function(event) {
		let bod = document.getElementById("body");
		var border_radius = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--tab_header_border_radius").replace("p","").replace("x","")));
		if (border_radius > 0) {
			border_radius--;
			SelectedTheme["ColorsSet"]["tab_header_border_radius"] = border_radius+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});

	// change tabs roundness preset(up)
	$(document).on("click", "#options_tabs_roundness_up", function(event) {
		let bod = document.getElementById("body");
		var border_radius = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--tab_header_border_radius")).replace("p","").replace("x",""));
		if (border_radius < 25) {
			border_radius++;
			SelectedTheme["ColorsSet"]["tab_header_border_radius"] = border_radius+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});

// -------------------------------SIZE ADJUSTMENT-------------------------------------------------------------------------	

	// change tabs size preset(down)
	$(document).on("click", "#options_tabs_size_down", function(event) {
		if (SelectedTheme["TabsSizeSetNumber"] > 0) {
			SelectedTheme["TabsSizeSetNumber"]--;
			ApplySizeSet(SelectedTheme["TabsSizeSetNumber"]);
			ApplySizeOptionsSet(SelectedTheme["TabsSizeSetNumber"]);
			SaveTheme($("#theme_list").val());
		}
	});

	// change tabs size preset(up)
	$(document).on("click", "#options_tabs_size_up", function(event) {
		if (SelectedTheme["TabsSizeSetNumber"] < 4) {
			SelectedTheme["TabsSizeSetNumber"]++;
			ApplySizeSet(SelectedTheme["TabsSizeSetNumber"]);
			ApplySizeOptionsSet(SelectedTheme["TabsSizeSetNumber"]);
			SaveTheme($("#theme_list").val());
		}
	});


// -------------------------------TABS SCROLLBAR SIZE ADJUSTMENT----------------------------------------------------------	

	// change tab list scrollbar preset(down)
	$(document).on("mousedown", "#options_tab_list_scrollbar_width_down", function(event) {
		let bod = document.getElementById("body");
		var border_radius = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--scrollbar_width").replace("p","").replace("x","")));
		if (border_radius > 0) {
			border_radius--;
			SelectedTheme["ColorsSet"]["scrollbar_width"] = border_radius+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});

	// change tab list scrollbar preset(up)
	$(document).on("mousedown", "#options_tab_list_scrollbar_width_up", function(event) {
		let bod = document.getElementById("body");
		var border_radius = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--scrollbar_width")).replace("p","").replace("x",""));
		if (border_radius < 20) {
			border_radius++;
			SelectedTheme["ColorsSet"]["scrollbar_width"] = border_radius+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});

	// change pin list scrollbar preset(down)
	$(document).on("mousedown", "#options_tab_list_scrollbar_height_down", function(event) {
		let bod = document.getElementById("body");
		var border_radius = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--scrollbar_height").replace("p","").replace("x","")));
		if (border_radius > 0) {
			border_radius--;
			SelectedTheme["ColorsSet"]["scrollbar_height"] = border_radius+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});

	// change pin list scrollbar preset(up)
	$(document).on("mousedown", "#options_tab_list_scrollbar_height_up", function(event) {
		let bod = document.getElementById("body");
		var border_radius = parseInt((window.getComputedStyle(bod, null).getPropertyValue("--scrollbar_height")).replace("p","").replace("x",""));
		if (border_radius < 20) {
			border_radius++;
			SelectedTheme["ColorsSet"]["scrollbar_height"] = border_radius+"px";
			ApplyColorsSet(SelectedTheme["ColorsSet"]);
			SaveTheme($("#theme_list").val());
		}
	});



// ----------------------CLEAR DATA BUTTON--------------------------------------------------------------------------------	

	// clear data
	$(document).on("click", "#options_clear_data", function(event) {
		chrome.storage.local.clear();
		chrome.runtime.sendMessage({command: "reload"});
		chrome.runtime.sendMessage({command: "reload_sidebar"});
		location.reload();
	});
}


function copyStringToClipboard(string) {
	function handler (event){
		event.clipboardData.setData('text/plain', string);
		event.preventDefault();
		document.removeEventListener('copy', handler, true);
	}
	document.addEventListener('copy', handler, true);
	document.execCommand('copy');
}


// dummy functions
function BindTabsSwitchingToMouseWheel() {}
function GetFaviconAndTitle() {}
function RefreshMediaIcon() {}