js-aqlmodule usage

aqlmodule-usage.js

/*

given an HTML element that corresponds to the selector '#el'
with "data-" attributes ['model', 'token', 'ide']

*/

var module = new Module($('#el'), options);

// or

var module = $('#el').aqlModule(options);

// the information set gets stored in $.data($el.get(0), 'Module')

// you can start clean by
var module = $('#el').aqlModule({ destroy: true });
// or
module = new Module($('#el')); // replaces the data

/*
	after construction
	the module will have:
		- module.token 	(from data-token="sometoken" or set in options)
		- module.ide  	(from data-ide or set in options)
		- module.model 	(from data-model or set in options)
		- module.data 	(can be passed as option)
*/

module = $('#el').aqlModule({
	data: {  }, 	// some data object
	ide: someide, 		// module.ide
	model: somemodel, 	// module.model
	token: sometoken 	// module.token
});


module.save({ key: value }, callbacks);
// is the equivalent of
var data = {key:value};
data[module.model + '_ide'] = module.ide;
data['_token'] = module.token;
aql.save(module.model, data, callbacks);

/*
	
	callbacks are the same as for aql.save
	success, success2, error, error2, saveMessage...

	you can set model save handlers prior to save otherwise 
	as well as add them to options when constructing

*/

module.setHandlers({
	save: function() { /*...*/ },
	error: function() { /*...*/ },
	remove: function() { /*...*/ }
});

/*

	when a module is saved successfully, module.data is populated with json.data, 
	token/ide are set, errors are cleared

	else module.errors is set

	------------------------------------------------------

	The $.data attachment is useful in the following situation, 
	having two different event listeners that should handle the request hte same way


*/

$('.some-el').on('change', function(e) {
	module.save({ this_field: $(this).val() });
	// or 
	$('#el').aqlModule().save({ this_field: $(this).val() });
});

$('.another-element').on('keyup', function(e) {
	module.save({ another_field: $(this).val() })
});

// this as opposed to for both of them writing
// it also prevents multiple lookups of the same thing by already having that object's data cached

var somehandlers = {
	success: function() { /*...*/ },
	error: function() { /*...*/ },
};

$('.some-el').on('change', function() {
	aql.save('model_name', {
		model_name_ide: $('#el').attr('data-ide'),
		_token: $('#el').attr('token'),
		this_field: $(this).val()
	}, somehandlers)
});

$('.another-element').on('keyup', function(e) {
	aql.save('model_name', {
		model_name_ide: $('#el').attr('data-ide'),
		_token: $('#el').attr('token'),
		another_field: $(this).val()
	}, somehandlers)
});

/* 	
	module save would update this element's data-token, data-ide properties 
	if this is an insert to the proper values returned in the json response

	we can also possibly update actual HTML fields that have proper attributes set 
	that are children of this $('#el')
	
*/