fsylvain/projet_programmation_web
1
0
Fork 0
mirror of https://github.com/Floriansylvain/projet_programmation_web.git synced 2026-08-19 11:43:16 +02:00
Code Issues Packages Projects Releases Wiki Activity

🎨 General visuals improvements

Browse Source
This commit is contained in:
Florian SYLVAIN
2021-12-10 12:14:03 +01:00
parent 0fe115d371
commit 84edef43dd
5 changed files with 126 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ProjetProgWeb/app.js
+67 -16
View File
@@ -5,6 +5,8 @@ const EXTRA_LARGE = 1200
const RESULTS_NUMBER = 10
const urlParams = new URLSearchParams(window.location.search);
let navbarForm = document.querySelector('.navbar-form')
let searchBar = document.querySelector('#searchbar')
let searchBarButton = document.querySelector('#search-button')
@@ -99,6 +101,19 @@ function updateUnderline(number) {
})
}
function focusResults(result) {
resultsDiv.childNodes.forEach(elem => {
let elemContent = elem.querySelector('.element-content')
if (result !== elem) {
elemContent.style.display = 'none'
} else {
let display = elemContent.style.display
elemContent.style.display = display === 'none' || display === '' ? 'block' : 'none'
}
})
fadeIn()
}
let resultsArray = []
let count = 0
let nbPages = 0
@@ -121,6 +136,8 @@ function displayResults(results) {
result.classList.add('result-element')
let i = 0
let header = document.createElement('div')
let qAuthor = elem[0]
let author = document.createElement('h3')
let pre_replacement = new RegExp( authorName, 'gi').exec(qAuthor)
@@ -130,18 +147,41 @@ function displayResults(results) {
let title = document.createElement('p')
title.innerText = qTitle
result.appendChild(author)
result.appendChild(title)
let firstElement = document.createElement('div')
firstElement.classList.add('result-element-header')
// elem.forEach(e => {
// let child = document.createElement(i === 0 ? 'h2' : 'p')
// let pre_replacement = new RegExp( authorName, 'gi').exec(e)
// child.innerHTML = e.replace(pre_replacement, `<mark>${pre_replacement}</mark>`)
// result.appendChild(child)
// i += 1
// })
let onlineButton = document.createElement('button')
onlineButton.innerHTML = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><path d=\"M12 0c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm1 16.057v-3.057h2.994c-.059 1.143-.212 2.24-.456 3.279-.823-.12-1.674-.188-2.538-.222zm1.957 2.162c-.499 1.33-1.159 2.497-1.957 3.456v-3.62c.666.028 1.319.081 1.957.164zm-1.957-7.219v-3.015c.868-.034 1.721-.103 2.548-.224.238 1.027.389 2.111.446 3.239h-2.994zm0-5.014v-3.661c.806.969 1.471 2.15 1.971 3.496-.642.084-1.3.137-1.971.165zm2.703-3.267c1.237.496 2.354 1.228 3.29 2.146-.642.234-1.311.442-2.019.607-.344-.992-.775-1.91-1.271-2.753zm-7.241 13.56c-.244-1.039-.398-2.136-.456-3.279h2.994v3.057c-.865.034-1.714.102-2.538.222zm2.538 1.776v3.62c-.798-.959-1.458-2.126-1.957-3.456.638-.083 1.291-.136 1.957-.164zm-2.994-7.055c.057-1.128.207-2.212.446-3.239.827.121 1.68.19 2.548.224v3.015h-2.994zm1.024-5.179c.5-1.346 1.165-2.527 1.97-3.496v3.661c-.671-.028-1.329-.081-1.97-.165zm-2.005-.35c-.708-.165-1.377-.373-2.018-.607.937-.918 2.053-1.65 3.29-2.146-.496.844-.927 1.762-1.272 2.753zm-.549 1.918c-.264 1.151-.434 2.36-.492 3.611h-3.933c.165-1.658.739-3.197 1.617-4.518.88.361 1.816.67 2.808.907zm.009 9.262c-.988.236-1.92.542-2.797.9-.89-1.328-1.471-2.879-1.637-4.551h3.934c.058 1.265.231 2.488.5 3.651zm.553 1.917c.342.976.768 1.881 1.257 2.712-1.223-.49-2.326-1.211-3.256-2.115.636-.229 1.299-.435 1.999-.597zm9.924 0c.7.163 1.362.367 1.999.597-.931.903-2.034 1.625-3.257 2.116.489-.832.915-1.737 1.258-2.713zm.553-1.917c.27-1.163.442-2.386.501-3.651h3.934c-.167 1.672-.748 3.223-1.638 4.551-.877-.358-1.81-.664-2.797-.9zm.501-5.651c-.058-1.251-.229-2.46-.492-3.611.992-.237 1.929-.546 2.809-.907.877 1.321 1.451 2.86 1.616 4.518h-3.933z\"/></svg>"
if (elem[14] === 'no') {
onlineButton.disabled = true
} else {
onlineButton.onclick = function() {
window.open('https://www.theses.fr/' + elem[13] + '/document', ',_blank')
}
}
firstElement.append(author, onlineButton)
header.append(firstElement, title)
let content = document.createElement('div')
content.classList.add('element-content')
elem.forEach(e => {
if (i > 3 && i !== 14) {
let child = document.createElement('p')
let pre_replacement = new RegExp(authorName, 'gi').exec(e)
child.innerHTML = e.replace(pre_replacement, `<mark>${pre_replacement}</mark>`)
content.appendChild(child)
} i += 1
})
count += 1
header.addEventListener('click', (e) => {
focusResults(result)
})
result.append(header, content)
resultsArray.push(result)
})
@@ -166,6 +206,10 @@ function displayResults(results) {
pagesNumbers.appendChild(number)
}
if (count < 1) {
pagesNumbersContainer.style.display = 'none'
}
browseResults(1)
fadeIn()
}
@@ -191,7 +235,7 @@ let lastSuggestion = new Date().getTime()
let suggestionsDisplayed = false
function realTimeDisplay() {
let search = document.querySelector('input[name=\'author\']').value
let search = document.querySelector('input[name=\'search\']').value
search = sanitize(search)
if (search.length > 3 && (search !== lastSearch && (new Date().getTime() - lastSuggestion) > 500)) {
lastSearch = search
@@ -280,9 +324,16 @@ searchBar.addEventListener('focus', () => {
switchNavTitle(false)
})
navbarForm.addEventListener('submit', e => {
e.preventDefault()
let data = new FormData(navbarForm)
searchBar.blur()
apiRequestThese(data.get('author'))
})
// navbarForm.addEventListener('submit', e => {
// e.preventDefault()
// let data = new FormData(navbarForm)
// searchBar.blur()
// apiRequestThese(data.get('author'))
// })
let urlSearch = urlParams.get('search')
if (urlSearch) {
searchBar.value = urlSearch
apiRequestThese(urlSearch)
}