Fork me on GitHub


 Bas   Précédent   Suivant

« 1 (2) 3 4 5 ... 14 »


Hack isearch autocompletion ajax avec prototype + scriptaculous
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
Bonjour à tous, j'ai réalisé un hack du module isearch par instant-zero.

J'ai ajouté une classe, un script un bloc de recherche avec autocompletion ajax style google suggest.

Demo ici:
http://www.s-martinez.com
(cliquez sur la loupe et faites des recherches)

Le hack nécessite prototype et scriptaculous.

Si vous utilisez la bibliothèque jseffect, il manque des fichiers dans le dossier prototype pour que scriptaculous fonctionne.

Le pack js effects avec les fichiers manquants et une version compressée de prototype et scriptaculous (proto-scripta-comp.js) est disponible ici:
http://www.s-martinez.com/uploads/jseffects.rar

Le hack est disponible ici:
http://www.s-martinez.com/uploads/isearch.zip


Mise en oeuvre:

1 Uploadez le dossier jseffects à la racine de votre site

2 Ajoutez cette ligne à votre fichier theme.html dans le head

<script src="<{$xoops_url}>/jseffects/prototype/proto-scripta-comp.js" type="text/javascript"></script>



3 Ajoutez ceci au fichier slyle.css de votre theme:

div.autocomplete {
      
position:absolute;
      
width:250px;
      
background-color:white;
      
border:1px solid #888;
      
margin:0px;
      
padding:0px;
      
z-index:1000
    
}
    
div.autocomplete ul {
      list-
style-type:none;
      
margin:0px;
      
padding:0px;
    }
    
div.autocomplete ul li.selected background-color#ffb;}
    
div.autocomplete ul li {
      list-
style-type:none;
      
display:block;
      
margin:0;
      
padding:1px;
      
height:15px;
      
cursor:pointer;
    }


4 Installez isearch (version modifiée disponible ci dessus)

5 Activez le bloc ajax search.

6 Amusez vous.

Posté le : 06/11/2007 14:40
Transférer la contribution vers d'autres applications Transférer


Re: isearch et autocompletion ajax souci envoi donnée post
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
Une petite modification pour la gestion des accents.
Le zip est mis à jour

Posté le : 06/11/2007 01:06
Transférer la contribution vers d'autres applications Transférer


Re: isearch et autocompletion ajax souci envoi donnée post
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
Autant pour moi j'ai raconté n'importe quoi!
C'est ça la fatigue on perd son temps à cause d'une erreur bidon.
J'avais oublié un underscrore à $_POST du coup si les variables globales étaient désactivées ca ne marchait pas, ce qui est normal.

Bref oubliez mon histoire de session.

Le hack mis à jour est dispo ici:
http://www.s-martinez.com/uploads/isearch.zip

Si isearch est déja installé chez vous, uploadez le dossier isearch dans le dossier modules et écrasez les fichiers présents puis mettez à jour le module.
Attention, testez avant de le mettre sur un site en ligne.

Puis ajoutez les css ci dessus.

Posté le : 06/11/2007 00:27
Transférer la contribution vers d'autres applications Transférer


Re: isearch et autocompletion ajax souci envoi donnée post
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
C'est bon j'ai trouvé la source du problème.

J'avais dans mon .htaccess la ligne suivante

SetEnv SESSION_USE_TRANS_SID 0


Comment fonctionnent les sessions avec ajax et prototype?

Vous pouvez voir le résultat en tapant "az" dans le formulaire ajax search sur:
http://xoops-theme.s-martinez.com

Le hack fonctionne ainsi:
à chaque caractère rentré, un script (appelé via ajax) cherche dans la base les 5 recherches les plus fréquentes commencant par les mêmes caractères et les propose en dessous du champ imput, comme google suggest.

Si un mot recherché n'est pas présent, il est enregistré dans la base grace à isearch et sera proposé la fois suivante.

Posté le : 05/11/2007 23:33
Transférer la contribution vers d'autres applications Transférer


Re: isearch et autocompletion ajax souci envoi donnée post
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
J'ai testé avec le xoops.js présent sur sourceforge, mais le problème persiste.

J'ai testé avec la version de kris contenue dans jseffects mais cela ne résoud pas le problème.

Je ne trouve pas la source du problème.

Posté le : 05/11/2007 21:31
Transférer la contribution vers d'autres applications Transférer


isearch et autocompletion ajax souci envoi donnée post
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
Bonjour à tous, j'ai réalisé un hack du module isearch qui fonctionne en local mais pas sur mon serveur en ligne. (pourtant tous deux en php5 et dernière version de xoops).

J'ai ajouté une classe, une fonction un bloc de recherche avec autocompletion ajax.

Le hack nécessite prototype et scriptaculous.

Sans réellement comprendre pourquoi, il semble que le paramètre query du block ne soit pas envoyé en post (via ajax), du coup, l'autocompletion ne s'adapte pas au terme recherché.

J'imagine qu'il y a un confilt javascript quelque part, mais je ne trouve pas où.

Si l'un d'entre vous peux regarder d'où peut venir le probleme, ca serait sympa.

Vous pouvez voir le problème aux adreses suivantes:
http://www.s-martinez.com
http://xoops-theme.s-martinez.com

Le hack est disponible ici:
http://www.s-martinez.com/uploads/isearch.zip

Ajoutez ceci au css de votre theme:

div.autocomplete {
      
position:absolute;
      
width:250px;
      
background-color:white;
      
border:1px solid #888;
      
margin:0px;
      
padding:0px;
    }
    
div.autocomplete ul {
      list-
style-type:none;
      
margin:0px;
      
padding:0px;
    }
    
div.autocomplete ul li.selected background-color#ffb;}
    
div.autocomplete ul li {
      list-
style-type:none;
      
display:block;
      
margin:0;
      
padding:1px;
      
height:15px;
      
cursor:pointer;
    }


Merci :)

Posté le : 05/11/2007 20:52
Transférer la contribution vers d'autres applications Transférer


Re: Xoops.org Redesign
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
Citation :
Est-ce que les sections modules et thèmes n'ont pas des teintes trop proches ?

Oui peut être je me suis fait la même réflexion.
Je tenterai avec une autre couleur.

Le doctype du thème a été changé pour xhtml 1.0 strict et est valide. (J'ai déja commencé, mais il y a pas mal de templates à modifier et également des variables smarty).

Un première version d'outils d'accessibilité a été ajoutée (grand format de police + contraste élevé). Ces options seront sauvées dans un cookie également (non implémenté).

Un bouton pour restaurer la mise en page par défaut a été ajouté.

Le preload des images fonctionnne maintenant sur tous les navigateurs.

Posté le : 26/10/2007 16:05
Transférer la contribution vers d'autres applications Transférer


Re: Xoops.org Redesign
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
Citation :
... va falloir se lever tôt pour le trouver celui-là


Oula non ca doit se trouver facilement vu mon niveau en javascript.
Là j'ai réeussi à me sortir de la panade en allant poser quelques questions sur le channel IRC de prototype et en écumant 15000 tutos javascript.
En même temps c'est comme ça qu'on apprends le mieux, mais ca fait mal à la tête au bout d'un moment...

Posté le : 24/10/2007 20:41
Transférer la contribution vers d'autres applications Transférer


Re: Xoops.org Redesign
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
Merci
Quand le drag n drop sera finalisé, je ferai un article pour aider à la mise en oeuvre du même sytème sur un thème.

Posté le : 24/10/2007 18:03
Transférer la contribution vers d'autres applications Transférer


Re: Xoops.org Redesign
Régulier
Inscrit: 19/01/2007 20:53
Messages: 144
La fontions drag n drop est enfin fonctionnelle.
Si vous modifiez la mise en page la page d'accueuil, les modifications seront enregistrées dans un cookie et l'organisation de vos blocs sera restaurée à vote retour.

Le drag'n'drop utilise prototype+scriptaculous, kris m'a conseillé d'utiliser JQuery + Jquery UI, mais quand je vois la difficultée que j'ai eu à faire fontionner le système sous scriptaculous, je préfère laisser le portage à un autre Framework javascript à un membre plus compétent que moi en javascript.

Le code est à optimiser largement, mais xoops dispose maintenant d'un thème drag'n'drop fonctionnel.

site de test: http://xoops-theme.s-martinez.com
theme : xoops-theme-web-2-0

++

Posté le : 24/10/2007 17:12
Transférer la contribution vers d'autres applications Transférer



 Haut
« 1 (2) 3 4 5 ... 14 »




Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

8 Personne(s) en ligne (6 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 8 | Plus ...