diff --git a/functions.php b/functions.php index 87a6e99..73953a2 100644 --- a/functions.php +++ b/functions.php @@ -100,7 +100,160 @@ collect(['setup', 'filters']) } add_action('admin_footer', 'cacher_bloc_foot_admin'); + + function custom_filter_dropdown() { + global $typenow; + if ($typenow == 'post') { // Adjust post type if needed + $selected = isset($_GET['custom_field_filter']) ? $_GET['custom_field_filter'] : ''; + $options = array( + 'isMainPart' => __('isMainPart', 'textdomain'), + 'isSubPart' => __('isSubPart', 'textdomain'), + ); + + echo ''; + } + } + + add_action('restrict_manage_posts', 'custom_filter_dropdown'); + + + function filter_by_custom_field($query) { + global $pagenow; + if (is_admin() && $pagenow == 'edit.php' && isset($_GET['custom_field_filter'])) { + $custom_field_key = sanitize_text_field($_GET['custom_field_filter']); + if (!empty($custom_field_key)) { + $meta_query = array( + array( + 'key' => $custom_field_key, + 'compare' => 'EXISTS', + ), + ); + $query->query_vars['meta_query'] = $meta_query; + } + } + } + + add_filter('parse_query', 'filter_by_custom_field'); + + + add_action('wp', 'generate_csv'); + + function generate_csv() { + if ('csv' === (isset($_GET['format']) ? $_GET['format'] : null)) { + // Query to get all posts + $args = array( + 'post_type' => 'post', + 'posts_per_page' => -1, + 'meta_key' => 'index', + 'meta_type' => 'NUMERIC', + 'orderby' => 'meta_value', + 'order' => 'ASC' + ); + + $posts = get_posts($args); + + if (!empty($posts)) { + // Initialize CSV data array + $csvData = array(); + + // Add CSV header row + $csvData[] = array('Temps', 'Images', 'Voix Off et In', 'Bande Son', 'Écrits', 'Section'); + + // Loop through posts and add them to the CSV data array + foreach ($posts as $post) { + $post_content = wp_strip_all_tags($post->post_content); + $content_array = explode("---", $post_content); + + $temps = $post->post_title; + $images = isset($content_array[1]) ? $content_array[1] : ''; + $images = substr($images, 0, -15); + $voixOffIn = isset($content_array[2]) ? $content_array[2] : ''; + $voixOffIn = substr($voixOffIn, 0, -10); + $bandeson = isset($content_array[3]) ? $content_array[3] : ''; + $bandeson = substr($bandeson, 0, -8); + $ecrits = isset($content_array[4]) ? $content_array[4] : ''; + + if (get_post_meta($post->ID, 'isMainPart', true)) { + $section = get_post_meta($post->ID, 'isMainPart', true); + } elseif (get_post_meta($post->ID, 'isSubPart', true)) { + $section = get_post_meta($post->ID, 'isSubPart', true); + } else { + $section = ''; + } + $csvData[] = array( + $temps, + $images, + $voixOffIn, + $bandeson, + $ecrits, + $section, + ); + } + + $csvFileName = 'partition_livre_d_image.csv'; + + header('Content-Encoding: UTF-8'); + header('Content-Type: text/csv; charset=utf-8'); + header('Content-Disposition: attachment; filename=' . $csvFileName); + echo "\xEF\xBB\xBF"; // UTF-8 BOM + + // Output CSV data + $output = fopen('php://output', 'w'); + foreach ($csvData as $row) { + fputcsv($output, $row); + } + fclose($output); + + exit; + } + } + } + + function custom_admin_styles() { + wp_enqueue_style('custom-admin', get_template_directory_uri() . '/resources/styles/admin_custom.css'); + } + add_action('admin_enqueue_scripts', 'custom_admin_styles'); + + function restrict_revisions_by_author($query) { + global $current_user; + + // Check if the user is logged in + if (is_user_logged_in()) { + get_currentuserinfo(); + $author_id = $current_user->ID; + + // Modify the query to filter revisions by author + if (isset($query->query_vars['post_type']) && $query->query_vars['post_type'] == 'revision') { + $query->set('author', $author_id); + } + } + } + add_action('pre_get_posts', 'restrict_revisions_by_author'); + + function customize_editor_for_editor_role() { + if (current_user_can('revisor')) { + wp_enqueue_script('custom-editor-script', get_template_directory_uri() . '/resources/scripts/custom-editor-script.js', array(), null, true); + wp_enqueue_style('custom-editor-style', get_template_directory_uri() . '/resources/styles/custom-editor-style.css'); + + // Get the content of the specific page (replace '123' with the actual page ID) + $page_id = 13940; + $page_content = get_post_field('post_content', $page_id); + + // Localize the page content to be accessible in your custom script + wp_localize_script('custom-editor-script', 'pageContentData', array('content' => $page_content)); + } + } + add_action('admin_enqueue_scripts', 'customize_editor_for_editor_role'); + + + + // function supprimer_tous_les_articles() { diff --git a/index.php b/index.php index 0720f18..4dd87b8 100644 --- a/index.php +++ b/index.php @@ -4,6 +4,64 @@ + style="background-color: #010d19;"> diff --git a/resources/assets/icons/arrow_drop_down.svg b/resources/assets/icons/arrow_drop_down.svg new file mode 100644 index 0000000..c7b0886 --- /dev/null +++ b/resources/assets/icons/arrow_drop_down.svg @@ -0,0 +1,38 @@ + + + + + + diff --git a/resources/assets/icons/arrow_drop_up.svg b/resources/assets/icons/arrow_drop_up.svg new file mode 100644 index 0000000..7efca28 --- /dev/null +++ b/resources/assets/icons/arrow_drop_up.svg @@ -0,0 +1,38 @@ + + + + + + diff --git a/resources/scripts/app.js b/resources/scripts/app.js index 00146ca..6646fdb 100644 --- a/resources/scripts/app.js +++ b/resources/scripts/app.js @@ -4,8 +4,18 @@ import domReady from '@roots/sage/client/dom-ready'; * Application entrypoint */ domReady(async () => { - // pour régler tous les pb au refresh quand la page est déjà scrollée - window.scrollTo(0, 0); + + window.addEventListener('load', function() { + setTimeout(function() { + window.scrollTo(0, 0); + }, 0); + }); + + window.addEventListener('resize', function() { + setTimeout(function() { + window.scrollTo(0, 0); + }, 0); + }); // CLEANER LE TABLEAU let minHeadTh = document.querySelector("#main table thead tr th:first-of-type"); @@ -27,6 +37,12 @@ domReady(async () => { for (let otherTableTd of otherTableTds) { otherTableTd.style.width = `${100 / 8 * 1.75}%`; } + + let editButtons = document.querySelectorAll(".edit-button"); + for (let editButton of editButtons) { + let editContainer = editButton.parentElement; + editContainer.style.height = `${editContainer.previousElementSibling.offsetHeight}px`; + } // HEADER AU SCROLL let tableHead = document.querySelector("thead tr"); let tHeadHeight = tableHead.offsetHeight; @@ -42,22 +58,65 @@ domReady(async () => { tableHead.style.height = tableHead.style.minHeight; } } - // italiques -> A FAIRE SUR LE CSV AVANT D'IMPORTER CA RALENTIT DE OUF LE CHARGEMENT - /* let tbody = document.querySelector('body main table tbody'); - let tbodyContent = tbody.innerHTML; - let asteriskCounter = 0; - for (let i = 0; i < tbodyContent.length; i++) { - if (tbodyContent[i] == "*") { - if (asteriskCounter % 2 == 0) { - tbodyContent = tbodyContent.substring(0, i) + '' + tbodyContent.substring(i + 1); - } else { - tbodyContent = tbodyContent.substring(0, i) + '' + tbodyContent.substring(i + 1); - } - asteriskCounter++; + + // C'EST LA POUR LES PRIVACY POLICY + // texte d'explication du login popup + // et privacy policy + let loginPopupText = document.getElementById('content_login_popup'); + let privacyText = document.getElementById('content_privacy').innerHTML; + loginPopupText = loginPopupText.innerText; + let loginPopupTextWrapper = document.getElementsByClassName('xoo-el-sidebar'); + if (loginPopupTextWrapper[0]) { + loginPopupTextWrapper[0].innerHTML = `

${loginPopupText}

`; + } + let policyDropdown = document.createElement('div'); + policyDropdown.style.width = "100%"; + policyDropdown.style.cursor = "pointer"; + policyDropdown.style.fontWeight = "bold"; + policyDropdown.style.display = "flex"; + policyDropdown.style.justifyContent = "space-between"; + policyDropdown.style.backgroundColor = "white"; + policyDropdown.style.padding = "20px 30px"; + let policyDropdownTitle = document.createElement('p'); + policyDropdownTitle.style.padding = "0"; + let policyDropdownPlus = document.createElement('p'); + policyDropdownPlus.style.padding = "0"; + policyDropdownPlus.innerText = '+'; + policyDropdownTitle.innerText = "Politique de confidentialité"; + policyDropdown.appendChild(policyDropdownTitle); + policyDropdown.appendChild(policyDropdownPlus); + let privacyPolicyContent = document.createElement('div'); + privacyPolicyContent.innerHTML = privacyText; + privacyPolicyContent.style.width = "100%"; + privacyPolicyContent.style.padding = "0px"; + let policyParagraphs = privacyPolicyContent.querySelectorAll('p, h2'); + for (let policyParagraph of policyParagraphs) { + policyParagraph.style.padding = '0'; + policyParagraph.style.marginBottom = '15px'; + } + privacyPolicyContent.style.height = "0px"; + privacyPolicyContent.style.overflow = "hidden"; + let policyOpen = false; + policyDropdown.addEventListener('click', togglePolicy); + if (loginPopupTextWrapper[0]) { + loginPopupTextWrapper[0].appendChild(policyDropdown); + loginPopupTextWrapper[0].style.overflowY = "scroll"; + loginPopupTextWrapper[0].appendChild(privacyPolicyContent); + } + + + function togglePolicy() { + if (policyOpen) { + privacyPolicyContent.style.height = "0px"; + privacyPolicyContent.style.padding = "0px"; + policyOpen = false; + } else { + privacyPolicyContent.style.height = "auto"; + privacyPolicyContent.style.padding = "10px 20px"; + policyOpen = true; } } - tbody.innerHTML = tbodyContent; -*/ + // titres de parties dans le tableau let mainpartTitless = document.querySelectorAll('.isMainPart'); @@ -128,7 +187,7 @@ domReady(async () => { } let totalTime = convertToSeconds(lastTime[0].innerText); - let tlContainer, tlContainerHeight, bodyHeight; + let tlContainer, tlContainerHeight; let partBlockHeights = []; let activePartIndex = 0; @@ -139,7 +198,6 @@ domReady(async () => { tlContainer.style.height = `calc(100vh - ${header.offsetHeight}px - ${footer.offsetHeight}px - 60px)`; tlContainer.style.top = `${document.querySelector('header').offsetHeight + 30}px`; tlContainerHeight = tlContainer.offsetHeight; - bodyHeight = document.querySelector('body').offsetHeight; for (let partDuration of partDurations) { partBlockHeights.push(partDuration / totalTime * tlContainerHeight); } @@ -172,6 +230,7 @@ domReady(async () => { toggleTitleHover(i, 'hide'); }); tlContainer.children[0].addEventListener("click", function() { + isScrollingFromGrab = false; titresFrise[i].el.scrollIntoView({ behavior: 'smooth', block: 'center' }); }); } @@ -197,6 +256,8 @@ domReady(async () => { let lastMain = null; + let grabbing = false; + for (let i = 0; i < elements.length; i++) { let current = elements[i]; let next = elements[i + 1]; @@ -302,6 +363,11 @@ domReady(async () => { } } + + // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + // ICI IL Y A LE GRAB DU CURSEUR DE LA TL + // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + // make the cursor move on scroll let cursor = document.querySelector('#cursor'); cursor.style.top = `${document.querySelector('#timeline_container').getBoundingClientRect().top}px`; @@ -312,8 +378,7 @@ domReady(async () => { partRects = Array.from(partRects); partRects = partRects.reverse(); partRects[0].style.width = '32px'; - let grabbing = false; - document.addEventListener("scroll", (event) => { + document.addEventListener("scroll", () => { if (!grabbing) { displayCurrentPartTitle(getCurrentPartFromScroll()); moveCursorFromScroll(getCurrentPartFromScroll()); @@ -324,9 +389,15 @@ domReady(async () => { let offsetY; element.addEventListener('mousedown', (e) => { + let elTransformY; + if (!element.style.transform) { + elTransformY = 0; + } else { + elTransformY = +element.style.transform.split('(')[1].split('p')[0]; + } e.preventDefault(); grabbing = true; - offsetY = e.clientY - +element.style.top.slice(0, -2); + offsetY = e.clientY - elTransformY; element.style.cursor = 'grabbing'; }); @@ -334,74 +405,29 @@ domReady(async () => { if (grabbing) { if (e.clientY < tlContainerHeight + tlContainer.offsetTop && e.clientY > tlContainer.offsetTop) { const y = e.clientY - offsetY; - element.style.top = `${y}px`; - relatedEl.style.top = `${y}px`; + element.style.transform = `translateY(${y}px)`; + relatedEl.style.transform = `translateY(${y}px)`; if (!isNaN(y)) displayCurrentPartTitle(getCurrentPartFromCursor(y)); - } else if (e.clientY <= tlContainer.offsetTop) { - element.style.top = `${tlContainer.offsetTop}px`; - relatedEl.style.top = `${tlContainer.offsetTop}px`; + } else if (e.clientY < tlContainer.offsetTop + 10) { + element.style.transform = `translateY(0px)`; + relatedEl.style.transform = `translateY(0px)`; } else if (e.clientY >= tlContainerHeight + tlContainer.offsetTop) { - element.style.top = `${tlContainerHeight + tlContainer.offsetTop}px`; - relatedEl.style.top = `${tlContainerHeight + tlContainer.offsetTop}px`; + element.style.transform = `translateY(${tlContainerHeight}px)`; + relatedEl.style.transform = `translateY(${tlContainerHeight}px)`; } } }); document.addEventListener('mouseup', () => { - grabbing = false; + if (grabbing) scrollOnGrab(element); element.style.cursor = 'grab'; + grabbing = false; }); } makeElementDraggable(cursor, titres); makeElementDraggable(titres, cursor); - - - - - -/* let cursorPrevTranslateAmount = +cursor.style.transform.slice(0, -3).slice(11); - // make the cursor draggable - let prevMousePos = 0; - cursor.addEventListener("mousedown", (event) => { - if (!grabbing) { - event.preventDefault(); - grabbing = true; - prevMousePos = event.clientY; - } - }); - window.addEventListener("mousemove", (event) => { - if (grabbing) { - event.preventDefault(); - let newPos = cursorPrevTranslateAmount + (event.clientY - prevMousePos); - if (event.clientY < tlContainerHeight + tlContainer.offsetTop && event.clientY > tlContainer.offsetTop) { - cursor.style.transform = `translateY(${newPos}px)`; - window.scrollBy(0, (event.clientY - prevMousePos) * (bodyHeight / tlContainerHeight)); - cursorPrevTranslateAmount = +cursor.style.transform.slice(0, -3).slice(11); - } else if (event.clientY <= tlContainer.offsetTop) { - cursor.style.transform = "translateY(0px)"; - window.scroll(0, 0); - cursorPrevTranslateAmount = 0; - } else if (event.clientY >= tlContainerHeight + tlContainer.offsetTop) { - cursor.style.transform = `translateY(${tlContainerHeight}px)`; - window.scroll(0, bodyHeight); - cursorPrevTranslateAmount = +cursor.style.transform.slice(0, -3).slice(11); - } - prevMousePos = event.clientY; - } - }); - window.addEventListener("mouseup", (event) => { - if (grabbing) { - grabbing = false; - } - }); - */ - - - - - // get heights of parts dans le tableau et dans la timeline function getSteps() { let tlElSteps = []; @@ -422,45 +448,102 @@ domReady(async () => { }); } - function moveCursorFromScroll(currentPartIndex) { - let currentScroll = window.scrollY; - - let cursorTopValue = 0; - let tlPartHeight, tlPartBottom; - + + // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + // ICI IL Y A LE SCROLL DU GRAB + // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + let isScrollingFromGrab = false; + + function scrollOnGrab(el) { + let scrollValue = + ((getSteps().scrollSteps[getCursorPositionInTimelinePart(el).stepAfterMouseUp] - getSteps().scrollSteps[getCursorPositionInTimelinePart(el).stepAfterMouseUp - 1]) * getCursorPositionInTimelinePart(el).proportionInPart) + + getSteps().scrollSteps[getCursorPositionInTimelinePart(el).stepAfterMouseUp]; + isScrollingFromGrab = true; + window.scrollTo({ top: scrollValue, behavior: 'smooth' }); + setTimeout(() => { + isScrollingFromGrab = false; + }, 2000); + } + + function getCursorPositionInTimelinePart(el) { + let elTransformY; + if (!el.style.transform) { + elTransformY = 0; + } else { + elTransformY = +el.style.transform.split('(')[1].split('p')[0]; + } + + let tlPartHeight, tlPartBottom, tlPartTop, proportionInPart, stepAfterMouseUp; for (let j = 0; j < partRects.length; j++) { - tlPartHeight = partRects[j].getBoundingClientRect().height - tlPartBottom = partRects[j].getBoundingClientRect().top - tlContainer.getBoundingClientRect().top; - cursorTopValue = tlPartBottom; - // get the amount of the current scrollpart scrolled - if (j === currentPartIndex) break; + if (j === getCurrentPartFromCursor(elTransformY)) { + tlPartHeight = partRects[j].getBoundingClientRect().height; + tlPartBottom = partRects[j].getBoundingClientRect().top - tlContainer.getBoundingClientRect().top; + tlPartTop = tlPartBottom - tlPartHeight; + proportionInPart = ((tlPartHeight - (elTransformY - tlPartTop)) / tlPartHeight) * -1; + if (proportionInPart > 0 && proportionInPart < 1) { + stepAfterMouseUp = j; + return {stepAfterMouseUp, proportionInPart}; + } else { + stepAfterMouseUp = j; + proportionInPart = 0; + return {stepAfterMouseUp, proportionInPart}; + } + } } + } - let currentScrollPartBottom = getSteps().scrollSteps[currentPartIndex - 1] ? getSteps().scrollSteps[currentPartIndex - 1] : 0; - let currentScrollPartHeight; - if (getSteps().scrollSteps[currentPartIndex + 1]) { - currentScrollPartHeight = getSteps().scrollSteps[currentPartIndex + 1] - currentScrollPartBottom; - } else { - currentScrollPartHeight = document.querySelector('body').scrollHeight - currentScrollPartBottom; - } - let currentScrollSincePartBottom = currentScroll - currentScrollPartBottom; - let scrollPartProportion = currentScrollSincePartBottom / currentScrollPartHeight; - cursorTopValue = cursorTopValue + tlPartHeight * (tlPartHeight / tlPartHeight * (scrollPartProportion - 0.3)); - - if (cursorTopValue > 0) { - cursor.style.transform = `translateY(${cursorTopValue}px)`; - titres.style.transform = `translateY(${cursorTopValue}px)`; - } else { - cursor.style.transform = `translateY(0px)`; - titres.style.transform = `translateY(0px)`; + // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + // ICI IL Y A LE RAPPORT SCROLL / TIMELINE + // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! + + function moveCursorFromScroll(currentPartIndex) { + if (!isScrollingFromGrab) { + let currentScroll = window.scrollY; + + let cursorTopValue = 0; + let tlPartHeight, tlPartBottom; + + for (let j = 0; j < partRects.length; j++) { + tlPartHeight = partRects[j].getBoundingClientRect().height + tlPartBottom = partRects[j].getBoundingClientRect().top - tlContainer.getBoundingClientRect().top; + cursorTopValue = tlPartBottom; + // get the amount of the current scrollpart scrolled + if (j === currentPartIndex) break; + } + + let currentScrollPartBottom = getSteps().scrollSteps[currentPartIndex - 1] ? getSteps().scrollSteps[currentPartIndex - 1] : 0; + let currentScrollPartHeight; + if (getSteps().scrollSteps[currentPartIndex + 1]) { + currentScrollPartHeight = getSteps().scrollSteps[currentPartIndex + 1] - currentScrollPartBottom; + } else { + currentScrollPartHeight = document.querySelector('body').scrollHeight - currentScrollPartBottom; + } + let currentScrollSincePartBottom = currentScroll - currentScrollPartBottom; + let scrollPartProportion = currentScrollSincePartBottom / currentScrollPartHeight; + + cursorTopValue = cursorTopValue + tlPartHeight * (tlPartHeight / tlPartHeight * (scrollPartProportion - 0.3)); + + if (cursorTopValue > 0) { + cursor.style.transform = `translateY(${cursorTopValue}px)`; + titres.style.transform = `translateY(${cursorTopValue}px)`; + } else { + cursor.style.transform = `translateY(0px)`; + titres.style.transform = `translateY(0px)`; + } } } let prevPartIndex = 0; + let lastCallTimestamp = 0; function displayCurrentPartTitle(currentPartIndex) { - titres.firstElementChild.innerText = getCurrentTime(titresFrise[currentPartIndex]?.el); + if (isNaN(currentPartIndex)) currentPartIndex = 0; + const currentTime = performance.now(); + if (currentTime - lastCallTimestamp >= 400) { + lastCallTimestamp = currentTime; + titres.firstElementChild.innerText = getCurrentTime(titresFrise[currentPartIndex]?.el); // ICI POUR METTRE LE TEMPS BIEN + } let mainEl = titres.children[1]; let subEl = titres.lastElementChild; if (mainEl.innerText != titresFrise[currentPartIndex]?.main || subEl.innerText != titresFrise[currentPartIndex]?.sub) { @@ -487,26 +570,332 @@ domReady(async () => { } } - function getCurrentPartFromCursor(cursorTop) { + function getCurrentPartFromCursor(cursorTransformY) { for (let i = 0; i < getSteps().tlElSteps.length; i++) { - if (cursorTop - tlContainer.offsetTop >= getSteps().tlElSteps[i] && cursorTop - tlContainer.offsetTop < getSteps().tlElSteps[i + 1]) { + if (cursorTransformY >= getSteps().tlElSteps[i] && cursorTransformY < getSteps().tlElSteps[i + 1]) { return(i); - } else if (cursorTop - tlContainer.offsetTop > getSteps().tlElSteps[getSteps().tlElSteps.length - 1]) { + } else if (cursorTransformY > getSteps().tlElSteps[getSteps().tlElSteps.length - 1]) { return(getSteps().tlElSteps.length - 1); } } } + /////////////////////////////////////// + // ICI LE GETCURRENTTIME !!!!!!!!!!!!!! + /////////////////////////////////////// + function getCurrentTime(titleEl) { let nextRow = titleEl?.nextElementSibling; - while(nextRow) { - if (nextRow.offsetTop > window.scrollY && - nextRow.classList.contains('isContentPart')) { - return(nextRow.firstElementChild.innerText); + if (!grabbing) { + while(nextRow) { + if (nextRow.offsetTop > window.scrollY && + nextRow.classList.contains('isContentPart')) { + return(nextRow.firstElementChild.innerText); + } + nextRow = nextRow.nextElementSibling; } - nextRow = nextRow.nextElementSibling; + } else { + let cursor = document.querySelector('#cursor'); + let allRowsUnder = []; + nextRow = nextRow.nextElementSibling.nextElementSibling; + while(nextRow) { + if (nextRow.classList.contains('isMainPart') || nextRow.classList.contains('isSubPart')) { + break; + } + allRowsUnder.push(nextRow); + nextRow = nextRow.nextElementSibling; + } + return allRowsUnder[Math.floor(allRowsUnder.length * getCursorPositionInTimelinePart(cursor).proportionInPart)].firstElementChild.innerText; } } + + + // désactive le loading quand les éléments sont affichés correctement + setTimeout(() => { + let loadingEl = document.getElementById('loading'); + loadingEl.style.opacity = "0"; + setTimeout(() => { + loadingEl.style.display = "none"; + }, 200); + }, 100); + + + // recherche + let searchableContent = document.querySelectorAll('tr td:not(:first-of-type):not(:last-of-type)'); + let searchInput = document.querySelector('input[type="search"]'); + let searchResults = document.querySelector('#search_results'); + let isResultOpen = false; + let resultAmount = 0; + let resultAmountText = document.querySelector('#result_amount'); + let hilightedWords; + let typingTimer; + let currentSelectedWord = 0; + let downArrow = document.querySelector('#search_results div div img:first-of-type'); + let upArrow = document.querySelector('#search_results div div img:last-of-type'); + + let thereAreResults = false; + let inputIsActive = false; + + searchInput.addEventListener('focus', () => { inputIsActive = true; toggleSearchResults(); }); + searchInput.addEventListener('blur', () => { inputIsActive = false; }); + + searchInput.addEventListener('keydown', function(e) { + triggerSearch(); + }); + + function triggerSearch() { + setTimeout(() => { + + hilightedWords = []; + + removeHighlightTags(); + + resultAmount = 0; + + let input = searchInput.value.toLowerCase(); + + if (searchInput.value.length >= 3) { + + thereAreResults = true; + + clearTimeout(typingTimer); + + typingTimer = setTimeout(function() { + + searchInContent(input); + +/* if (!isResultOpen) { + toggleSearchResults(); + } + */ + let currentScroll = window.scrollY; + + if (hilightedWords.length != 0) { + + searchResults.querySelector('div p:first-of-type').style.display = "block"; + searchResults.querySelector('div p:last-of-type').style.display = "none"; + + for (let i = 0; i < hilightedWords.length; i++) { + + let wordBoundingTop = hilightedWords[i].getBoundingClientRect().top; + + if (hilightedWords.length <= 1) { + let scrollValue = (wordBoundingTop + currentScroll) - window.innerHeight / 2; + window.scrollTo({ top: scrollValue, behavior: 'smooth' }); + currentSelectedWord = 1; + resultAmountText.innerText = currentSelectedWord + "/" + resultAmountText.innerText; + upArrow.classList.add('disabled'); + downArrow.classList.add('disabled'); + } else { + if (currentScroll < hilightedWords[i].getBoundingClientRect().top && i === 0) { + + let scrollValue = (wordBoundingTop + currentScroll) - window.innerHeight / 2; + window.scrollTo({ top: scrollValue, behavior: 'smooth' }); + currentSelectedWord = 1; + resultAmountText.innerText = currentSelectedWord + "/" + resultAmountText.innerText; + upArrow.classList.add('disabled'); + downArrow.classList.remove('disabled'); + break; + + } else if ( + currentScroll < wordBoundingTop + currentScroll && currentScroll > hilightedWords[i - 1]?.getBoundingClientRect().top + currentScroll + ) { + + let scrollValue = (wordBoundingTop + currentScroll) - window.innerHeight / 2; + window.scrollTo({ top: scrollValue, behavior: 'smooth' }); + currentSelectedWord = i + 1; + resultAmountText.innerText = currentSelectedWord + "/" + resultAmountText.innerText; + upArrow.classList.remove('disabled'); + downArrow.classList.remove('disabled'); + break; + + } else if (currentScroll > wordBoundingTop && i === hilightedWords.length - 1) { + + let scrollValue = (wordBoundingTop + currentScroll) - window.innerHeight / 2; + window.scrollTo({ top: scrollValue, behavior: 'smooth' }); + currentSelectedWord = hilightedWords.length; + resultAmountText.innerText = currentSelectedWord + "/" + resultAmountText.innerText; + upArrow.classList.remove('disabled'); + downArrow.classList.add('disabled'); + break; + + } + + } + + } + + } else { + searchResults.querySelector('div p:first-of-type').style.display = "none"; + searchResults.querySelector('div p:last-of-type').style.display = "block"; + upArrow.classList.add('disabled'); + downArrow.classList.add('disabled'); + } + + }, 800); + + } else { + removeHighlightTags(); + thereAreResults = false; + + searchResults.querySelector('div p:first-of-type').style.display = "none"; + searchResults.querySelector('div p:last-of-type').style.display = "block"; + upArrow.classList.add('disabled'); + downArrow.classList.add('disabled'); +/* if (isResultOpen) { + toggleSearchResults(); + } + */ } + }, 10); + } + + function searchInContent(input) { + for (let content of searchableContent) { + + if (content.innerText != '') { + + for (let textEl of content.children) { + + if (textEl.innerText !== '') { + + if (textEl.innerHTML.toLowerCase().includes(input)) { + + let splitContent = textEl.innerHTML.toLowerCase().split(input); + + let processedText = ''; + + for (let i = 0; i < splitContent.length; i++) { + + if (splitContent[0] !== '' || splitContent[splitContent.length - 1] !== '') { + + if (i === 0) { + processedText += textEl.innerHTML.substring(0, splitContent[i].length); + + } else { + let amountOfTextToConcatenate = 0; + for (let j = 0; j <= i - 1; j ++) { + amountOfTextToConcatenate += splitContent[j].length + input.length; + } + processedText += + '' + + textEl.innerHTML.substring(amountOfTextToConcatenate - input.length, amountOfTextToConcatenate) + + '' + + textEl.innerHTML.substring( + amountOfTextToConcatenate, amountOfTextToConcatenate + splitContent[i].length + ); + + } + } else if (splitContent[splitContent.length - 1] === '' && splitContent[0] === '') { + processedText = '' + textEl.innerHTML.substring(splitContent[i - 1].length, splitContent[i - 1].length + input.length) + ''; + + } + + } + + textEl.innerHTML = processedText; + + hilightedWords = document.querySelectorAll('.highlight'); + resultAmount = hilightedWords.length; + + } + + } + + } + } + } + + resultAmountText.innerText = resultAmount; + } + + function removeHighlightTags() { + for (let content of searchableContent) { + if (content.innerHTML.includes('')) { + content.innerHTML = content.innerHTML.replace(/|<\/span>/g, ''); + } + } + } + + function toggleSearchResults() { + if (thereAreResults || inputIsActive) { + searchResults.style.display = "block"; + searchResults.style.opacity = 1; + searchResults.style.maxHeight = "1000px"; + isResultOpen = true; + } else { + searchResults.style.opacity = 0; + searchResults.style.maxHeight = "0px"; + isResultOpen = false; + setTimeout(() => { + searchResults.style.display = "none"; + }, 300); + } + } + + upArrow.addEventListener('click', function (el) { + if (!el.target.classList.contains('disabled')) { + let currentScroll = window.scrollY; + currentSelectedWord--; + + let wordBoundingTop = hilightedWords[currentSelectedWord - 1].getBoundingClientRect().top; + + let scrollValue = (wordBoundingTop + currentScroll) - window.innerHeight / 2; + window.scrollTo({ top: scrollValue, behavior: 'smooth' }); + resultAmountText.innerText = currentSelectedWord + "/" + resultAmountText.innerText.split('/')[1]; + + if (currentSelectedWord === 1) { + upArrow.classList.add('disabled'); + downArrow.classList.remove('disabled'); + } else { + upArrow.classList.remove('disabled'); + downArrow.classList.remove('disabled'); + } + + } + }); + + downArrow.addEventListener('click', function (el) { + if (!el.target.classList.contains('disabled')) { + let currentScroll = window.scrollY; + currentSelectedWord++; + + let wordBoundingTop = hilightedWords[currentSelectedWord - 1].getBoundingClientRect().top; + + let scrollValue = (wordBoundingTop + currentScroll) - window.innerHeight / 2; + window.scrollTo({ top: scrollValue, behavior: 'smooth' }); + resultAmountText.innerText = currentSelectedWord + "/" + resultAmountText.innerText.split('/')[1]; + + if (currentSelectedWord === hilightedWords.length) { + downArrow.classList.add('disabled'); + upArrow.classList.remove('disabled'); + } else { + downArrow.classList.remove('disabled'); + upArrow.classList.remove('disabled'); + } + } + }); + + let tagsDiv = document.querySelector('#search_results > div:last-of-type'); + + window.addEventListener('click', function (el) { + if (!searchResults.contains(el.target) && isResultOpen && el.target != searchInput && el.target != tagsDiv) { + toggleSearchResults(); + } + }); + + let searchWordList = document.querySelector('#content_search_tag'); + searchWordList = searchWordList.innerText.substring(1, searchWordList.innerText.length - 1).split(', '); + + for (let tag of searchWordList) { + let tagWrapper = document.createElement('p'); + tagWrapper.innerText = tag; + tagWrapper.addEventListener('click', function () { + searchInput.value = tag; + triggerSearch(); + }); + tagsDiv.appendChild(tagWrapper); + } + }); /** diff --git a/resources/scripts/custom-editor-script.js b/resources/scripts/custom-editor-script.js new file mode 100644 index 0000000..b2a1e36 --- /dev/null +++ b/resources/scripts/custom-editor-script.js @@ -0,0 +1,21 @@ +(function($) { + // Access the page content + var pageContent = pageContentData.content; + + // Now you can use the 'pageContent' variable in your JavaScript code + console.log(pageContent); + + setTimeout(() => { + let editorWriting = document.querySelector('.edit-post-visual-editor'); + let writingSpace = document.querySelector('.block-editor-writing-flow'); + writingSpace.style.padding = "0"; + console.log(editorWriting); + let tutorialWrapper = document.createElement('div'); + tutorialWrapper.style.width = "100%"; + tutorialWrapper.style.backgroundColor = "#384756"; + tutorialWrapper.style.padding = "20px"; + tutorialWrapper.innerHTML = pageContent; + editorWriting.appendChild(tutorialWrapper); + }, 2000); + +})(jQuery); diff --git a/resources/styles/admin_custom.css b/resources/styles/admin_custom.css new file mode 100644 index 0000000..c78d02c --- /dev/null +++ b/resources/styles/admin_custom.css @@ -0,0 +1,139 @@ +@font-face { + font-family: "Authentic_Sans_60"; + src: url("../assets/fonts/authentic-sans-90/AUTHENTICSans-60.woff") format("woff"), + url("../assets/fonts/authentic-sans-90/AUTHENTICSans-60.woff2") format("woff2"), + url("../assets/fonts/authentic-sans-90/AUTHENTICSans-60.otf") format("otf"); + font-style: normal; +} + +html { + background-color: #1e262e !important; +} + +body.wp-admin { + background-color: #26313b; + color: white !important; + font-family: "Authentic_Sans_60"; +} + +.wp-admin table, +.wp-admin #adminmenuwrap li, +.wp-admin #adminmenuwrap ul { + background: #1f2730 !important; + border: none; +} + +.wp-admin #adminmenu li.current a { + background: #384756 !important; +} + +.wp-admin .selected { + background-color: #384756 !important; +} + +#wpadminbar .menupop { + background: #1e262e !important; +} + +.wp-admin li, +.wp-admin ul { + background-color: #26313b !important; +} + +.wp-admin .current::after { + border-right-color: #26313b !important; +} + +.wp-admin table tbody tr, +.wp-admin #adminmenuback, +.wp-admin #adminmenuwrap, +.wp-admin #adminmenu, +#wpadminbar { + background-color: #1e262e !important; +} + +.wp-admin th, +.wp-admin h1, +.wp-admin h2, +.wp-admin p, +.wp-admin label, +.wp-admin abbr, +.wp-admin td { + color: white !important; +} + +.wp-admin a { + color: #bbb !important; +} + + +.editor-styles-wrapper { + background-color: #26313b !important; +} + +.edit-post-header { + background-color: #1e262e !important; + color: white !important; +} + +.edit-post-header .components-button svg { + fill: white !important; + outline: white !important; +} + +.edit-post-header button { + color: white !important; + outline-color: white !important; + background: none !important; +} + +.interface-interface-skeleton__footer { + display: none !important; +} + +.components-panel__header { + background-color: #26313b !important; +} + +.components-panel__header ul li button { + color: white !important; +} + +/* .components-panel__header ul li:last-of-type { + display: none; +} */ + +.components-panel__header button svg { + fill: white !important; + outline: white !important; +} + +.interface-interface-skeleton__sidebar { + background-color: #1e262e !important; +} + +.components-panel__body-title:hover { + background-color: initial !important; +} + +.components-panel__body-title button { + color: white !important; +} + +.components-panel__body-title button svg { + fill: white !important; + outline: white !important; +} + +.components-panel { + background-color: #1e262e !important; + color: white !important; +} +/* +.components-panel > div { + display: none !important; +} */ + +.components-panel > div:first-of-type { + display: block !important; +} \ No newline at end of file diff --git a/resources/styles/app.css b/resources/styles/app.css index 6b814c2..63c8258 100644 --- a/resources/styles/app.css +++ b/resources/styles/app.css @@ -28,7 +28,6 @@ url("/assets/fonts/authentic-sans-90/AUTHENTICSans-60.woff2") format("woff2"), url("/assets/fonts/authentic-sans-90/AUTHENTICSans-60.otf") format("otf"); font-style: normal; - } @font-face { @@ -47,5 +46,163 @@ font-style: italic; } - + #wpadminbar { + display: none; + } + + thead::after { + content: ''; + display: block; + position: fixed; + width: 100px; + height: 80px; + background-color: #010d19; + top: 100px; + left: 83.3333vw; + z-index: 10; + } + + .isContentPart td:last-of-type { + position: absolute; + width: auto !important; + padding: 0; + right: 14vw; + height: auto; + display: flex; + align-items: center; + padding-bottom: 0.75rem; + } + + .isContentPart td:last-of-type a { + font-size: 1.1rem; + opacity: 0.4; + transition: opacity 0.2s ease-in; + } + + .isContentPart td:last-of-type a:hover { + opacity: 1 !important; + } + + .isContentPart:hover td:last-of-type a { + opacity: 0.7; + } + + em { + font-family: "Libre_Caslon"; + font-style: italic; + } + + .xoo-el-sidebar { + max-width: 50%; + background-color: #eee; + } + + .xoo-el-sidebar p { + padding: 40px 40px; + color: 010d19; + } + + #about_popup { + z-index: 10; + position: fixed; + top: 0; + left: 0; + display: none; + opacity: 0; + width: 100vw; + height: 100vh; + align-items: center; + justify-content: center; + transition: opacity 0.3s ease-out; + } + + #about_popup #about_modale { + position: relative; + background-color: white; + color: #010d19; + width: 75vw; + } + + #about_popup #about_modale span { + position: absolute; + top: -11px; + right: -11px; + color: #010d19; + font-size: 23px; + border-radius: 50%; + background-color: white; + border: 4px solid white; + cursor: pointer; + } + + #about_popup #about_modale span:hover { + color: red; + } + + #about_popup #about_modale #about_title { + color: #010d19; + background-color: white; + width: 100%; + height: 80px; + text-align: center; + font-family: 'Libre_Caslon'; + padding-top: 25px; + text-transform: uppercase; + font-size: 1.3rem; + } + + #about_popup #about_modale #about_content { + color: #010d19; + background-color: #eee; + padding: 40px 30px; + height: 100%; + } + + #about_popup #about_modale #about_content p { + margin-bottom: 15px; + } + + .highlight { + color: #010d19; + background-color: yellow; + } + + input { + width: 100%; + } + + #search_results { + display: none; + top: 8vh; + background-color: #26313b; + max-height: 0px; + height:auto; + opacity: 0; + transition: opacity 0.3s ease, max-height 0.3s ease; + } + + #search_results img.disabled { + opacity: 0.4; + cursor: default; + } + + #search_results > div:last-of-type { + padding: 15px; + border-top: solid 1px white; + } + + #search_results > div:last-of-type p { + display: inline-block; + padding: 3px 9px; + margin: 5px 3px; + border: solid 1px white; + border-radius: 10px; + background-color: rgba(255, 255, 255, 0.2); + cursor: pointer; + transition: background-color 0.2s ease; + } + + #search_results > div:last-of-type p:hover { + background-color: rgba(255, 255, 255, 0.1); + } } \ No newline at end of file diff --git a/resources/styles/custom-editor-style.css b/resources/styles/custom-editor-style.css new file mode 100644 index 0000000..a10f72e --- /dev/null +++ b/resources/styles/custom-editor-style.css @@ -0,0 +1,57 @@ +.edit-post-header > div:first-of-type, +.block-editor-block-toolbar { + display: none !important; +} + +/* .block-library-classic__toolbar + */ + +#mceu_54-body > div:first-of-type, +#mceu_54-body > div:nth-of-type(2), +#mceu_54-body > div:nth-of-type(4), +#mceu_54-body > div:nth-of-type(5), +#mceu_54-body > div:nth-of-type(6), +#mceu_54-body > div:nth-of-type(7), +#mceu_54-body > div:nth-of-type(8), +#mceu_54-body > div:nth-of-type(9), +#mceu_54-body > div:nth-of-type(10), +#mceu_54-body > div:nth-of-type(11), +#mceu_54-body > div:nth-of-type(12), +#mceu_54-body > div:nth-of-type(13), +#mceu_54-body > div:nth-of-type(14) { + display: none !important; +} + +.edit-post-header-toolbar__left > button:first-of-type, +.edit-post-header-toolbar__left > div:first-of-type, +.edit-post-header-toolbar__left > button:last-of-type { + display: none !important; +} + +.edit-post-header__settings > button:first-of-type, +.edit-post-header__settings > div:first-of-type, +.edit-post-header__settings > div:last-of-type, +.edit-post-header__settings > button:last-of-type, +.block-editor-inserter, +.components-panel__header ul > li:last-of-type { + display: none !important; +} + +.components-panel > div:not(:first-of-type), +.edit-post-post-status > h2, +.edit-post-post-status > div:nth-of-type(3) { + display: none !important; +} + +.rvy-author-selection, +.rvy-submission-div > a:last-of-type, +.revision-created > a { + display: none !important; +} + +#bulk-action-selector-top > option[value="submit_revision"], +#bulk-action-selector-top > option[value="approve_revision"], +#bulk-action-selector-top > option[value="decline_revision"], +#bulk-action-selector-top > option[value="publish_revision"] { + display: none !important; +} \ No newline at end of file diff --git a/resources/views/index.blade.php b/resources/views/index.blade.php index 8114e0e..d26d98d 100644 --- a/resources/views/index.blade.php +++ b/resources/views/index.blade.php @@ -1,6 +1,21 @@ @extends('layouts.app') @section('content') +
+
+ +
+ À propos +
+
+ post_content) ?> +
+
+
+ + + +
@@ -12,7 +27,7 @@ - + @@ -26,7 +41,7 @@ $args = array( 'post_type' => 'post', 'posts_per_page' => -1, - 'meta_key' => 'Index', + 'meta_key' => 'index', 'meta_type' => 'NUMERIC', 'orderby' => 'meta_value', 'order' => 'ASC' @@ -35,27 +50,52 @@ if ($query->have_posts()) : while ($query->have_posts()) : $query->the_post(); - $contenu = get_the_content(); + if (get_post_meta(get_the_ID(), 'isMainPart', true)) { ?> + + + + + + + + - - - - - - - - - + + + + + + + + + @if (! have_posts()) {!! __('Sorry, no results were found.', 'sage') !!} diff --git a/resources/views/sections/footer.blade.php b/resources/views/sections/footer.blade.php index c02645f..1fc21da 100644 --- a/resources/views/sections/footer.blade.php +++ b/resources/views/sections/footer.blade.php @@ -1,8 +1,8 @@ + +
+

+ Chargement + . + . + . +

+
+ + diff --git a/resources/views/sections/header.blade.php b/resources/views/sections/header.blade.php index d85770d..305d8cb 100644 --- a/resources/views/sections/header.blade.php +++ b/resources/views/sections/header.blade.php @@ -1,7 +1,20 @@
- - + +
@@ -10,13 +23,36 @@ Le Livre d'Image -
+
+
+
+

0 occurences

+ +
+ arrow down + arrow up +
+
+
+
+
+ + @if (has_nav_menu('primary_navigation')) -
+ +
Images Voix Off et In
+
+
{{ get_post_meta(get_the_ID(), 'isMainPart', true) }}
+
+
+
{{ get_post_meta(get_the_ID(), 'isSubPart', true) }}
+
{{ the_title()}}🖉';} elseif (!is_user_logged_in()) { echo '';}?>
{{ the_title()}} + 🖉'; + } elseif (!is_user_logged_in()) { + echo ''; + }?> +