drupal-rorschach/web/themes/custom/rorschach/scripts/main.js

console.log('salut');

// fusion cellules dans tableau

///
// doit chercher un p dans td dans tbody dans table dans .paragraph--type--text qui a la class .rowspan et setAttribut a son parent td

// var cellRowspan = document.querySelector('p.rowspan').parentElement;
// cellRowspan.setAttribute('rowspan', '4');

// // ok va chercher tous les éléments p.cell-display-none (child)
// const pDisplayNone = document.querySelectorAll('p.cell-display-none');
// console.log(pDisplayNone);





// // ok va chercher un element td (parent)
// var tdDisplayNone = document.querySelector('p.cell-display-none').parentElement;   
// console.log(tdDisplayNone);
// /// et lui appliquer une class.
// tdDisplayNone.classList.add('display-none');

///// comment aller chercher TOUS les éléments td ?  //////
let p = document.querySelectorAll('p.cell-display-none');



let pDisplayNone = document.querySelector('p.cell-display-none');
console.log(pDisplayNone);
let tdparent = [];
while(pDisplayNone.parentNode.closest('td')){
    tdparent.push(pDisplayNone.parentNode.closest('td'));
    pDisplayNone = pDisplayNone.parentNode.closest('td');
}
console.log(tdparent);


/// pour chaque élément de array pDisplayNone ( NodeList ), 
// pDisplayNone.forEach((element) =>document.querySelectorAll('td'));

/// aller chercher le parent td 
/// et lui appliquer une class.

// faut faire un array de td avant de faire un for each
// let td = new Array(pDisplayNone);
// console.log(td);












// const parent = document.getElementById("parent");
// let childNodes = parent.childNodes;
// console.log(childNodes.length); // let's assume "2"
// parent.appendChild(document.createElement("div"));
// console.log(childNodes.length); // outputs "3"



// function displayNone(){

  // for (let i = 0; i < cellsDisplayNone.lenght; i++ ){
  //   const cellDisplayNone = cellsDisplayNone.parentElement[i]
  //   // let cellDisplayNone = this.parentElement.getElementsByClassName("cell-display-none");
  //   // console.log(cellDisplayNone);


  // }

  
// };
// cellDisplayNone.classList.add('display-none');
// cellDisplayNone.style.display ="none";




// for (let i = 0; i < cellDisplayNone.lenght; i++ ){

//   cellDisplayNone.style.display ="none";
// }


//////////////

// var cellsRowspan = document.getElementsByClassName("rowspan");
// var cellsDisplayNone = document.getElementsByClassName("cell-display-none");

// function rowspan(){
//   // for (let i = 0; i < cellsRowspan.length; i++){
//   //   cellsRowspan[i].
//   // }
//   let cellRowspan = this.parentNode.querySelector(".rowspan");
//   cellRowspan.setAttribute('rowspan', '4');
// }









// function tableOne(){
//   var table1cell1 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
//   var table1cell2 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
//   var table1cell3 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
//   var table1cell4 = document.querySelector('#tablefield-paragraph-34-field_tablefield-0.tablefield tbody tr td.row_4.col_1');

//   table1cell1.setAttribute('rowspan', '4');
//   table1cell2.style.display ="none";
//   table1cell3.style.display ="none";
//   table1cell4.style.display ="none";
// }


// // function tableTwo(){
// //   var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
// //   var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
// //   var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
// //   var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');
  
// //   table2cell1.setAttribute('rowspan', '4');
// //   table2cell2.style.display ="none";
// //   table2cell3.style.display ="none";
// //   table2cell4.style.display ="none";
  
// // }

// tableOne();
// tableTwo();

// var table2cell1 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_1.col_1');
// var table2cell2 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_2.col_1');
// var table2cell3 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_3.col_1');
// var table2cell4 = document.querySelector('#tablefield-paragraph-29-field_tablefield-0.tablefield tbody tr td.row_4.col_1');

// table2cell1.setAttribute('rowspan', '4');
// table2cell2.style.display ="none";
// table2cell3.style.display ="none";
// table2cell4.style.display ="none";


// const table = document.getElementByClass("paragraph--type--text");
// console.log(hello);
// for (const child of table.children) {
//   console.log(child.tagName);
// }

// const paragraph = document.getElementsByClassName("paragraph--type--text");
// for (const table of paragraph.children){
//   table.addClass("rowspan");
// }