import './SalesSheets.html';
import './SalesSheetForm.js';
import './SalesSheetEditor.js';
import swal from 'sweetalert2';

let PREFIX = "SalesSheets.";

Template.SalesSheets.onCreated(function() {
	this.subscribe("products");
	this.subscribe("venues");
	this.subscribe("measures");
	this.subscribe("salesSheets");
});
Template.SalesSheets.onDestroyed(function() {
	// Reset the view's session variables used for navigation.
	Session.set(PREFIX + "currentFormName", undefined);
	Session.set(PREFIX + "tab", undefined);
});

//******************************************************************
//** Container template that allows a user to pick a sheet and either fill it out OR edit it.
//******************************************************************
Template.SalesSheetsMain.onCreated(function() {
	//Save the previous session state - whether we are editing the selected sheet.
	//The name of the currently active page tab.  This will either be the SalesSheetForm or the SalesSheetEditor.
	if(!Session.get(PREFIX + "tab")) Session.set(PREFIX + "tab", "SalesSheetForm");
	if(!Session.get(PREFIX + 'selectedSheet')) {
		Session.set(PREFIX + 'selectedSheet', Meteor.collections.SalesSheets.findOne({}, {sort: {name: 1}}));
	}
});
Template.SalesSheetsMain.helpers({
	sheets: function() {
		//let sheets = Meteor.collections.SalesSheets.find({}, {sort: {name: 1}}).fetch();
		//
		//if(sheets && sheets.length > 0) sheets[0].isFirst = true;
		//
		//return sheets;
		return Meteor.collections.SalesSheets.find({}, {sort: {name: 1}});
	},
	sheetsSelectIsSelected: function(sheet, isFirst) {
		let selectedSheet = Session.get(PREFIX + "selectedSheet");
		
		if(!selectedSheet && isFirst) Session.set(PREFIX + "selectedSheet", selectedSheet = sheet);
		
		return selectedSheet == sheet ? "selected" : "";
	},
	disableButtons: function() {
		//Disable the edit & delete functionality if nothing is selected.
		return !Session.get(PREFIX + "selectedSheet");
	},
	selected: function() {
		//Get whether the current sheet is selected and return the string for use in the option tag.
		//return this.isSelected ? "selected" : "";
		return this._id == Session.get(PREFIX + 'selectedSheet')._id;
	},
	tab: function() {
		return Session.get(PREFIX + "tab");
	},
	tabData: function() {
		return Session.get(PREFIX + "selectedSheet")._id;
	},
	isSheetSelected: function() {
		return Session.get(PREFIX + "selectedSheet");
	},
	isEditingSheet: function() {
		return Session.get(PREFIX + "tab") == "SalesSheetEditor";
	}
});
Template.SalesSheetsMain.events({
	'change select[name="sheetSelection"]': function(event, template) {
		let id = $(event.target).val();
		let selected = Meteor.collections.SalesSheets.findOne(id);
		
		Session.set(PREFIX + "selectedSheet", selected);
		// Reset the editor button & the displayed tab.
		Session.set(PREFIX + "tab", "SalesSheetForm");
	},
	'click .editSheet': function(event, template) {
		if(!$(event.target).hasClass("selected")) {
			// Display the editor for the sheet.
			Session.set(PREFIX + "tab", "SalesSheetEditor");
		}
		else {
			// Remove the sheet editor and show the form to fill out the sheet.
			Session.set(PREFIX + "tab", "SalesSheetForm");
			// Reset the editor session variables.
			Session.set(PREFIX + "currentFormName", undefined);
		}
	},
	'click .deleteSheet': function(event, template) {
		let selectedSheet = Session.get(PREFIX + "selectedSheet");
		
		if(selectedSheet) {
			swal({
				title: "Are you sure?",
				text: "This will permanently remove the sale sheet named " + selectedSheet.name + ".",
				type: "question",
				showCancelButton: true,
				confirmButtonColor: "#DD6B55",
				confirmButtonText: "Yes"
			}).then(
				function(isConfirm) {
					if(isConfirm) {
						Meteor.call('removeSalesSheet', selectedSheet._id, function(error) {
							if(error) sAlert.error("Failed to delete the sheet!\n" + error);
							else {
								Session.set(PREFIX + "selectedSheet", Meteor.collections.SalesSheets.findOne({}, {sort: {name: 1}}));
							}
						});
					}
				},
				function(dismiss) {}
			);
		}
	},
	'click .createSheet': function(event, template) {
		let $input = template.$('input[name="newSheetName"]');
		
		if($input.hasClass('show')) {
			let name = $input.val();
			
			name = name ? name.trim() : undefined;
			name = name && name.length > 0 ? name : undefined;
			
			if(name) {
				Meteor.call('createSalesSheet', name, function(error, id) {
					if(error) sAlert.error("Failed to create the sheet!\n" + error);
					else {
						//Quick hack to attempt to allow the sheet we created to be added to the select box before we try to select it and edit it.
						let count = 0;
						let interval = setInterval(function() {
							let selected = Meteor.collections.SalesSheets.findOne(id);
							
							if(selected) {
								//Select the sheet in the drop down.
								template.$('select[name="sheetSelection"]').val(id);
								Session.set(PREFIX + "selectedSheet", selected);
								//Display the editor tab.
								Session.set(PREFIX + "tab", "SalesSheetEditor");
								clearInterval(interval);
							}
							else count++;
							
							//Avoid infinite loop that should never happen.
							if(count > 100) clearInterval(interval);
						}, 100);
					}
				});
			}
			
			$input.removeClass('show');
			$(event.target).toggleClass('move');
		}
		else {
			$input.addClass('show');
			$(event.target).toggleClass('move');
		}
	}
});