vb.org Archive - Integration with vBulletin - [AJAX]

Hello,

I speak French...

1. Upload the js file in clientscript : forumroot/clientscript/slidepanel.js

2. Add to CSS

HTML Code:

#dhtmlgoodies_leftPanel ul{

padding-left:20px;

margin-left:0px;

}

#dhtmlgoodies_leftPanel div{

padding:3px;

}

#mainContent{

width:460px;

background-color:#fff;

padding-right:5px;

border-left:1px solid #000;

border-right:1px solid #000;

border-bottom:1px solid #000;

padding-left:5px;

}



#dhtmlgoodies_leftPanel{

background:#fff;

color:#000;

font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;

height:100%;        

left:0px;

z-index:10;

position:absolute;

display:none;

overflow:hidden;

}

#dhtmlgoodies_leftPanel #leftPanelContent{

padding:0px;

}

#dhtmlgoodies_leftPanel .closeLink{

padding-left:2px;

padding-right:2px;

background-color:#FFF;

position:absolute;

top:7px;

left:135px;

border:1px solid #000;

color:#000;

font-size:0.8em;

}

#dhtmlgoodies_leftPanel .closeLink:hover{

color:#FFF;

background-color:#000;

}

3. Add to template HEADINCLUDE

HTML Code:

<script type="text/javascript" src="clientscript/slidepanel.js"></script>

4. Add to template HEADER

HTML Code:

<!-- Code for the left panel -->

<div id="dhtmlgoodies_leftPanel">

        <a class="closeLink" href="#" onclick="initSlideLeftPanel();return false">Fermer</a>

        <div id="leftPanelContent">

        <!-- This is the content -->

        <div>

<!-- table to support left column nav -->

<table cellpadding="0" cellspacing="0" border="0" width="100%" align="center">

<tr valign="top">

<td>



<!-- usercp nav -->

<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0">

<tr><td class="tcat" nowrap="nowrap"><a href="usercp.php$session[sessionurl_q]">

        Tableau de bord</a></td></tr>

<tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('yourcp')"><img id="collapseimg_yourcp" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_yourcp].gif" alt="" border="0" /></a><a href="member.php?$session[sessionurl]u=$bbuserinfo[userid]">Votre profil</a></td></tr>

<tbody id="collapseobj_yourcp" style="$vbcollapse[collapseobj_yourcp]">

        <tr><td class="$navclass[profile]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20"><img border="0" src="$stylevar[imgdir_misc]/usercp_icons/user_edit.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editprofile">Modifier vos informations</a></td>

                        </tr>

                </table>

                </td></tr>



        <tr><td class="$navclass[customize]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/vcard_edit.gif" width="16" height="16"></td>

                                <td>

                                <a class="smallfont" href="profile.php?$session[sessionurl]do=customize">Personnalisation du profil</a></td>

                        </tr>

                </table>

                </td></tr>



        <if condition="$show['profilepiclink']">

        <tr><td class="$navclass[profilepic]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/picture_edit.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editprofilepic">Modifier votre portrait</a></td>

                        </tr>

                </table>

                </td></tr>

        </if>

</tbody>

<tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('networking')"><img id="collapseimg_networking" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_networking].gif" alt="" border="0" /></a>R?seau</td></tr>

<tbody id="collapseobj_networking" style="$vbcollapse[collapseobj_networking]">

        <tr><td class="$navclass[buddylist]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/emoticon_smile.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=buddylist"><if condition="$show['friends_and_contacts']">$vbphrase[contacts_and_friends]<else />Contacts</if></a></td>

                        </tr>

                </table>

                </td></tr>

        <tr><td class="$navclass[usergroups]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/group.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="group.php$session[sessionurl_q]">Groupes sociaux</a></td>

                        </tr>

                </table>

                </td></tr>

        <tr><td class="$navclass[usergroups]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/group_add.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editusergroups">Mes groupes</a></td>

                        </tr>

                </table>

                </td></tr>



        <tr><td class="$navclass[album]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/photos.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="album.php?$session[sessionurl]u=$bbuserinfo[userid]">Images & Albums</a></td>

                        </tr>

                </table>

                </td></tr>

</tbody>

<tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('settings')"><img id="collapseimg_settings" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_settings].gif" alt="" border="0" /></a>Param?tres 

        et Options</td></tr>

<tbody id="collapseobj_settings" style="$vbcollapse[collapseobj_settings]">

        <if condition="$show['avatarlink']">

        <tr><td class="$navclass[avatar]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/picture_empty.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editavatar">Modifier votre avatar</a></td>

                        </tr>

                </table>

                </td></tr>

        </if>

        <if condition="$show['siglink']">

        <tr><td class="$navclass[signature]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/page_red.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editsignature">Modifier votre signature</a></td>

                        </tr>

                </table>

                </td></tr>

        </if>

        <tr><td class="$navclass[password]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/lock.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editpassword">Email & Mot de passe</a></td>

                        </tr>

                </table>

                </td></tr>

        <tr><td class="$navclass[options]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/cog.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editoptions">Modifier vos options</a></td>

                        </tr>

                </table>

                </td></tr>

        <tr><td class="$navclass[ignorelist]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/user_delete.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=ignorelist">Modifier la liste d'ignor?s</a></td>

                        </tr>

                </table>

                </td></tr>

</tbody>

<if condition="$show['pmmainlink']">

<tr>

        <td class="thead" nowrap="nowrap">

        <span id="nav_pmfolders"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('pm')"><img id="collapseimg_pm" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_pm].gif" alt="" border="0" /></a>Messages 

        priv?s</span></td>

</tr>

<tbody id="collapseobj_pm" style="$vbcollapse[collapseobj_pm]">

        <tr><td class="$navclass[pm_messagelist]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/email_open.gif" width="16" height="16"></td>

                                <td colspan="2"><a class="smallfont" href="private.php?$session[sessionurl_q]folderid=0">Bo?te de r?ception</a></td>

                        </tr>

                        <tr>

                                <td width="20">

                &nbsp;</td>

                                <td>

                <img border="0" src="$stylevar[imgdir_misc]/tree_$stylevar[textdirection].gif" /></td>

                                <td><a class="smallfont" href="private.php?$session[sessionurl_q]folderid=-1">?l?ments envoy?s</a></td>

                        </tr>

                </table>

                </td></tr>

        <if condition="$show['pmsendlink']">

        <tr><td class="$navclass[pm_newpm]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/email_add.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="private.php?$session[sessionurl]do=newpm">Envoyer un message</a></td>

                        </tr>

                </table>

                </td></tr>

        </if>

        <if condition="$show['pmtracklink']">

        <tr><td class="$navclass[pm_trackpm]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/email_go.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="private.php?$session[sessionurl]do=trackpm">Suivre vos messages</a></td>

                        </tr>

                </table>

                </td></tr>

        </if>

        <tr><td class="$navclass[pm_editfolders]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/folder_edit.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="private.php?$session[sessionurl]do=editfolders">Modifier vos dossiers</a></td>

                        </tr>

                </table>

                </td></tr>

</if>

</tbody>

<tr>

        <td class="thead" nowrap="nowrap">

                <span id="nav_subsfolders"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('subs')"><img id="collapseimg_subs" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_subs].gif" alt="" border="0" /></a>Discussions 

                suivies</span></td>

</tr>

<tbody id="collapseobj_subs" style="$vbcollapse[collapseobj_subs]">

        <tr><td class="$navclass[substhreads_listthreads]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/newspaper.gif" width="16" height="16"></td>

                                <td colspan="2"><a class="smallfont" href="subscription.php?$session[sessionurl]do=viewsubscription">Lister les abonnements</a></td>

                        </tr>

                        <tr>

                                <td width="20">

                &nbsp;</td>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/tree_$stylevar[textdirection].gif" /></td>

                                <td><a class="smallfont" href="subscription.php?$session[sessionurl]do=viewsubscription&daysprune=-1&folderid=all">Voir tout</a></td>

                        </tr>

                </table>

                </td></tr>

        <tr><td class="$navclass[substhreads_editfolders]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/folder_edit.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="subscription.php?$session[sessionurl]do=editfolders">Modifier vos dossiers</a></td>

                        </tr>

                </table>

                </td></tr>

</tbody>



<tr><td class="thead"><a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('misc')"><img id="collapseimg_misc" src="$stylevar[imgdir_button]/collapse_thead$vbcollapse[collapseimg_misc].gif" alt="" border="0" /></a>Divers</td></tr>

<tbody id="collapseobj_misc" style="$vbcollapse[collapseobj_misc]">

        <tr><td class="$navclass[event_reminders]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/time.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="calendar.php?$session[sessionurl]do=viewreminder">Rappel des ?v?nements</a></td>

                        </tr>

                </table>

                </td></tr>

        <if condition="$show['paidsubscriptions']">

        <tr><td class="$navclass[paid_subscriptions]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/coins.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="payments.php$session[sessionurl_q]">Abonnements payants</a></td>

                        </tr>

                </table>

                </td></tr>

        </if>

        <if condition="$show['attachments']">

        <tr><td class="$navclass[attachments]" nowrap="nowrap">

                <table border="0" cellspacing="0" cellpadding="0">

                        <tr>

                                <td width="20">

                <img border="0" src="$stylevar[imgdir_misc]/usercp_icons/attach.gif" width="16" height="16"></td>

                                <td><a class="smallfont" href="profile.php?$session[sessionurl]do=editattachments">Pi?ces jointes</a></td>

                        </tr>

                </table>

                </td></tr>

<tbody>

        </if>

</table>

<!-- / usercp nav -->



        <if condition="$show['popups']">

                <div class="vbmenu_popup" id="nav_subsfolders_menu" style="display:<if condition="$show['popups']">none<else />block</if>">

                        <table cellpadding="4" cellspacing="1" border="0">

                        <tr>

                        <td class="thead" nowrap="nowrap">$vbphrase[folders]</td>

                        </tr>

                        $cpnav[subsfolders]

                        </table>

                </div>

        </if>

        <if condition="$show['popups']">                        

                <div class="vbmenu_popup" id="nav_pmfolders_menu" style="display:<if condition="$show['popups']">none<else />block</if>">

                        <table cellpadding="4" cellspacing="1" border="0">

                        <tr>

                                <td class="thead" nowrap="nowrap">$vbphrase[folders]</td>

                        </tr>

                        $cpnav[pmfolders]

                        </table>

                </div>

        </if>

</td>

</tr>

</table>

<!-- / table to support left column nav -->

        </div>

        <!-- End content -->

        </div>

</div>

<!-- End code for the left panel -->

5. After if you want a link in your template, you can add this :

HTML Code:

<a href="#" onclick="initSlideLeftPanel();return false">Voir le Slide Panel ou appuyez sur F1</a>

Touch F1 in your keayboard, or click the image (top right) http://www.apdcanari.com/forum/image...isc/expand.gif

Source : http://www.dhtmlgoodies.com/

C?dric :rolleyes:

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01317 seconds Memory Usage 1,922KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (5)bbcode_html_printable (3)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (2)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (10)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: