Chatbox latérale

par Nakira Ven 6 Jan 2012 - 20:23

Rappel du premier message :

Bonsoir à tous le staff, et à toute la communauté.

Je viens de penser à un truc. Oui, ça m'arrive de penser :p

Mais en gros voilà la bête : une chatbox latérale sur toutes les pages de Halo Création afin de "sociabiliser" les membres entre eux. Et aussi une manière plus... pratique de navigation.
Bref, j'ai mis au point, sous la pression de ce cher Bendak, un petit code qui serait apte à afficher la chatbox latérale grâce à lui seul. Ainsi la désactiver serait un jeu d'enfant (en fait, un case à cocher :p).

Si ce principe de chatbox latérale ne vous parle pas, je vous invite à aller voir sur mon forum test ici (c'est un forum pour les codes, pas pour les graphismes

). Regardez en haut à gauche, contre le bord. Cliquez sur le "Ouvrir" de travers et vous saurez ce q
Tout est personnalisable : couleur de fond, bordure, ornements, image Ouvrir/Fermer, la position (à gauche à droite au milieu en haut, réglable au pixel près !). Tout ai-je dis

Ce code fonctionne à la perfection sur toutes les versions de forum ForumActif.
Le tutoriel est simple. Tant qu'à faire, même si ça n'intéresse pas le staff d'Halo Création (ou la communauté en soi, je vous partage ici le tutoriel.

Spoiler:

Voilà, au niveau des avantages que cela procure, mis à part une navigation que cela procure, ça peut donner un côté plus... Convivial à Hcréa, et une chatbox plus accessible, et à n'importe quel moment. De plus, le temps de chargement n'est pas plus long que celui d'un smiley !

par SK Mar 10 Jan 2012 - 19:37

Phantom'z XplowZ a écrit:Ou alors on est vraiment PGM, et on a pas besoin de ça :
Click droit sur "chatbox" > Ouvrir dans un nouvel Onglet.

Ou alors un PGM de PGM et on clique avec la molette de la souris sur "Chatbox" !

Sinon j'suis plus pour une chatbox en haut du forum que ça. Smile

par **Elros** Mar 10 Avr 2012 - 12:00

Il y a un détail qui serait pas mal, c'est que la largeur de la CB latérale soit ajustée par rapport à la largeur de la page (genre 80 ou 90%)

par **Cox** Mar 10 Avr 2012 - 22:28

Naki, si tu veux planche là-dessus

Et voir s'il n'est toujours pas possible de rendre la taille étirable par l'utilisateur ?

par **KFR Tepec Fett** Mer 11 Avr 2012 - 8:33

Cox a écrit:Et voir s'il n'est toujours pas possible de rendre la taille étirable par l'utilisateur ?

Hm il faudrait voir avec la propriété CSS3 "resize: both;" dans le l'attribut style du iframe, mais le iframe étant ce qu'il est (...), je ne sais pas si, même dans les navigateurs qui supportent le resize (de mémoire Chrome, Firefox, Safari), cela fonctionnera.

par Nakira Mer 11 Avr 2012 - 10:42

Hmm. Tu pars sur de mauvaises bases Tepec : l'iframe, c'est la chatbox. Et cet iframe est contenu dans un tableau rajouté à la page avec du js. Il faudrait donc trouver une manière d'étirer le tableau. L'iframe suivra tout seul si on lui donne une largeur type 100%...
Je ne conniat pas de fonction CSS(3) qui permette de rendre un tableau extensible... Je cherche mais avant, je m'occupe d'un certain générateur mis de côté trop longtemps Cox :p
Et Tepec est bien mieux placé que moi (au niveau de l'accès au code depuis le PA) pour faire divers tests... Enfin, s'il a le temps .. ?

EDIT : bon, j'ai trouvé comment faire en fait, je vous donne ça dès que tous les pitits bugs seront corrigés

par Nakira Mer 11 Avr 2012 - 12:38

Bon, je up pour vous dire que c'est fait.
Je vais faire un résumé succinct de ce que j’ai fait :
-J'ai utilisé le même script que celui utilisé pour la chatbox normale.
-J'ai adapté mon code pour qu'il fonctionne avec ce script
-Le problème du décalage de 5px est corrigé (le left:-5px est inutile désormais).
-La CB est donc resizable dans sa hauteur uniquement (comme l'originelle).
-La CB occupera désormais 75% de la largeur de l'écran du visiteur, quelle que soit sa résolution d'écran (les admins pourrons changer cette valeur si besoin est).

Voici le code, à mettre à la place de l'ancien :
Code:
document.write(' <table id="table_cb" width="75%" style="position: fixed; top: 5px; left: 0px;background-color: rgba(0,0,0,0);z-index:9999; height:300px;" cellpadding="0" cellspacing="0"> <tr> <td id="chatboxpop" style="display:none; height:100%"> <iframe src="/chatbox/index.forum?page=front" scrolling="no" style="width: 100%; height: 100%; display: block;" marginwidth="0" marginheight="0" frameborder="0"></iframe> <br /> <img src="http://2img.net/i/fa/resize.gif" onmousedown="javascript:resizeElement(event, \'table_cb\');" style="cursor:se-resize; float:right"> </td> <td id="td_cbpop" style="vertical-align: top; background-color: rgba(255,5,244,0); padding:0px;"> <img style="cursor:pointer;" src="http://d22.e-loader.net/HROYP8X96F.png" onClick="document.getElementById(\'chatboxpop\').style.display=(this.src==\'http://d22.e-loader.net/HROYP8X96F.png\')?\'block\':\'none\';this.src=(this.src==\'http://d22.e-loader.net/HROYP8X96F.png\')?\'http://d24.e-loader.net/fgbt8FevEo.png\':\'http://d22.e-loader.net/HROYP8X96F.png\';document.getElementById(\'td_cbpop\').style.verticalAlign=(this.src==\'http://d22.e-loader.net/HROYP8X96F.png\')?\'top\':\'bottom\';"/> </td> </tr> </table> ');

Bonne journée !

par **Cox** Dim 15 Avr 2012 - 11:22

Ton code est foireux.

par Nakira Dim 15 Avr 2012 - 12:26

Euh... non, il fonctionne très bien Cox.
Je l'ai testé sur deux forum différent, dont un de la même version (phpbb3) que HCRéA et à chaque fois la chatbox s'affiche sans problème.

As-tu bien inséré le code en entier dans un module Javascript, et non HTML.
As-tu bien cocher la case "Sur toutes les pages" dans le cadre au dessus de la zone de texte du code ?
As-tu bien cocher "oui" à la question "Activer la gestion des codes Javascript :" ?

C'est quand même bizarre. Peut être cela dépend-il des navigateurs, auquel cas je vais retravailler dessus, mais je vais vérifier au préalable.

Et dans le cas où ça ne fonctionne pas, peut-tu me préciser ce qui bloque dan mon code ?

par **Cox** Dim 15 Avr 2012 - 13:02

Ah pardon, j'ai du mal voir, je le réactive.

EDIT : Oh bah mince, elle marche pas et fout le bordel sur le forum..

par **D4rK phenix** Dim 15 Avr 2012 - 13:11

Je suis sur Chrome et ca marche très bien...

par **Cox** Dim 15 Avr 2012 - 13:17

Le code est foireux sur FF, Nakira est en train de régler le problème, en attendant, retour à la version précédente.

par Contenu sponsorisé

Chatbox latérale

Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale

Re: Chatbox latérale