[DEV in PROGRESS]Box verticale 16/9 sur Zspin

[Porko]

Yo!

Test avec 3 jeux en mode vertical (paysage une autre fois)
manque les stats, les animations.... on verra un autre jour

[BBvideo 560,340][/BBvideo]

C'est fluide à mort
Si vous voulez tester:

Download l'archive et décompréssez ====> https://mega.nz/#!KAoSFLZA!9cugtx0-_8pk ... eXdArggOhw
récuperez la vrrsion de Zspin qui convient à votre OS ====> releases-f115/beta-test-t7243.html#p109555
et foutez le dans le premier dossier nommé ZspinShumpBox

Lancez, parametrez et testez (ya pas de jeux c juste le frontend)

Si vous etes en mode paysage (normal quoi) virez le plein ecran et redimentionnez pour avoir les bonnes proportions (c juste plus joli)

Merci @biloon j'ai pas encore commenté le code

[camarade35]

c'est propre vilain tricheur ( @porko ) , j'ai fouillé pour trouvé l'astuce, mettre le cadre en wheel pour éviter le flash noir, pas mal du tout ^^

edit :



je rencontre le même problème avec le thème vertical que j'ai balancé, le width à 100% pas de soucis mais le height à 100% fonctionne sur navigateur mais pas avec zspin, il se limite à la hauteur max de la vidéo.
Ma résolution : 1920 x 1080

[DarkTrooper]

super taf ça donne envie!

[Porko]

@camarade a part les max-height et max-widht faut peut-être mettre quand même une valeur énorme...
dis moi si tu trouves une astuce, j'ai pas le blème sous OSX

[camarade35]

@porko :

à tester, pour moi ces réglages fonctionnent.

Code : Tout sélectionner

  #vid_encart {
      position: absolute;
      top: 9.5vh;
      left: 10.2vh;
      width: 63%;
      height: auto;
      z-index: 1;
}

[Porko]

Merci mec!

Mais pour garder compatible a plusieurs résolutions (mais tjrs 16/9) il faut le contraindre par la hauteur (d'où le vh)
Mais effectivement si tu mets un height la video ne suit pas

donc

Code : Tout sélectionner

      position: absolute;
      top: 10.2vh;
      left: 10.2vh;
      width: 34.9vh;
      z-index: 1;

Et là c'est nickel


Biloon, pour le cadre en bas à droite on va faire plusieurs images qui se relaient, il me faudrait de quoi alimenter les 3 jeux
instructions, fanart...
On va se limiter à 4 pour le moment

Merci les gros

EDIT: lien mega à jour avec le theme qui va bien

[biloon]

Yo,
je viens de voir c'est super :ouah !

Je vais te faire :
- le rideau de loading comme tu m'a demandé mais un unique aux couleurs de Zspin pour qu'on identifie bien le Frontend

Effectivement ca peut cool de mettre le slide en bas à droite mais il faudrait trouvé un moyen pour que ça apparaissent en plein Ecran et qu'on ai pas de bande noires sur des images verticales ?

[Porko]

Pô compris au sujet du cadre... Tu veux dire full-cadre? Si c'est ça il me faudrait le natif de ton fond ou le fond en PNG 1080x1920 avec un trou au niveau de cadre (pour mettre les images à l'intérieur du cadre)
Les images à mettre dedans doivent avoir la même résolution ou au moins les mêmes proportions


Pour le rideau, en fait ce serait mieux d'avoir une ouverture façon ascenseur (comme la video de camarade) ==> ouverture plus rapide (moins de distance qu'un volet roulant)
Et j'insiste pour la wheel en peinture écaillé sur cette ouverture (on pourra automatiser par la suite) pour pour la navigation c'est mieux de voir direct quel jeu et sélectionné quand tu veux aller vite

[biloon]

Pô compris au sujet du cadre... Tu veux dire full-cadre? Si c'est ça il me faudrait le natif de ton fond ou le fond en PNG 1080x1920 avec un trou au niveau de cadre (pour mettre les images à l'intérieur du cadre)
Les images à mettre dedans doivent avoir la même résolution ou au moins les mêmes proportions

Si SI on s'est compris !
justement les instructions card n'ont pas les proportions du cadre en bas en droite... c 'est pour ça que je suppose qu'il va y avoir des bandes noires...
pas de soucis pour l'ascenceur je vais me pencher la dessus

[Porko]

Sinon pour les instructions, rajoute un cadre a part tout en bas au format des instructions space et ce sera réglé (le plus large possible qu'on puisse lire)

[biloon]

Par contre je viens de revoir la vidéo...
je pensais que le fond resterait fixe ( le module de visionnage en gros) et qu'on aurait pas cet éffet de slide ?
Et finalement la Wheel ca serait uniquement les informations ?

Je me trompe ?

[Porko]

On peux laisser en fixe il suffit d'éditer Database/Main menu/wheel.json
et de remplacer le code par celui là

Code : Tout sélectionner

{
  "transitionTime": 2,
  "selectPosition": 2,
  "hide": true,
  "hideStart": 1000,
  "hideDuration": 1000,
  "type": "horizontal",
  "points": [
  {"x":0, "y":0, "scale":2.62, "zIndex":1},
    {"x":0, "y":0, "scale":2.62, "zIndex":1},
    {"x":0, "y":0, "scale":2.62, "zIndex":2},
    {"x":0, "y":0, "scale":2.62, "zIndex":1},
    {"x":0, "y":0, "scale":2.62, "zIndex":1}
  ]
}

Mais je préfère en slide

[camarade35]

Par contre je viens de revoir la vidéo...
je pensais que le fond resterait fixe ( le module de visionnage en gros) et qu'on aurait pas cet éffet de slide ?
Et finalement la Wheel ca serait uniquement les informations ?

Je me trompe ?

En fait, il faut savoir qu'on attends un correctif/maj sur zspin car pour le moment entre deux chargement de thèmes il y a un flash noir
@biloon : de ce fait, le slide grace à la wheel permet d'éviter cette vision du flash, voilà

@porko : on a bien un problème avec zspin sur le height, autant le width permet de scaler à foison autant le height ne prend rien et bloque à la valeur de la vidéo (si vidéo 640x480, le max height même avec 200% sera 640px affiché)
Donc fonctionne en html (height: 100%; affiche bien la vidéo sur toute la hauteur) mais pas avec zspin --> go issue

[Porko]

Yep j'ai vu le coup du height sur les videos...

Par contre avec le dernier bout de code pour le wheel.json tu as les wheels fixes

[camarade35]

@porko : oui, j'ai pas testé mais j'ai vu les positions ^^

[Porko]

J'ai intégré les étoiles du level de (0 à 5)
Je bute sur speed et autres... Faire des barre par rapport à une valeur c'est chaud pour moi...

J'ai tenté un truc degueux a base de *** comme valeur dans le database et afficher avec le fond de la mm couleur... Ca marche mais limité en terme de mise à l'echelle....

Ouvert à toute solution

[biloon]

Hey laisse tomber PORKO je vais te les envoyer les cercles au format JPEG
Prépare juste une espace pour un artwork

[Porko]

Je vais y arriver !
Ce sera mieux car plus léger, moins de taf et surtout je pourrais l'animer

T'inquiètes, jm'acharne

EDIT: Quitte à taffer, peux tu alimentes moi plutôt les instructions pour les 3 jeux?

[camarade35]

https://github.com/chartjs/Chart.js

edit : j'abuse, allez : http://www.chartjs.org/docs/latest/charts/doughnut.html

edit2 : https://codepen.io/camarade35/pen/MoVMaN" onclick="window.open(this.href);return false;

[Porko]

Merci camarade mais là pour le coup t'es sûr que je ne peux rien y biter
Merci quand même

Je sais créer un block, ça c'est bon
Je sais lui donner une taille, couleur...
Je ne sais pas lier la valeur du database (ex: speed-Zspin) à la largeur de mon block
Comment lui dire.... width: %zspin-speed%vh; ??? <=== pas test

C'est tout