Discussion :

[patlabar]

Bonjour,

Je suis à peine un peu plus que débutant en bash...
Je suis en train d'écrire un script pour transformer des pages html qui contiennent des tableaux afin de les rendre responsives via bootstrap.
La composition des tableaux varient au sein d'une même page et d'une page à l'autre.



Voici les étapes que j'ai repérées :
1 - Pour chaque ligne de tableau encadrée par les balises <tr> et </tr>, je dois compter le nombre de fois où la balise <td> est présente.

J'arrive à compter le nombre de fois ou un motif apparaît sans un fichier de la manière suivante :
grep -c "motif" nom_du_fichier

mais il faudrait que je puisse travailler dans mon fichier sur ce qui est entre les <tr> et </tr>

2 - Si entre les balises <tr> et </tr>, il y a une image, récupérer la valeur de width pour savoir la proportion que prend l'image par rapport à la page.
3 - A partir de ces infos, je vais faire des calculs : avoir une valeur pour la cellule qui contient l'image et une autre pour les autres cellules
et réinjecter mes résultats pour remplacer les <td> par des <div> avec des classes adaptées.
Pour réinjecter ces résultats, il faut aussi que je puisse sélectionner la ou les balises <td> qui sont suivies d'une image.

Voici le code avant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<tr> 
        <td> 
        	<img src="fichier_image.jpg" alt="" width="299" height="319"> 
        </td>
        <td>
        	<p>Texte</p>	
        </td>
        <td>
        	<p>Texte</p>	
        </td>
        <td>
        	<p>Texte</p>	
        </td>
 </tr>

et ce que je veux obtenir :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<div class="row"> 
        <div class="col-$largeur_image> 
        	<img src="fichier_image.jpg" alt="" width="299" height="319"> 
        </div>
        <div class="col-$largeur_texte>
        	<p>Texte</p>	
        </div>
        <div class="col-$largeur_texte>
        	<p>Texte</p>	
        </div>
        <div class="col-$largeur_texte>
        	<p>Texte</p>	
        </div>
 </div>

Voici le script provisoire que j'ai écrit :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
nom=fichier.html
 
# pour isoler une ligne comprise entre <tr> et </tr> et compter le nombre d'occurences <td> puis les affecter dans une variable :
nb_cellules=$(tr '\n' '^' <$nom | grep -o -P '(?<=<tr>).*(?=</tr>)' |tr '^' '\n' |  grep -c "<td>")
 
colonne_bootstrap=$((12/nb_cellules))
 
# pour connaître la largeur de l'image
long=$(tr '\n' '^' <fichier.html | grep -o -P '(?<=width=").*(?=")')
largeur_image="${long:0:3}"
 
echo $long
echo $largeur_image
 
# pour remplacer le <td avec la classe bootstrap adaptée :
tr '\n' '^'<fichier.html | tr -d [:blank:] | sed -i "s/<td>^<img/<div class=\"col-'$largeur_image'\"\ /g" fichier.html | tr '^' '\n'
# cette commande fonctionne quand je l'utilise seule dans le terminal mais pas dans mon script, sans doute un pb de sortie/entrée des processus...
 
sed -i "s/<td/\<div class="col-$colonne_bootstrap"/g;s/<\/td>/<\/div>/;s/<tr>/<div class=\"row\">/;s/<\/tr>/<\/div>/" fichier.html

Il y a sans doute des erreurs et d'autres manières plus élégantes et économique d'écrire tout cela...
Merci pour vos retours.
Patrick

[N_BaH]

bonjour,

le HTML étant un langage balisé sans aucune obligation de format (les balises peuvent être n'importe où, les lignes vierges ne sont pas significatives, et tout le fichier peut être sur une seule ligne), le shell n'est pas un langage adapté à son traitement.
il est préférable d'utiliser xmllint.

[Dens1]

Bonjour,
oui mais je crois l'objectif est de modifier vite fait un fichier html en le réécrivant (rien à voir avec le html ou le php ou quoique ce soit d'autre ....).
Le problème me semble juste de réécrire massivement un ou plusieurs fichiers avec des valeurs modifiées, et remplacer les tableaux par des div.

Si c'est le cas, à vue de nez sed est ton ami. Mais de toute façon il faut un script avec des boucles si plusieurs fichiers.
Si tu découvres Sed, ça va prendre un peu de temps. AMHA

Il est facile de remplacer tous les <tr> par <div> et les </tr> par </div>, etc ...
il faudrait grep toues les <img> et récupérer avec sed les valeurs de width et height, ...
Quoique ... Vu que <img ne varie pas, pourquoi récupérer les valeurs ? width je vois, c'est $largeur_image, mais $largeur-texte c'est quoi ?

PS: et responsives ? c'est à dire ?

[N_BaH]

modifier vite fait un fichier html [...]rien à voir avec le html

le shell n'est pas adapté au traitement d'un langage balisé (html, xml, json...). J'ai expliqué pourquoi, je ne sais pas comment le dire autrement.
le script shell qui va fonctionner pour un fichier html (ou autre balisage) peut ne pas fonctionner pour un autre; c'est dommage pour du traitement par lot* !
alors que xmllint (ou python, ou perl, avec la bibliothèque ad'hoc (si nécessaire)) n'aura pas de souci.

PS: et responsives ? c'est à dire ?

+1

--
* il est bien question de "transformer des pages" dans le premier message.

[Dens1]

alors que xmllint (ou python, ou perl, avec la bibliothèque ad'hoc (si nécessaire)) n'aura pas de souci.

j'ignore tout ça, aucune notion. Si c'est plus simple, un jour j'explorerai si j'ai besoin (c'est tellement vaste).

[Christophe]

Je rejoint N_BaH.

Tu pourras y arriver mais en galérant, alors que tu as des outils adaptés à cela.

[patlabar]

Bonjour,
oui mais je crois l'objectif est de modifier vite fait un fichier html en le réécrivant (rien à voir avec le html ou le php ou quoique ce soit d'autre ....).
Le problème me semble juste de réécrire massivement un ou plusieurs fichiers avec des valeurs modifiées, et remplacer les tableaux par des div.

C'est bien ça.

Si c'est le cas, à vue de nez sed est ton ami. Mais de toute façon il faut un script avec des boucles si plusieurs fichiers.
Si tu découvres Sed, ça va prendre un peu de temps. AMHA

Je commence à me familiariser au sed.

Il est facile de remplacer tous les <tr> par <div> et les </tr> par </div>, etc ...
il faudrait grep toues les <img> et récupérer avec sed les valeurs de width et height, ...
Quoique ... Vu que <img ne varie pas, pourquoi récupérer les valeurs ? width je vois, c'est $largeur_image, mais $largeur-texte c'est quoi ?

Sur les différentes pages que j'ai à traité (12 000 environ), je vais avoir un nombre varié d'images par page avec des width différentes et un nombre de colonnes différent.

PS: et responsives ? c'est à dire ?

C'est à dire que la mise en page puisse s'adapter aux différentes tailles d'écran. D'où l'utilisation de bootstrap.

[patlabar]

bonjour,

le HTML étant un langage balisé sans aucune obligation de format (les balises peuvent être n'importe où, les lignes vierges ne sont pas significatives, et tout le fichier peut être sur une seule ligne), le shell n'est pas un langage adapté à son traitement.
il est préférable d'utiliser xmllint.

Merci pour ce retour.

Je vais creuser xmllint mais cela m'a l'air complexe.