Messagerie


HTML5 et plein écran

Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
jeudi 2 novembre 2017 à 12:07
Salut salut,

Je voudrait ajouter un bouton pour sortir du mode pleine écran dans un jeu en HTML5 au lieux de devoir appuyer sur échap. "Passer en mode fenêtré" ne marche pas.
Et je n’ai pas trouvé nonplus comment tester si le jeu est en plein écran ou pas.
Emmanuel
2412 messages
Fusion 2.5 Dev Fusion 2.5
Firefly Exporteur UWP Exporteur iOS Exporteur Android Exporteur HTML5 Fusion 2.5+
jeudi 2 novembre 2017 à 13:18
bonjour
a tu regarde sur l extension (L'objet HTML5)  en Appelle une fonction Javascript dans la page HTML ?

Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
jeudi 2 novembre 2017 à 13:50
Hm, non j’ai pas tellement regardé. Mais du coup, faut que j’ajoute la fonction dans mon fichier html. Je vais chercher ça.

[edit]hé cool ça marche :)

Donc si ça intéresse quelqu’un, J’ai ajouté dans mon fichier html
<script>
function toggleFullScreen()
{
  if (!document.fullscreenElement) { document.documentElement.requestFullscreen();}
  else { if (document.exitFullscreen) { document.exitFullscreen(); } }
}
</script>

Puis dans Fusion j’ai fait un événement avec pour action Appeler Fonction "toggleFullScreen"
Modifié le vendredi 23 août 2019 à 11:57 par Seyjin
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
samedi 4 novembre 2017 à 12:39
Coucou,

Alors sinon, pour tester si le jeu est en plein écran. On peut juste comparer la taille horizontale de la partie client de la fenêtre × la taille verticale de la partie client de la fenêtre à la largeur de l’écran × la hauteur de l’écran via l’objet Contrôle Fenêtre, si égale alors le jeu en plein écran (ou tordu, mais normalement ça n’arrivera pas).
Patrice
2784 messages
Fusion 2.5 Dev Fusion 2.5
Firefly Exporteur UWP Exporteur iOS Exporteur Android Exporteur HTML5 Fusion 2.5+
samedi 4 novembre 2017 à 14:04
Merci beaucoup, tu aurais un petit mfa d'exemple ? C'est super intéressant. Je trouve que la compilation html5 génère une page assez sommaire. Si on peut améliorer un peu.
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
samedi 4 novembre 2017 à 16:13
Je trouves au contraire que la page html générée par Fusion est trop fournie. Pleins de cadres qui ne servent à rien et les dimensions fixes qui sont incompatible avec le pleine écran.

Je termine la mise à jour de 10010, organise et commente les événements, et vous passe le mfa et mon fichier html.
Patrice
2784 messages
Fusion 2.5 Dev Fusion 2.5
Firefly Exporteur UWP Exporteur iOS Exporteur Android Exporteur HTML5 Fusion 2.5+
samedi 4 novembre 2017 à 20:04
Je me suis mal exprimé, la page est assez compliquée, mais au final la présentation est sommaire et franchement pas jolie. J'avais pensé un temps faire un utilitaire avec Fusion pour générer à posteriori une page HTML qui appelle le jeu avec la possibilité de modifier l'image de fond, le titre et éventuellement d'autres options comme le full screen in-game. Ça manque...
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
samedi 4 novembre 2017 à 21:20
Le mieux pour afficher le jeu est d’utiliser une iframe en plus de la page avec le jeu. C’est nécessaire pour avoir le jeu dans un cadre et pouvoir passer en plein écran.

Voilà le mfa de 10010 en exemple accompagner de deux fichier html. Pour les tests, je le lance avec page.html.

En fait, il n’est pas utile d’ajouter quoi que ce soit directement dans le fichier index.html, tout ça dépend du site qui l’héberge.
Modifié le vendredi 23 août 2019 à 11:57 par Seyjin
Pièces jointes
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
lundi 6 novembre 2017 à 10:24
Je reviens parler d’un bug avec l’option Étirer sans dépasser . D’après ce que j’ai observé, la scène semble toujours adaptée sur la largeur, et dépasse donc en bas quand la hauteur est plus petite au lieux d’être adaptée en hauteur.


Mais en cliquant un peu partout j’ai remarqué que les positions et hitbox des objets sont aux endroits de la scène adaptée en hauteur (mouai, j’arrive pas à bien l’expliquer).

J’ai parcouru le forum officiel pour voir si on parle de ce bug, mais comme je suis pas douée en anglais je rame.

[edit] Bon pour le bug, il suffit de virer les dimensions du canvas dans le CSS.
Modifié le vendredi 23 août 2019 à 11:57 par Seyjin
890 messages

vendredi 10 novembre 2017 à 16:19
Hello,
çà faisait longtemps...
Pour un taf, j'ai besoin de faire une appli html5 en plein écran. çà je sais faire : resize display + anti aliasing et c'est bon. l'appli se resize (du verbe resizer ;) ) en temps réel si je manipule la fenêtre.
Mais si je place l'index.html dans un article joomla, le module html5 ne va plus sur tout l'écran. Et pire que tout si je manipule ma fenêtre j'écrase visuellement mon appli en hauteur...

Quelqu'un sait-il comment insérer une appli fusion sur joomla proprement ?
merci de vos lumières !
Emmanuel
2412 messages
Fusion 2.5 Dev Fusion 2.5
Firefly Exporteur UWP Exporteur iOS Exporteur Android Exporteur HTML5 Fusion 2.5+
vendredi 10 novembre 2017 à 16:34
Bonjour Arthurh du a regarde en utils  l extension (L'objet HTML5)  en Appelle une fonction Javascript dans la page HTML ?
avec seyjin on a parle ici : http://comptoir-mmf.eu/Forum/index.php?topic=2117.0
890 messages

vendredi 10 novembre 2017 à 16:52
Merci Emmanuel ! je vais regarder çà !!!
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
vendredi 10 novembre 2017 à 18:31
Salut salut,

Je ne connais pas trop Joomla. Je suppose que l’intégration se fait avec une ifram, du coup il faut lui ajouté allowfullscreen="true" pour pouvoir passer en plein écran.

(En fait là je me dit que ça serait peut être bien de fusionner les deux topics pour pas éparpiller les infos intéressantes)
Modifié le vendredi 23 août 2019 à 11:57 par Seyjin
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
vendredi 10 novembre 2017 à 18:42
J’ai un peu modifier mon fichier html de base. Maintenant quand on passe en plein écran et que la hauteur (ou la largeur) est plus petite, ça fait des bandes noires en haut et en bas (ou sur les côtés).
Modifié le vendredi 23 août 2019 à 11:57 par Seyjin
Pièces jointes
890 messages

vendredi 10 novembre 2017 à 18:46
Merci Seyjin. Visiblement joomla me fait des siennes ou c'est moi qui suit trop quiche (fort possible d'ailleurs).
Le soucis majeur est la perte du plein écran parfait lorsque le html est placé en iframe dans joomla : il allonge la hauteur !
Alors mon html fonctionne super tout seul : je déforme la fenêtre et tout est parfaitement collé. Bref...
il me reste juste un code pour rendre une iframe responsive. Bien que le terme est impropre pour mon utilisation mais bon... je termine mes tests et reviens vers vous !
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
vendredi 10 novembre 2017 à 21:11
Tu as pu testé avec l’argument allowfullscreen ? Je sais pas si c’est possible en utilisant Joomla.
890 messages

vendredi 10 novembre 2017 à 22:37
Et bien c'est inopérant. On cherche à faire autrement...
En fait c'est pas un fullscreen que je cherche à faire, juste que ma frame colle aux bords de la fenêtre, quand le module html5 est mis dans un article joomla.
Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
samedi 11 novembre 2017 à 09:14
Tu veux dire par dessus toute la mise en page du site ?
Voilà un petit exemple pour ça.
Pièces jointes
890 messages

samedi 11 novembre 2017 à 09:51
Hello Seyjin, merci !
Je joue le html5 en utilisant page.html et cliquer sur le bouton ne mets pas en plein écran (j'ai toujours la barre du navigateur en haut). Mais le html se mets bien au bord de la fenêtre pour la largeur.
Je serais toi, j'obligerais de coller aussi en hauteur. Pour les 4 points de rupture d'un responsive, en paysage, les rapports d'écran sont entre 1.6 et 1.77. ceux qui sont avec un rapport 1.6 ne verront plus de barre en bas et ne détecteront pas forcément l'étirement en hauteur.
Pour mon problème, c'est la surcouche joomla ou plutôt le fait que le html est dans une iframe dans le bloc article de joomla.
Si j'utilise mon html seul, je colle parfaitement à tous les bords quelque soit la taille de la fenêtre (je préfère çà car mon rapport d'écran cible varie très peu). Mais si je colle mon html dans la frame joomla, il l'enferme dans son canvas et modifie la hauteur de ce dernier en fonction de l'écrasement en X de la frame...
En fait pour tout expliquer : j'ai un module html qui ne doit être jouable que lorsqu'un joueur vient de s'enregistrer. Mais le processus d'enregistrement est sous joomla (pour récupérer facilement la liste des enregistrés avec un beau back office bien propre, un système de vérif automatiser pour les e-mails ... bref). Du coups, l'appli html doit détecter si un process de ce genre a été effectué avant ou savoir d'où vient l'internaute avant le jeu html pour éviter que le jeu ne puisse se jouer sans s'être inscrit.
La première piste à été d'utiliser la fonction document.referrer mais ce n'est pas valable au sein d'un même domaine et le client veut que le site et le jeu soient sur un même domaine.
La seconde piste a été de regarder du côté des cookies. J'ai le nom du cookie créée lors de l'inscription joomla mais il est interdit à une appli externe au processus de lire les cookies sur l'ordi d'un internaute. merci à Nuagedan100 pour ses investigations !!!! :)
La troisième piste est de chercher une session ouverte. Je teste cela actuellement.
La quatrième piste est un code pour rendre l'iframe de joomla déformable, parfaitement collée aux bords. Ma femme y est presque. Mais presque c'est pas encore çà. Donc cette piste aussi est en cours de recherche. Si elle débouche, je n'ai plus à m'occuper de la troisième piste puisque le jeu ne sera accessible que via le système de Joomla vu que la page est déclarée pour les membres uniquement.
Voilà tu sais tout ! Encore un grand merci pour ton aide ! ;)

Seyjin
1471 messages
Fusion 2.5 Dev
Exporteur Android Exporteur HTML5 Fusion 2.5+
samedi 11 novembre 2017 à 11:14
Pour qu’il n’y au pas les barres du navigateur, j’utilise le mode plein écran (avec la fonction dont je parles plus haut). La dernière version de mon index.html ajuste bien les bandes noirs quelque soit le ratio de l’écran ou la fenêtre. page.html me sert juste pour tester avant que j’upload sur itch. Avec cette méthode je n’ai pas besoin de toucher aux dimensions de l’ifram.
Utilisateurs en ligne
  • Aucun utilisateur en ligne
  • 13 visiteurs au total

Derniers messages