STIC Discussion:STIC II - exercice 15 (Nestor-Pixel)

De EduTech Wiki
Aller à la navigation Aller à la recherche

Webrefence -- Sylviane 24 avril 2008 à 17:35 (CEST)

Depuis cette après-midi je n'ai plus aucun accès au site "Webreference", quand je le charge, il affiche une page blanche et ce dans n'importe quel navigateur (FF, IE, Op). Le lien apparaît dans la barre url, avec le favicon mais la page reste désepérement vide avec indiqué en bas "terminé". Or le site n'est pas en carafe, j'ai fait vérifier par d'autres personnes. Est-ce parce que j'ai fait des manipulations autour du js et ça aurait déréglé qq chose ? J'ai réinstallé Firefox, ça n'a rien changé. J'ai revérifié tous mes paramètres. J'ai pas de restrictions de pop up ni de choses comme ça.

Avez-vous une piste ?

Je cherche un script qui me permette de déplacer des images sur une autre image. Quelqu'un a-t-il ça ? Ou pouvez-vous m'indiquer d'autres sites de scripts. J'ai fouillé le web mais je ne trouve que des sites avec scripts pour les menus, des choses comme ça.

Merci

Re: Webrefence -- Daniel K. Schneider 24 avril 2008 à 18:29 (CEST)

Non je ne connais pas de "drag and drop" scripts pour JS. Je vous conseille de fouiller quand-même une fois ma page de liens. Doit y avoir au moins 3 sites qui ont ce genre de code.

http://edutechwiki.unige.ch/en/JavaScript_links#Sites_with_javascript_code

(genre dhtmlgoodies ou hotscripts) http://www.dhtmlgoodies.com/index.html?page=dragDrop

Re: Re: Webrefence -- Sylviane 24 avril 2008 à 22:26 (CEST)

merci beaucoup, j'ai trouvé ça : http://www.dhtmlgoodies.com/scripts/drag-drop-custom/demo-drag-drop-1.html ça me paraît convenir, pourvu que je sache l'adapter.

Re: Webrefence -- Davidc 25 avril 2008 à 21:35 (CEST)

Refresh d'une page javascript

Concernant les pages vides, il est souvent nécessaire de rafraîchir une page pour voir les modifications apportés au script JS. Mais il ne faut pas oublier que les navigateurs en font parfois trop pour nos besoins. Souvent les .js sont mis en cache !

2 trucs pour rafraîchir une page avec des scripts .js externe :

  1. Refresh avec ctrl-f5
  2. Dans Firefox, clik sur Outils/Effacer mes traces => cocher que le cache

Il existe des méthodes plus compliqués aussi pour le développement, du genre écrire :

<script type="text/javascript" src="monScript.js?<?php echo time();?>"></script>

afin que le navigateur recherche toujours un script qu'il n'a pas en cache..

Script drag-and-drop

Mon favori perso, c'est la librairie prototype.js. À partir de cette librairie, il y a la librairie Scriptaculous qui rajoute plein de fonctionnalités comme le drag-and-drop made easy. Exemple de création d'un drag facile :

new Draggable('id_de_l'objet_a_rendre_draggable');

Ces 2 librairies ont une très bonne documentation online et des communautés très actives ==> d'où des réponses complètes et rapides à tes questions..

Re: Script drag-and-drop -- Sylviane 25 avril 2008 à 23:58 (CEST)

wââ il y a des trucs bling-bling marrants (bling bling est un mot à la mode en ce moment en France ;-)

Merci David. Mais finalement j'ai abandonné mon idée première car je ne cherchais pas seulement à ce que ce soit drag & drop mais aussi à ce que lorsque l'étiquette était mal placée, elle revienne à sa place initiale. Je n'ai vraiment pas trouvé comment faire, donc je suis partie sur quelque chose de + simple, - de modifs. Par contre pour ma deuxième idée, il faut que je cree un texte particulier et ce n'est pas évident non plus.

Re: Re: Script drag-and-drop -- Sylviane 26 avril 2008 à 08:34 (CEST)

En fait mon idée était simplement de reproduire à l'écran l'exercice que Denise et moi avions fait pour methodo. Là c'est sous forme papier mais à l'écran il aurait suffit de drag and drop les mots et les placer dans les bonnes cases. J'avais compris le principe du script mais j'ai eu trop de difficultés à positionner les boites correctement à partir des scripts trouvés. J'ai donc lâché cette idée. Je pense qu'en y conscacrant + de temps j'y serais arrivée.

=Re: Re: Re: Script drag-and-drop -- Davidc 26 avril 2008 à 18:02 (CEST)=

Et encore, ça n'est qu'une toute petite page démo, les effets possibles sont vraiments presque-infini et quand on se met à les combiner... et à rajouter du ajax par-dessus. :P

C'est d'ailleurs pour ça que j'ai de la difficulté à t'enligner. Il faudrait que tu décrives de façon exhaustive et télégraphique (scénario d'utilisation) ce que tu veux. M'est avis que ça n'est pas si difficile à faire, faut juste s'aiguiller dans la bonne direction.

Exemple, quel est le comportement du drag (et de son cercueil) quand il est au dessus de la bonne boîte ? Quand il est au-dessus de la mauvaise ? Sinon, tu veux un effet "retour à la case départ" ou pas, comment, quoi, etc. ? Tout ça, c'est assez simple à réaliser en utilisant les bonnes options. J'te guide si tu veux ;)

==Re: Re: Re: Re: Script drag-and-drop -- Davidc 26 avril 2008 à 18:25 (CEST)==

Deja, une piste pour faire simple. tu crée un div pour chaque cercueil et tu les position: absolute. Reste à déterminer la bonne position sur ton image (top, left: 120px;) Après, tu créé tes drag avec des options pour atterir correctement dans tes cercueils ou retouner au point de départ (revert:true)

===Re: Re: Re: Re: Re: Script drag-and-drop -- Sylviane 27 avril 2008 à 16:07 (CEST)===

Merci David pour ton aide mais je ne vais reprendre la construction de ma première idée car l'autre est bien avancée. Mais je compte bien me remettre à Js et à Php pendant les grandes vacances ce sera plus facile car j'aurai du temps. Par contre je veux bien que tu répondes à ma question suivante (que je poste dans sous un nouvel intitulé pour + de visibilité.. :-)

TTW -- Sylviane 27 avril 2008 à 16:25 (CEST)

J'ai installé et paramétré un ttw (celui de chez Tiny). Ça marche. Mais maintenant je voudrais récupérer le resultat ailleurs que sur le serveur de chez Tiny et visible sur une page html dédiée. Je ne comprends pas quel nom de variable je dois mettre dans le fichier php pour lui dire d'aller récupérer les données de mon écran d'édition. J'ai vu que pour ça, Tiny avait créé un fichier dump.php mais bien sûr je n'y ai pas accès vu que c'est sur leur serveur donc je ne peux pas voir comment il est écrit.

Re: TTW -- Davidc 27 avril 2008 à 17:20 (CEST)

Il me faudrait un lien vers ton tiny, là ta configuration me semble obscur... (Est-ce Tiny, TinyMCE ?) Ton Tiny et ton script en lien please

Re: Re: TTW -- Sylviane 27 avril 2008 à 20:47 (CEST)

oui c'est TinyMCE

lien vers la page html

lien vers la librairie aux 10 000 lignes

lien vers le script utilise

et si tu remontes dans le répertoire, il y a plein de trucs annexes qui appartiennent à ce script, (sauf index et mots et le répertoire js qui est lié au script mots. Il faut d'ailleurs être passé par "mots" pour comprendre cet exo.)

Tu vois que quand on envoie, on tombe sur une page du serveur de chez TinyMCE (c'est ça que je voudrais modifier)

PS : je me demande ce que c'est que ce "path" vide qui traine en bas de la fenêtre d'édition.

je voulais te dire quand même David que ce n'est pas grave si tu n'as pas le temps d'y regarder (ne te crois pas obligé de me répondre), je sais que tu as bcp de W avec ton stage + le reste. Moi même je pars jeudi pour Ge et je ne sais pas si j'aurais le temps de m'y remettre, il y aussi methodo à finir, alors tu vois...

Re: Re: Re: TTW -- Davidc 27 avril 2008 à 23:56 (CEST)

mouarf!! trop facile! (t'inquiète, je fais ça pour me détendre ;) ) J'te donne pas la solution de ton problème de renvoie.. juste quelques indices, ça serait trop facile sinon ;)

  1. Le prob, c'est quand tu soumet ton formulaire, c'est ça ?
  2. Qu'est-ce que tu cliques pour soumettre ?
  3. Cet élément fait partie de quoi ?
  4. T'es sûr que c'est du javascript ça ?

Allez, courage, la solution est easy, mais faut switcher de cerveau un peu (lâche le js un peu)

Sinon, pour le path: c'est le "chemin" dans lequel tu écris quand tu es dans l'éditeur. Si tu écris quelque chose de normal, le path c'est p, un paragraphe, etc.

Re: Re: Re: TTW -- Daniel K. Schneider 28 avril 2008 à 15:15 (CEST)

En gros il faut soit:

  • lire la doc (mais c'est pas nécessaire puisque la réponse est très simple)
  • regarder le formulaire (plus simple): Dans les exemples (et aussi dans votre code) vous voyez que tinymce ne fait rien (!!) d'autre que de transmettre un seul truc, une textarea nommée "elm1". Donc autrement dit: TinyMCE modifie juste votre façon de remplir un element textarea standard.
  • inclure dans votre fichier php un phpinfo(). Cela liste aussi les infos que le script recoit (c.f. mes slides).

Donc réponse: faut du côté php récuper $_POST['elm1'] et ensuite faire ce que vous en voulez, genre mettre le contenu dans une base de données (et là cela devient un peu plus compliqué, c.f. les exercices précédants).

Nettoyer script -- Sylviane 27 avril 2008 à 16:29 (CEST)

Le js que j'ai récupéré fait+ de 10 000 lignes ! rien de moins ! Je ne le ferai pas mais logiquement il faudrait le nettoyer non ? et ne prendre que ce qui est nécessaire à sa propre page. Je suppose qu'il y a dans ce fichier des paramètres concernant la personnalisation de certains points ou est-ce qu'il est si important parce que ça concerne un outil d'édition ttw ?

Re: Nettoyer script -- Davidc 27 avril 2008 à 17:26 (CEST)

En général, on prend une librairie dans l'état où elle est. avec ses 10000 ou ses 250 lignes ! Pas touche à ta librairie parce que c'est ce qu'on appelle un hack de la librairie, après, plus personne ne peut t'aider positivement dans le développement de ton appli parce que la librairie que tu utilises n'a pas les mêmes réactions que celle de personne en fait.. Alors, non, pas de nettoyage, à moins que tu ne veuilles intégrer l'équipe de développeur de cette librairie ou créer un fork (fr: fourche) de la librairie que tu pourrais appeler ReallyFu**inTiny :P

Par contre, souvent avec la librairie js, il y a des tas de fichiers inutiles dont tu peux te débarrasser. C'est du cas par cas selon les librairies, normalement il y a un fichier quelque part qui dit quels sont les fichiers essentiels, faut chercher. Mais pas touche à ta librairie ;)

Re: Re: Nettoyer script -- Sylviane 27 avril 2008 à 20:49 (CEST)

mouarf ! je touche plus rien :-)

Re: Re: Nettoyer script -- Daniel K. Schneider 28 avril 2008 à 15:06 (CEST)

Ouais ne faut rien y toucher. Par contre, parfois il existe 2 versions. Une "lisible" et une où tout le script est inclu dans une seule très longue ligne compact. TinyMCE par exemple est distributé comme cela. Donc prendre la version "moche" pour distribuer:

  • tiny_mce.js