@osimatic/helpers-js 1.5.3 → 1.5.4

package/details_sub_array.js

@@ -13,66 +13,73 @@ class DetailsSubArray {
 		} = options;
 
 		function getNbColumns(tr) {
-			return tr.closest('table').find('thead tr').children().length;
+			return tr.closest('table').querySelector('thead tr').children.length;
 		}
 		function displayErrorRow(tr) {
-			tr.after($('<tr class="text-error"><td colspan="'+getNbColumns(tr)+'">'+labelErrorOccurred+'</td></tr>'));
+			tr.insertAdjacentHTML('afterend', '<tr class="text-error"><td colspan="'+getNbColumns(tr)+'">'+labelErrorOccurred+'</td></tr>');
 		}
 		function displayDetailsRow(tr, content) {
-			var trContent = $(''
-				+ '<tr class="participants">'
-				+ '<td colspan="'+getNbColumns(tr)+'">'
-				+ '</td>'
-				+ '</tr>'
-			);
-			trContent.find('td').append(content);
-			tr.after(trContent);
+			const td = document.createElement('td');
+			td.setAttribute('colspan', getNbColumns(tr));
+			if (content instanceof Node) {
+				td.appendChild(content);
+			} else {
+				td.innerHTML = content || '';
+			}
+			const trContent = document.createElement('tr');
+			trContent.className = 'participants';
+			trContent.appendChild(td);
+			tr.insertAdjacentElement('afterend', trContent);
 		}
 
 		function hideDetailsRow(link) {
-			var tr = link.closest('tr').addClass('folded');
-			if (tr.next().hasClass('participants') ) {
-				tr.next().remove();
+			const tr = link.closest('tr');
+			tr.classList.add('folded');
+			const next = tr.nextElementSibling;
+			if (next && next.classList.contains('participants')) {
+				next.remove();
 			}
 			showPlusButton(link);
 		}
 
 		function showPlusButton(link) {
-			link.prop('title', showDetailsLabel).attr('disabled', false).html($('<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>'));
+			link.title = showDetailsLabel;
+			link.disabled = false;
+			link.innerHTML = '<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>';
 		}
 		function showMinusButton(link) {
-			link.prop('title', hideDetailsLabel).attr('disabled', false).html($('<span class="glyphicon glyphicon-minus" aria-hidden="true"></span>'));
+			link.title = hideDetailsLabel;
+			link.disabled = false;
+			link.innerHTML = '<span class="glyphicon glyphicon-minus" aria-hidden="true"></span>';
 		}
 
 		function displayLoading(link) {
-			link.attr('disabled', true).html($('<i class="fa fa-circle-notch fa-spin"></i>'));
-			var tr = link.closest('tr');
-			tr.after($('<tr class="waiting_icon"><td colspan="'+getNbColumns(tr)+'" class="center"><i class="fa fa-circle-notch fa-spin"></i></td></tr>'));
+			link.disabled = true;
+			link.innerHTML = '<i class="fa fa-circle-notch fa-spin"></i>';
+			const tr = link.closest('tr');
+			tr.insertAdjacentHTML('afterend', '<tr class="waiting_icon"><td colspan="'+getNbColumns(tr)+'" class="center"><i class="fa fa-circle-notch fa-spin"></i></td></tr>');
 		}
-		function hideLoading(link) {
+		function hideLoading() {
 			// todo : cacher que le loader du lien au lieu de tous les loaders (cas ou l'user clique sur tous les boutons rapidement)
-			if ($('tr.waiting_icon').length > 0) {
-				$(('tr.waiting_icon')).remove();
-			}
+			document.querySelectorAll('tr.waiting_icon').forEach(el => el.remove());
 		}
 
 		function setHideDetailsLink(link) {
 			showMinusButton(link);
-			link.click(function() {
-				$(this).stop();
+			link.onclick = function(e) {
+				e.preventDefault();
 				hideDetailsRow(link);
 				setDisplayDetailsLink(link);
-				return false;
-			});
+			};
 		}
 
 		function setDisplayDetailsLink(link) {
-			link.click(function() {
-				$(this).stop().off('click');
+			link.onclick = function(e) {
+				e.preventDefault();
+				link.onclick = null;
 				hideDetailsRow(link);
 				doDetailsActionRequest(link);
-				return false;
-			});
+			};
 		}
 
 		function doDetailsActionRequest(link) {
@@ -80,19 +87,17 @@ class DetailsSubArray {
 
 			if (onBeforeSend != null) {
 				displayDetailsRow(link.closest('tr'), onBeforeSend(link));
-				hideLoading(link);
+				hideLoading();
 				setHideDetailsLink(link);
 				return;
 			}
 
 			function onComplete() {
-				hideLoading(link);
+				hideLoading();
 				setHideDetailsLink(link);
-				//link.attr('disabled', false).button('reset');
 			}
 
-			//link.attr('disabled', true).button('loading');
-			HTTPClient.request('GET', link.data('url_details'), null,
+			HTTPClient.request('GET', link.dataset.url_details, null,
 				(jsonObj) => {
 					if (jsonObj == null) {
 						if (onError != null) {
@@ -115,18 +120,17 @@ class DetailsSubArray {
 						return;
 					}
 
-					link.closest('tr').after($('<tr class="error"><td colspan="6" class="center">'+(labelErrorOccurred ??'Une erreur s’est produite.')+'</td></tr>'));
+					link.closest('tr').insertAdjacentHTML('afterend', '<tr class="error"><td colspan="6" class="center">'+(labelErrorOccurred ?? 'Une erreur s\'est produite.')+'</td></tr>');
 
 					onComplete();
-					//window.location.replace(decodeURIComponent(urlRetour));
 				}
 			);
 		}
 
-		table.find('a.details_link').each(function(idx, link) {
-			$(link).removeClass('hide');
-			setDisplayDetailsLink($(link));
-			showPlusButton($(link));
+		table.querySelectorAll('a.details_link').forEach((link) => {
+			link.classList.remove('hide');
+			setDisplayDetailsLink(link);
+			showPlusButton(link);
 		});
 	}