Fork me on GitHub

Rapport de message :*
 

affichage des descriptions en javascript

Titre du sujet : affichage des descriptions en javascript
par CPascal sur 13/02/2010 16:11:13

bonjour

pour donner suite a ce post voici la deuxième modif pour XOOPS 2.4.4: affichage des descriptions des modules et system en javascript ce qui permet d'avoir a mon sens des pages moins longues tout en ayant la possibilité de mieux détailler les descriptions/explications des modules et du module system

1) ouvrir le fichier .../modules/system/admin/preferences/mains.php

modifiez ver la ligne 108 comme ceci

$config_handler =& xoops_gethandler('config');
$criteria = new CriteriaCompo();
$criteria->add(new Criteria('conf_modid', 0));
$criteria->add(new Criteria('conf_catid', $confcat_id));
$config = $config_handler->getConfigs($criteria);
$confcount = count($config);
for ($i = 0; $i < $confcount; $i++) {

//descriptions du système dans administration        
//modif CPascal - 12 février 2010     
//$title = (!defined($config[$i]->getVar('conf_desc')) || constant($config[$i]->getVar('conf_desc')) == '') ? constant($config[$i]->getVar('conf_title')) : constant($config[$i]->getVar('conf_title')) . '<br /><br /><span style="font-weight:normal;">' . constant($config[$i]->getVar('conf_desc')) . '</span>';


//ajout CPascal - ajout javascript dans les descriptions des modules et du système dans administration: (<img class="helptip" src="./images/view_off.png" alt="Vew help text" /><span class="helptext"> ) 
$title = (!defined($config[$i]->getVar('conf_desc')) || constant($config[$i]->getVar('conf_desc')) == '') ? constant($config[$i]->getVar('conf_title')) : constant($config[$i]->getVar('conf_title')) . '<img class="helptip" src="./images/view_off.png" alt="Vew help text" /><span class="helptext">' . constant($config[$i]->getVar('conf_desc')) . '</span>';            
//fin de l'ajout            


switch ($config[$i]->getVar('conf_formtype')) {
case 'textarea':


puis faite la même chose vers la ligne 302 comme ceci

$form->addElement(new XoopsFormHidden('redirect', $myts->htmlspecialchars($_GET["redirect"]))); } elseif ($module->getInfo('adminindex')) {            $form->addElement(new XoopsFormHidden('redirect', XOOPS_URL . '/modules/' . $module->getVar('dirname') . '/' . $module->getInfo('adminindex')));
        }
for ($i = 0; $i < $count; $i++) {

//descriptions des modules dans administration        
//modif CPascal - 12 février 2010         
//$title = (!defined($config[$i]->getVar('conf_desc')) || constant($config[$i]->getVar('conf_desc')) == '') ? constant($config[$i]->getVar('conf_title')) : constant($config[$i]->getVar('conf_title')).'<br /><br /><span style="font-weight:normal;">'.constant($config[$i]->getVar('conf_desc')).'</span>';

//ajout CPascal - ajout javascript dans les descriptions des modules dans administration: (<img class="helptip" src="./images/view_off.png" alt="Vew help text" /><span class="helptext"> )           
$title = (!defined($config[$i]->getVar('conf_desc')) || constant($config[$i]->getVar('conf_desc')) == '') ? constant($config[$i]->getVar('conf_title')) : constant($config[$i]->getVar('conf_title')).'<img class="helptip" src="./images/view_off.png" alt="Vew help text" /><span class="helptext">'.constant($config[$i]->getVar('conf_desc')).'</span>';
//fin de l'ajout            

switch ($config[$i]->getVar('conf_formtype')) {
case 'textarea':



ATTENTION ! pour les débutants ajouter uniquement les portions de code entre l'indication //Ajout CPascal et //fin de l'ajout j'ai mis un peut de code xoops pour vous aidez a vous repérez sur le fichier ouvert

2) ouvrir le fichier .../modules/system/class/gui.php
ajouter dans la fonction: function header() cette portion de code java comme ceci:

class XoopsSystemGui
{
//modèle template
    var $template;
//navigation
    var $navigation;
//nom de dossier
    var $foldername;
//pour le thème
    var $xoTheme;
//ajout CPascal - 12 février 2010 - javascript    
    var $js = '';
//fin
    function header()
    {
global $xoops, $xoopsConfig, $xoopsModule, $xoopsModuleConfig, $xoopsUser, $xoopsOption, $xoTheme, $js, $xoopsTpl;
        ob_start();

        xoops_loadLanguage('admin', 'system');
        xoops_loadLanguage('cpanel', 'system');
        xoops_loadLanguage('modinfo', 'system');

        $xoopsLogger =& XoopsLogger::getInstance();
        $xoopsLogger->stopTime('Module init');
        $xoopsLogger->startTime('XOOPS output init');

if (!headers_sent()) {
header('Content-Type:text/html; charset=' . _CHARSET);
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header('Cache-Control: no-store, no-cache, must-revalidate');
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
}

require_once XOOPS_ROOT_PATH . '/class/template.php';
require_once XOOPS_ROOT_PATH . '/class/theme.php';

$adminThemeFactory = new xos_opal_AdminThemeFactory();
$this->xoTheme =& $adminThemeFactory->createInstance(array(
'folderName' => $this->foldername,
'themesPath' => 'modules/system/class/gui'));

$this->xoTheme->loadLocalization('admin');
$this->template =& $this->xoTheme->template;

$GLOBALS['xoTheme'] =& $this->xoTheme;
$GLOBALS['adminTpl'] =& $this->xoTheme->template;

$xoopsLogger->stopTime('XOOPS output init');
$xoopsLogger->startTime('Module display');

$xoopsPreload =& XoopsPreload::getInstance();
        $xoopsPreload->triggerEvent('system.class.gui.header');
//ajout CPascal - 12 février 2010 - javascript pour les descriptions des modules et du système
//modif CPascal: modification du code: $("img.helptip").hover(function() remplacer par ce code: $("img.helptip").click(function() pour les liens
// dans les descriptions
   echo $js = '<script type="text/javascript">
   $(function() {
   $("span.helptext").hide();
   $("img.helptip").click(function() {
   $(this).nextAll().each( function() {
   if ($(this).filter("span.helptext").is(":visible")) {
   $(this).filter("span.helptext").toggle("slow");
   return false;
   } else {
   $("span.helptext").fadeOut("slow");
   }
   if ($(this).filter("img.helptip").length) {
   return false;
   }
   $(this).filter("span.helptext").toggle("slow");
   });
   });
   });
   </script>';        
//fin        
    }


3) ouvrir le fichiers CSS du thème administration que vous utilisez:

prenons comme exemple le thème oxygen
ouvrir le fichier ../modules/system/glass/gui/oxygen/css/style.css ajouter cette portion de code css:

/* ==================== info bulle descriptions des modules et du système ==================== */
/*** image info dans les description ***/
.caption-text img {float: right; padding-top: 2px;cursor: pointer;}
/*** boite javascript ***/
span.helptext {
    position: absolute;
    right: 65%;
    z-index: 9000;
    background-color: #CCCCCC;
    outline: 1px solid #CCCCCC;
    border: 2px solid #FFFFFF;
    padding: 10px 15px;
    max-width: 25%;
    display: none;
    color: #fff;
    text-align: justify;
    font-size: 1em;
    font-weight: normal;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}
span.helptext a {color: #666666; font-weight: normal; background-color: transparent;}
span.helptext a:hover {text-decoration: underline; color: #fff; font-weight: normal; background-color: transparent;}


évidement modifier couleurs, position etc.. selon vos goûts et thème utilisez dans l'administration

et enfin ajouter une image nommée view_off.png dans le fichier: ../modules/system/images

celle çi par exemple:
Open in new window

ce qui vous donnera sa:

Open in new window

et sa au passage de la souri sur l'image view_off.png

Open in new window



voila je pense avoir rien oublier n'hésitez pas si c'est la cas


Attention: éditer le 15 février pour apporter correction en cas de lien dans les descriptions.
Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

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