# Format de skins MPlayer

## Aperçu

Ce n'est pas en rapport direct avec le format des skins, mais vous devez savoir que MPlayer n'a pas de skin par défaut, donc au moins une skin doit être installée pour pouvoir utiliser la GUI.

### Répertoires

MPlayer cherche des skins dans ces répertoires (dans cet ordre):

1. `$(DATADIR)/skins/`

2. `$(PREFIX)/share/mplayer/skins/`

3. `~/.mplayer/skins/`

Notez que le premier répertoire peut varier suivant la façon dont MPlayer a été configuré (voir les arguments `--prefix` et `--datadir` du script `configure`).

Chaque skin est installée dans son propre répertoire sous l'un des répertoires listés ci-dessus, par exemple:

    $(PREFIX)/share/mplayer/skins/default/

### Format d'images

Les images doivent être en truecolor (24 ou 32 bpp) et enregistrées au format PNG.

Dans la fenêtre principale et la barre de lecture (c.f. ci-dessous) vous pouvez utiliser des images dotées de régions "transparentes": les régions remplies avec la couleur #FF00FF (magenta) deviennent transparentes dans MPlayer. Cela signifie que vous pouvez obtenir des formes particulières pour vos fenêtres si votre serveur X possède l'extension XShape.

### Composants d'une skin

Les skins sont d'un format plutôt libre (contrairement aux formats fixes de Winamp/XMMS, par exemple), donc il ne tient qu'a vous de créer quelque chose de bien.

Actuellement, trois fenêtres doivent être décorées: la fenêtre principale, la sous-fenêtre, la barre de lecture, et le menu (activable par un clic droit).

- Vous contrôlez MPlayer par la fenêtre principale et/ou la barre de lecture. L'arrière plan est une image. Divers objets peuvent (et doivent) venir se placer dans cette fenêtre: boutons, podomètres (sliders) et labels. Pour chaque objet, vous devez spécifier sa taille et sa position.

  Un bouton comprend trois états (pressé, relâché, désactivé), donc l'image doit se diviser en trois parties, verticalement. Voir l'objet bouton pour plus de détails.

  Un podomètre (principalement utilisé pour la barre d'avancement et le contrôle du volume/balance) peut posséder n'importe quel nombre d'états en empilant ces images, verticalement. Voir hpotmeter et potmeter pour plus de détails.

  Les labels sont un peu particuliers : les caractères nécessaires pour les dessiner sont récupérés depuis un fichier image, décrit par un fichier de description de polices. Ce dernier est un fichier texte brut spécifiant la position x,y ainsi que la taille de chaque caractère dans l'image (le fichier image et son descripteur forment une police ensemble). Voir dlabel et slabel pour plus de détails.

  Toutes les images disposent de la couleur de transparence décrite dans la section formats d'images. Si le serveur X ne supporte pas l'extension Xshape, les parties transparentes seront noires. Si vous voulez utiliser cette fonction, la largeur de l'image de la fenêtre principale devra être divisible par 8.

- La sous-fenêtre contient la vidéo en elle même. Elle peut afficher une image si aucun film n'est chargé (ce n'est jamais plaisant d'avoir une fenêtre vide :-)) Note: la couleur de transparence n'est pas autorisée ici.

- Le menu est simplement un moyen de contrôler MPlayer par des entrées graphiques. Deux images sont nécessaires pour le menu: l'une d'elle, l'image de base, affiche le menu dans son été normal, l'autre est utilisée pour afficher les entrées sélectionnées. Quand vous faites apparaître le menu, la première image s'affiche. Si vous passez la souris sur les entrées du menu, l'entrée sélectionnée est copiée depuis la seconde image, et uniquement la partie concernée par cette sélection (la seconde image ne s'affiche jamais complètement.)

  Une entrée de menu se définit par sa position et sa taille dans l'image (voir la section menu pour plus de détails).

Une chose essentielle n'a pas encore été mentionnée : pour que les boutons, podomètres et entrées du menu fonctionnent, MPlayer doit savoir quoi en faire. Ceci dépend des messages (events) envoyés. Pour chacun de ces objets vous devez définir le message à afficher quand on clique dessus.

### Fichiers

Vous aurez besoin des fichiers suivants pour construire une skin:

- Le fichier de configuration nommé skin indique à MPlayer comment assembler les différentes images et comment interpréter les clics de souris sur l'interface.

- L'image de fond de la fenêtre principale.

- Les images correspondants aux objets de la fenêtre principale (y compris une ou plusieurs polices et descripteurs nécessaires à l'affichage des textes).

- L'image affichée dans la sous-fenêtre (optionnel).

- Deux images pour le menu (nécessaires uniquement si vous voulez créer un menu).

A l'exception du fichier de configuration, vous pouvez nommer les fichiers comme bon vous semble (mais notez que les descripteurs de polices doivent avoir une extension `.fnt`).

## Le fichier skin

Comme mentionné plus haut, c'est le fichier de configuration de la skin. Il est lu ligne par ligne; les lignes de commentaires démarrent par le caractère '`;`' en début de ligne (seuls les espaces et tabulations sont autorisées avant ce signe).

Les fichiers se composent de sections. Chaque section décrit la skin pour une application et s'écrit sous la forme:

    section = nom de la section
    .
    .
    .
    end

Actuellement il n'existe qu'une application, donc vous n'aurez besoin que d'une section: dont le nom est movieplayer.

Dans cette section chaque fenêtre est décrite par un bloc de la forme suivante:

    window = nom de la fenêtre
    .
    .
    .
    end

Où peut-être l'un des types suivants:

- main - pour la fenêtre principale

- sub - pour la sous-fenêtre

- menu - pour le menu

- playbar - barre de lecture

(Les blocs sub et menu sont optionnels - vous n'avez pas l'obligation de décorer le menu et la sous-fenêtre.)

Dans un bloc window, vous pouvez définir chaque objet sous la forme:

    objet = paramètre

Où `objet` est une ligne identifiant le type d'objet de la GUI, `paramètre` est une valeur numérique ou textuelle (ou une liste de valeurs séparées par des virgules).

Le fichier final doit donc ressembler à ceci:

    section = movieplayer
      window = main
      ; ... objets de la fenêtre principale ...
      end

      window = sub
      ; ... objets de la sous-fenêtre ...
      end

      window = menu
      ; ... objets du menu ...
      end

      window = playbar
      ; ... objets de la la barre de lecture ...
      end
    end

Le nom d'un fichier image doit être donné sans distinction de répertoire - les images seront cherchées dans le répertoire `skins`. Vous pouvez (mais ce n'est pas obligatoire) spécifier l'extension du fichier. Si le fichier n'existe pas, MPlayer essaie de charger le fichier `<nomfichier>.<ext>`, où `png` et `PNG` sera respectivement `<ext>` (dans cet ordre). La première correspondance trouvée sera utilisée.

Pour finir quelques mots sur le positionnement. La fenêtre principale et la sous-fenêtre peuvent être placées dans des coins différents de l'écran en donnant les coordonnées `X` et `Y`. `0` pour haut ou gauche, `-1` pour centre et `-2` pour droite ou bas, comme montré sur cette illustration:

    (0, 0)----(-1, 0)----(-2, 0)
      |          |          |
      |          |          |
    (0,-1)----(-1,-1)----(-2,-1)
      |          |          |
      |          |          |
    (0,-2)----(-1,-2)----(-2,-2)

Un exemple. Supposons que vous avez crée une image `main.png` que vous voulez utiliser pour la fenêtre principale:

    base = main, -1, -1

MPlayer essaie de charger les fichiers `main`, `main.png`, `main.PNG`.

### Fenêtre principale et barre de lecture

Vous trouverez ci-dessous la liste des objets utilisables dans les blocs '`window = main`' ... '`end`', et '`window = playbar`' ... '`end`'.

`base = image, X, Y`

  Vous spécifiez ici l'image de fond utilisée dans la fenêtre principale. La fenêtre apparaîtra a la position `X,Y` sur l'écran. La fenêtre aura la taille de l'image.

  Ces coordonnées ne fonctionnent actuellement pas pour la fenêtre d'affichage.

  Les régions transparentes (couleur #FF00FF) apparaîtront en noir sur les serveurs X n'ayant pas l'extension XShape. La largeur de l'image doit être divisible par 8.

`button = image, X, Y, largeur, hauteur, message`

  Place un bouton de taille `largeur` * `hauteur` a la position `X,Y`. Le `message` sera généré au clic sur ce bouton. L'image appelée par `image` doit avoir trois états empilés verticalement (pour les trois états du bouton), comme ceci:

      +------------+
      |  pressé    |
      +------------+
      |  relâché   |
      +------------+
      |  désactivé |
      +------------+

`decoration = enable|disable`

  Active (enable) ou désactive (disable) la décoration du gestionnaire de fenêtre pour la fenêtre principale. disable par défaut.

  Cela ne fonctionne pas pour la fenêtre d'affichage, il n'y en a pas besoin.

`hpotmeter = button, blargeur, bhauteur, phases, numphases, default, X, Y, largeur, hauteur, message`

`vpotmeter = button, blargeur, bhauteur, phases, numphases, default, X, Y, largeur, hauteur, message`

  Place un podomètre horizontal (hpotmeter) ou vertical (vpotmeter) de taille `largeur` * `hauteur` à la position `X,Y`. L'image peut être divisée en différentes parties pour les différentes phases du podomètre (par exemple, vous pouvez en avoir un pour le contrôle du volume qui passe du vert au rouge quand sa valeur passe du minimum au maximum). `hpotmeter` peut posséder un bouton qui sera glissé horizontalement.

  - `button` - l'image utilisée pour le bouton (doit avoir trois états superposés, comme pour les boutons)

  - `blargeur`,`bhauteur` - taille du bouton

  - `phases` - l'image utilisée pour les différentes phases du podomètre. Une valeur `NULL` spéciale peut-être utilisée si vous ne voulez pas d'image. L'image doit être divisée en `numphasesparts` verticalement comme ceci:

        +------------+
        |  phase #1  |
        +------------+
        |  phase #2  |
        +------------+
             ...
        +------------+
        |  phase #n  |
        +------------+

  - `numphases` - nombre d'états placés dans l'image `phases`.

  - `default` - valeur par défaut du podomètre (dans un intervalle de `0` à `100`)

  - `X`,`Y` - position du hpotmeter

  - `largeur`,`hauteur` - largeur et hauteur du `hpotmeter`

  - `message` - le message généré lors des changements d'état de `hpotmeter`

`potmeter = phases, numphases, default, X, Y, largeur, hauteur, message`

  Un `hpotmeter` sans bouton. (je suppose qu'il est censé tourner en rond, mais il réagit uniquement aux tractions horizontales.) Pour une description de ses paramètres lisez hpotmeter. Ses `phases` peuvent être fixées à `NULL`, mais ce n'est pas vraiment utile, puisque vous ne pouvez pas voir son niveau.

`font = fontfile, fontid`

  Définit une police. `fontfile` est le nom du descripteur de police avec l'extension `.fnt` (inutile de préciser son extension ici). `fontid` réfère à la police (c.f. dlabel et slabel). Jusqu'à 25 polices peuvent être définies.

`slabel = X, Y, fontid, "texte"`

  Place un label dynamique à la position `X,Y`. `texte` est affiché en utilisant la police identifiée par `fontid`. Le texte est juste une chaîne brute (les variables `$x` ne fonctionnent pas) qui doit être mise entre doubles quotes (mais le caractère " ne peut pas faire partie du texte). Le label est affiché en utilisant la police identifiée par `fontid`.

`dlabel = X, Y, longueur, align, fontid, "texte"`

  Place un label statique à la position `X,Y`. Le label est appelé dynamique parce que son texte est rafraîchi périodiquement. La longueur maximum du label est définie par `longueur` (sa hauteur dépend de la hauteur des caractères). Si le texte a afficher dépasse cette longueur il sera scrollé, ou bien aligné dans l'espace spécifié par la valeur du paramètre `align`: `0` pour droite, `1` pour centre, et `2` pour gauche.

  Le texte à afficher est donné par `texte`: il doit être écrit entre doubles quotes (mais le caractère " ne peut pas faire partie du texte). Le texte s'affiche en utilisant la police spécifiée par `fontid`. Vous pouvez utiliser les variables suivantes dans le texte:

  Variable | Signification
  --- | ---
  $1 | temps de lecture au format hh:mm:ss
  $2 | temps de lecture au format mmmm:ss
  $3 | temps de lecture au format hh (heures)
  $4 | temps de lecture au format mm (minutes)
  $5 | temps de lecture au format ss (secondes)
  $6 | longueur du film au format hh:mm:ss
  $7 | longueur du film au format mmmm:ss
  $8 | temps de lecture au format h:mm:ss
  $v | volume au format xxx.xx%
  $V | volume au format xxx.xx
  $b | balance au format xxx.xx%
  $B | balance au format xxx.xx
  $$ | le caractère $
  $a | un caractère dépendant du type audio (aucun: `n`, mono: `m`, stéréo: `t`)
  $t | numéro de piste (dans la playlist)
  $o | nom du fichier
  $f | nom du fichier en minuscule
  $F | nom du fichier en majuscule
  $T | un caractère dépendant du type de flux (fichier: `f`, Video CD: `v`, DVD: `d`, URL: `u`)
  $p | le caractère p (si une vidéo est en lecture et que la police a le caractère p)
  $s | le caractère s (si une vidéo est stoppée et que la police a le caractère s)
  $e | le caractère e (si une vidéo est en pause et que la police a le caractère e)
  $x | largeur du film
  $y | hauteur du film
  $C | nom du codec utilisé

Les variables `$a, $T, $p, $s` et `$e` e retournent toutes des caractères pouvant s'afficher comme des symboles spéciaux (par exemple, e est le symbole de pause qui ressemble généralement à ||). Vous pouvez avoir une police pour les caractères normaux et une autre pour les symboles. Lisez la section sur les symboles pour plus d'informations.

### Sous-fenêtre

Vous trouverez ci-dessous la liste des objets utilisables dans le bloc '`window = sub`' . . . '`end`'.

`base = image, X, Y, largeur, hauteur`

  L'image qui s'affichera dans la fenêtre. La fenêtre apparaîtra à la position `X,Y` sur l'écran (`0,0` est le coin supérieur gauche). Vous pouvez spécifier `-1` pour centre et `-2` pour droite (`X`) et bas (`Y`). La fenêtre prendra la taille de l'image. `largeur` et `hauteur` donnent la taille de la fenêtre; ces paramètres sont optionnels (si ils sont absents, le fenêtre prend la taille de l'image).

`background = R, V, B`

  Vous permet de définir la couleur de fond. Utile si l'image est plus petite que la fenêtre. `R`, `V` et `B` spécifient les composantes rouge, verte et bleue de la couleur (d'un intervalle entre 0 et 255).

### Menu

Comme mentionné précédemment, le menu s'affiche en utilisant deux images. Les entrées normales du menu sont extraites de l'image spécifiée par l'objet `base`, tandis que l'entrée actuellement sélectionnée est extraite de l'image spécifiée par l'objet `selected`. Vous devez définir la taille et la position de chaque entrée du menu par l'objet `menu`.

Ils correspondent aux objets utilisés dans le bloc '`window = menu`'. . .'`end`'.

`base = image`

  L'image utilisée pour les entrées normales.

`selected = image`

  L'image utilisée pour les entrées sélectionnées.

`menu = X, Y, largeur, hauteur, message`

  Définit la position `X,Y` et la taille des entrées du menu dans les images. `message` est le message généré quand le bouton de la souris est relâché.

## Polices

Comme mentionné dans la section sur les parties de la skin, une police est définie par une image et un fichier de description. Vous pouvez placer les caractères n'importe ou sur l'image, mais vous devez vous assurer que leur position et taille correspondent précisément au fichier de description.

Le fichier descriptif des polices (avec l'extension `.fnt`) peut avoir des lignes de commentaires commençant par '`;`'. Le fichier doit avoir une ligne du type

    image = image

Où `image` est le nom de l'image qui sera utilisée pour la police (vous n'avez pas à définir d'extension).

    "char" = X, Y, largeur, hauteur

Ici `X` et `Y` précisent la position du caractère `char` dans l'image (`0,0` est le coin supérieur gauche). `largeur` et `hauteur` sont les dimensions du caractère en pixels.

Voici un exemple définissant les caractères A, B, C utilisant `font.png`.

    ; Peut être "font" au lieu de "font.png".
    image = font.png

    ; Trois caractères suffisent pour une démonstration. :-)
    "A" =  0,0, 7,13
    "B" =  7,0, 7,13
    "C" = 14,0, 7,13

### Symboles

Certains caractères ont une signification spéciale quand ils sont retournés par des variables utilisées dans dlabel. Ces caractères sont censés s'afficher comme des symboles (par exemple, dans le cas d'une lecture DVD, vous pouvez afficher un beau logo DVD a la place du caractère '`d`').

La table ci-dessous liste les caractères pouvant s'afficher comme des symboles (et nécessitent donc une police différente).

Caractère | Symbole
--- | ---
p | lecture
s | stop
e | pause
n | pas de son
m | son mono
t | son stéréo
f | lecture depuis un fichier
v | lecture depuis un Video CD
d | lecture depuis un DVD
u | lecture depuis une URL

## Messages de la GUI

Ce sont les messages qui peuvent être générés par les boutons, podomètres et entrées du menu.

### Contrôle de lecture:

evNext

  Saute à la prochaine piste dans la playlist.

evPause

  Associé à la commande `evPlaySwitchToPause`. Ils s'utilisent pour avoir un bouton play/pause commun. Les deux messages peuvent être assignés aux boutons affichés exactement à la même position dans la fenêtre. Ces messages mettent la lecture en pause et le bouton `evPlaySwitchToPause` s'affiche (pour indiquer que le bouton peut être pressé pour continuer la lecture).

evPlay

  Commence la lecture.

evPlaySwitchToPause

  Le contraire de `evPauseSwitchToPlay`. Ce message démarre la lecture et l'image associée au bouton `evPauseSwitchToPlay` s'affiche (pour indiquer que le bouton peut être pressé pour mettre en pause la lecture).

evPrev

  Saute à la piste précédente dans la playlist.

evStop

  Stoppe la lecture.

### Déplacement dans le flux:

evBackward10sec

  Recule de 10 secondes.

evBackward1min

  Recule de 1 minute.

evBackward10min

  Recule de 10 minutes.

evForward10sec

  Avance de 10 secondes.

evForward1min

  Avance de 1 minute.

evForward10min

  Avance de 10 minutes.

evSetMoviePosition

  Se place à la position (utilisable avec un podomètre; utilise la valeur relative (0-100%) du podomètre).

### Contrôle vidéo:

evHalfSize

  Réduit de moitié la taille de la fenêtre vidéo.

evDoubleSize

  Double la taille de la fenêtre vidéo.

evFullScreen

  Passe en mode plein écran.

evNormalSize

  Met la vidéo à sa taille réelle.

### Contrôle audio:

evDecAudioBufDelay

  Diminue le délai du tampon audio.

evDecBalance

  Diminue la balance.

evDecVolume

  Diminue le volume.

evIncAudioBufDelay

  Augmente le délai du tampon audio.

evIncBalance

  Augmente la balance.

evIncVolume

  Augmente le volume.

evMute

  Active/désactive le son.

evSetBalance

  Fixe la balance (utilisable avec un podomètre; utilise la valeur relative (0-100%) du podomètre).

evSetVolume

  Fixe le volume (utilisable avec un podomètre; utilise la valeur relative (0-100%) du podomètre).

### Divers:

evAbout

  Ouvre la fenêtre 'A Propos'.

evDropSubtitle

  Désactive le sous-titre actuellement utilisé.

evEqualizer

  Active/désactive l'équalizer.

evExit

  Quitte le programme.

evIconify

  Iconifie la fenêtre.

evLoad

  Charge un fichier (en ouvrant un mini navigateur de fichiers, où vous pouvez choisir un fichier).

evLoadPlay

  Fait la même chose que `evLoad`, mais démarre la lecture automatiquement après le chargement du fichier.

evLoadSubtitle

  Charge un fichier de sous-titres (avec un sélecteur de fichier)

evLoadAudioFile

  Charge un fichier audio (avec un sélecteur de fichier)

evNone

  Message vide, sans effet. (à part peut-être dans les versions CVS :-)).

evPlaylist

  Ouvre/ferme la playlist.

evPlayDVD

  Essaie d'ouvrir le disque dans le lecteur DVD-ROM indiqué.

evPlayVCD

  Essaie d'ouvrir le disque dans le lecteur CD-ROM indiqué.

evPreferences

  Ouvre la fenêtre de préférences.

evSetAspect

  Fixe l'aspect de l'image.

evSetURL

  Ouvre la fenêtre de saisie d'URL.

evSkinBrowser

  Ouvre le navigateur de skins.

## Créer des skins de qualité

Vous avez lu toute la doc expliquant comment faire un skin pour la GUI de MPlayer, fait de votre mieux avec Gimp et souhaitez nous soumettre votre skin? Lisez les guidelines pour éviter les erreurs communes et produire un skin de haute qualité.

Nous voulons des skins que nous puissions ajouter à notre repository pour se conformer à certain standards de qualité. Il y a aussi un nombre de choses que vous pouvez faire pour rendre notre vie plus simple.

En tant qu'exemple, vous pouvez jeter un oeil à la skin Blue, elle satisfait tous les critères listé ci-dessous depuis la version 1.5.

- Chaque skin devra joindre un fichier `README` qui contiendra les informations sur vous, l'auteur, le copyright et les notices de licence et n'importe quoi d'autre que vous souhaitiez ajouter. Si vous désirez avoir un changelog, ce fichier est le bon endroit.

- Il devrez y avoir un fichier `VERSION` avec rien de plus que le numéro de version de la skin sur une simple ligne (e.g. 1.0).

- Les contrôles horizontaux et verticaux (sliders comme le volume ou la position) devront avoir le centre du bouton proprement centré sur le milieu du slider. Il devra être possible de bouger le bouton aux deux extrémités du slider, mais pas de le dépasser.

- Les éléments de la skin devront avoir les bonnes tailles déclarées dans le fichier de la skin. Si cela n'est pas le cas vous pouvez cliquer en dehors e.g. un bouton et encore le déclencher ou cliquer à l'intérieur de sa zone et ne pas le déclencher.

- le fichier `skin` devra être prettyprinted et ne pas contenir d'onglets. Prettyprinted signifie que les chiffres devront s'aligner de façon ordonnée dans les colonnes