ajout fichiers renommés manquants (0d14740d) · Commits · pdn-certic / MaX

plugins/ead_search/ead_search_page.css

0 → 100644

+237 −0

Original line number	Diff line number	Diff line
		.ead-search{
		margin-top: 100px;
		}

		.ead-search button{
		cursor: pointer;
		}

		.ead-search-ul {
		list-style-type: none;
		display: inline-block;
		margin:0;
		padding:0
		}

		section.browse section p, section.browse section ul{
		line-height: 1.3;

		}

		section.browse section p {
		margin-bottom: 2px;
		margin-top:7px;
		}

		section.browse section ul{
		margin: 0px;
		}


		.ead-search-ul li {
		display: inline-block;
		margin-left:5px;
		border: 1px solid #ccc;
		border-radius: 2px;
		padding: 2px 5px;
		font-size:0.8rem;
		}

		.ead-search-ul li button {
		display :inline-block;
		border: none;
		background-color: none;
		padding: 4px;
		margin: 0px 0px 0px 7px;
		color: red;
		cursor : pointer;
		}

		.ead-search label{
		display :inline-block;
		min-width: 200px;
		}

		section#ead-search-section #ead-search-date-wrap{
		border-top: 1px solid #ccc;
		margin-top:10px;
		padding-top:10px;
		width: 70%;
		}

		section#ead-search-section #ead-search-date-wrap div{
		margin:10px;
		}

		#ead-search-date-wrap div span{
		display :inline-block;
		min-width: 50px;
		}

		#ead-search-results {
		border-top: 1px solid #888;
		margin-bottom:51px;
		}

		#ead-search-results section{
		width: 66%;
		min-width: 700px;
		margin-bottom:66px;
		}

		#searchLoading{
		padding-top: 20px;
		display:none;
		text-align: center;
		position: absolute;

		}

		div.boutonSearch button {
		margin-left: 365px;

		}

		.ead-search-popup-wrap{
		display: inline;
		position: relative;
		}

		.ead-search-popup{
		display: none;
		position: absolute;
		top:0;
		left: 10px;
		border:1px solid #999;
		min-width:500px;
		background-color: white;
		z-index:10;
		font-size:0.8rem;
		}

		.ead-search-close-popup {
		position: absolute;
		top :5px;
		right: 5px;
		}
		.ead-search-popup button {
		display:flex;
		justify-content: center;
		align-items: center;
		max-width: 32px;
		max-height: 32px;

		padding: 3px 6px;
		}

		.ead-search-popup ul {
		list-style-type: none;
		margin-left: 0;
		padding-left:0;
		}

		.ead-search-popup ul li{
		cursor: pointer;
		line-height: 1.2;
		}

		.ead-search-popup ul li:hover{
		color: #888;
		}

		.ead-search-popup-alphabet{
		text-align :center;
		}
		.ead-search-index-pager{
		display:flex;
		justify-content: center;
		align-items: center;
		}
		.ead-search-index-pager button{
		margin: 5px;
		}
		.ead-search-index-pager input{
		max-width: 80px;
		}

		.ead-search-index-n{
		display: inline-block;
		margin-right: 15px;
		min-width: 25px;
		font-weight: bold;
		text-align:right;
		}
		.ead-search-alpha {
		cursor : pointer;
		}
		.ead-search-alpha.selected{
		color: black;
		font-weight: bold;
		}

		section.browse section#ead-search-section div#ead-search-simple {
		border-bottom: 1px solid #888;
		padding-bottom: 3px;
		border-top: 1px solid #888;
		padding-top: 3px;
		margin-top:10px;
		margin-left:0px;
		margin-bottom:10px;
		}


		section#ead-search-section ul li {
		line-height: 1.5;
		}

		section#ead-search-section div {
		margin: 0px;
		}

		section#ead-search-section div.ead-search-popup-alphabet {
		margin: 10px;
		padding-left:5px;
		}



		section.browse .ead-search {
		margin-top: 17em;
		margin-left: 24px;
		}

		input[type="text"] {
		padding: 6px 10px;
		margin: 8px 0;
		border: 1px solid #ccc;
		background-size: 18px;
		}

		input[type="text"][id="searchInput"] {
		padding: 6px 33px;
		background: transparent url("loupe.png") no-repeat 10px 4px;
		background-size: 18px;
		}

		button {
		border: 1px solid #ccc;
		padding: 6px 15px;
		margin: 8px 0;
		}

		section.porte-documents button {
		padding: 3px 6px;
		}

		button.iconeListe {
		padding: 18px 15px;
		margin: 8px 0;
		border: none;
		background: transparent url("liste.png") no-repeat 6px 4px;
		background-size: 21px;
		}

		section#ead-search-section div.contexte {
		margin: 3px 0px 2px 9px;
		line-height: 1.3;
		}
		No newline at end of file

plugins/ead_search/ead_search_page.js

0 → 100644

+265 −0

Original line number	Diff line number	Diff line
		const PAGE_LENGTH = 10;

		class EadSearchPlugin {

		constructor(name) {
		this.currentFirstLetterFilter = null;
		this.withDatesFilter = document.getElementById('ead-search-date-cb').checked;
		this.filters = {}
		if (document.getElementById('ead-search-section')) {
		document.getElementById('ead-search-date-cb').addEventListener('click', (evt) => {
		this.withDatesFilter = evt.target.checked;
		if (!this.withDatesFilter) {
		document.getElementById('ead-search-date-from').setAttribute('disabled', true);
		document.getElementById('ead-search-date-to').setAttribute('disabled', true);
		} else {
		document.getElementById('ead-search-date-from').removeAttribute('disabled');
		document.getElementById('ead-search-date-to').removeAttribute('disabled')
		}
		})
		this.bindIndexAutocompletes();
		}
		}

		bindIndexAutocompletes() {
		let indexList = document.querySelectorAll('.ead-search-input');

		indexList.forEach((e) => {
		e.addEventListener('input', (evt) => {
		let indexId = e.dataset.indexid
		let indexName = e.dataset.index;
		let q = e.value;
		if (q.trim() !== '') {
		let url = baseURI + projectId + '/search-index/' + indexName + '.json?q=.' + q + '.';
		url += e.dataset.attr ? ('&attr=' + e.dataset.attr + '&value=' + e.dataset.value) : '';

		let datalist = document.getElementById(indexId);
		fetch(url).then((res) => res.json()).then((json) => {
		datalist.querySelectorAll('*').forEach(n => n.remove());
		let entries = json.entries;
		let options = ''
		entries.forEach((entry) => {
		options += '<option value="' + decodeURIComponent(entry.normal) + '"/>';
		});
		datalist.innerHTML = options;
		});

		document.getElementById(indexId + '-input').addEventListener('input', (event) => {
		if (event.inputType === 'insertReplacementText') {
		this.addIndexFilter(indexName, event.target.value, indexId)
		}
		});

		}
		})
		})

		}

		togglePopup(tagId) {
		let popupElt = document.getElementById('ead-search-popup-' + tagId);
		if (popupElt.style.display == 'block') {
		popupElt.style.display = 'none';
		} else
		this.popupIndex(tagId);
		}

		popupIndex(tagId) {
		this.currentFirstLetterFilter = null;
		document.getElementById('alpha-' + tagId).classList.toggle('selected')
		document.querySelectorAll('.ead-search-popup').forEach((p) => p.style.display = 'none')
		if (!document.getElementById('ul-' + tagId)) {//needs first fetch
		this.fetchPage(tagId, 1);
		}
		let popupElt = document.getElementById('ead-search-popup-' + tagId);
		popupElt.style.display = 'block';
		}

		fetchPage(tagId, pageNumber) {
		let popupElt = document.getElementById('ead-search-popup-' + tagId);
		let popupContent = document.getElementById('ead-search-popup-' + tagId + "-contents");
		//popupContent.innerHTML = '';
		//let url = baseURI + projectId + '/search-index/'+tagName+'.json?p='+pageNumber;
		let listTarget = document.getElementById('ul-' + tagId);
		if (!listTarget) {
		listTarget = document.createElement('ul');
		listTarget.setAttribute('id', 'ul-' + tagId);
		popupContent.appendChild(listTarget);
		}
		let inputTarget = document.getElementById(tagId + '-input');
		let tagName = inputTarget.dataset.index;
		let url = baseURI + projectId + '/search-index/' + tagName + '.json?page=' + pageNumber;
		url += inputTarget.dataset.attr ? ('&attr=' + inputTarget.dataset.attr + '&value=' + inputTarget.dataset.value) : '';
		if (this.currentFirstLetterFilter)
		url += "&q=^" + this.currentFirstLetterFilter
		fetch(url)
		.then((res) => res.json()).then((json) => {
		let entries = json.entries
		let total = json.total;
		let totalElt = document.getElementById('ead-search-nb-entries-' + tagId)
		if (!totalElt) {
		totalElt = document.createElement('h5');
		totalElt.setAttribute('id', 'ead-search-nb-entries-' + tagId)
		popupContent.appendChild(totalElt);
		}
		totalElt.innerHTML = total + (entries > 1 ? ' entrée' : ' entrées');
		listTarget.innerHTML = '';
		entries.forEach((entry, n) => {
		let li = document.createElement('li');
		let spanNumber = document.createElement('span');
		spanNumber.classList.add('ead-search-index-n');
		spanNumber.innerHTML = (PAGE_LENGTH * (pageNumber - 1) + n + 1);
		let entryText = document.createTextNode(decodeURIComponent(entry.normal));
		li.appendChild(spanNumber);
		li.appendChild(entryText);
		li.addEventListener('click', (evt) => {
		this.addIndexFilter(tagName, decodeURIComponent(entry.normal), tagId);
		})
		listTarget.appendChild(li);
		});

		if (!document.getElementById('ead-search-index-pager-' + tagId))
		popupContent.appendChild(this.buildPager(tagId, total));
		})
		}

		fetchIndexEntriesByLetter(letter, tagId) {
		this.currentFirstLetterFilter = letter.trim() === '' ? null : letter;
		document.querySelectorAll('.ead-search-alpha.selected').forEach(e => {
		e.classList.toggle('selected')
		})
		document.getElementById("alpha-" + tagId + (this.currentFirstLetterFilter ? '-' + this.currentFirstLetterFilter : '')).classList.toggle('selected')
		this.fetchPage(tagId, 1)
		}

		addIndexFilter(filterType, filterValue, filterId) {
		if (filterValue.trim() === '')
		return;

		if (!this.filters[filterType])
		this.filters[filterType] = []
		this.filters[filterType].push(filterValue);
		let li = document.createElement('li');
		let rmBtn = document.createElement('button');
		rmBtn.innerHTML = "×"
		li.innerHTML = filterValue;
		li.appendChild(rmBtn);
		document.getElementById(filterId + '-ul').appendChild(li);
		document.getElementById(filterId + '-input').value = '';
		rmBtn.addEventListener('click', (evt) => {
		li.remove();
		this.filters[filterType].splice(this.filters[filterType].indexOf(filterValue), 1);
		if (this.filters[filterType].length === 0)
		delete this.filters[filterType];
		})
		}

		buildPager(tagId, total, url) {
		let nbPage = Math.floor(total / PAGE_LENGTH);
		console.log('nbPager = ' + nbPage)
		let pagerElt = document.createElement('div');

		let firstArrowElt = document.createElement('button');
		firstArrowElt.innerHTML = '<<';
		let prevArrowElt = document.createElement('button');
		prevArrowElt.innerHTML = '<';

		let lastArrowElt = document.createElement('button');
		lastArrowElt.innerHTML = '>>';
		let nextArrowElt = document.createElement('button');
		nextArrowElt.innerHTML = '>';

		let inputPageElt = document.createElement('input');
		inputPageElt.type = 'number';
		inputPageElt.value = 1;

		pagerElt.appendChild(firstArrowElt);
		pagerElt.appendChild(prevArrowElt);
		pagerElt.appendChild(inputPageElt);
		pagerElt.appendChild(nextArrowElt);
		pagerElt.appendChild(lastArrowElt);

		let gotoPage = function (n) {
		inputPageElt.value = n;
		inputPageElt.dispatchEvent(new Event('change'));
		}

		firstArrowElt.addEventListener('click', () => gotoPage(1));
		prevArrowElt.addEventListener('click', () => gotoPage(Number(inputPageElt.value) - 1));
		lastArrowElt.addEventListener('click', () => gotoPage(nbPage));
		nextArrowElt.addEventListener('click', () => gotoPage(Number(inputPageElt.value) + 1));

		inputPageElt.addEventListener('change', (evt) => {
		let pageTarget = inputPageElt.value;
		this.fetchPage(tagId, pageTarget);
		})

		pagerElt.classList.add('ead-search-index-pager');
		pagerElt.setAttribute('id', 'ead-search-index-pager-' + tagId)
		return pagerElt;
		}

		runEadSearch() {
		//pour ne pas que les résultats précédents restent affichés, on vide le contenu html
		let resultsDiv = document.querySelector("#ead-search-results");
		resultsDiv.innerHTML = '';
		let query = 'resultats.html';
		document.querySelector("#searchLoading").style.display = "block";
		let filtered = false;
		Object.keys(this.filters).forEach((k, i) => {
		query += (i === 0 ? '?' : '&') + 'indexes[]=' + k;
		console.log(this.filters[k])
		for (let j = 0; j < this.filters[k].length; j++) {
		query += '&' + k + "[]=" + encodeURIComponent(this.filters[k][j])
		}
		filtered = true;
		})

		query = baseURI + projectId + '/' + query;

		if (this.withDatesFilter) {
		//date
		let dateMode = document.querySelector('input[name=ead-search-radio-date]:checked').value
		if (dateMode === 'interval') {
		let from = document.getElementById('ead-search-date-from').value;
		let to = document.getElementById('ead-search-date-to').value;
		if (from && to)
		query += (!filtered ? "?" : "&") + "from=" + from + "&to=" + to
		} else if (dateMode === 'in') {
		let dateIn = document.getElementById('ead-search-date-in').value;
		query += (!filtered ? "?" : "&") + "in=" + dateIn
		}
		}
		fetch(query).then(res => res.text()).then(text => {
		document.getElementById('ead-search-results').innerHTML = text
		}).then(function () {
		document.querySelector("#searchLoading").style.display = "none";
		})

		}

		runEadSimpleSearch() {
		var simpleSearch = document.querySelector('#searchInput').value;
		//pour ne pas que les résultats précédents restent affichés, on vide le contenu html
		let resultsDiv = document.querySelector("#ead-search-results");
		resultsDiv.innerHTML = '';
		if (simpleSearch.trim() === '') {
		alert('Recherche vide ou incorrecte.');
		return;
		}
		document.querySelector("#searchLoading").style.display = "block";
		let query = 'resultatsSimple.html?search=' + simpleSearch;
		query = baseURI + projectId + '/' + query;

		fetch(query).then(res => res.text()).then(text => {
		document.getElementById('ead-search-results').innerHTML = text
		}).then(function () {
		document.querySelector("#searchLoading").style.display = "none";
		})

		}

		}

		let eadSearch = new EadSearchPlugin('EadSearchPlugin')
		window.eadSearch = eadSearch;