@osimatic/helpers-js 1.5.24 → 1.5.26

package/chartjs.js

@@ -42,7 +42,12 @@ class Chartjs {
 
 	static createStackedChart(chartDiv, chartData, title=null, options={}) {
 		Chartjs.init();
+
 		chartDiv = toEl(chartDiv);
+		if (!chartDiv) {
+			return;
+		}
+
 		chartDiv.innerHTML = '';
 		new Chart(chartDiv.getContext("2d"), deepmerge({
 			type: "bar",
@@ -93,7 +98,12 @@ class Chartjs {
 
 	static createBarChart(chartDiv, chartData, title=null, options={}) {
 		Chartjs.init();
+
 		chartDiv = toEl(chartDiv);
+		if (!chartDiv) {
+			return;
+		}
+
 		chartDiv.innerHTML = '';
 		new Chart(chartDiv.getContext("2d"), deepmerge({
 			type: "bar",
@@ -151,6 +161,10 @@ class Chartjs {
 		Chartjs.init();
 
 		chartDiv = toEl(chartDiv);
+		if (!chartDiv) {
+			return;
+		}
+
 		chartDiv.innerHTML = '';
 		new Chart(chartDiv.getContext("2d"), deepmerge({
 			type: "line",
@@ -204,6 +218,10 @@ class Chartjs {
 		Chartjs.init();
 
 		chartDiv = toEl(chartDiv);
+		if (!chartDiv) {
+			return;
+		}
+
 		chartDiv.innerHTML = '';
 		new Chart(chartDiv.getContext("2d"), deepmerge({
 			type: "doughnut",

package/count_down.js

@@ -4,16 +4,16 @@ class CountDown {
 
 	static init(div, options = {}) {
 		div = toEl(div);
+		if (!div) {
+			return;
+		}
+
 		const {
 			onRefreshData,
 			labelNextUpdate = 'Prochaine mise à jour',
 			labelDoUpdate = 'Mettre à jour',
 		} = options;
 
-		if (!div) {
-			return;
-		}
-
 		div.insertAdjacentHTML('beforeend', '<div class="count_down_title">'+labelNextUpdate+'</div>');
 		div.insertAdjacentHTML('beforeend', '<div class="count_down_progress"><div class="count_down_current"></div></div>');
 		div.insertAdjacentHTML('beforeend', '<div class="count_down_text"></div>');

package/details_sub_array.js

@@ -5,6 +5,10 @@ class DetailsSubArray {
 
 	static initDetailsLink(table, options = {}) {
 		table = toEl(table);
+		if (!table) {
+			return;
+		}
+
 		const {
 			onSuccess,
 			onError,

package/file.js

@@ -105,6 +105,10 @@ class Img {
 
 	static initImg(div) {
 		div = toEl(div);
+		if (!div) {
+			return;
+		}
+
 		div.querySelectorAll('.asynchronously_img').forEach(img => {
 			Img.loadImgUrl(img.dataset.url, img);
 		});

package/form_date.js

@@ -6,6 +6,10 @@ class InputPeriod {
 
 	static addLinks(form) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
 		const input = form.querySelector('input[type="date"][data-add_period_select_links]');
 		if (!input) {
 			return;
@@ -29,6 +33,9 @@ class InputPeriod {
 
 	static init(form) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
 		//console.log(form.querySelector('a.period_select_current_week'));
 
 		const linkToday = form.querySelector('a.period_select_today');
@@ -144,6 +151,9 @@ class FormDate {
 
 	static fillYearSelect(select, nbYearsBefore=5, nbYearsAfter=0) {
 		select = toEl(select);
+		if (!select) {
+			return;
+		}
 		const currentDate = new Date();
 		for (let year=currentDate.getUTCFullYear()-nbYearsBefore; year<=(currentDate.getUTCFullYear()+nbYearsAfter); year++) {
 			select.insertAdjacentHTML('beforeend', '<option value="'+year+'">'+year+'</option>');
@@ -152,6 +162,9 @@ class FormDate {
 
 	static fillMonthSelect(select, locale) {
 		select = toEl(select);
+		if (!select) {
+			return;
+		}
 		for (let month=1; month<=12; month++) {
 			select.insertAdjacentHTML('beforeend', '<option value="'+month+'">'+DateTime.getMonthNameByMonth(month, locale).capitalize()+'</option>');
 		}
@@ -159,6 +172,9 @@ class FormDate {
 
 	static fillDayOfWeekSelect(select, locale) {
 		select = toEl(select);
+		if (!select) {
+			return;
+		}
 		for (let dayOfWeek=1; dayOfWeek<=7; dayOfWeek++) {
 			select.insertAdjacentHTML('beforeend', '<option value="'+dayOfWeek+'">'+DateTime.getDayNameByDayOfWeek(dayOfWeek, locale).capitalize()+'</option>');
 		}
@@ -166,6 +182,9 @@ class FormDate {
 
 	static initForm(form) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
 
 		function fillPeriodSelect(select) {
 			Object.entries(FormDate.getPeriodList()).forEach(([idx, tabListPeriode]) => {

package/form_helper.js

@@ -3,9 +3,16 @@ const { toEl, toJquery } = require('./util');
 class FormHelper {
 	static init(form, onSubmitCallback, submitButton=null) {
 		const wasJQuery = form && form.jquery;
-		form = toEl(form); submitButton = toEl(submitButton);
+		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
 		FormHelper.reset(form, submitButton);
-		submitButton = null != submitButton ? submitButton : form.querySelector('button[name="validate"]');
+		submitButton = null != submitButton ? toEl(submitButton) : form.querySelector('button[name="validate"]');
+		if (!submitButton) {
+			return wasJQuery ? toJquery(form) : form;
+		}
 		submitButton.onclick = function(e) {
 			e.preventDefault();
 			FormHelper.buttonLoader(this, 'loading');
@@ -19,8 +26,12 @@ class FormHelper {
 
 	static reset(form, submitButton=null) {
 		const wasJQuery = form && form.jquery;
-		form = toEl(form); submitButton = toEl(submitButton);
-		submitButton = null != submitButton ? submitButton : form.querySelector('button[name="validate"]');
+		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
+		submitButton = null != submitButton ? toEl(submitButton) : form.querySelector('button[name="validate"]');
 		form.querySelectorAll('input[name]:not([type="checkbox"]):not([type="radio"]), select:not(.selectpicker), textarea').forEach(el => {
 			el.value = '';
 			el.onchange = null;
@@ -33,6 +44,10 @@ class FormHelper {
 
 	static populateForm(form, data) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
 		const employeesDisplayType = form.querySelector('[name="employees_display_type"][value="NONE"]');
 		if (employeesDisplayType) employeesDisplayType.checked = true; //todo à retirer
 
@@ -72,12 +87,15 @@ class FormHelper {
 
 	static getFormData(form) {
 		form = toEl(form);
+		if (!form) {
+			return null;
+		}
 		return new FormData(form);
 	}
 
 	static getDataFromFormData(formData) {
 		let data = {};
-		for(let pair of formData.entries()) {
+		for (let pair of formData.entries()) {
 			//console.log(pair[0]+ ', '+ pair[1]);
 			data[pair[0]] = pair[1];
 		}
@@ -86,6 +104,9 @@ class FormHelper {
 
 	static getFormDataQueryString(form) {
 		form = toEl(form);
+		if (!form) {
+			return null;
+		}
 		return new URLSearchParams(new FormData(form)).toString();
 	}
 
@@ -97,7 +118,7 @@ class FormHelper {
 
 	static getInputValue(input) {
 		input = toEl(input);
-		if (typeof input == 'undefined' || input == null) {
+		if (!input) {
 			return null;
 		}
 		let value = input.value;
@@ -109,11 +130,18 @@ class FormHelper {
 
 	static getLinesOfTextarea(textarea) {
 		textarea = toEl(textarea);
+		if (!textarea) {
+			return null;
+		}
 		return textarea.value.replace(/(\r\n|\n|\r)/g, "\n").split("\n").filter(word => word.length > 0);
 	}
 
 	static setOnInputChange(input, callback, doneTypingInterval=700) {
 		input = toEl(input);
+		if (!input) {
+			return null;
+		}
+
 		// setup before functions
 		let typingTimer;  // timer identifier
 
@@ -141,6 +169,10 @@ class FormHelper {
 
 	static resetSelectOption(form, selectName) {
 		form = toEl(form);
+		if (!form) {
+			return null;
+		}
+
 		form.querySelectorAll('select[name="'+selectName+'"] option').forEach(o => {
 			o.disabled = false;
 			o.selected = false;
@@ -148,24 +180,48 @@ class FormHelper {
 	}
 	static setSelectedSelectOption(form, selectName, optionValue) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
 		const opt = form.querySelector('select[name="'+selectName+'"] option[value="'+optionValue+'"]');
-		if (opt) opt.selected = true;
+		if (opt) {
+			opt.selected = true;
+		}
 	}
 	static setSelectedSelectOptions(form, selectName, optionValues) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
 		optionValues.forEach(id => FormHelper.setSelectedSelectOption(form, selectName, id));
 	}
 	static disableSelectOption(form, selectName, optionValue) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
 		const opt = form.querySelector('select[name="'+selectName+'"] option[value="'+optionValue+'"]');
-		if (opt) opt.disabled = true;
+		if (opt) {
+			opt.disabled = true;
+		}
 	}
 	static disableSelectOptions(form, selectName, optionValues) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
+
 		optionValues.forEach(id => FormHelper.disableSelectOption(form, selectName, id));
 	}
 	static countSelectOptions(form, selectName) {
 		form = toEl(form);
+		if (!form) {
+			return null;
+		}
+
 		return form.querySelectorAll('select[name="'+selectName+'"] option:not([disabled])').length;
 	}
 
@@ -199,6 +255,9 @@ class FormHelper {
 
 	static initTypeFields(form) {
 		form = toEl(form);
+		if (!form) {
+			return;
+		}
 
 		// Show/Hide password
 		form.querySelectorAll('input[type="password"]').forEach(inputEl => {
@@ -223,6 +282,9 @@ class FormHelper {
 
 	static hideField(inputOrSelect) {
 		inputOrSelect = toEl(inputOrSelect);
+		if (!inputOrSelect) {
+			return;
+		}
 		inputOrSelect.closest('.form-group')?.classList.add('hide');
 	}
 
@@ -281,6 +343,9 @@ class FormHelper {
 	static hideFormErrors(form) {
 		const wasJQuery = form && form.jquery;
 		form = toEl(form);
+		if (!form) {
+			return null;
+		}
 		form.querySelectorAll('div.form_errors').forEach(el => el.remove());
 		return wasJQuery ? toJquery(form) : form;
 	}
@@ -315,6 +380,10 @@ class FormHelper {
 
 	static displayFormErrorsFromText(form, errorLabels, errorWrapperDiv=null) {
 		form = toEl(form); errorWrapperDiv = toEl(errorWrapperDiv);
+		if (!form) {
+			return;
+		}
+
 		let errorDiv = '<div class="alert alert-danger form_errors">'+errorLabels+'</div>';
 
 		if (null != errorWrapperDiv) {
@@ -356,6 +425,10 @@ class FormHelper {
 	static buttonLoader(button, action) {
 		const wasJQuery = button && button.jquery;
 		button = toEl(button);
+		if (!button) {
+			return null;
+		}
+
 		if (action === 'start' || action === 'loading') {
 			if (button.disabled) {
 				return wasJQuery ? toJquery(button) : button;
@@ -405,6 +478,9 @@ class ArrayField {
 	}) {
 		const wasJQuery = formGroupDiv && formGroupDiv.jquery;
 		formGroupDiv = toEl(formGroupDiv);
+		if (!formGroupDiv) {
+			return;
+		}
 		function isOptionDefined(optionName) {
 			return typeof options[optionName] != 'undefined' && null !== options[optionName];
 		}
@@ -713,6 +789,9 @@ class ArrayField {
 class EditValue {
 	static init(valueDiv, onSubmitCallback, getInputCallback) {
 		valueDiv = toEl(valueDiv);
+		if (!valueDiv) {
+			return;
+		}
 		const link = document.createElement('a');
 		link.href = '#';
 		link.className = 'text-warning';

package/google_charts.js

@@ -45,6 +45,10 @@ class GoogleCharts {
 
 	static draw(div, options) {
 		div = toEl(div);
+		if (!div) {
+			return;
+		}
+
 		const {
 			chart_type: chartType,
 			title: title,

package/import_from_csv.js

@@ -21,6 +21,10 @@ class ImportFromCsv {
 
 	static initForm(div, options = {}) {
 		div = toEl(div);
+		if (!div) {
+			return;
+		}
+
 		const {
 			importColumns,
 			requestImportData,
@@ -74,7 +78,7 @@ class ImportFromCsv {
 			}
 
 			const hasHeader = formUpload.querySelectorAll('input[name="header"][value="1"]:checked').length;
-			const encoding = formUpload.querySelector('select[name="encoding"]').value;
+			const encoding = formUpload.querySelector('select[name="encoding"]')?.value;
 
 			Papa.parse(fileInput.files[0], {
 				header: hasHeader,
@@ -175,6 +179,10 @@ class ImportFromCsv {
 
 	static displayData(divResult, data, header, formMatching) {
 		divResult = toEl(divResult);
+		if (!divResult) {
+			return;
+		}
+
 		let table = divResult.querySelector('table');
 		if (!table) {
 			divResult.insertAdjacentHTML('beforeend', '<table class="table table-sm table-bordered"></table>');

package/location.js

@@ -306,6 +306,9 @@ class Country {
 class PostalAddress {
 	static setAutocomplete(input, onPlaceChanged) {
 		input = toEl(input);
+		if (!input) {
+			return;
+		}
 		const autocomplete = new google.maps.places.Autocomplete(
 			input,
 			{types: ['geocode']}

package/media.js

@@ -10,6 +10,10 @@ class AudioMedia {
 
 	static initPlayLinks(div) {
 		div = toEl(div);
+		if (!div) {
+			return;
+		}
+
 		// Affiche un lecteur audio
 		div.querySelectorAll('.play_link').forEach(link => {
 			link.addEventListener('click', function(e) {
@@ -128,6 +132,10 @@ class AudioMedia {
 class VideoMedia {
 	static initPlayPauseClick(videoElement) {
 		videoElement = toEl(videoElement);
+		if (!videoElement) {
+			return;
+		}
+		
 		videoElement.addEventListener('click', function(e) {
 			// handle click if not Firefox (Firefox supports this feature natively)
 			if (typeof InstallTrigger === 'undefined') {

package/multi_files_input.js

@@ -5,8 +5,15 @@ const { toEl } = require('./util');
 class MultiFilesInput {
 	static init(fileInput, setFilesList, nbMaxFiles, maxFileSize) {
 		fileInput = toEl(fileInput);
+		if (!fileInput) {
+			return;
+		}
+
 		let filesList = [];
 		const formGroup = fileInput.closest('.form-group');
+		if (!formGroup) {
+			return;
+		}
 
 		if (!formGroup.querySelector('.multi_files_input_dropzone')) {
 			fileInput.insertAdjacentHTML('afterend', `

package/multiple_action_in_table.js

@@ -29,12 +29,12 @@ class MultipleActionInTable {
 	// Peut être appelé après l'initialisation DataTable.
 	static init(table, options = {}) {
 		table = toEl(table);
-		const { cellSelector = 'select', imgArrow = '' } = options;
-
 		if (!table || !table.classList.contains('table-action_multiple')) {
 			return;
 		}
 
+		const { cellSelector = 'select', imgArrow = '' } = options;
+
 		let divBtn = MultipleActionInTable.getDivBtn(table);
 		if (divBtn == null) {
 			return;
@@ -145,6 +145,10 @@ class MultipleActionInDivList {
 // init checkbox
 	static init(contentDiv, options = {}) {
 		contentDiv = toEl(contentDiv);
+		if (!contentDiv) {
+			return;
+		}
+
 		const { imgArrow = '' } = options;
 
 		let buttonsDiv = MultipleActionInDivList.getButtonsDiv(contentDiv);

package/open_street_map.js

@@ -457,6 +457,7 @@ class OsmMap {
 
 	constructor(mapContainer, options={}) {
 		mapContainer = toEl(mapContainer);
+		
 		this.markers = [];
 		this.locations = [];
 		this.tempSelection = null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@osimatic/helpers-js",
-  "version": "1.5.24",
+  "version": "1.5.26",
   "main": "main.js",
   "scripts": {
     "test": "jest",

package/paging.js

@@ -3,24 +3,23 @@ const { toEl } = require('./util');
 
 class Pagination {
 	static paginateCards(div, nbItemsPerPage) {
-		div = toEl(div);
 		Pagination.paginate(div, div.querySelectorAll('.pagination_item'), nbItemsPerPage, null);
 	}
 
 	static paginateTable(table, select=null) {
-		table = toEl(table); select = toEl(select);
 		Pagination.paginate(table, table.querySelectorAll('tbody tr:not(.hide)'), parseInt(table.dataset.max_rows), select);
 	}
 
 	static paginate(div, items, nbItemsPerPage, select=null, labelDisplayAll=null) {
-		div = toEl(div); select = toEl(select);
-		let maxItems = nbItemsPerPage;
-
+		div = toEl(div);
 		if (!div) {
 			return;
 		}
 
-		if (select != null) {
+		let maxItems = nbItemsPerPage;
+
+		select = select != null ? toEl(select) : null;
+		if (select) {
 			if (!select.children.length) {
 				const opt0 = document.createElement('option');
 				opt0.value = '0';
@@ -53,6 +52,11 @@ class Pagination {
 	}
 
 	static initPaginationDiv(div, onTop) {
+		div = toEl(div);
+		if (!div) {
+			return;
+		}
+
 		const ul = document.createElement('ul');
 		ul.className = 'pagination';
 
@@ -137,6 +141,7 @@ class Navigation {
 		if (!a) {
 			return;
 		}
+
 		let ulNav = a.closest('.nav');
 		if (!ulNav) {
 			return;
@@ -164,9 +169,11 @@ class Navigation {
 	}
 
 	static showTab(a) {
-		if (typeof bootstrap == 'undefined') {
+		a = toEl(a);
+		if (!a || typeof bootstrap == 'undefined') {
 			return;
 		}
+
 		let tab = new bootstrap.Tab(a);
 		tab.show();
 	}

package/select_all.js

@@ -39,6 +39,7 @@ class SelectAll {
 		if (!formGroup) {
 			return;
 		}
+
 		const allCheckbox = formGroup.querySelectorAll('input[type="checkbox"]:not(.check_all)');
 		const allCheckboxChecked = formGroup.querySelectorAll('input[type="checkbox"]:not(.check_all):checked');
 		const lienSelectAll = formGroup.querySelector('a.check_all');
@@ -60,6 +61,7 @@ class SelectAll {
 		if (!table) {
 			return;
 		}
+
 		const inputCheckAll = table.querySelector('tr input.check_all');
 		if (!inputCheckAll) {
 			return;
@@ -87,6 +89,7 @@ class SelectAll {
 		if (!table) {
 			return;
 		}
+
 		const allCheckbox = table.querySelectorAll('tbody input[type="checkbox"]');
 		const allCheckboxChecked = table.querySelectorAll('tbody input[type="checkbox"]:checked');
 		const checkboxSelectAll = table.querySelector('thead input.check_all');
@@ -103,6 +106,7 @@ class SelectAll {
 		if (!contentDiv) {
 			return;
 		}
+
 		contentDiv.querySelectorAll('input.check_all').forEach(inputCheckAll => {
 			const div = inputCheckAll.closest('div.checkbox_with_check_all');
 
@@ -137,6 +141,7 @@ class SelectAll {
 		if (!div) {
 			return;
 		}
+
 		// 22/11/2021 : rajout :not(.check_all) sinon si toutes les cases sont coché, la case select all n'est pas coché à l'initialisation
 		const allCheckbox = div.querySelectorAll('div.checkbox input[type="checkbox"]:not(.check_all), div.form-check input[type="checkbox"]:not(.check_all)');
 		const allCheckboxChecked = div.querySelectorAll('div.checkbox input[type="checkbox"]:not(.check_all):checked, div.form-check input[type="checkbox"]:not(.check_all):checked');

package/sortable_list.js

@@ -3,6 +3,10 @@ const { toEl } = require('./util');
 class SortableList {
 	static init(sortableList, clientYOffset=0) {
 		sortableList = toEl(sortableList);
+		if (!sortableList) {
+			return;
+		}
+
 		sortableList.querySelectorAll('[draggable="true"]').forEach(item => {
 			item.addEventListener('dragstart', () => {
 				// Adding dragging class to an item after a delay

package/tests/form_date.test.js

@@ -182,6 +182,11 @@ describe('FormDate', () => {
 			mockSelect = { insertAdjacentHTML: jest.fn() };
 		});
 
+		test('should do nothing if element does not exist', () => {
+			expect(() => FormDate.fillYearSelect(null)).not.toThrow();
+			expect(() => FormDate.fillYearSelect(undefined)).not.toThrow();
+		});
+
 		test('should fill select with years from 5 years before to current year', () => {
 			FormDate.fillYearSelect(mockSelect);
 
@@ -259,6 +264,11 @@ describe('FormDate', () => {
 			}
 		});
 
+		test('should do nothing if element does not exist', () => {
+			expect(() => FormDate.fillMonthSelect(null)).not.toThrow();
+			expect(() => FormDate.fillMonthSelect(undefined)).not.toThrow();
+		});
+
 		test('should fill select with 12 months', () => {
 			FormDate.fillMonthSelect(mockSelect, 'fr');
 
@@ -281,6 +291,11 @@ describe('FormDate', () => {
 			}
 		});
 
+		test('should do nothing if element does not exist', () => {
+			expect(() => FormDate.fillDayOfWeekSelect(null)).not.toThrow();
+			expect(() => FormDate.fillDayOfWeekSelect(undefined)).not.toThrow();
+		});
+
 		test('should fill select with 7 days of week', () => {
 			FormDate.fillDayOfWeekSelect(mockSelect, 'fr');