Definitions v1

scripts/catc.js

@@ -55,8 +55,50 @@ function CATC(asGlobals)
 	
 	this.initMenu = function()
 	{
-		self.elem.$Menu.find('.fa-home').attr('href', '#'+self.consts.default_page);
-		self.elem.$Menu.show('fast');
+		//Search
+		self.refreshDefs();
+		self.elem.$Menu.find('#search').addSearch('defs');
+		$('#add-def').on('show.bs.modal', function (event) {
+			var $Button = $(event.relatedTarget);
+			var iDefId = $Button.data('id');
+			var $Modal = $(this);
+			
+			var asDef = iDefId?self.vars(['lov-defs', iDefId]):{'title':'', 'description':''};
+			$Modal.find('#add_def_title').text(iDefId?'Update a definition':'Add a new definition');
+			$Modal.find('#def_id').val(iDefId);
+			$Modal.find('#def_title').val(asDef.title);
+			$Modal.find('#def_description').val(asDef.description);
+			
+			var asParams = Tools.serialize('def_form');
+			$Modal.find('#save').off('click').click(function(){
+				Tools.ajax(
+					'set_def',
+					function(asData){
+						self.onFeedback('success', 'Definition of "'+asData.def.title+'" '+(asData.new_def?'added':'updated'));
+						self.refreshDefs();
+					},
+					'def_form'
+				);
+			});
+		});
+		
+		self.elem.$Menu.find('.home').click(function(){self.setHash(self.consts.default_page);});
+		self.elem.$Menu.find('.logoff').click(function(){self.setHash('logoff');});
+		self.elem.$Menu.slideDown('fast');
+	};
+	
+	this.refreshDefs = function() {
+		Tools.ajax(
+			'get_defs',
+			(asData) => {
+				self.vars('lov-defs', asData);
+				$.each(self.vars('lov-defs'), function(iKey, asValues) {
+					self.vars(['lov-defs', iKey, 'safe_title'], removeDiacritics(asValues['title']));
+					self.vars(['lov-defs', iKey, 'label'], asValues['description']);
+					self.vars(['lov-defs', iKey, 'safe_label'], removeDiacritics(asValues['description']));
+				});
+			}
+		);
 	};
 	
 	this.setSideElemVisibility =  function() {
@@ -236,9 +278,12 @@ function CATC(asGlobals)
 		//Switch main content
 		$FadeInElem.empty();
 		$FadeInElem.html($Dom);
-
+		
 		//Show main
-		$FadeInElem.fadeTo('fast', 1, function(){self.pageInit(asHash, bFirstPage);});
+		$FadeInElem.fadeTo('fast', 1, function(){
+			self.pageInit(asHash, bFirstPage);
+			$('[data-toggle="tooltip"]').tooltip();
+		});
 	};
 	
 	/* Variables Handling */
@@ -277,7 +322,7 @@ function CATC(asGlobals)
 	};
 	
 	this.getTemplateItem = function(sItemName) {
-		return self.elem.$Main.find('.template-items').find('.'+sItemName).clone();
+		return $('.template-items').find('.'+sItemName).clone();
 	}
 }
 

scripts/common.js

@@ -168,6 +168,85 @@ function copyArray(asArray)
 	return asArray.slice(0); //trick to copy array
 }
 
+$.prototype.addSearch = function(sSection)
+{
+	$(this)
+		.autocomplete({
+			autoFocus: true,
+			delay: 0,
+			section:sSection,
+			source: function(oRequest, fResponse) {
+				var sTerm = removeDiacritics(oRequest.term);
+				var rMatcher = new RegExp($.ui.autocomplete.escapeRegex(sTerm), 'i');
+				var asResults = [];
+				
+				var asData = self.vars('lov-'+this.options.section);
+				$.each(asData, function(iDefId, oItem) {
+					var oTitleMatch = oItem.safe_title.match(rMatcher);
+					var oLabelMatch = oItem.safe_label.match(rMatcher);
+					if(oTitleMatch) {
+						oItem.index = parseInt(oTitleMatch.index, 10);
+						oItem.size = oTitleMatch[0].length;
+						oItem.field = 'title';
+						asResults.push(oItem);
+					}
+					else if(oLabelMatch) {
+						oItem.index = parseInt(oLabelMatch.index, 10);
+						oItem.size = oLabelMatch[0].length;
+						oItem.field = 'label';
+						asResults.push(oItem);
+					}
+					oItem.id = iDefId;
+				});
+				
+				$('#add_def')
+					.toggleClass('btn-outline-primary', (asResults.length > 0))
+					.toggleClass('btn-primary', (asResults.length == 0));
+				
+				fResponse(asResults);
+		    }
+		}
+	)
+	.data("ui-autocomplete")._renderItem = function(ul, item) {
+		
+		var fGetHighLightedContent = function(sContent, iIndex, iSize){
+			return $('<span>')
+				.append(sContent.substr(0, iIndex))
+				.append($('<span>', {'class':'highlight text-secondary'}).text(sContent.substr(iIndex, iSize)))
+				.append(sContent.substr(iIndex + iSize));
+		};
+		var $Title = $('<div>', {'class':'title text-break text-capitalize font-weight-bold text-primary'});
+		var $Desc = $('<div>', {'class':'desc text-break'});
+		
+		if(item.field=='title') {
+			$Title.append(fGetHighLightedContent(item.title, item.index, item.size));
+			$Desc.text(item.label);
+		}
+		else {
+			$Title.text(item.title);
+			$Desc.append(fGetHighLightedContent(item.label, item.index, item.size));
+		}
+		return $('<li>', {'class':'list-group-item shadow'})
+			.css('width', $('#search').outerWidth())
+			.data("item.autocomplete", item)
+			.append($('<div>', {'class':'row'})
+				.append($('<div>', {'class':'col'})
+					.append($Title)
+					.append($Desc)
+				)
+				.append($('<div>', {'class':'col-auto d-flex align-items-center'}).append($('<button>', {'class':'btn btn-outline-secondary'})
+						.data('id', item.id)
+						.attr('data-toggle', 'modal')
+						.attr('data-target', '#add-def')
+						.appendIcon('edit')
+				))
+			)
+			.appendTo(ul);
+	};
+	
+	$($(this).data("ui-autocomplete").classesElementLookup['ui-front']).addClass('list-group');
+}
+
 $.prototype.appendIcon = function(sIcon, bFull) {
 	return $(this).append(Tools.getIcon(sIcon, bFull));
 };