PHP [EXERCICE] Créer un sprite CSS avec PHP

Rayzen

Membre
5/1/22
2
0
0
rayzen.io
Bonjour, petit exercice à vous proposer avec PHP. :)

But de l'exercice
Comprendre le traitement d’images et la gestion de fichiers en PHP

Enoncé
Au départ, nous avons un dossier contenant plusieurs images au format PNG. L’idée principale du projet est de développer un programme, qui concatène toutes ces images en un seul "sprite". L’idée secondaire est de générer le fichier CSS représentant cette concaténation.

Nous vous fournissons la page de "manuel" du css_generator en annexe. Vous devez faire en sorte d’implémenter le nécessaire pour satisfaire ce manuel. Vous trouverez de nombreux générateurs de sprites CSS sur la toile dont vous pouvez vous inspirer pour comprendre les fonctionnalités attendues.

Attention, nous attendons un outil en ligne de commande uniquement.

En voici quelques-uns:
  • spritegen.website-performance.org
  • css.spritegen.com
Note: Vous devez avoir décommenter la ligne extension=gd.so dans votre fichier de configuration "php.ini". Vous pouvez le vérifier en tapant la commande: grep -r extension=gd.so [chemin vers votre php]*

Bash:
CSS_GENERATOR(1) UserCommands CSS_GENERATOR(1)

NAME

css_generator - sprite generator for HTML use

SYNOPSIS

css_generator [OPTIONS]... assets_folder

DESCRIPTION

Concatenate all images inside a folder in one sprite and write a style sheet ready to use.

Mandatory arguments to long options are mandatory for short options too.

-r, --recursive

Look for images into the assets_folder passed as arguement and all of its subdirectories.

-i, --output-image=IMAGE

Name of the generated image. If blank, the default name is « sprite.png ».

-s, --output-style=STYLE

Name of the generated stylesheet. If blank, the default name is « style.css ».

4

BONUS OPTIONS

-p, --padding=NUMBER

Add padding between images of NUMBER pixels.

-o, --override-size=SIZE

Force each images of the sprite to fit a size of SIZExSIZE pixels.

-c, --columns_number=NUMBER

The maximum number of elements to be generated horizontally.
Restriction
Afin de mettre à l’épreuve vos capacités et vous permettre de les améliorer, il est interdit d’utiliser pour tout le projet + aides:
  • La fonction scandir de PHP
  • Les classes itératrices de PHP telles que RecursiveDirectoryIterator

Aides
Aide 1:
Créez une fonction my_increment qui incrémente un entier de 0 à 10 de manière récursive.
Prototype : my_increment($int);

Aide 2:
Créez une fonction my_recursive_readdir qui prend en paramètre une chemin vers un dossier.
Cette fonction retournera un tableau contenant tous les noms des fichiers contenus dans les sous dossier et le dossier passé en paramètre.
Prototype : array my_recursive_readdir($path);
Hint: readdir

Aide 3:
Créer une fonction my_merge_image qui prend en paramètre deux chemins d’images au format PNG et qui retourne la fusion de ces deux images.
Prototype : my_merge_image($first_img_path , $second_img_path);

Aide 4:
Créer une fonction my_generate_css qui génère un fichier CSS correspondant à la fusion des deux images.
Vous devrez définir suivant votre étape 0 les paramètres de cette fonction.
Prototype : my_generate_css(...);

Aide 5:
Créer une fonction my_scandir qui récupère tous les noms des fichiers .PNG contenu dans le dossier dont le nom est passé en paramètre. Cette fonction renvoie un tableau contenant ces noms.
Prototype : my_scandir($dir_path);
Hint: scandir, readdir

Voilà, ce sera tout pour ce premier challenge. Bon courage. :)
 
Mobile app for XenForo 2 by Appify