jQuery(document).ready(function($) {
	var notRequiredField = {};
	var allField = {};
	$.ajax({
		type: "POST",
		url: "app/includes/ajax.php",
		data: {"action": "get_all_pages"}
	}).done(function(data) {
		try{
			data = JSON.parse(data);
			var tbody = $("#edit-forms-table").find("tbody");
			var i = 1;
			for(var key in data) {
				var tr = $("<tr></tr>");
				$(tr).append("<td>"+i+"</td>");
				$(tr).append("<td>"+data[key].id+"</td>");
				$(tr).append("<td>"+data[key].title+"</td>");
				$(tr).append("<td>"+data[key].permalink+"</td>");
				$(tr).append('<td><button  data-toggle="modal" data-target="#editFormsModal"  data-title="'+data[key].title+'" data-id="'+data[key].id+'" data-permalink="'+data[key].permalink+'" class="btn btn-sm btn-block edit-required-btn">Edit Required Fields</button></td>');
				$(tbody).append(tr);
				i++;
			}
		}
		catch(err) {
			console.log(err);
			console.log(data);
		}
		finally {
			$.getNotRequiredFields();
		}
	})

	$.extend({
		getNotRequiredFields: function() {
			$.ajax({
				type: "POST",
				url: "app/includes/ajax.php",
				data: {"action": "get_not_required_fields"}
			}).done(function(data) {
				try{
					data = JSON.parse(data);
					notRequiredField = data.notrequired;
					allField = data.all;
					console.log(data);
				}
				catch(err) {
					console.log(err);
					console.log(data);
				}
				finally {

				}
			})
		}
	})

	$(document).on("click", ".edit-required-btn", function(e) {
		var btn = $(this);
		$("#editFormsModalLabel").html($(btn).data("title"));
		$("#save-changes-btn").attr("disabled", true);
		$('#page_permalink').val($(btn).data("permalink"));
		$('#page_id').val($(btn).data("id"));
		var page_id = $(btn).data("id");
		var permalink = $(btn).data("permalink");
		getHTML(permalink, function (response) {
			var forms = response.querySelectorAll( 'form' );
			var nrf = $("#not_required_field");
			var allf = $("#all_field");
			$(nrf).html("");
			$(allf).html("");
			if(forms !== null) {
				var forms = Array.from(forms);
				for(var fkey in forms) {
					var fields = Array.from(forms[fkey]);
					for(var key in fields) {
						if(fields[key].nodeName === "INPUT" || fields[key].nodeName === "SELECT" || fields[key].nodeName === "CHECKBOX" || fields[key].nodeName === "RADIO" || fields[key].nodeName === "TEXTAREA") 
						{
							if(fields[key].getAttribute("id") != "" && fields[key].getAttribute("id") != null && fields[key].getAttribute("type") != "hidden") {
								var attr_id = fields[key].getAttribute("id");
								if(notRequiredField[permalink] !== undefined) {
									var is_not_req = (jQuery.inArray(attr_id, notRequiredField[permalink]) === -1) ? false : true;
								} else {
									var is_not_req = (fields[key].getAttribute("required") !== null) ? false : true;
								}

								var option = "<option"
								option += (is_not_req) ? " selected" : "";
								option += ">"+attr_id+"<option>";
								$(nrf).append(option);

								var option = "<option selected>"+attr_id+"<option>";
								$(allf).append(option);

								$("#save-changes-btn").attr("disabled", false);
							}
						}
					}
				}
			}
			$(nrf).trigger("chosen:updated");
			$(allf).trigger("chosen:updated");
		});
	});

	$(document).on("click", "#save-changes-btn", function(e) {
		e.preventDefault();
		var btn = $(this);
		var btnText = $(btn).html();
		$(btn).html("Please Wait").attr("disabled", true);
		var form = $("#edit-form-form");
		var formData = new FormData(form[0]);
		$.ajax({
		    type: 'POST',
		    url: "app/includes/ajax.php",
		    data: formData,
		    processData: false,
    		contentType: false,
    	}).done(function(data) {
    		try{
				data = JSON.parse(data);
			}
			catch(err) {
				console.log(err);
				console.log(data);
			}
			finally {
				$.getNotRequiredFields();
				$(btn).html(btnText).attr("disabled", false);
				$('#editFormsModal').modal('toggle');
			}
    	})
	})
})