Soir de flotte

La vue du balcon peut être un terrain d’expérimentation, même quand il fait moche ! Mais à 30 secondes de temps d’exposition, mieux vaut sortir le trépied…

On peut remarquer sur ces deux photos, que le nombre de raies lumineuses autour des sources est différent : 10 raies pour la première, 6 pour la seconde. Hé oui, ce n’est pas le même objectif ! Pour la première photo, il s’agit d’un 50mm à focale fixe, dont le diaphragme est constitué de 5 lamelles. Pourquoi il y a 10 raies et non 5 ? Je cherche encore la réponse, mais c’est peut-être lié à la forme des ces lamelles… Pour la seconde photo, c’est un 18-55 mm, avec un diaphragme à 6 lamelles.

Le dot m’habite

Il est des fois où on erre parmi les répertoires depuis son terminal : cd par-ci, cd par-là… Avancer dans 3 sous-dossiers, remonter de 7… Parfois on ne sait plus combien de « .. » il va falloir enchaîner… Pourtant, le nom du dossier (lointain parent), lui, il est juste là, et ce fichu principe de remonter les niveaux un à un… En plus avec la quasi assurance de devoir saisir, dans une seconde commande, un ultime « cd .. » … Bref, des fois, c’est quand-même chiant ! Une petite fonction en Bash, et les « cd ../../.. […] /../../.. » vont vite décéder.

Dans la fonction ci-dessous, les commandes classiques que sont test, pwd et sed, vont nous permettre de remonter au répertoire qui aura été saisi en argument (pourvu que celui-ci existe).

function dcd ()
{
    if test `pwd | sed -e "s/\(.*\<${1}\>.*\)/\!/g"` = '!'
    then
        niveaux=`pwd | sed -e "s;.*\<${1}\>/*\(.*\);\1;" -e "s/\<[^/]*\>/../g"`

        test ${#niveaux} -gt 1 && cd $niveaux
    fi
}

Avant que vous ne soyez pris(e) de panique au vu de ce bout de code (les expressions régulières ont parfois un côté obscur), quelques explications s’imposent peut-être…

Le test qui conditionne le if, permet de vérifier que le paramètre $1 constitue bien le nom d’un des répertoires supérieurs :

  1. on exécute d’abord pwd pour connaître le chemin complet
  2. sed permet ensuite de transformer tout ce chemin en un seul caractère « ! », à l’unique condition que le paramètre $1 soit bien trouvé (en tant que mot au sens des expressions régulières)
  3. si la commande retourne « ! », alors le contenu du if est exécuté

Une fois dans le if, avec l’assurance que le répertoire cible existe, le nombre de répertoires à remonter va être stocké dans une variable « niveaux ». En voici le principe :

  1. on exécute encore une fois pwd, toujours pour connaître le chemin complet
  2. une première expression est soumise à la commande sed (premier « -e » ), afin de retirer de la chaîne tous les caractères devant le répertoire cible (donc en amont), et le répertoire cible avec
  3. une seconde expression est ensuite soumise à sed (deuxième « -e » ), pour remplacer chacun des répertoires encore présents par les fameux deux points « .. »
  4. en testant la longueur de la chaîne de « ../../.. » produite, on s’assure enfin de devoir remonter un certain nombre de niveaux, et c’est à cette seule condition qu’est exécuté le cd $niveaux

Après enregistrement de ce script dans un fichier, et un petit « source … » sur ce même fichier, la commande dcd fraîchement créée peut enfin être testée dans le terminal.

# Là, ça marche :
mynameis@localhost:/etc/locale/fr/LC_MESSAGES$ dcd locale
mynameis@localhost:/etc/locale$
# Là, ça marche pas, et heureusement :
mynameis@localhost:/etc/locale/fr/LC_MESSAGES$ dcd et
mynameis@localhost:/etc/locale/fr/LC_MESSAGES$

Bon… Tout ça c’est bien, mais c’est un peu lourd-dingue alors qu’il n’y a pas de quoi casser trois pattes à un canard… Voici une deuxième solution qui a le mérite d’être plus robuste, tout en étant nettement plus lisible.

function dcd ()
{
    increment=0
 
    for directory in `pwd | sed -e "s/ /5PAC3/g" -e "s/\// /g"`
    do
        directory=`echo $directory | sed "s/5PAC3/ /g"`
        test "$increment" -eq 1 && cd ..
        test "$directory" = "$1" && increment=1
    done
}

Le principe de cette nouvelle version est très simple :

  1. à l’aide de pwd, on dresse la liste des dossiers en amont, que l’on sépare par des espaces avec sed
  2. la chaîne «5PAC3», comme pour un précédent article, nous permet de sauvegarder les éventuels espaces dans le nom des répertoires
  3. pour chaque répertoire listé, on exécute alors le contenu de la boucle for :
    • on recouvre d’abord les espaces précédemment convertis en chaîne «5PAC3»
    • dès que l’on arrive au dossier cible, on le signale en mettant à jour la variable $increment
    • si le dossier cible a été dépassé dans la liste, alors on sait qu’il faut remonter d’un niveau via un « cd .. » , à chaque nouveau passage

Les solutions ne manquent donc pas, et il y en a, à n’en pas douter, sûrement d’autres ; et même meilleures que ces deux-ci.

Creative Commons License
Publié sous licence Creative Commons.

Le soleil de Fort-Mahon

Ce week-end était l’occasion* d’aller profiter de la mer, et pourquoi pas de s’exercer à la photographie. Sous-exposer, par exemple ici à -1, et avec une ouverture minimale de l’ordre de F/22, permet d’obtenir de bons résultats. Il ne reste alors plus qu’à jouer avec la composition pour tenter de casser la monotonie des clichés : soleil/mer… soleil/mer… soleil/mer… :mrgreen:

Attention, un intrus s’est caché parmi ces photos. Saurez-vous retrouver quelle image n’a pas été sous-exposée ?

* Pour ne pas dire la seule occasion, même si ce mois d’août pourri n’est pas terminé…

Creative Commons License
Publié sous licence Creative Commons.

Réaliser facilement un cadre pour Fotowall

Les quelques cadres proposés par défaut dans Fotowall ne suffisent pas toujours à rassasier la créativité débordante des utilisateurs. Fort heureusement, ce logiciel repose exclusivement sur des standards, notamment le SVG pour la réalisation des cadres. Il est donc relativement simple de créer de nouveaux cadres, moyennant… deux petites contraintes 😉 :

  • Réaliser un dessin au format SVG nécessite l’utilisation d’un logiciel de dessin vectoriel, ce qui n’est pas très compliqué, mais peut déjà en rebuter plus d’un.
  • Suivre un certain nombre d’indications, toujours au niveau du SVG, pour un affichage sans problème dans Fotowall… et là, j’ai déjà perdu la moitié de mon lectorat (ce qui doit à peu près représenter un bras ou un pied)…

Avant de proposer une solution qui permettra de s’affranchir de ces deux contraintes, et ainsi faciliter l’intégration d’un « simple dessin » comme cadre dans Fotowall, nous allons voir comment fonctionnent ces fameux cadres.

Comme dit plus haut, les cadres reposent sur des dessins vectoriels au format SVG. Pour qu’ils puissent être utilisés dans Fotowall, ceux-ci sont découpés en 9 morceaux, identifiés par une étiquette au sein du fichier. L’illustration ci-dessous représente ces 9 morceaux composant le cadre, la zone représentée en rose correspondant au positionnement d’une photo du pèle-mêle.

Les différentes parties du cadre SVG
Les différentes parties du cadre SVG

Les étiquettes affichées sur chaque morceau, telles que « topleft » ou « bottom », correspondent aux différents ID sur lesquels repose Fotowall. Sans ces ID, Fotowall ne sera pas en mesure d’utiliser le cadre, et le contour de la photo du petit neveu ou de Médor, restera désespérément vide. A ces 9 morceaux s’ajoutent 4 autres éléments, ci-dessus représentés par des flèches. Bien qu’apparaissant lors de l’édition du dessin vectoriel, ces éléments sont invisibles une fois dans Fotowall. Ils restent pour autant nécessaires. Ceux-ci, identifiés par des ID « hint-[…]-margin », permettent de définir l’épaisseur du contour qui doit être visible. Ainsi, si nous prenons pour exemple la flèche de gauche, voici son impact sur l’image de gauche :

  • Si l’objet « hint-left-margin » est de longueur égale à l’image « left », alors cette image apparaît dans toute sa largeur.
  • Si l’objet « hint-left-margin » est de longueur supérieure à l’image « left », alors un espace apparaît entre cette image et le bord de la photo. Cet espace est automatiquement comblé par l’image de fond « center », qui dépasse donc à gauche de la photo.
  • Si l’objet « hint-left-margin » est de longueur inférieure à l’image « left », alors elle est partiellement recouverte par la photo.

Mathématiquement, la distance de la zone d’espace, ou de la zone recouverte, est la différence de longueur entre l’élément « hint-[…]-margin » et chacune des images concernées (les 3 de gauche, les 3 de droite, les 3 du haut, ou les 3 du bas) : si le cadre fait 5 pixels et la marge 10 pixels, il y aura un écart de 5 pixels entre le cadre et la photo.

Un petit détail qui a son importance, les images « top », « left », « bottom » et « right » seront automatiquement étirées en fonction de la taille de la photo. A partir de là, on se rend malheureusement compte qu’il est difficile de proposer un cadre avec des motifs supportant difficilement d’être déformés… L’exemple ci-dessous illustre assez bien ce problème. Qu’à cela ne tienne ! Il est déjà possible de faire pas mal de trucs pour s’amuser, et ces quelques limitations finiront par être levées avec le temps.

Les bords étant étirés, les motifs sont inévitablement déformés
Les bords étant étirés, les motifs sont inévitablement déformés

Nous avons vu qu’un cadre se composait de 9 + 4 éléments graphiques dans un fichier SVG. Pour éviter de saisir les ID de ces éléments à la main dans le fichier SVG (qui est une bête structure XML), dans Inkscape il est possible de les saisir après un clic droit sur chacun de ces éléments, comme illustré ci-dessous.

Edition d'un ID dans Inkscape
Edition d'un ID dans Inkscape

Avec les quelques informations que nous venons de voir, nous pouvons nous rendre compte que produire un cadre peut être fait sans trop de difficulté, mais que cela peut aussi devenir fastidieux dès lors qu’on voudra multiplier ces cadres, par exemple pour les décliner en plusieurs couleurs. Hé puis nous l’avons déjà dit, tout le monde n’est pas forcément à l’aise avec le dessin vectoriel ! Dans ce cas, pourquoi ne pas produire un cadre directement en bitmap (JPG, PNG) à l’aide d’un logiciel de retouche photo comme Gimp, pour le convertir aussitôt après en cadre SVG prêt pour Fotowall ?

Nous l’avons très rapidement abordé plus haut, un fichier SVG est un fichier texte au format XML. Ca tombe bien, les outils en ligne de commande foisonnent sur nunux, et Bash (ou tout autre *sh, ne soyons pas –trop– sectaire) est la star quand il s’agit de produire automatiquement des fichiers !

La tentation de faire un tel programme était trop forte. Voici un script qui va nous permettre de nous affranchir du découpage d’une image et de sa conversion en SVG : fotowall_frame_compiler.zip

Une fois décompressé, le fonctionnement de ce script, quoique nécessitant un de ces écrans sombres et étranges qu’on appelle « terminaux« , est d’une grande simplicité d’utilisation. Regardez plutôt :

./fotowall_frame_compiler.sh image.png

Le script peut se contenter d’un seul et unique paramètre, à savoir l’image à convertir. Dans ce cas, les 9 parties du cadre seront autant que possible de hauteur et de largeur égales. Pour un meilleur rendu, attention à préférer des dimensions multiples de 3 dès le départ. En sortie du programme, le fichier SVG est créé, en reprenant le nom de l’image d’origine et en remplaçant l’extension par « .svg » (ce qui donne dans notre exemple image.png > image.svg).

Mais on peut aussi très bien avoir un contour de cadre de largeur ou de hauteur (ou les deux) différente de celle de l’emplacement réservé pour les photos. Pour reprendre l’exemple de la première illustration, on voit très bien que la hauteur de « top » et de « bottom » n’est pas identique à la hauteur de « center ». Dans ce cas, il va donc être nécessaire de connaître la taille exacte que l’on souhaite donner à « center » une fois transformé en SVG. Dans Gimp, il est par exemple possible de mesurer cette zone avec l’outil de sélection rectangulaire. Une fois la hauteur et la largeur connues, il suffit ensuite d’ajouter ces deux nouveaux paramètres au script :

./fotowall_frame_compiler.sh image.png 150 130

Le premier nombre correspondant à la largeur en pixels, et le second nombre correspondant à la hauteur (en pixels aussi, vous l’aurez deviné). En considérant que la zone « center » est parfaitement centrée, le script est alors en mesure de calculer la largeur et la hauteur de chacune des 9 parties, ainsi que les positionner dans l’image SVG. Bref, il n’y a plus rien à faire, le cadre étant immédiatement utilisable par Fotowall ! Si le rendu n’est pas impeccable (un écart d’un ou deux pixels est toujours possible), il suffit de jouer directement sur les deux valeurs dans la ligne de commande, puis rafraîchir le cadre dans Fotowall. Pour illustrer tout ceci, voici un exemple plus concret :

Exemples de découpages d'une image
Exemples de découpages d'une image

Ce script, requiert toutefois un ou deux logiciels, qui sont disponibles parmi les dépôts de toute bonne distribution GNU/Linux :

Attention. Le script crée temporairement 9 images PNG dans le dossier. Ce sont les 9 éléments ensuite stockés dans le fichier SVG, qui ont été découpés par ImageMagick et numérotés ainsi (en reprenant l’exemple ci-dessus) : image_0.png, image_1.png, … image_8.png. Veillez donc à ne pas avoir une image portant le même nom, sans quoi elle sera écrasée. A la fin d’exécution, ces 9 images temporaires sont automatiquement supprimées.

Après avoir abordé le fonctionnement des cadres SVG pour Fotowall, un script nous permet désormais de nous affranchir d’un certain nombre d’étapes peu amusantes (étiquetage, découpage…), et ainsi nous concentrer sur la réalisation purement graphique de l’image. Attention toutefois à préférer le format d’image PNG, qui est le seul à bénéficier à la fois des dégradés de couleur et de la transparence.

En guise de conclusion, on peut résumer ainsi les différents points abordés au sujet des cadres dans Fotowall :

  • Ils sont au format SVG, et peuvent être dessinés à l’aide des nombreux logiciels de dessin vectoriel, dont Inkscape fait partie.
  • Un cadre est composé de 9 éléments : les 4 coins, les 4 bords et le centre. A ces 9 éléments s’ajoutent 4 autres éléments pour la distance entre les bords du cadre et les bords de la photo.
  • Chacun des 9 + 4 éléments possède un ID précis au sein de l’image vectorielle.
  • Les bords étant étirés, les motifs sont déformés, ce qui limite les possibilités de création pour le moment.
  • Il est possible de s’affranchir de toute la partie SVG et de réaliser des cadres à partir d’images bitmap (de préférence PNG) à l’aide du script fotowall_frame_compiler.zip (nécessite GNU/Linux et une version récente d’ImageMagick).

Creative Commons License
Publié sous licence Creative Commons.

Cadres « néon » pour Fotowall

Voici quelques cadres à ajouter au logiciel de pèle-mêles Fotowall. Fait avec amour sous Gimp, Inkscape et avec l’aide d’ImageMagick ! 😀

Cadres néon pour Fotowall
Cadres néon pour Fotowall

Pour pouvoir utiliser ces cadres, veuillez décompresser cette archive ZIP, puis ouvrir les fichiers SVG directement depuis Fotowall (bouton clef à molette > Nouveau cadre).

Si les quelques couleurs réalisées ne vous suffisent pas, si vous souhaitez améliorer le look de ces cadres, ou bien si vous êtes tout simplement curieux / curieuse de savoir comment ils ont été créés, vous pouvez également télécharger ce fichier source. Celui-ci comprend trois fichiers :

  • neon.xcf, le fichier « projet » qui s’ouvre avec Gimp, comprenant calques et chemins.
  • neon_bleu.png, l’image produite par défaut à partir du projet neon.xcf.
  • fotowall_frame_compiler.sh, un script Bash permettant de créer (presque) automatiquement un cadre SVG à partir d’une image PNG.

Pour créer de nouvelles couleurs facilement, sans passer par le projet, il suffit d’ouvrir l’image PNG dans Gimp, et de jouer avec le menu Couleurs > Colorier (teinte et saturation donnant de très bons résultats).

Le script Bash s’utilise ainsi (sous nunux :mrgreen:) :

~$ ./fotowall_frame_compiler.sh neon_bleu.png
  • Avec l’aide d’ImageMagick et de la commande convert, le script divise d’abord en 9 l’image PNG et enregistre temporairement les 9 images résultantes.
  • Le fichier SVG est ensuite créé avec les chemins relatifs des 9 images PNG.
  • Le fichier SVG s’ouvre alors automatiquement dans Inkscape, afin de stocker les images directement dans le fichier (menu Extensions > Images > Incorporer les images) au lieu de faire appel aux fichiers PNG externes. Une fois modifié, le fichier SVG est prêt pour Fotowall.
  • Les 9 images temporaires sont supprimées avant que le script Bash ne se termine.

Un de ces quatre, il faudra aussi que je donne quelques explications plus « techniques » sur la réalisation de cadres pour Fotowall, ceci afin peut-être d’éviter quelques heures de rétro-ingénierie à d’autres…

Petit bonus : de nombreux cadres que j’ai réalisé il y a maintenant quelque temps… 😎

Creative Commons License
Publié sous licence Creative Commons.