Script de modification de fichier css px --> em

Version imprimable

14/11/2017, 17h40
Mushu_Senjak

Script de modification de fichier css px --> em

Bonjour à tous.

Dans le cadre de mon travail je suis censé modifier une cinquantaine de fichier css.
Le but est de changer toutes les valeurs aillant une unité en px, pour la changer en em.
Rien de bien compliquer à la base: C'est une unité proportionnelle qui vaut em = px / taille de référence
(dans mon cas la taille de référence c'est 12px donc em = px / 12)

Mais voilà le "problème". Les fichiers font une centaine de lignes chacun et j'ai envie d'automatiser tout ça.(parce que, un j'ai la flemme et deux j'ai envie de découvrir le python)

En gros --> repéré dans un fichier texte toutes les valeurs ressemblant a 960px (regex ?)
faire le calcule 80 = 960/12
modifier la valeur 960px en 80em.

Je voulais donc savoir si tout cela était possible en python (je n'y ai jamais touché)
Et si vous pouviez m'indiquer un début de marche à suivre ^^'.
ou au moins un indice.

Merci d'avance

Bon après avoir trouvé un tout petit peu d'aide dans mon entreprise, J'ai réussi a pondre un truc.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 import re with open("in/base","r+") as fichier: print("J'ouvre le fichier") for line in fichier : print("lecture d'une ligne") if re.compile('[0-9]+px').search(line): print("j'ai trouvé une occurance") regpx = re.findall("([0-9]+)px",line)[0] print("La je vien de faire de la magie from java (ça a l'air moche en python): "+ regpx) regem = str(int(regpx)/12)+"em" print("Bon en théorie la j'ai du em : "+regem) line.replace(regpx+"px",regem) print("Mais malheureusement ça remplace rien du tout")
Problème cela ne marche pas T_T.
Pas de message d'erreur. Il m'affiche bien tout les prints. (avec les bonne valeurs et tout)
Mais malheureusement pas de modification dans le fichier. Il reste inchangé.

Une petite idée de mon erreur ?

Edit : Bon Y'a encore plein de petit truc qui ne vont pas et qui va falloir que je modifie.
Notamment le fait que si il y a plusieurs "valeurpx" par ligne il prend en compte que la première >_>
Et qui faut que je limite le nombre de chiffre après la virgule de "valeurem".
Mais ça je pense que je peut le réglé tout seul ^^'

Bon bin merci de votre aide :p

Du coup j'ai trouvé la solution a mon problème.
Du coup je vous poste la solution au cas ou cela intéresserai quelqu'un (on sait jamais).

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
 
#!/usr/bin/env python
 
import re
import time
import datetime
import logging
 
from logging.handlers import RotatingFileHandler
 
# création de l'objet logger qui va nous servir à écrire dans les logs
logger = logging.getLogger()
# on met le niveau du logger à DEBUG, comme ça il écrit tout
logger.setLevel(logging.DEBUG)
 
# création d'un formateur qui va ajouter le temps, le niveau
# de chaque message quand on écrira un message dans le log
formatter = logging.Formatter('%(asctime)s :: %(levelname)s :: %(message)s')
# création d'un handler qui va rediriger une écriture du log vers
# un fichier en mode 'append', avec 1 backup et une taille max de 1Mo
file_handler = RotatingFileHandler('LogTraitement.log', 'a', 1000000, 1)
# on lui met le niveau sur DEBUG, on lui dit qu'il doit utiliser le formateur
# créé précédement et on ajoute ce handler au logger
file_handler.setLevel(logging.DEBUG)
file_handler.setFormatter(formatter)
logger.addHandler(file_handler)
 
# création d'un second handler qui va rediriger chaque écriture de log
# sur la console
stream_handler = logging.StreamHandler()
stream_handler.setLevel(logging.DEBUG)
logger.addHandler(stream_handler)
 
nbValeurModified = 0
with open("ListOfFichier.txt","r") as FichierListFichier:
    logger.debug("Début du traitement des fichiers css")
 
    for line in FichierListFichier :
        fileName = line.replace("\n","")
        with open("in/"+fileName,"r") as InCss:
            logger.debug("Début du traitement du fichier - "+ fileName)
            with open("out/"+fileName,"w") as OutCss:
                for line in InCss :
                    if re.compile('[0-9]+px').search(line):
                        print("j'ai trouvé une occurance")
                        listOfPxToModifie = re.findall("([0-9]+)px",line)
                        for i in range(0,len(listOfPxToModifie)):
                            nbValeurModified += 1
                            pxToEm = str(round(int(listOfPxToModifie[i])/12,4))+"em"
                            line = line.replace(listOfPxToModifie[i]+"px",pxToEm)
                            logger.debug(fileName+" :: Modification de la valeur "+listOfPxToModifie[i]+"px en " + pxToEm)
 
                    OutCss.write(line)
 
        logger.debug("Fin du traitement du fichier - "+ fileName)
 
    logger.debug("Fin du traitement des fichier css")
    logger.debug("Nombre de valeur modifier : "+ str(nbValeurModified))

Au final j'ai rajouté un logger histoire de tracé mes modifications
J'ai rajouté le fait de prendre la liste des fichier à traiter dans un fichier.
J'ai pris en compte la possibilité d'avoir plusieurs "valeurpx" par ligne
J'ai tronqué la valeurem a 4 chiffre après la virgule.

Voila voila ^^'

15/11/2017, 14h29
wiztricks
Salut,

Pour construire la solution, il faut partir d'un CSS qui contient des exemples de ce qu'on souhaite modifier (histoire de pouvoir tester). En partant de (trouvé dans les exemples du W3C):
Code:

1 2 3 4 5 css = '''div.mybox { border: 2px solid } @media (min-resolution: 2dppx) { /* Media with 2 or more dots per px */ div.mybox { border: 1.5px solid } }'''
on se rend déjà compte que ce n'est pas toujours un entier.
Après, on lit le tutoriel Python sur les regex au chapitre qui parle de search and replace. Le plus simple, ici, va être de fabriquer une fonction qui replacera x.y"px" par value"em":
Code:

1 2 3 def replace(match): value = float(match.groups()[0]) / 12 return str(round(value, 4)) + 'em'
reste à construire l'expression régulière qui avalera tout çà:

Code:

rg = re.compile(r'(\d+(.\d*)?)px')

et de vérifier si çà le fait:

Code:

rg.sub(replace, css)

qui retourne:
Code:

1 2 3 4 5 div.mybox { border: 0.1667em solid } @media (min-resolution: 2dppx) { /* Media with 2 or more dots per px */ div.mybox { border: 0.125em solid } }
- W
16/11/2017, 11h00
Mushu_Senjak

Ah oui ^^.

Ça a l'air beaucoup plus optimisé que ce que j'ai fait ^^'.

J'ai plus beaucoup le temps de travaillé sur ce projet.
Mais je regarderai ce que je peut faire avec tes indications la semaine prochaine.

Merci en tout cas

Bon je rencontre un petit problème.
Dans les fichiers que je traite il se trouve qu'il y a pas mal d’occurrence du type

Code:

margin: 0 10px;

ou encore

Code:

margin: 0 0 10px 0;

Et la c'est le drame T_T. dixit Stack trace.
Code:

1 2 3 4 5 6 Traceback (most recent call last): File "d:/Profiles/blabla/Desktop/testPython/pxToEmdeveloppez.py", line 47, in <module> print(rg.sub(replace, css)) File "d:/Profiles/blabla/Desktop/testPython/pxToEmdeveloppez.py", line 39, in replace value = float(match.groups()[0]) / 12 ValueError: could not convert string to float: '0 10'
>_> en faissant un petit print du Match_Object

Code:

<_sre.SRE_Match object; span=(22, 28), match='0 10px'>

j'ai l'impression que le regex "(\d+(.\d*)?)px" fait passé l'espace comme un caractère acceptable. Et je ne comprend absolue pas pourquoi, et comment évite cela ?

20/11/2017, 15h11
wiztricks

Citation:

Envoyé par Mushu_Senjak

j'ai l'impression que le regex "(\d+(.\d*)?)px" fait passé l'espace comme un caractère acceptable. Et je ne comprend absolue pas pourquoi, et comment évite cela ?

Exact.
J'ai oublié de mettre un '\' devant le '.': et donc çà accepte n'importe quel caractère.

- W