JeuWeb Créez votre jeu par navigateur !

nemesis_elite · (Modification du message : 23-04-2007, 10:43 PM par nemesis_elite.)

Oki merci

Si d'autre personne on des idées ....

**Sephi-Chan** · 23-04-2007, 11:56 PM

Moi je pense que.... Ha merde je ne pense pas. >.<

Plus sérieusement, tu devrais peut-être passer par un stockage en Javascript pour que, quand on clique sur une image, ça la mette sur le personnage. Parce que la c'est un peu lourd de devoir survoler l'élément.

Donc l'idée est de stocker tes informations dans un array Javascript , le but étant que l'utilisateur n'ai plus qu'à cliquer sur l'image pour lancer un script PHP qui propose l'image finale.

Sephi-Chan, qui s'essayera peut-être à un tel script.

Roworll · 24-04-2007, 09:13 AM

Je penche aussi pour une gestion 100% client avec un bouton de sauvegarde une fois le choix effectué.
C'est plus naturel comme mécanisme et ça permet de ne pas valider un design qui ne nous plait pas (j'ai un avatar, je veux le modifier et finalement les modifs ne me plaisent pas).

Ca décharge le serveur des traitements GD inutiles lors des etapes de prévisu.

[edit]
Pour le fun et les amateurs de JS, voici une version (totalement inutile) 100% JS.
Ce n'est pas optimisé (il y a quelques tests sont on pourrait se passer avec une meilleure organisation des variables) mais il y a des bouts de codes "amusant" dedans comme la génération d'éléments dynamiques avec support des évènements onClick, etc.

Les images utilisées pointent directement sur le site d'origine. c'est donc utilisable par tout le monde en local.

Code PHP :
<?php 

<html>

    <head>

        <script language="javascript"  type="text/javascript">

        //Valeurs par défaut au chargement

        var sBase='http://aurelien68.free.fr/perso/images/2/';

        var iYeux=1;

        var iCheveux=1;

        var iArmure=1;

        var iSsArmure=1;

        function findPos(obj) {

            var curleft = curtop = 0;

            if (obj.offsetParent) {

                curleft = obj.offsetLeft

                curtop = obj.offsetTop

                while (obj = obj.offsetParent) {

                    curleft += obj.offsetLeft;

                    curtop += obj.offsetTop;

                }

            }

            return [curleft,curtop];

        }        

        //Initialisation des éléments de la page

        function loadBuild(){    

            loadModel('cheveux',11);    

            loadModel('yeux',6);    

            loadModel('sous-armures',5);    

            loadModel('armures',4);

            BuildImage('mini');

            BuildImage('maxi');

            setPart('cheveux',iCheveux);

            setPart('yeux',iYeux);

            setPart('sous-armures',iSsArmure);

            setPart('armures',iArmure);

        }

        //Chargement des images modèle et association des scripts

        function loadModel(sType,iTot){

            var oDiv=document.getElementById('panel');

            for(var i=1;i<=iTot;i++){

                oImg=document.createElement('img');

                oImg.src=sBase+sType+'/'+i+'.png';

                oImg.id=sType+i;

                oImg.val=i;

                oDiv.appendChild(oImg);

                oImg.onclick=function () {

                    if(sType=='cheveux') iCheveux=this.val;

                    else if(sType=='yeux') iYeux=this.val;

                    else if(sType=='sous-armures') iSsArmure=this.val;

                    else if(sType=='armures') iArmure=this.val;

                }

                oImg.onmouseover=function () {

                    document.getElementById('mini'+sType).src=this.src

                    document.getElementById('maxi'+sType).src=this.src

                }

                oImg.onmouseout=function () {

                    if(sType=='cheveux') setPart(sType,iCheveux);

                    else if(sType=='yeux') setPart(sType,iYeux);

                    else if(sType=='sous-armures') setPart(sType,iSsArmure);

                    else if(sType=='armures') setPart(sType,iArmure);

                }

            }

            oBr=document.createElement('br');

            oDiv.appendChild(oBr);

        }

        //construction des deux images de prévisu

        function BuildImage(sMode){

            var oDiv=document.getElementById(sMode);

            aCoord=findPos(oDiv)

            oDiv.innerHTML='';

            setTete(oDiv,aCoord);

            loadPart('cheveux',iCheveux,oDiv,aCoord);

            loadPart('yeux',iYeux,oDiv,aCoord);

            loadPart('sous-armures',iSsArmure,oDiv,aCoord);

            loadPart('armures',iArmure,oDiv,aCoord);

        }

        // Construction des éléments des images de prévisu

        function loadPart(sType,iVal,oElem,aCoord){

            oImg=document.createElement('img');

            oImg.src=sBase+sType+'/'+iVal+'.png';

            oImg.style.position='absolute';

            oImg.style.top=aCoord[1]+'px';

            oImg.style.left=aCoord[0]+'px';

            oImg.id=oElem.id+sType;

            oElem.appendChild(oImg);

            oImg.style.width=oImg.parentNode.style.width

            oImg.style.height=oImg.parentNode.style.height

        }

        //Mise en place des éléments de l'image finale en fonction des valeurs

        function setPart(sType,iVal){

            oImg=document.getElementById('mini'+sType);

            oImg.src=document.getElementById(sType+iVal).src;

            oImg=document.getElementById('maxi'+sType);

            oImg.src=document.getElementById(sType+iVal).src;

        }

        //Construction du visage

        function setTete(oElem,aCoord){

            oImg=document.createElement('img');

            oImg.src=sBase+'tete.png';

            oImg.style.position='absolute';

            oImg.style.top=aCoord[1]+'px';

            oImg.style.left=aCoord[0]+'px';

            oElem.appendChild(oImg);

            oImg.style.width=oImg.parentNode.style.width

            oImg.style.height=oImg.parentNode.style.height

        }

        function saveImg(){

            // Mettre ici le code de sauvegarde GD de l'image.

        }

        </script>

        <style type="text/css">

        img:hover{

            cursor:pointer;

        }

        img{

            border: 1px solid black;

            margin:2px;

        }

        </style>

    </head>

    <body onLoad="javascript:loadBuild();">

        <div id="panel"></div>

        <br />

        <table>

            <tr>

                <td valign="bottom"><div id="maxi" style="width:64px;height:96px;" ></div></td>

                <td valign="bottom"><div id="mini" style="width:32px;height:48px;" ></div></td>

            </tr>

        </table>

        <br />

        <input type="submit" onClick="saveImg()">

    </body>

</html>

Plume · 24-04-2007, 10:26 AM

Y en à qui s'emmerde quand même -_-
Je regarde pas parce que moi et JS ... Bref !

Merci quand même de partager Smile

nemesis_elite · 24-04-2007, 12:12 PM

@Roworll : Merci bien ,je vais regarder çà Smile

DämEn a écrit :Y en à qui s'emmerde quand même -_-

....

Plume · 24-04-2007, 12:39 PM

J'parlais du fait qu'il avait sûrement du temps à perdre pour faire ça alors qu'il dit lui même et je cite :

Roworll a écrit :voici une version (totalement inutile) 100% JS.

Faut pas voir le mal partout ^^ Ca pousse à la névrose Big Grin

nemesis_elite · 24-04-2007, 12:40 PM

Okii ^^

dsl j'ai mal compris Smile

Plume · 24-04-2007, 12:46 PM

Ca ira pour cette fois GRrrr !

^^

nemesis_elite · 24-04-2007, 01:28 PM

^^

Voila jai modifier le script :
http://aurelien68.free.fr/perso/
Il marche très bien Smile

Merci a vous tous Smile

**Sephi-Chan** · (Modification du message : 24-04-2007, 01:52 PM par Sephi-Chan.)

Ca m'affiche l'adresse de l'image http://aurelien68.free.fr/perso/image.php quand je fais Enregistrer.

Sujets apparemment similaires…
Sujet		Auteur	Réponses	Affichages	Dernier message
	[Réglé] Script d'upload:	zneman	22	8 654	01-08-2007, 09:40 PM Dernier message: Plume
	Aide pour mon script d'attaque[REGLE]	Kassak	9	4 235	16-04-2007, 11:21 AM Dernier message: Michu
	[Réglé]Bug script d'attaque	zneman	7	3 674	05-04-2007, 10:32 PM Dernier message: Byleth
	[REGLE]Script bon ?	Archange	14	4 585	23-11-2006, 08:52 PM Dernier message: Archange