+- PrimTux, la distribution éducative (https://forum.primtux.fr)
+-- Forum : PrimTux: LE CONTENU: présentation, aide et développement (https://forum.primtux.fr/forumdisplay.php?fid=4)
+--- Forum : Migration des activités wine (https://forum.primtux.fr/forumdisplay.php?fid=38)
+--- Sujet : Exerciseurs et remplacement progressifs des Clicmenu (/showthread.php?tid=982)
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 12-11-2018
Oui, c'est vrai... et encore j'ai réduit. :lol: Je suis en train de voir pour avoir q'un paramètre qui règle la vitesse et du coup j'ajusterais en temps voulu.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 12-11-2018
mothsart a écrit :Désolé, je me suis trompé de lien :Si c'est pour répondre au drag & drop, tu t'es encore trompé de lien puisque celui-là c'est celui du remplaçant du paralphabet !
https://mothsart.github.io/labo/frontend/shootingstand/
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 12-11-2018
Rah, j'ai vraiment pas les yeux en face des trous ces derniers soirs : https://bevacqua.github.io/dragula/
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 12-11-2018
mothsart a écrit :Rah, j'ai vraiment pas les yeux en face des trous ces derniers soirs : https://bevacqua.github.io/dragula/Ben, c'est la page exemple du lien donné en premier et pour lequel j'exprimais des réserves !
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 13-11-2018
Ah, je pensais que tu utilisais le fichier exemple dans le dépôt git.
C'est bizarre, j'avais utilisé cette lib pour mon éditeur de svg interactif sans rencontré de difficulté : j'ai juste suivi l'api bêtement.
Maintenant, si tu fais du natif et que tu t'en sors, c'est toujours mieux.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 17-11-2018
Pour info et pour éviter les travaux en doublon:
j'ai commencé à travailler sur "à la campagne", 1ère application du clicmenu mini (constitution de collections de nombres).
Je ne sais pas si quelqu'un a commencé à travailler là-dessus, mais de toute façon ça ne sera pas du temps perdu en ce qui me
concerne parce que:
- je n'avais pas touché au html + css + javascript depuis plus d'un an (et en javascript je n'étais que débutant). Donc ça me permet de m'y replonger;
- ça me permet de travailler à fond sur le drag & drop, avec gestion d'événements associés, ce qu'on retrouve dans beaucoup d'applications.
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 17-11-2018
Non, pas travaillé dessus. Tant mieux si tu te perfectionnes !
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 22-11-2018
Philippe Dpt35 a écrit :J'ai en revanche trouvé un tuto proposant les bases, très simples, fonctionnant sous Firefox et Chrome:Pour info:
https://www.useragentman.com/blog/2010/01/10/cross-browser-html5-drag-and-drop/
Je vais travailler avec ça.
Finalement, avec cet outil, je me suis trouvé bloqué pour implémenter certaines fonctions dont j'avais besoin (l'outil le permettait peut-être, mais je n'ai en ce qui me concerne pas réussi à faire avec).
Du coup j'ai cherché ailleurs, et j'ai trouvé beaucoup plus simple encore, en n'utilisant que html5:
https://www.w3schools.com/html/html5_draganddrop.asp
avec quelques recherches complémentaires sur le net pour certaines fonctions : copier un objet, le supprimer...
Très facile à prendre en main. Un code simple, pas besoin de code externe. Je recommande !
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 22-11-2018
Super si tu as trouvé ton bonheur.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 26-11-2018
Voici une première application: l'adaptation de A la campagne en HTML5 et responsive:
https://www.de-bric-et-de-broc.fr/test/applis/alacampagne/alacampagne.html
Il reste à faire l'habillage. Etant incompétent dans le domaine du graphisme, je fais appel aux vôtres. Si vous avez des adresses de graphismes dans lesquels aller piocher, ou si vous vous sentez l'envie de dessiner vous-mêmes, je suis preneur.
Voici le graphisme de l'original:
![[Image: alacampagne.png]](http://www.primtux.fr/Documentation/forum/alacampagne.png)
Tous avis permettant d'améliorer la présentation et l'ergonomie sont également les bienvenus.
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 27-11-2018
Pas mal Philippe !
J'ai vu passé pas mal de petits bugs mais je vais déjà me concentrer sur le graphisme et je te les listerais après intégration.
Je sais comment ça se passe : y'a des bugs graphiques qui vont naturellement disparaître et d'autres apparaître après cette étape. On va donc éviter le travail inutile.
Faudra peut-être réfléchir à faire marcher ton jeu sur une interface tactile.
En attendant, j'ai fini mon illustration pour mon stand de tir : https://openclipart.org/detail/310952/shooting-stand
Dis moi juste si il faut que je garde les images des animaux ou si je peux tout vectoriser en mode cartoon ?
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 27-11-2018
J'ai fait très récemment de nouvelles modifications, et je ne sais pas si tu les as vues au moment de tes essais: nouvelles images, zoom lors du drag.
J'ai repris des images en vérifiant leur droit d'utilisation. Il m'a fallu piocher dans les images utilisables et modifiables dans un but non commercial. Je n'ai pas trouvé de choses satisfaisantes dans le libre (ce qui ne signifie pas qu'il n'en existe pas - je suis preneur de tout lien intéressant vers des banques d'images).
Je ne suis pas particulièrement attachées aux images actuelles. si tu as des choses à proposer, n'hésite pas.
On peut d'ailleurs déjà se poser la question du type d'images: faut-il privilégier le réalisme, ou au contraire aller vers du dessin compte-tenu de l'âge du public concerné ?
Ne pourrait-il pas également être intéressant d'avoir une certaine unité dans le graphisme, avec un même style que l'on retrouverait à travers les diverses applications, qui serait la marque des applis développées pour et par PrimTux ?
Je vais creuser la question pour le tactile, mais il me semblait plus important dans un premier temps de développer rapidement pour PrimTux un grand nombre d'applications, l'adaptation au tactile pouvant se faire dans un second temps.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 27-11-2018
PS: les sources sont sur Framagit, mais pour l'instant uniquement en privé.
J'attends d'avoir quelque chose de plus présentable pour les mettre publques, mais si d'ici là tu souhaites y avoir accès, il n'y a pas de problème !
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 28-11-2018
J'ai maintenant les outils pour les applications qui font appel au glisser-déposer. Je vais donc travailler sur celles-là. j'attaque "Association d'images" de clic-menu mini, qui consiste à regrouper ds images par catégories. ça devrait aller beaucoup plus vite.
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 29-11-2018
Philippe a écrit :On peut d'ailleurs déjà se poser la question du type d'images: faut-il privilégier le réalisme, ou au contraire aller vers du dessin compte-tenu de l'âge du public concerné ?
Ne pourrait-il pas également être intéressant d'avoir une certaine unité dans le graphisme, avec un même style que ...
Je suis partagé sur l'idée. La cohérence graphique c'est conseillé dans le monde pro mais en réalité j'ai peur des fois de perdre de la diversité en ayant quelque chose de trop lisse.
La diversité, ça à du bien.
L'idéale serait d'avoir des apps avec des thèmes graphiques mais bon, on va pas trop faire les fines bouches.
Le soucis avec les images matriciels c'est effectivement les droits ou la capacité de faire des photos.
Je préfère me concentrer sur du vectoriel car ça me donne beaucoup de souplesse :
- pas de tracas sur le responsive et sur la taille. (une fois compressé, c'est plutôt petit)
- facilité d'édition et de découpage pour du web
- grande liberté de création
- rapidité : je commence à être à l'aise sur inkscape
Je vais voir ce que je peux faire pour "à la campagne".
Philippe a écrit :Je vais creuser la question pour le tactile, mais il me semblait plus important dans un premier temps de développer rapidement pour PrimTux un grand nombre d'applications, l'adaptation au tactile pouvant se faire dans un second temps.
Oui, tu as raison, rien d'urgent. Concentre toi sur les autres applis en drag and drop. On verra ça plus tard.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 01-12-2018
Voilà, j'ai le moteur de l'application association d'images, à tester (Jérémy, je pense que tes enfants se feront un plaisir de tester !
)https://www.de-bric-et-de-broc.fr/test/applis/association/association.html
Je fais là aussi appel à contribution pour l'habillage.
Se pose le problème des images à classer. J'ai copié les images depuis le jeu original. Soit nous refaisons des images (mais alors, quel boulot, sachant qu'il y a 3 séries de 15 images, et qu'il y a une seconde application identique mais avec des séries différentes !) soit nous utilisons les images actuelles, mais dans ce cas il serait préférable d'en demander l'autorisation à l'auteur. Quelqu'un sait-il comment le contacter ?
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 01-12-2018
De ce que j'ai compris de Clicmenu : c'est une boite qui encapsule des jeux de provenance variés donc c'est plutôt vers les devs de l'app "association d'images" qu'ils faut se tourner...
(Je t'ai mis un mail d'un des devs de clicmenu)
Après, vu que le soft est déjà inclus dans les logiciels non libres, on peut toujours mettre les applications ou ont a des indécisions niveau droits d'images dans le périmètre "non libre".
En finalité, je ne pense vraiment pas qu'on risque quoi que ce soit sur ce type de contenu et qu'on se prend la tête pour pas grand chose.
Seul truc qui pourrait être sympa : mettre de la transparence sur les png serait top.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 01-12-2018
mothsart a écrit :Seul truc qui pourrait être sympa : mettre de la transparence sur les png serait top.Pendant le déplacement ?
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 01-12-2018
Non, éviter d'avoir des fonds unis (gris ou blanc).
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 01-12-2018
Mais alors il faut présenter les choses autrement: ce ne sont alors plus des images à classer, mais des choses ou objets !
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 02-12-2018
Exact et ça reste subsidiaire.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 02-12-2018
J'ai mis une bordure aux images, ça améliore déjà beaucoup.
Exerciseurs et remplacement progressifs des Clicmenu - mothsart - 02-12-2018
Ok, bonne idée.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 12-12-2018
J'ai créé un moteur javascript permettant de créer facilement toute application dont le but est d'ordonner des éléments:
- mots à mettre dans l'ordre alphabétique
- nombre à ranger dans l'ordre
- etc.
Pour cela il suffit de remplir le tableau en toute première ligne du script avec les items sous forme de chaînes de caractères, en les mettant dans l'ordre que l'on doit obtenir. On peut créer autant de listes que l'on veut en insérant tout simplement de nouveaux tableaux dans le tableau.
L'appli crée automatiquement les boutons permettant de sélectionner les différentes listes et affiche les éléments dans un ordre aléatoire.
On range les éléments en les déplaçant dans le cadre par drag & drop. Une fois dans le cadre, les éléments peuvent être redéplacés.
Avec ce moteur on pourra facilement créer tout type d'application pours lesquelles il s'agit d'ordonner des éléments quelconques. Il ne restera plus que l'habillage à faire en html et css.
C'est testable ici: https://www.de-bric-et-de-broc.fr/test/applis/ordonner/ordonner.html
J'attends vos retours en vue d'améliorer.
Exerciseurs et remplacement progressifs des Clicmenu - Philippe Dpt35 - 14-12-2018
Pendant que j'y étais, j'ai fait une adaptation pour réaliser des applications dont le but est d'ordonner des images.
A tester ici:
https://www.de-bric-et-de-broc.fr/test/applis/ordonner-img/ordonner-img.html
Pour réaliser ses propres séries d'images à classer, il suffit de modifier le fichier images.js du répertoire en y indiquant le nom des fichiers images dans l'ordre du classement correct, et de placer les fichiers images dans le dossier img.
Voici le contenu du fichier images.js actuel:
Code :
/*
Entrer ici les noms des images à classer.
Chaque nouveau tableau correspond à une nouvelle liste.
Pour créer une nouvelle liste, il suffit d'ajouter un nouveau tableau
sans oublier de mettre une vrigule à la fin de la ligne du tableau précédent.
Dans le tableau, les noms des images doivent être impérativement saisis dans
l'ordre de classement. Le script se chargera de les proposer dans un ordre aléatoire.
*/
var items = [
["img1-1.jpg","img1-2.jpg","img1-3.jpg","img1-4.jpg","img1-5.jpg","img1-6.jpg","img1-7.jpg","img1-8.jpg"],
["insecte.png","souris.png","chat.png","chien.png","mouton.png","vache.png","elephant.png","baleine.png"]
];
/*
Indiquer dans ce tableau la hauteur des images des différentes séries,
la première valeur correspondant à la pemière série,
la seconde à la deuxième série, etc.
*/
var hauteurImages = ["145px","100px"];Il n'y a plus qu'à ouvrir le fichier html, le script se chargeant de créer tous les élément html nécessaires.