/*
 * Copyright 2012 LinkedIn Corp.
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not
 * use this file except in compliance with the License. You may obtain a copy of
 * the License at
 * 
 * http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations under
 * the License.
 */

$.namespace('azkaban');

var flowExecuteDialogView;
azkaban.FlowExecuteDialogView = Backbone.View.extend({
	events: {
		"click .closeExecPanel": "hideExecutionOptionPanel",
		"click #schedule-btn": "scheduleClick",
		"click #execute-btn": "handleExecuteFlow"
	},
	
	initialize: function(settings) {
		this.model.bind('change:flowinfo', this.changeFlowInfo, this);
		$("#overrideSuccessEmails").click(function(evt) {
			if ($(this).is(':checked')) {
				$('#successEmails').attr('disabled', null);
			}
			else {
				$('#successEmails').attr('disabled', "disabled");
			}
		});
				
		$("#overrideFailureEmails").click(function(evt) {
			if ($(this).is(':checked')) {
				$('#failureEmails').attr('disabled', null);
			}
			else {
				$('#failureEmails').attr('disabled', "disabled");
			}
		});
	},
	
	render: function() {
	},
	
	getExecutionOptionData: function() {
		var failureAction = $('#failureAction').val();
		var failureEmails = $('#failureEmails').val();
		var successEmails = $('#successEmails').val();
		var notifyFailureFirst = $('#notifyFailureFirst').is(':checked');
		var notifyFailureLast = $('#notifyFailureLast').is(':checked');
		var failureEmailsOverride = $("#overrideFailureEmails").is(':checked');
		var successEmailsOverride = $("#overrideSuccessEmails").is(':checked');
		
		var flowOverride = {};
		var editRows = $(".editRow");
		for (var i = 0; i < editRows.length; ++i) {
			var row = editRows[i];
			var td = $(row).find('td');
			var key = $(td[0]).text();
			var val = $(td[1]).text();
			
			if (key && key.length > 0) {
				flowOverride[key] = val;
			}
		}
		
		var data = this.model.get("data");
		var disabledList = gatherDisabledNodes(data);
		
		var executingData = {
			projectId: projectId,
			project: this.projectName,
			ajax: "executeFlow",
			flow: this.flowId,
			disabled: JSON.stringify(disabledList),
			failureEmailsOverride:failureEmailsOverride,
			successEmailsOverride:successEmailsOverride,
			failureAction: failureAction,
			failureEmails: failureEmails,
			successEmails: successEmails,
			notifyFailureFirst: notifyFailureFirst,
			notifyFailureLast: notifyFailureLast,
			flowOverride: flowOverride
		};
		
		// Set concurrency option, default is skip

		var concurrentOption = $('input[name=concurrent]:checked').val();
		executingData.concurrentOption = concurrentOption;
		if (concurrentOption == "pipeline") {
			var pipelineLevel = $("#pipelineLevel").val();
			executingData.pipelineLevel = pipelineLevel;
		}
		else if (concurrentOption == "queue") {
			executingData.queueLevel = $("#queueLevel").val();
		}
		
		return executingData;
	},
	changeFlowInfo: function() {
		var successEmails = this.model.get("successEmails");
		var failureEmails = this.model.get("failureEmails");
		var failureActions = this.model.get("failureAction");
		var notifyFailure = this.model.get("notifyFailure");
		var flowParams = this.model.get("flowParams");
		var isRunning = this.model.get("isRunning");
		var concurrentOption = this.model.get("concurrentOption");
		var pipelineLevel = this.model.get("pipelineLevel");
		var pipelineExecutionId = this.model.get("pipelineExecution");
		var queueLevel = this.model.get("queueLevel");
		var nodeStatus = this.model.get("nodeStatus");
		var overrideSuccessEmails = this.model.get("overrideSuccessEmails");
		var overrideFailureEmails = this.model.get("overrideFailureEmails");
		
		if (overrideSuccessEmails) {
			$('#overrideSuccessEmails').attr('checked', true);
		}
		else {
			$('#successEmails').attr('disabled','disabled');
		}
		if (overrideFailureEmails) {
			$('#overrideFailureEmails').attr('checked', true);
		}
		else {
			$('#failureEmails').attr('disabled','disabled');
		}
		
		if (successEmails) {
			$('#successEmails').val(successEmails.join());
		}
		if (failureEmails) {
			$('#failureEmails').val(failureEmails.join());
		}
		if (failureActions) {
		$('#failureAction').val(failureActions);
		}
		
		if (notifyFailure.first) {
		$('#notifyFailureFirst').attr('checked', true);
		}
		if (notifyFailure.last) {
			$('#notifyFailureLast').attr('checked', true);
		}
		
		if (concurrentOption) {
			$('input[value='+concurrentOption+'][name="concurrent"]').attr('checked', true);
		}
		if (pipelineLevel) {
			$('#pipelineLevel').val(pipelineLevel);
		}
		if (queueLevel) {
			$('#queueLevel').val(queueLevel);
		}

		if (flowParams) {
			for (var key in flowParams) {
				editTableView.handleAddRow({
					paramkey: key, 
					paramvalue: flowParams[key]
				});
			}
		}
	},
	
	show: function(data) {
		var projectName = data.project;
		var flowId = data.flow;
		var jobId = data.job;
		
		// ExecId is optional
		var execId = data.execid;
		var exgraph = data.exgraph;
		
		this.projectName = projectName;
		this.flowId = flowId;
		
		var self = this;
		var loadCallback = function() {
			if (jobId) {
				self.showExecuteJob(projectName, flowId, jobId, data.withDep);
			}
			else {
				self.showExecuteFlow(projectName, flowId);
			}
		}
		
		var loadedId = executableGraphModel.get("flowId");
		this.loadGraph(projectName, flowId, exgraph, loadCallback);
		this.loadFlowInfo(projectName, flowId, execId);

	},
	
	showExecuteFlow: function(projectName, flowId) {
		$("#execute-flow-panel-title").text("Execute Flow " + flowId);
		this.showExecutionOptionPanel();

		// Triggers a render
		this.model.trigger("change:graph");
	},
	
	showExecuteJob: function(projectName, flowId, jobId, withDep) {
		sideMenuDialogView.menuSelect($("#flow-option"));
		$("#execute-flow-panel-title").text("Execute Flow " + flowId);
		
		var data = this.model.get("data");
		var disabled = this.model.get("disabled");
		
		// Disable all, then re-enable those you want.
		disableAll();
		
		var jobNode = data.nodeMap[jobId];
		touchNode(jobNode, false);
		
		if (withDep) {
			recurseAllAncestors(jobNode, false);
		}

		this.showExecutionOptionPanel();
		this.model.trigger("change:graph");
	},
	
	showExecutionOptionPanel: function() {
		sideMenuDialogView.menuSelect($("#flow-option"));
		$('#execute-flow-panel').modal();
	},
	
	hideExecutionOptionPanel: function() {
		$('#execute-flow-panel').modal("hide");
	},
	
	scheduleClick: function() {
		console.log("click schedule button.");
		this.hideExecutionOptionPanel();
		schedulePanelView.showSchedulePanel();
	},
	
	loadFlowInfo: function(projectName, flowId, execId) {
		console.log("Loading flow " + flowId);
		fetchFlowInfo(this.model, projectName, flowId, execId);
	},
	
	loadGraph: function(projectName, flowId, exgraph, callback) {
		console.log("Loading flow " + flowId);
		var requestURL = contextURL + "/manager";
		
		var graphModel = executableGraphModel;
		// fetchFlow(this.model, projectName, flowId, true);
		var requestData = {
				"project": projectName, 
				"ajax": "fetchflowgraph", 
				"flow": flowId
			};
		var self = this;
		var successHandler = function(data) {
			console.log("data fetched");
			graphModel.addFlow(data);
			
			if (exgraph) {
				self.assignInitialStatus(data, exgraph);
			}
			
			// Auto disable jobs that are finished.
			disableFinishedJobs(data);
			executingSvgGraphView = new azkaban.SvgGraphView({
				el: $('#flow-executing-graph'), 
				model: graphModel,
				render: false,
				rightClick: { 
					"node": expanelNodeClickCallback,
					"edge": expanelEdgeClickCallback, 
					"graph": expanelGraphClickCallback 
				},
				tooltipcontainer: "#svg-div-custom"
			});
			
			if (callback) {
				callback.call(this);
			}
		};
		$.get(requestURL, requestData, successHandler, "json");
	},
	assignInitialStatus: function(data, statusData) {
		// Copies statuses over from the previous execution if it exists.
		var statusNodeMap = statusData.nodeMap;
		var nodes = data.nodes;
		for(var i=0; i<nodes.length; ++i) {
			var node = nodes[i];
			var statusNode = statusNodeMap[node.id];
			if (statusNode) {
				node.status = statusNode.status;
				if (node.type == "flow" && statusNode.type == "flow") {
					this.assignInitialStatus(node, statusNode);
				}
			}
		}
	},
	handleExecuteFlow: function(evt) {
		console.log("click schedule button.");
		var executeURL = contextURL + "/executor";
		var executingData = this.getExecutionOptionData();
		executeFlow(executingData);
	}
});

var editTableView;
azkaban.EditTableView = Backbone.View.extend({
	events: {
		"click table .addRow": "handleAddRow",
		"click table .editable": "handleEditColumn",
		"click table .removeIcon": "handleRemoveColumn"
	},

	initialize: function(setting) {
	},
	
	handleAddRow: function(data) {
		var name = "";
		if (data.paramkey) {
			name = data.paramkey;
		}
		
		var value = "";
		if (data.paramvalue) {
			value = data.paramvalue;
		}
	
		var tr = document.createElement("tr");
		var tdName = document.createElement("td");
		$(tdName).addClass('property-key');
		var tdValue = document.createElement("td");
		
		var remove = document.createElement("div");
		$(remove).addClass("pull-right").addClass('remove-btn');
		var removeBtn = document.createElement("button");
		$(removeBtn).attr('type', 'button');
		$(removeBtn).addClass('btn').addClass('btn-xs').addClass('btn-danger');
		$(removeBtn).text('Delete');
		$(remove).append(removeBtn);

		var nameData = document.createElement("span");
		$(nameData).addClass("spanValue");
		$(nameData).text(name);
		var valueData = document.createElement("span");
		$(valueData).addClass("spanValue");
		$(valueData).text(value);
						
		$(tdName).append(nameData);
		$(tdName).addClass("editable");
		
		$(tdValue).append(valueData);
		$(tdValue).append(remove);
		$(tdValue).addClass("editable").addClass('value');
		
		$(tr).addClass("editRow");
		$(tr).append(tdName);
		$(tr).append(tdValue);
	 
		$(tr).insertBefore(".addRow");
		return tr;
	},
	
	handleEditColumn: function(evt) {
		var curTarget = evt.currentTarget;
	
		var text = $(curTarget).children(".spanValue").text();
		$(curTarget).empty();
					
		var input = document.createElement("input");
		$(input).attr("type", "text");
		$(input).addClass('form-control').addClass('input-sm');
		$(input).css("width", "100%");
		$(input).val(text);
		$(curTarget).addClass("editing");
		$(curTarget).append(input);
		$(input).focus();
		
		var obj = this;
		$(input).focusout(function(evt) {
			obj.closeEditingTarget(evt);
		});
		
		$(input).keypress(function(evt) {
			if (evt.which == 13) {
				obj.closeEditingTarget(evt);
			}
		});
	},
	
	handleRemoveColumn: function(evt) {
		var curTarget = evt.currentTarget;
		// Should be the table
		var row = curTarget.parentElement.parentElement;
		$(row).remove();
	},
	
	closeEditingTarget: function(evt) {
		var input = evt.currentTarget;
		var text = $(input).val();
		var parent = $(input).parent();
		$(parent).empty();

		var valueData = document.createElement("span");
		$(valueData).addClass("spanValue");
		$(valueData).text(text);

		if ($(parent).hasClass("value")) {
			var remove = document.createElement("div");
			$(remove).addClass("pull-right").addClass('remove-btn');
			var removeBtn = document.createElement("button");
			$(removeBtn).attr('type', 'button');
			$(removeBtn).addClass('btn').addClass('btn-xs').addClass('btn-danger');
			$(removeBtn).text('Delete');
			$(remove).append(removeBtn);
			$(parent).append(remove);
		}
		
		$(parent).removeClass("editing");
		$(parent).append(valueData);
	}
});

var sideMenuDialogView;
azkaban.SideMenuDialogView = Backbone.View.extend({
	events: {
		"click .menu-header": "menuClick"
	},
	
	initialize: function(settings) {
		var children = $(this.el).children();
		for (var i = 0; i < children.length; ++i ) {
			var child = children[i];
			$(child).addClass("menu-header");
			var caption = $(child).find(".menu-caption");
			$(caption).hide();
		}
		this.menuSelect($("#flow-option"));
	},
	
	menuClick: function(evt) {
		this.menuSelect(evt.currentTarget);
	},
	
	menuSelect: function(target) {
		if ($(target).hasClass("active")) {
			return;
		}
		
		$(".side-panel").each(function() {
			$(this).hide();
		});
		
		$(".menu-header").each(function() {
			$(this).find(".menu-caption").slideUp("fast");
			$(this).removeClass("active");
		});
		
		$(target).addClass("active");
		$(target).find(".menu-caption").slideDown("fast");
		var panelName = $(target).attr("viewpanel");
		$("#" + panelName).show();
	}
});

var handleJobMenuClick = function(action, el, pos) {
	var jobid = el[0].jobid;
	
	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowName + "&job=" + jobid;
	if (action == "open") {
		window.location.href = requestURL;
	}
	else if (action == "openwindow") {
		window.open(requestURL);
	}
}

var executableGraphModel;

/**
 * Disable jobs that need to be disabled
 */
var disableFinishedJobs = function(data) {
	for (var i=0; i < data.nodes.length; ++i) {
		var node = data.nodes[i];
		
		if (node.status == "DISABLED" || node.status == "SKIPPED") {
			node.status = "READY";
			node.disabled = true;
		}
		else if (node.status == "SUCCEEDED" || node.status=="RUNNING") {
			node.disabled = true;
		}
		else if (node.status == "CANCELLED") {
			node.disabled = false;
			node.status="READY";
		}
		else {
			node.disabled = false;
			if (node.type == "flow") {
				disableFinishedJobs(node);
			}
		}
	}
}

/**
 * Enable all jobs. Recurse
 */
var enableAll = function() {
	recurseTree(executableGraphModel.get("data"), false, false);
	executableGraphModel.trigger("change:disabled");
}

var disableAll = function() {
	recurseTree(executableGraphModel.get("data"), true, false);
	executableGraphModel.trigger("change:disabled");
}

var recurseTree = function(data, disabled, recurse) {
	for (var i=0; i < data.nodes.length; ++i) {
		var node = data.nodes[i];
		node.disabled = disabled;
		
		if (node.type == "flow" && recurse) {
			recurseTree(node, disabled);
		}
	}
}

var touchNode = function(node, disable) {
	node.disabled = disable;
	executableGraphModel.trigger("change:disabled");
}

var touchParents = function(node, disable) {
	var inNodes = node.inNodes;

	if (inNodes) {
		for (var key in inNodes) {
			inNodes[key].disabled = disable;
		}
	}

	executableGraphModel.trigger("change:disabled");
}

var touchChildren = function(node, disable) {
	var outNodes = node.outNodes;

	if (outNodes) {
		for (var key in outNodes) {
			outNodes[key].disabled = disable;
		}
	}
	
	executableGraphModel.trigger("change:disabled");
}

var touchAncestors = function(node, disable) {
	recurseAllAncestors(node, disable);
	
	executableGraphModel.trigger("change:disabled");
}

var touchDescendents = function(jobid, disable) {
	recurseAllDescendents(node, disable);
	
	executableGraphModel.trigger("change:disabled");
}

var gatherDisabledNodes = function(data) {
	var nodes = data.nodes;
	var disabled = [];
	
	for (var i = 0; i < nodes.length; ++i) {
		var node = nodes[i];
		if (node.disabled) {
			disabled.push(node.id);
		}
		else {
			if (node.type == "flow") {
				var array = gatherDisabledNodes(node);
				if (array && array.length > 0) {
					disabled.push({id: node.id, children: array});
				}
			}
		}
	}
	
	return disabled;
}

function recurseAllAncestors(node, disable) {
	var inNodes = node.inNodes;
	if (inNodes) {
		for (var key in inNodes) {
			inNodes[key].disabled = disable;
			recurseAllAncestors(inNodes[key], disable);
		}
	}
}

function recurseAllDescendents(node, disable) {
	var outNodes = node.outNodes;
	if (outNodes) {
		for (var key in outNodes) {
			outNodes[key].disabled = disable;
			recurseAllDescendents(outNodes[key], disable);
		}
	}
}

var expanelNodeClickCallback = function(event, model, node) {
	console.log("Node clicked callback");
	var jobId = node.id;
	var flowId = executableGraphModel.get("flowId");
	var type = node.type;
	
	var menu;
	if (type == "flow") {
		var flowRequestURL = contextURL + "/manager?project=" + projectName + "&flow=" + node.flowId;
		if (node.expanded) {
			menu = [
				{title: "Collapse Flow...", callback: function() {model.trigger("collapseFlow", node);}},
				{title: "Open Flow in New Window...", callback: function() {window.open(flowRequestURL);}}
			];
	
		}
		else {
			menu = [
				{title: "Expand Flow...", callback: function() {model.trigger("expandFlow", node);}},
				{title: "Open Flow in New Window...", callback: function() {window.open(flowRequestURL);}}
			];
		}
	}
	else {
		var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowId + "&job=" + jobId;
		menu = [
				{title: "Open Job in New Window...", callback: function() {window.open(requestURL);}},
			];
	}

	$.merge(menu, [
		{break: 1},
		{title: "Enable", callback: function() {touchNode(node, false);}, submenu: [
			{title: "Parents", callback: function(){touchParents(node, false);}},
			{title: "Ancestors", callback: function(){touchAncestors(node, false);}},
			{title: "Children", callback: function(){touchChildren(node, false);}},
			{title: "Descendents", callback: function(){touchDescendents(node, false);}},
			{title: "Enable All", callback: function(){enableAll();}}
		]},
		{title: "Disable", callback: function() {touchNode(node, true)}, submenu: [
			{title: "Parents", callback: function(){touchParents(node, true);}},
			{title: "Ancestors", callback: function(){touchAncestors(node, true);}},
			{title: "Children", callback: function(){touchChildren(node, true);}},
			{title: "Descendents", callback: function(){touchDescendents(node, true);}},
			{title: "Disable All", callback: function(){disableAll();}}
		]},
		{title: "Center Job", callback: function() {model.trigger("centerNode", node);}}
	]);


	contextMenuView.show(event, menu);
}

var expanelEdgeClickCallback = function(event) {
	console.log("Edge clicked callback");
}

var expanelGraphClickCallback = function(event) {
	console.log("Graph clicked callback");
	var flowId = executableGraphModel.get("flowId");
	var requestURL = contextURL + "/manager?project=" + projectName + "&flow=" + flowId;
	
	var menu = [
		{title: "Open Flow in New Window...", callback: function() {window.open(requestURL);}},
		{break: 1},
		{title: "Enable All", callback: function() {enableAll();}},
		{title: "Disable All", callback: function() {disableAll();}},
		{break: 1},
		{title: "Center Graph", callback: function() {executableGraphModel.trigger("resetPanZoom");}}
	];
	
	contextMenuView.show(event, menu);
}

var contextMenuView;
$(function() {
	executableGraphModel = new azkaban.GraphModel();
	flowExecuteDialogView = new azkaban.FlowExecuteDialogView({
		el: $('#execute-flow-panel'), 
		model: executableGraphModel
	});
	
	sideMenuDialogView = new azkaban.SideMenuDialogView({
		el: $('#graph-options')
	});
	editTableView = new azkaban.EditTableView({
		el: $('#editTable')
	});

	contextMenuView = new azkaban.ContextMenuView({
		el: $('#contextMenu')
	});
});
