PHPBoost CMS : Sujet - CSlideShow3

BeHuman

Le 15/01/12 à 17h11

Booster Minigun

Groupe: Membre

Inscrit le: 05/01/12
Messages: 35

Salut à tous,

bon, je viens vers vous pour vous proposer un Pseudo Module (si on me permet le terme)
Pour être plus précis CSlideShow3 est un script Javascript générant du html
Ce pseudo module n'est qu'un petit script sans envergure et surtout largement modifiable par vos soins

avant de pouvoir utiliser ce module il faut placer le lien du script dans HEAD:
Code HTML :

<script src="cslideshow3.js" type="text/javascript" charset="utf-8"></script>

penser à changer les adressage si cela ne convienne pas de même pour le LINK css qui est stocker dans le script Javascript "cslideshow3.js" dans la fonction Template ligne 73:
Code JAVASCRIPT :

document.write("<link rel=\"stylesheet\" href=\"cslideshow3.css\" type=\"text\/css\" media=\"screen, print, handheld\" \/>");

Ce module se place dans des menus de contenus ou dans un edito,news, articles...etc grâce au balise [html] exemple:
Code HTML :

[html]
<script type="text/javascript">
    Template(
        'IDTest',
        'titre 01',
        'http://google.fr',
        'imgs/01.png',
        'description 01',
        'titre 02',
        'http://google.fr',
        'imgs/02.png',
        'description 02',
        'titre 03',
        'http://google.fr',
        'imgs/03.png',
        'description 03'
    );
    CSlideShow3('IDTest');  
</script>
[/html]

bref voilà en espérant que cela puise servir à certain.
n'ayant pas eu de réponse ayant réglé mon problème de variable à cet http://www.phpboost.com/forum/topic-11933+ajouter-des-variables-perso-dans-un-tpl.php je n'aipas voulus me lancer sur le dev d'un pure Module, car je n'ai pas encore compris le système de variable.

cependant si quelqu'un à un template de Module pour commener je suis preneur

merci ++

Lien vers dépôt de source

PS: archive de téléchargement en tar.bz2 (format libre oblige

)

Edité par BeHuman Le 15/01/12 à 17h17

Visiteur

Le 15/01/12 à 17h51

Boosteur Inactif

Groupe: Visiteur

Bonjour^^

Pas mal du tout, je testerais dès que j'ai un moment de libre .. Par contre pour tes variable j’essaierais aussi, car il me semble que tu as du faire un oublie .. OU alors là ... je regarderais aussi ..

@imablement Swan.

BeHuman

Le 15/01/12 à 18h13

Booster Minigun

Groupe: Membre

Inscrit le: 05/01/12
Messages: 35

swan:

Bonjour^^

Pas mal du tout, je testerais dès que j'ai un moment de libre .. Par contre pour tes variable j’essaierais aussi, car il me semble que tu as du faire un oublie .. OU alors là ... je regarderais aussi ..

@imablement Swan.

Thx

et re-merci pour les variables, car franchement c'est frustrant.

Sinon j'ai oublié de préciser que les animations sont gérer par le CSS et j'ai essaye d'être un maximum compatible à tous les navigateurs (Mozilla(Firefox,galéon...etc),Opéra,Webkit(Chrome,Safari...etc),Konqueror et peut être IE9), le Javascript ne sert car générer le HTML et communiquer avec les événements onClick de la liste à droite du slideshow.

En faite je génère le HTML via le javascript pour des raison de lisibilité à l'édition.
pour un aperçu c'est ici que ça ce passe
actuellement sur le site en cours le modèle d'édition est ainsi:
Code HTML :

 
[html]
<div style="width:auto;height:auto">
    <div id="CSlideShow3">
        <div id="CSlideShow3_slide">
<!--############### DEBUT TITRE MODIFIABLE ENTRE LES <DIV></DIV> ###############-->
            <div class='CSlideShow3_txt_title' id='CSlideShow3_tt01'>Les directs</div>
            <div class='CSlideShow3_txt_title' id='CSlideShow3_tt02'>la grille des programmes 2012</div>
            <div class='CSlideShow3_txt_title' id='CSlideShow3_tt03'>les peaux de castes</div>
<!--############### FIN TITRE MODIFIABLE ENTRE LES <DIV></DIV> ###############-->
            <ul id="CSlideShow3_content">
<!--############### DEBUT IMAGE SLIDESHOW MODIFIABLE DANS SRC="" ###############-->
                <li><a href="/news/news.php"><img id='CSlideShow3_img01' src="/upload/01.png"/></a></li>
                <li><a href="/pages/pages.php?title=grille-des-programmes"><img id='CSlideShow3_img02' src="/upload/02.png"/></a></li>
                <li><a href="/media/media.php"><img id='CSlideShow3_img03' src="/upload/03.png"/></a></li>
<!--############### FIN IMAGE SLIDESHOW MODIFIABLE DANS SRC="" ###############-->
            </ul>
<!--############### DEBUT DESCRIPTION MODIFIABLE ENTRE LES <DIV></DIV> ###############-->
            <div class='CSlideShow3_txt_content' id='CSlideShow3_tc01'>à lundi 9 heures.</div>
            <div class='CSlideShow3_txt_content' id='CSlideShow3_tc02'>La grille des programmes pour 2011/2012</div>
            <div class='CSlideShow3_txt_content' id='CSlideShow3_tc03'>Les Podcasts, artistes, d&eacute;couvertes...etc sont disponible ici</div>
<!--############### FIN DESCRIPTION MODIFIABLE ENTRE LES <DIV></DIV> ###############-->
        </div>      
        <div id="CSlideShow3_block_list">
            <ul>
<!--############### DEBUT IMAGE MENU MODIFIABLE DANS SRC="" ###############-->
                <li><img id='CSlideShow3_list_img01' onClick='CSlideShow3_ListClick(this,1)' src="/upload/01.png" title="Les Matinales !!!" /></li>
                <li><img id='CSlideShow3_list_img02' onClick='CSlideShow3_ListClick(this,2)' src="/upload/02.png" title="La grilles des programmes" /></li>
                <li><img id='CSlideShow3_list_img03' onClick='CSlideShow3_ListClick(this,3)' src="/upload/03.png" title="Les Podcasts" /></li>
<!--############### FIN IMAGE MENU MODIFIABLE DANS SRC="" ###############-->
            </ul>
        </div>
    </div>
</div>
&nbsp;<br/>
[/html]

le modèle d'édition que je vous propose est ainsi:
Code HTML :

 
[html]
<script type="text/javascript">
    Template(
        'IDTest',
        'titre 01',
        'http://google.fr',
        'imgs/01.png',
        'description 01',
        'titre 02',
        'http://google.fr',
        'imgs/02.png',
        'description 02',
        'titre 03',
        'http://google.fr',
        'imgs/03.png',
        'description 03'
    );
    CSlideShow3('IDTest');  
</script>
[/html]

Je trouve cette formule plus souple non?
Je pense même rajouter un argument d'adressage vers un css de son choix pour plus de souplesse.
ensuite on ajoute un bouton au bbcode est hop on à une nouvelle options SlideShow pour tous

Edité par BeHuman Le 16/01/12 à 02h53

Visiteur

Le 16/01/12 à 11h31

Boosteur Inactif

Groupe: Visiteur

Bonjour,

Citation:

Je trouve cette formule plus souple non?
Je pense même rajouter un argument d'adressage vers un css de son choix pour plus de souplesse.
ensuite on ajoute un bouton au bbcode est hop on à une nouvelle options SlideShow pour tous

Certes

Mais il ne serait pas plutot judicieux de faire coincider les deux codes (HTML et le modèle d'édition) ?? Car dans le modèle d'édition, on ne sait pas vraiment à quoi cela corresponds. Je dis cela surtout pour une meilleur compréhension entre les deux codes.

Pour les images, tu les stocks directement dans upload ??

@imablement Swan.

BeHuman

Le 16/01/12 à 12h48

Booster Minigun

Groupe: Membre

Inscrit le: 05/01/12
Messages: 35

Bein dans ton header.tpl tu active le cslishow3.js.
Ensuite dans un article ou edito:
Code JAVASCRIPT :

 
[html]
<script type="text/javascript">
    Template(
        "SlideShow", //ID
 
        "Les Matinales", //Titre 01
        "/news/news.php", //Lien 01
        "/upload/01.png", //Image 01
        "un truc bidon", //Description 01
 
        "La grilles des programmes", //Titre 02
        "/pages/pages.php?title=grille-des-programmes", //Lien 03
        "/upload/02.png", //Image 02
        "un truc à l'ouest", //Description 02
 
        "Les Podcasts", //Titre 03
        "/news/news.php", //Lien 03
        "/upload/03.png", //Image 03
        "un truc à chier" //Description 03
    );
    CSlideShow3("SlideShow"); 
</script>
[/html]

tu constatera que le modèle d'édition est entre les balises HTML bbcode et rien ne t'empêche d'ajouter des commentaires pour plus de lisibilité.Seul l'ID de template doit être égale à
Code JAVASCRIPT :

CSlideShow3("SlideShow");

.
Pour les images et liens,tu mets se que tu veux, sachant que le framework de Pbt détectera les liens interne, donc oui tu peux te faire un dossier dans upload ou tu stockera les images de ton SlideShow, tu peux même les mettres dans la galerie si cela te conviens mieux...etc

++

Edité par BeHuman Le 16/01/12 à 12h49

Visiteur

Le 16/01/12 à 13h39

Boosteur Inactif

Groupe: Visiteur

Merci, je tiens juste à dire que c'est pas pour moi.... je pense à ceux qui ont du mal avec le codage, et me positionne au niveau de compréhension d'un débutant

Visiteur

Le 16/01/12 à 17h33

Boosteur Inactif

Groupe: Visiteur

Salut

J'ai pas compris à quoi tout ceci sert

.. Dsl, on peut expliquer avec une démo ou autre?

• Développement des modules » Modules en développement » Modules PHPBoost 3 » CSlideShow3 SlideShow en CSS3/Javascript

PHPBoost CMS

PHPBoost

Support

Téléchargements

Développement

Communauté

Annonces

Question aléatoire

Livre d'or

Mini sondage

Forum PHPBoost

Annonces