From f477314613beb26b0ce4c61ec0b1900df1de1cb1 Mon Sep 17 00:00:00 2001 From: polo Date: Mon, 1 Sep 2025 18:52:17 +0200 Subject: =?UTF-8?q?renommage=20des=20pr=C3=A9sentations,modif=20pr=C3=A9se?= =?UTF-8?q?ntation=20des=20blocs=20et=20largeur=20min=20(donc=20nb=20de=20?= =?UTF-8?q?colonnes)=20en=20mode=20grid,=20corrections=20de=20bugs=20et=20?= =?UTF-8?q?erreurs=20404,=20le=20param=20page=5Fmodif=20n'est=20plus=20une?= =?UTF-8?q?=20action,=20l=C3=A9g=C3=A8re=20symfonyfication=20du=20routeur?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/css/body.css | 28 +++++------------- public/css/modif_page.css | 46 +++++++++++++++++++++-------- public/js/modif_page.js | 75 +++++++++++++++++++++++++++++++++++++---------- 3 files changed, 101 insertions(+), 48 deletions(-) (limited to 'public') diff --git a/public/css/body.css b/public/css/body.css index 17bdad5..af178a8 100644 --- a/public/css/body.css +++ b/public/css/body.css @@ -49,6 +49,10 @@ main background-color: #E3F3FF; padding: 15px 0; } +.hidden +{ + display: none; +} section > h3 { padding: 15px; @@ -62,28 +66,10 @@ section > h3 padding: 15px; } -.grid_columns +.grid > .section_child { - display: grid; - grid-template-columns: repeat(3, 1fr); -} -@media screen and (max-width: 800px) -{ - .grid_columns - { - grid-template-columns: repeat(2, 1fr); - } -} -@media screen and (max-width: 600px) -{ - article - { - /*margin: 5px;*/ - } - .grid_columns - { - display: block; - } + display: grid; /* et c'est tout */ + /*grid-template-columns: repeat(auto-fit, minmax(' . $min_width . 'px, 1fr)); */ /* dans PostBlockBuilder et NewsBlockBuilder */ } .galery_photos { diff --git a/public/css/modif_page.css b/public/css/modif_page.css index d6fc23e..9048f05 100644 --- a/public/css/modif_page.css +++ b/public/css/modif_page.css @@ -5,7 +5,7 @@ padding: 10px; margin: 10px 15px; } -.page_modification form select, .page_modification form input[type=submit] +.page_modification select, .page_modification input[type=submit] { color: #ff1d04; font-size: medium; @@ -17,7 +17,7 @@ { cursor: pointer; }*/ -.page_modification form input[type=submit]:hover +.page_modification input[type=submit]:hover { background-color: yellow; border-radius: 4px; @@ -29,10 +29,10 @@ flex-wrap: wrap; justify-content: space-evenly; } -.edit_page_zone, .edit_bloc_zone, .delete_page_zone +.edit_page_zone, .edit_block_zone, .delete_page_zone { background-color: #f0f0f0f0; - margin: 5px; + margin: 8px 5px; padding: 10px; } #edit_description @@ -47,32 +47,54 @@ { vertical-align: top; } -.edit_bloc_zone +.edit_block_zone { display: flex; justify-content: space-evenly; flex-wrap: wrap; } -.edit_page_zone p, .edit_bloc_zone p, .edit_page_zone form +.edit_page_zone p, .edit_block_zone p, .edit_page_zone form { margin: 5px; } -.new_bloc #bloc_title +.new_block #bloc_title { width: 70%; max-width: 300px; } -.modify_bloc > div + +.modify_block img +{ + vertical-align: middle; +} +.delete_page_zone +{ + text-align: center; +} +.modify_one_block +{ + background-color: white; + margin: 8px 0; + padding: 5px; +} +.modify_one_block > * +{ + /*text-wrap: nowrap;*/ +} +.modify_one_block > div { display: flex; align-items: baseline; } -.modify_bloc img +.block_options > * { - vertical-align: middle; + /*display: flex; + flex-wrap: wrap;*/ + text-wrap: nowrap; } -.delete_page_zone +.grid_options { - text-align: center; + /*text-wrap: nowrap;*/ /* saut de la div grid_options */ + flex-wrap: wrap; /* éléments à l'intérieur de grid_options lorsque lui-même dépasse la largeur dispo (téléphone) */ } \ No newline at end of file diff --git a/public/js/modif_page.js b/public/js/modif_page.js index b307f69..615f34a 100644 --- a/public/js/modif_page.js +++ b/public/js/modif_page.js @@ -19,9 +19,7 @@ function changePageTitle(page_id){ fetch('index.php?page_edit=page_title', { method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, + headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({title: page_name.value, page_id: page_id}) }) .then(response => response.json()) @@ -49,9 +47,7 @@ function changePageTitle(page_id){ fetch('index.php?page_edit=page_menu_path', { method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, + headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({page_menu_path: page_name_path.value, page_id: page_id}) }) .then(response => response.json()) @@ -88,9 +84,7 @@ function changeDescription(node_data_id){ fetch('index.php?page_edit=page_description', { method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, + headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({description: textarea.value, node_data_id: node_data_id}) }) .then(response => response.json()) @@ -117,9 +111,7 @@ function renamePageBloc(bloc_id){ fetch('index.php?bloc_edit=rename_page_bloc', { method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, + headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({bloc_title: input.value, bloc_id: bloc_id}) }) .then(response => response.json()) @@ -159,9 +151,7 @@ function switchBlocsPositions(bloc_id, direction, current_page) { fetch('index.php?page=' + current_page + '&bloc_edit=switch_blocs_positions', { method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, + headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ id1: bloc_id, id2: parseInt(other_bloc.id) }) }) .then(response => response.json()) @@ -187,4 +177,59 @@ function switchBlocsPositions(bloc_id, direction, current_page) { .catch(error => { console.error('Erreur:', error); }); +} + +function changePresentation(bloc_id){ + const presentation = document.getElementById('presentation_select_' + bloc_id).value; + + fetch('index.php?bloc_edit=change_presentation', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ id: bloc_id, presentation: presentation }) + }) + .then(response => response.json()) + .then(data => { + if(data.success){ + document.getElementById(bloc_id).className = presentation; + document.getElementById('cols_min_width_edit_' + bloc_id).className = presentation === 'grid' ? '' : 'hidden'; + console.log('changement de présentation'); + } + else{ + console.log('Erreur au changement de présentation côté serveur'); + } + }) + .catch(error => { + console.error('Erreur:', error); + }); +} + +function changeColsMinWidth(bloc_id){ + const cols_min_width_input = document.getElementById('cols_min_width_select_' + bloc_id); + + if(cols_min_width_input.value < 150){ + cols_min_width_input.value = 150; + } + else if(cols_min_width_input.value > 500){ + cols_min_width_input.value = 500; + } + + fetch('index.php?bloc_edit=change_cols_min_width', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ id: bloc_id, cols_min_width: cols_min_width_input.value }) + }) + .then(response => response.json()) + .then(data => { + if(data.success){ + document.getElementById(bloc_id).className = 'grid'; + document.getElementById(bloc_id).querySelector(".section_child").style.gridTemplateColumns = 'repeat(auto-fit, minmax(' + data.cols_min_width + 'px, 1fr))'; + console.log('changement de la largeur minimum en mode grille'); + } + else{ + console.log('Erreur au changement du nb de colonnes en mode grille côté serveur'); + } + }) + .catch(error => { + console.error('Erreur:', error); + }); } \ No newline at end of file -- cgit v1.2.3