Page 1 sur 1

Infobulles avec Quixe

MessagePosté: Lun Juin 20, 2016 2:28 am
par Natrium
J'étais un peu jaloux de Tipelau qui affichait des bulles d'aide avec Vorple, alors j'ai essayé de voir s'il n'y avait pas un moyen de faire un truc équivalent avec Quixe et du CSS. Le résultat que j'ai obtenu est sympa et je me suis dit que ça intéresserait sûrement quelqu'un.

Déjà, il faut utiliser deux styles Glulx, donc c'est un peu contraignant si on n'en a plus beaucoup de disponibles… Pour l'exemple, j'ai utilisé les deux styles personnalisés, mais on peut aussi utiliser le style de note (si le jeu n'a pas de score) ou le style de citation (si le jeu n'a pas de boxed quotations). L'un des styles va servir pour le texte à survoler, et l'autre pour la bulle en tant que tel. L'infobulle n'apparaîtra que si le premier style est suivi de second, donc il est possible d'utiliser un style qui est déjà utilisé.
Code: Tout sélectionner
When play begins:
    say  "Lorem ipsum dolor sit amet. [first special style]Passe le curseur ici ![second special style]Et voici une infobulle ![roman type] Blabla bla patati et patata.".

Il faut ensuite modifier le fichier glkote.css en ajoutant ces lignes à la fin (à adapter en fonction des styles choisis et de l'apparence que l'on veut) :
Code: Tout sélectionner
/* L'apparence du texte à survoler */

.Style_user1 {
    text-decoration: underline;
    color: blue;
}

/* L'apparence de la bulle. */

.Style_user1 + .Style_user2 {

/* Pour la positionner "hors" du texte */
    position: absolute;
    margin-left: -5px;
    margin-top: 5px;

/* Son apparence */
    background: yellow;
    border: solid black 1px;

/* Il faut la masquer */
    opacity: 0;
}

/* Quand on passe le curseur sur le texte */

.Style_user1:hover + .Style_user2 {
    opacity: 1;
}

J'ai attaché un petit exemple, qui montre ce que ça donne si on s'amuse à ajouter des transitions.

Le seul défaut pour l'instant, c'est que ça n'est pas beau si on joue sur autre chose que Quixe, puisque les deux textes seront affichés l'un après l'autre. Le seul moyen d'empêcher ça, c'est de compiler deux fois le jeu, l'une ayant une option activée qui affiche les infobulles d'une autre manière (entre parenthèses, par exemple).

J'imagine qu'on peut faire plein d'autres effets marrants juste Quixe et du CSS !

Re: Infobulles avec Quixe

MessagePosté: Mer Juin 22, 2016 12:31 pm
par Mule hollandaise
Ah, cool ! C'est chouette d'arriver à faire ça ! Et c'est marrant de voir que c'est juste un petit peu de CSS, c'est quand même super puissant ce truc :)

Re: Infobulles avec Quixe

MessagePosté: Mer Juin 22, 2016 2:41 pm
par Otto Grimwald
C'est intéressant... bravo !