ztfy/ztfy.myams: comparison src/ztfy/myams/resources/js/myams.js

Mercurial Mercurial > ztfy > ztfy.myams / comparison

summary | shortlog | changelog | graph | tags | bookmarks | branches | files | changeset | file | latest | revisions | annotate | diff | comparison | raw | help

src/ztfy/myams/resources/js/myams.js

changeset 118	c87d242a1176
parent 104	d25135ad3899
child 127	cf00ea83daa7

equal deleted inserted replaced

-:23c0c267b970
+:c87d242a1176
 * $Tag$
 * A bootstrap based application/administration skin
 *
 * Custom administration and application skin tools
 * Released under Zope Public License ZPL 1.1
-* ©2014 Thierry Florac <tflorac@ulthar.net>
+* ©2014-2015 Thierry Florac <tflorac@ulthar.net>
 */
 (function($) {
 	/**
 	 * MyAMS extensions to JQuery
 	 */
 	if (window.MyAMS === undefined) {
 		window.MyAMS = {
 			devmode: true,
+			lang: 'en',
 			throttle_delay: 350,
 			menu_speed: 235,
 			navbar_height: 49,
 			ajax_nav: true,
 			enable_widgets: true,
 	 * Copyright Andrew Davy: https://forrst.com/posts/Get_the_URL_of_the_current_javascript_file-Dst
 	 */
 	MyAMS.baseURL = (function () {
 		var script = $('script[src$="/myams.js"], script[src$="/myams.min.js"]');
 		var src = script.attr("src");
+		ams.devmode = !src.endsWith('.min.js');
 		return src.substring(0, src.lastIndexOf('/') + 1);
 	})();
 	/**
 					ams.dialog.open(result.location);
 					break;
 				case 'reload':
 					if (result.close_form != false)
 						ams.dialog.close(form);
-					url = result.location;
+					url = result.location || window.location.hash;
 					if (url.startsWith('#'))
 						url = url.substr(1);
 					ams.skin.loadURL(url, result.target || target || '#content');
 					break;
 				case 'redirect':
 					if (result.close_form == true)
 						ams.dialog.close(form);
-					url = result.location;
+					url = result.location || window.location.href;
 					if (result.window) {
 						window.open(url, result.window, result.options);
 					} else {
 						window.location.href = url;
 					}
 					break;
 			}
 			if (result.content) {
 				var content = result.content;
 				var container = $(content.target || target || form || '#content');
-				container.html(content.html);
+				if (content.raw == true) {
-				ams.initContent(container);
+					container.text(content.text);
+				} else {
+					container.html(content.html);
+					ams.initContent(container);
+				}
+				if (!content.keep_hidden)
+					container.removeClass('hidden');
+			}
+			if (result.contents) {
+				var contents = result.contents;
+				for (var index in contents) {
+					content = contents[index];
+					container = $(content.target);
+					if (content.raw == true) {
+						container.text(content.text);
+					} else {
+						container.html(content.html);
+						ams.initContent(container);
+					}
+					if (!content.keep_hidden)
+						container.removeClass('hidden');
+				}
 			}
 			if (result.message) {
 				var message = result.message;
 				if (typeof(message) == 'string') {
 					if ((status == 'info') || (status == 'success'))
 								   message.status || 'success',
 								   message.header,
 								   message.body,
 								   message.subtitle);
 			}
+			if (result.smallbox) {
+				ams.skin.smallBox(result.smallbox_status || status,
+								  {title: result.smallbox,
+								   icon: 'fa fa-fw fa-info-circle font-xs align-top margin-top-10',
+								   timeout: 3000});
+			}
 			if (result.messagebox) {
 				message = result.messagebox;
 				if (typeof(message) == 'string')
 					ams.skin.messageBox('info',
 										{title: ams.i18n.ERROR_OCCURED,
 					ams.skin.messageBox(message_status,
 										{title: message.title || ams.i18n.ERROR_OCCURED,
 										 content: message.content,
 										 icon: message.icon,
 										 number: message.number,
-										 timeout: message.timeout || 10000});
+										 timeout: message.timeout == null ? undefined : (message.timeout || 10000)});
 				}
 			}
 			if (result.event)
 				form.trigger(result.event, result.event_options);
 			if (result.callback)
 				ams.executeFunctionByName(result.callback, form, result.options);
 			if (result.callbacks) {
-				for (var index in result.callbacks) {
+				for (index in result.callbacks) {
 					if (!$.isNumeric(index))
 						continue;
 					var callback = result.callbacks[index];
 					ams.executeFunctionByName(callback, form, callback.options);
 				}
 				submit_options = handler;
 				handler = undefined;
 			}
 			// Prevent multiple submits of the same form
 			if (form.data('submitted')) {
-				ams.skin.messageBox('warning', {
+				if (!form.data('ams-form-hide-submitted')) {
-					title: ams.i18n.WAIT,
+					ams.skin.messageBox('warning', {
-					content: ams.i18n.FORM_SUBMITTED,
+						title: ams.i18n.WAIT,
-					icon: 'fa fa-save shake animated',
+						content: ams.i18n.FORM_SUBMITTED,
-					timeout: 5000
+						icon: 'fa fa-save shake animated',
-				});
+						timeout: form.data('ams-form-alert-timeout') || 5000
+					});
+				}
 				return false;
 			}
 			// Check submit validators
 			if (!ams.form._checkSubmitValidators(form))
 				return false;
 				ams.skin.alert(form, 'error', ams.i18n.ERROR_OCCURED, errors)
 			} else if (errors instanceof Array) {
 				var header = errors.length == 1 ? ams.i18n.ERROR_OCCURED : ams.i18n.ERRORS_OCCURED;
 				ams.skin.alert(form, 'error', header, errors);
 			} else {
+				$('.state-error', form).removeClass('state-error');
 				header = errors.widgets && (errors.widgets.length > 1) ? ams.i18n.ERRORS_OCCURED : ams.i18n.ERROR_OCCURED;
 				var message = new Array();
 				var index;
 				for (index in errors.messages) {
 					if (!$.isNumeric(index))
 					message.push(errors.messages[index].message || errors.messages[index]);
 				}
 				for (index in errors.widgets) {
 					if (!$.isNumeric(index))
 						continue;
-					var widget = errors.widgets[index];
+					// set widget status message
-					$('[name="' + widget.name + '"]', form).parent('label')
+					var widget_data = errors.widgets[index];
-														   .removeClassPrefix('state-')
+					var widget = $('[name="' + widget_data.name + '"]', form);
-														   .addClass('state-error')
+					widget.parents('label:first')
-														   .after('<span for="name" class="state-error">' + widget.message + '</span>');
+						  .removeClassPrefix('state-')
-					if (widget.label) {
+						  .addClass('state-error')
-						message.push(widget.label + ' : ' + widget.message);
+						  .after('<span for="name" class="state-error">' + widget_data.message + '</span>');
+					// complete form alert message
+					if (widget_data.label) {
+						message.push(widget_data.label + ' : ' + widget_data.message);
+					}
+					// mark parent tab (if any) with error status
+					var tab_index = widget.parents('.tab-pane').index() + 1;
+					if (tab_index > 0) {
+						var nav_tabs = $('.nav-tabs', $(widget).parents('.tabforms'));
+						$('li:nth-child(' + tab_index + ')', nav_tabs).removeClassPrefix('state-')
+																	  .addClass('state-error');
+						$('li.state-error:first a', form).click();
 					}
 				}
 				ams.skin.alert(form, 'error', header, message, errors.error_message);
 			}
 		}
 					var fieldset = legend.parent('fieldset');
 					var data = legend.data();
 					if (!data.amsChecker) {
 						var checker = $('<label class="checkbox"></label>');
 						var fieldname = data.amsCheckerFieldname || ('checker_'+ams.generateId());
+						var checkbox_id = fieldname.replace(/\./, '_');
 						var prefix = data.amsCheckerHiddenPrefix;
 						var hidden = null;
 						var checkedValue = data.amsCheckerHiddenValueOn || 'true';
 						var uncheckedValue = data.amsCheckerHiddenValueOff || 'false';
+						var marker = data.amsCheckerMarker || false;
 						if (prefix) {
 							hidden = $('<input type="hidden">').attr('name', prefix + fieldname)
 															   .val(data.amsCheckerState == 'on' ? checkedValue : uncheckedValue)
 															   .prependTo(legend);
+						} else if (marker) {
+							$('<input type="hidden">').attr('name', marker)
+													  .attr('value', 1)
+													  .prependTo(legend);
 						}
 						var input = $('<input type="checkbox">').attr('name', fieldname)
-																.attr('id', fieldname.replace(/\./, '_'))
+																.attr('id', checkbox_id)
 																.data('ams-checker-hidden-input', hidden)
 																.data('ams-checker-init', true)
-																.val(true)
+																.val(data.amsCheckerValue || true)
 																.attr('checked', data.amsCheckerState == 'on' ? 'checked' : null);
 						if (data.amsCheckerReadonly) {
 							input.attr('disabled', 'disabled');
 						} else {
 							input.on('change', function(e) {
 									}
 								}
 							});
 						}
 						input.appendTo(checker);
-						$('.legend', legend).attr('for', input.attr('id'));
+						$('>label', legend).attr('for', input.attr('id'));
 						checker.append('<i></i>')
 							   .prependTo(legend);
 						var required = $('[required]', fieldset);
 						required.attr('data-required', true);
 						if (data.amsCheckerState == 'on') {
 			 */
 			select2: function(element) {
 				var selects = $('.select2', element);
 				if (selects.length > 0) {
 					ams.ajax.check($.fn.select2,
-								   ams.baseURL + 'ext/jquery-select2-3.4.5' + (ams.devmode ? '.js' : '.min.js'),
+								   ams.baseURL + 'ext/jquery-select2-3.5.2' + (ams.devmode ? '.js' : '.min.js'),
 								   function() {
 										selects.each(function() {
 											var select = $(this);
 											var data = select.data();
 											var data_options = {
 												initSelection: ams.getFunctionByName(data.amsSelect2InitSelection),
 												formatSelection: data.amsSelect2FormatSelection === undefined
 																	? ams.helpers.select2FormatSelection
 																	: ams.getFunctionByName(data.amsSelect2FormatSelection),
 												formatResult: ams.getFunctionByName(data.amsSelect2FormatResult),
+												formatMatches: data.amsSelect2FormatMatches === undefined
+																	? function(matches) {
+																		if (matches == 1)
+																			return ams.i18n.SELECT2_MATCH;
+																		else
+																			return matches + ams.i18n.SELECT2_MATCHES;
+																	}
+																	: ams.getFunctionByName(data.amsSelect2FormatMatches),
 												formatNoMatches: data.amsSelect2FormatResult === undefined
 																	? function(term) {
 																		return ams.i18n.SELECT2_NOMATCHES;
 																	}
 																	: ams.getFunctionByName(data.amsSelect2FormatResult),
 													break;
 												default:
 													break;
 											}
-											if (data.amsSelect2Query) {
+											if (select.attr('readonly')) {
+												data_options.query = function() {
+													return [];
+												};
+											} else if (data.amsSelect2Query) {
 												// Custom query method
 												data_options.query = ams.getFunctionByName(data.amsSelect2Query);
 												data_options.minimumInputLength = data.amsSelect2MinimumInputLength || 1;
 											} else if (data.amsSelect2QueryUrl) {
 												// AJAX query
 											var settings = $.extend({}, data_options, data.amsSelect2Options);
 											settings = ams.executeFunctionByName(data.amsSelect2InitCallback, select, settings) || settings;
 											var plugin = select.select2(settings);
 											ams.executeFunctionByName(data.amsSelect2AfterInitCallback, select, plugin, settings);
+											if (select.hasClass('ordered')) {
+												$(plugin.context).parents('.select2-parent').find('ul.select2-choices').sortable({
+													containment: 'parent',
+													start: function() {
+														select.select2('onSortStart');
+													},
+													update: function() {
+														select.select2('onSortEnd');
+													}
+											   })
+											}
 											select.on('change', function() {
 												var validator = $(select.get(0).form).data('validator');
 												if (validator !== undefined)
 													$(select).valid();
 								   });
 				}
 			},
 			/**
-			 * JQuery-UI date picker
+			 * JQuery date picker
 			 */
 			datepicker: function(element) {
 				var datepickers = $('.datepicker', element);
 				if (datepickers.length > 0) {
-					datepickers.each(function() {
+					ams.ajax.check($.fn.datetimepicker,
-						var picker = $(this);
+								   ams.baseURL + 'ext/jquery-datetimepicker' + (ams.devmode ? '.js': '.min.js'),
-						var data = picker.data();
+								   function(first_load) {
-						var data_options = {
+										if (first_load) {
-							dateFormat: data.amsDatepickerFormat || 'dd/mm/yy',
+											ams.getCSS(ams.baseURL + '../css/ext/jquery-datetimepicker' + (ams.devmode ? '.css' : '.min.css'), 'jquery-datetimepicker');
-							prevText: '<i class="fa fa-chevron-left"></i>',
+										}
-							nextText: '<i class="fa fa-chevron-right"></i>',
+										datepickers.each(function() {
-							changeMonth: data.amsDatepickerChangeMonth,
+											var input = $(this);
-							changeYear: data.amsDatepickerChangeYear,
+											var data = input.data();
-							showButtonPanel: !data.amsDatepickerHidePanel
+											var data_options = {
-						};
+												lang: data.amsDatetimepickerLang || ams.lang,
-						var settings = $.extend({}, data_options, data.amsDatepickerOptions);
+												format: data.amsDatetimepickerFormat || 'd/m/y',
-						settings = ams.executeFunctionByName(data.amsDatepickerInitCallback, picker, settings) || settings;
+												datepicker: true,
-						var plugin = picker.datepicker(settings);
+												dayOfWeekStart: 1,
-						ams.executeFunctionByName(data.amsDatepickerAfterInitCallback, picker, plugin, settings);
+												timepicker: false
-					});
+											};
+											var settings = $.extend({}, data_options, data.amsDatetimepickerOptions);
+											settings = ams.executeFunctionByName(data.amsDatetimepickerInitCallback, input, settings) || settings;
+											var plugin = input.datetimepicker(settings);
+											ams.executeFunctionByName(data.amsDatetimepickerAfterInitCallback, input, plugin, settings);
+										});
+								   });
+				}
+			},
+			/**
+			 * JQuery datetime picker
+			 */
+			datetimepicker: function(element) {
+				var datetimepickers = $('.datetimepicker', element);
+				if (datetimepickers.length > 0) {
+					ams.ajax.check($.fn.datetimepicker,
+								   ams.baseURL + 'ext/jquery-datetimepicker' + (ams.devmode ? '.js': '.min.js'),
+								   function(first_load) {
+										if (first_load) {
+											ams.getCSS(ams.baseURL + '../css/ext/jquery-datetimepicker' + (ams.devmode ? '.css' : '.min.css'), 'jquery-datetimepicker');
+										}
+										datetimepickers.each(function() {
+											var input = $(this);
+											var data = input.data();
+											var data_options = {
+												lang: data.amsDatetimepickerLang || ams.lang,
+												format: data.amsDatetimepickerFormat || 'd/m/y H:i',
+												datepicker: true,
+												dayOfWeekStart: 1,
+												timepicker: true
+											};
+											var settings = $.extend({}, data_options, data.amsDatetimepickerOptions);
+											settings = ams.executeFunctionByName(data.amsDatetimepickerInitCallback, input, settings) || settings;
+											var plugin = input.datetimepicker(settings);
+											ams.executeFunctionByName(data.amsDatetimepickerAfterInitCallback, input, plugin, settings);
+										});
+								   });
+				}
+			},
+			/**
+			 * JQuery time picker
+			 */
+			timepicker: function(element) {
+				var timepickers = $('.timepicker', element);
+				if (timepickers.length > 0) {
+					ams.ajax.check($.fn.datetimepicker,
+								   ams.baseURL + 'ext/jquery-datetimepicker' + (ams.devmode ? '.js': '.min.js'),
+								   function(first_load) {
+										if (first_load) {
+											ams.getCSS(ams.baseURL + '../css/ext/jquery-datetimepicker' + (ams.devmode ? '.css' : '.min.css'), 'jquery-datetimepicker');
+										}
+										timepickers.each(function() {
+											var input = $(this);
+											var data = input.data();
+											var data_options = {
+												lang: data.amsDatetimepickerLang || ams.lang,
+												format: data.amsDatetimepickerFormat || 'H:i',
+												datepicker: false,
+												timepicker: true
+											};
+											var settings = $.extend({}, data_options, data.amsDatetimepickerOptions);
+											settings = ams.executeFunctionByName(data.amsDatetimepickerInitCallback, input, settings) || settings;
+											var plugin = input.datetimepicker(settings);
+											ams.executeFunctionByName(data.amsDatetimepickerAfterInitCallback, input, plugin, settings);
+										});
+								   });
 				}
 			},
 			/**
 			 * JQuery typeahead plug-in
 													$(element).closest('.form-group, label:not(:parents(.form-group))').removeClass('state-error');
 												},
 												errorElement: 'span',
 												errorClass: 'state-error',
 												errorPlacement: function(error, element) {
-													if (element.parent('label').length)
+													var label = element.parents('label:first');
-														error.insertAfter(element.parent());
+													if (label.length)
+														error.insertAfter(label);
 													else
 														error.insertAfter(element);
 												}
 											});
 											if (ams.plugins.i18n) {
 																	? function() {
 																		// JQuery-form plug-in must be loaded synchronously!!
 																		// Otherwise, hidden input fields created by jquery-validate plug-in
 																		// and matching named buttons will be deleted (on first form submit)
 																		// before JQuery-form plug-in can get them when submitting the form...
+																		$('.state-error', form).removeClass('state-error');
 																		ams.ajax.check($.fn.ajaxSubmit,
 																					   ams.baseURL + 'ext/jquery-form-3.49' + (ams.devmode ? '.js' : '.min.js'));
 																		return ams.form.submit(form);
 																	}
 																	: ams.getFunctionByName(data.amsFormSubmitHandler)
-															   : undefined
+															   : undefined,
+												invalidHandler: form.attr('data-async') !== undefined
+																? data.amsFormInvalidHandler === undefined
+																	? function(event, validator) {
+																		$('.state-error', form).removeClass('state-error');
+																		for (var index in validator.errorList) {
+																			var error = validator.errorList[index];
+																			var tab_index = $(error.element).parents('.tab-pane').index() + 1;
+																			if (tab_index > 0) {
+																				var nav_tabs = $('.nav-tabs', $(error.element).parents('.tabforms'));
+																				$('li:nth-child(' + tab_index + ')', nav_tabs)
+																						.removeClassPrefix('state-')
+																						.addClass('state-error');
+																				$('li.state-error:first a', nav_tabs).click();
+																			}
+																		}
+																	}
+																	: ams.getFunctionByName(data.amsFormInvalidHandler)
+																: undefined
 											};
 											var settings = $.extend({}, data_options, data.amsValidateOptions);
 											settings = ams.executeFunctionByName(data.amsValidateInitCallback, form, settings) || settings;
 											var plugin = form.validate(settings);
 											ams.executeFunctionByName(data.amsValidateAfterInitCallback, form, plugin, settings);
 											settings = ams.executeFunctionByName(data.amsDatatableInitCallback, table, settings) || settings;
 											var plugin = table.dataTable(settings);
 											ams.executeFunctionByName(data.amsDatatableAfterInitCallback, table, plugin, settings);
 											if (extensions.length > 0) {
 												for (index in extensions) {
-													switch(extensions[index]) {
+													switch (extensions[index]) {
 														case 'autofill':
 															var af_settings = $.extend({}, data.amsDatatableAutofillOptions, settings.autofill);
 															af_settings = ams.executeFunctionByName(data.amsDatatableAutofillInitCallback, table, af_settings) || af_settings;
 															table.data('ams-autofill', data.amsDatatableAutofillConstructor === undefined
 																						? new $.fn.dataTable.AutoFill(table, af_settings)
 								   });
 				}
 			},
 			/**
+			 * TableDND plug-in
+			 */
+			tablednd: function(element) {
+				var tables = $('.table-dnd', element);
+				if (tables.length > 0) {
+					ams.ajax.check($.fn.tableDnD,
+								   ams.baseURL + 'ext/jquery-tablednd' + (ams.devmode ? '.js' : '.min.js'),
+								   function(first_load) {
+										tables.each(function() {
+											var table = $(this);
+											$(table).on('mouseover', 'tr', function() {
+												$(this.cells[0]).addClass('drag-handle');
+											}).on('mouseout', 'tr', function() {
+												$(this.cells[0]).removeClass('drag-handle');
+											});
+											var data = table.data();
+											var data_options = {
+												onDragClass: data.amsTabledndDragClass || 'dragging-row',
+												onDragStart: data.amsTabledndDragStart,
+												dragHandle: data.amsTabledndDragHandle,
+												scrollAmount: data.amsTabledndScrollAmount,
+												onAllowDrop: data.amsTabledndAllowDrop,
+												onDrop: data.amsTabledndDrop || function(dnd_table, row) {
+													var target = data.amsTabledndDropTarget;
+													if (target) {
+														var rows = [];
+														$(dnd_table.rows).each(function() {
+															var row_id = $(this).data('ams-element-name');
+															if (row_id)
+																rows.push(row_id);
+														});
+														var local_target = ams.getFunctionByName(target);
+														if (typeof(local_target) == 'function') {
+															local_target.call(table, dnd_table, rows);
+														} else {
+															ams.ajax.post(target, {names: rows});
+														}
+													}
+												}
+											};
+											var settings = $.extend({}, data_options, data.amsTabledndOptions);
+											settings = ams.executeFunctionByName(data.amsTabledndInitCallback, table, settings) || settings;
+											var plugin = table.tableDnD(settings);
+											ams.executeFunctionByName(data.amsTabledndAfterInitCallback, table, plugin, settings);
+										});
+								   });
+				}
+			},
+			/**
+			 * FancyBox plug-in
+			 */
+			fancybox: function(element) {
+				var fancyboxes = $('.fancybox', element);
+				if (fancyboxes.length > 0) {
+					ams.ajax.check($.fn.fancybox,
+								   ams.baseURL + 'ext/jquery-fancybox-2.1.5' + (ams.devmode ? '.js' : '.min.js'),
+								   function(first_load) {
+										if (first_load)
+											ams.getCSS(ams.baseURL + '../css/ext/jquery-fancybox-2.1.5' + (ams.devmode ? '.css' : '.min.css'));
+										fancyboxes.each(function() {
+											var fancybox = $(this);
+											var data = fancybox.data();
+											var helpers = (data.amsFancyboxHelpers || '').split(/\s+/);
+											if (helpers.length > 0) {
+												for (var index in helpers) {
+													var helper = helpers[index];
+													switch (helper) {
+														case 'buttons':
+															ams.ajax.check($.fancybox.helpers.buttons,
+																		   ams.baseURL + 'ext/fancybox-helpers/fancybox-buttons.js' + (ams.devmode ? '.js' : '.min.js'));
+															break;
+														case 'thumbs':
+															ams.ajax.check($.fancybox.helpers.thumbs,
+																		   ams.baseURL + 'ext/fancybox-helpers/fancybox-thumbs.js' + (ams.devmode ? '.js' : '.min.js'));
+															break;
+														case 'media':
+															ams.ajax.check($.fancybox.helpers.media,
+																		   ams.baseURL + 'ext/fancybox-helpers/fancybox-media.js' + (ams.devmode ? '.js' : '.min.js'));
+															break;
+														default:
+															break;
+													}
+												}
+											}
+											var data_options = {
+												type: data.amsFancyboxType,
+												padding: data.amsFancyboxPadding || 10,
+												margin: data.amsFancyboxMargin || 10,
+												beforeLoad: ams.getFunctionByName(data.amsFancyboxBeforeLoad) || function() {
+													this.title = ams.executeFunctionByName(data.amsFancyboxTitleGetter, this) || $(this.element).attr('original-title') || $(this.element).attr('title');
+												},
+												helpers: {
+													title: {
+														type: 'inside'
+													}
+												}
+											};
+											var settings = $.extend({}, data_options, data.amsFancyboxOptions);
+											settings = ams.executeFunctionByName(data.amsFancyboxInitCallback, fancybox, settings) || settings;
+											var plugin = fancybox.fancybox(settings);
+											ams.executeFunctionByName(data.amsFancyboxAfterInitCallback, fancybox, plugin, settings);
+										});
+								   });
+				}
+			},
+			/**
+			 * Image area select plug-in
+			 */
+			imgareaselect: function(element) {
+				var images = $('.imgareaselect', element);
+				if (images.length > 0) {
+					ams.ajax.check($.fn.imgAreaSelect,
+								   ams.baseURL + 'ext/jquery-imgareaselect-0.9.10' + (ams.devmode ? '.js' : '.min.js'),
+								   function(first_load) {
+										if (first_load)
+											ams.getCSS(ams.baseURL + '../css/ext/jquery-imgareaselect' + (ams.devmode ? '.css' : '.min.css'));
+										images.each(function() {
+											var image = $(this);
+											var data = image.data();
+											var parent = data.amsImgareaselectParent ? image.parents(data.amsImgareaselectParent) : 'body';
+											var data_options = {
+												instance: true,
+												handles: true,
+												parent: parent,
+												x1: data.amsImgareaselectX1 || 0,
+												y1: data.amsImgareaselectY1 || 0,
+												x2: data.amsImgareaselectX2 || data.amsImgareaselectImageWidth,
+												y2: data.amsImgareaselectY2 || data.amsImgareaselectImageHeight,
+												imageWidth: data.amsImgareaselectImageWidth,
+												imageHeight: data.amsImgareaselectImageHeight,
+												minWidth: 128,
+												minHeight: 128,
+												aspectRatio: data.amsImgareaselectRatio,
+												onSelectEnd: ams.getFunctionByName(data.amsImgareaselectSelectEnd) || function(img, selection) {
+													var target = data.amsImgareaselectTargetField || 'image_';
+													$('input[name="' + target + 'x1"]', parent).val(selection.x1);
+													$('input[name="' + target + 'y1"]', parent).val(selection.y1);
+													$('input[name="' + target + 'x2"]', parent).val(selection.x2);
+													$('input[name="' + target + 'y2"]', parent).val(selection.y2);
+												}
+											};
+											var settings = $.extend({}, data_options, data.amsImgareaselectOptions);
+											settings = ams.executeFunctionByName(data.amsImgareaselectInitCallback, image, settings) || settings;
+											var plugin = image.imgAreaSelect(settings);
+											ams.executeFunctionByName(data.amsImgareaselectAfterInitCallback, image, plugin, settings);
+											// Add update timeout when plug-in is displayed into a modal dialog
+											setTimeout(function() {
+												plugin.update();
+											}, 250);
+										});
+								   })
+				}
+			},
+			/**
 			 * Sparkline graphs
 			 */
 			graphs: function(element) {
 				var graphs = $('.sparkline', element);
 				if (graphs.length > 0) {
 			var settings = $.extend({}, data_options, {
 				title: data.amsMessageboxTitle || data_options.title || '',
 				content: data.amsMessageboxContent || data_options.content || '',
 				icon: data.amsMessageboxIcon || data_options.icon,
 				number: data.amsMessageboxNumber || data_options.number,
-				timeout: data.amsMessageboxTimeout || data_options.icon
+				timeout: data.amsMessageboxTimeout || data_options.timeout
 			});
 			var status = data.amsMessageboxStatus || data_options.status || 'info';
 			var callback = ams.getFunctionByName(data.amsMessageboxCallback || data_options.callback);
 			ams.skin.messageBox(status, settings, callback);
 		},
 			var settings = $.extend({}, data_options, {
 				title: data.amsSmallboxTitle || data_options.title || '',
 				content: data.amsSmallboxContent || data_options.content || '',
 				icon: data.amsSmallboxIcon || data_options.icon,
 				iconSmall: data.amsSmallboxIconSmall || data_options.iconSmall,
-				timeout: data.amsSmallboxTimeout || data_options.icon
+				timeout: data.amsSmallboxTimeout || data_options.timeout
 			});
 			var status = data.amsSmallboxStatus || data_options.status || 'info';
 			var callback = ams.getFunctionByName(data.amsSmallboxCallback || data_options.callback);
 			ams.skin.smallBox(status, settings, callback);
 		}
 				var handlers = element.data('ams-events-handlers');
 				for (var event in handlers) {
 					element.on(event, ams.getFunctionByName(handlers[event]));
 				}
 			});
+		}
+	};
+	/**
+	 * Container management
+	 */
+	MyAMS.container = {
+		/**
+		 * Change container elements order
+		 *
+		 * This is a callback which may be used with TableDnD plug-in which allows you to
+		 * change order of table rows.
+		 * Rows order is stored in an hidden input which is defined in table's data attribute
+		 * called 'data-ams-input-name'
+		 */
+		changeOrder: function(table, names) {
+			var input = $('input[name="' + $(this).data('ams-input-name') + '"]', $(this));
+			input.val(names.join(';'));
+		},
+		/**
+		 * Delete an element from a container table
+		 *
+		 * @param element
+		 * @returns {Function}
+		 */
+		deleteElement: function(element) {
+			return function() {
+				var link = $(this);
+				MyAMS.skin.bigBox({
+					title: MyAMS.i18n.WARNING,
+					content: '<i class="text-danger fa fa-2x fa-bell shake animated"></i>&nbsp; ' + MyAMS.i18n.DELETE_WARNING,
+					buttons: MyAMS.i18n.BTN_OK_CANCEL
+				}, function(button) {
+					if (button == MyAMS.i18n.BTN_OK) {
+						var table = link.parents('table');
+						var location = table.data('ams-location');
+						var tr = link.parents('tr');
+						var delete_target = tr.data('ams-delete-target') || table.data('ams-delete-target') || 'delete-element.json';
+						var object_name = tr.data('ams-element-name');
+						MyAMS.ajax.post(location + '/' + delete_target, {'object_name': object_name}, function(result, status) {
+							if (result.status == 'success') {
+								if (table.hasClass('datatable')) {
+									table.dataTable().fnDeleteRow(tr[0]);
+								} else {
+									tr.remove();
+								}
+							}
+						});
+					}
+				});
+			}
 		}
 	};
 	/**
 	 * Main page initialization
 	 * This code is called only once to register global events and callbacks
 	 */
 	MyAMS.initPage = function() {
+		var body = $('body');
 		/* Init main components */
-		ams.root = $('BODY');
+		ams.root = body;
 		ams.left_panel = $('#left-panel');
 		ams.shortcuts = $('#shortcut');
+		ams.plugins.initData(body);
 		// Init main AJAX events
 		var jquery_xhr = $.ajaxSettings.xhr;
 		$.ajaxSetup({
 			progress: ams.ajax.progress,
 			}
 		}
 		// Hide menu button
 		$('#hide-menu >:first-child > A').click(function(e) {
-			$('BODY').toggleClass("hidden-menu");
+			body.toggleClass("hidden-menu");
 			e.preventDefault();
 		});
 		// Switch shortcuts
 		$('#show-shortcut').click(function(e) {
 			});
 			e.preventDefault();
 		});
 		// Check active pop-overs
-		$('BODY').on('click', function(e) {
+		body.on('click', function(e) {
 			var element = $(this);
 			if (!element.is(e.target) &&
 				element.has(e.target).length === 0 &&
 				$('.popover').has(e.target).length === 0)
 				element.popover('hide');
 				e.preventDefault();
 				var href_getter = ams.getFunctionByName(href);
 				if (typeof(href_getter) == 'function') {
 					href = href_getter.call(link);
 				}
-				var target = link.data('ams-target');
+				if (typeof(href) == 'function') {
-				if (target) {
+					// Javascript function call
-					ams.form.confirmChangedForm(target, function() {
+					e.stopPropagation();
-						ams.skin.loadURL(href, target, link.data('ams-link-options'), link.data('ams-link-callback'));
+					href.call(link);
-					});
 				} else {
-					ams.form.confirmChangedForm(function() {
+					// Standard AJAX or browser URL call
-						if (href.startsWith('#')) {
+					// Convert %23 chars to #
-							if (href != location.hash) {
+					href = href.replace(/\%23/, '#');
-								if (ams.root.hasClass('mobile-view-activated')) {
+					var target = link.data('ams-target');
-									ams.root.removeClass('hidden-menu');
+					if (target) {
-									window.setTimeout(function () {
+						ams.form.confirmChangedForm(target, function () {
+							ams.skin.loadURL(href, target, link.data('ams-link-options'), link.data('ams-link-callback'));
+							e.stopPropagation();
+						});
+					} else {
+						ams.form.confirmChangedForm(function () {
+							if (href.startsWith('#')) {
+								if (href != location.hash) {
+									if (ams.root.hasClass('mobile-view-activated')) {
+										ams.root.removeClass('hidden-menu');
+										window.setTimeout(function () {
+											window.location.hash = href;
+										}, 150);
+									} else
 										window.location.hash = href;
-									}, 150);
+								}
-								} else
+							} else
-									window.location.hash = href;
+								window.location = href;
-							}
+						});
-						} else
+					}
-							window.location = href;
-					});
 				}
 			});
 			$(document).on('click', 'a[target="_blank"]', function(e) {
 				e.preventDefault();
 				window.open($(e.currentTarget).attr('href'));
 		}
 		// Initialize modal dialogs links
 		$(document).off('click.modal')
 				   .on('click', '[data-toggle="modal"]', function(e) {
+			var source = $(this);
+			if (source.data('ams-stop-propagation') === true)
+				e.stopPropagation();
 			e.preventDefault();
-			var source = $(this);
 			ams.dialog.open(source);
 			if (source.parents('#shortcut').exists())
 				setTimeout(ams.skin._hideShortcutButtons, 300);
 		});
 		$(document).on('shown.bs.modal', ams.dialog.shown);
 		// Initialize custom click handlers
 		$(document).on('click', '[data-ams-click-handler]', function(e) {
 			var source = $(this);
 			var data = source.data();
 			if (data.amsClickHandler) {
-				if (data.amsClickStopPropagation === true)
+				if ((data.amsStopPropagation === true) || (data.amsClickStopPropagation === true))
 					e.stopPropagation();
 				if (data.amsClickKeepDefault !== true)
 					e.preventDefault();
 				var callback = ams.getFunctionByName(data.amsClickHandler);
 				if (callback !== undefined)
 		CLEAR_STORAGE_TITLE: "Clear Local Storage",
 		CLEAR_STORAGE_CONTENT: "Would you like to RESET all your saved widgets and clear LocalStorage?",
 		BTN_OK: "OK",
 		BTN_CANCEL: "Cancel",
+		BTN_OK_CANCEL: "[OK][Cancel]",
 		BTN_YES: "Yes",
 		BTN_NO: "No",
-		BTN_OK_CANCEL: "[OK][Cancel]",
+		BTN_YES_NO: "[Yes][No]",
 		FORM_CHANGED_WARNING: "Some changes were not saved. These updates will be lost if you leave this page.",
+		DELETE_WARNING: "This change can't be undone. Are you sure that you want to delete this element?",
 		NO_UPDATE: "No changes were applied.",
 		DATA_UPDATED: "Data successfully updated.",
 		HOME: "Home",
 		LOGOUT: "Logout?",
 		LOGOUT_COMMENT: "You can improve your security further after logging out by closing this opened browser",
 		SELECT2_PLURAL: 's',
+		SELECT2_MATCH: "One result is available, press enter to select it.",
+		SELECT2_MATCHES: " results are available, use up and down arrow keys to navigate.",
 		SELECT2_NOMATCHES: "No matches found",
 		SELECT2_SEARCHING: "Searching...",
 		SELECT2_LOADMORE: "Loading more results...",
 		SELECT2_INPUT_TOOSHORT: "Please enter {0} more character{1}",
 		SELECT2_INPUT_TOOLONG: "Please delete {0} character{1}",

ztfy/ztfy.myams