JOOMLA! 2.5
finalmente mi sono deciso a imparare a sviluppare per joomla. Volevo iniziare con un modulo semplice, il classico menu...
questa discussione è finalizzata nel migliorare l'applicazione di modo che sia io e chi come me non ha ancora programmato per joomla possa imparare qualcosa.
RISULTATO FINALE: voglio un modulo menu con linea magica che segua il mouse tipo questo:
DEMO MENU MAGICOFASE 1
allora... iniziamo col file XML
<config>
<fields name="params">
<fieldset name="basic">
<field
name="scelta_menu"
type="menu"
default="mainmenu"
label="Select a menu"
description="Select a menu" />
<field
name="font_size"
type="text"
default="12"
label="Grandezza font"
description="grandezza del carattere " />
<field
name="color_text"
type="text"
default="#000"
label="colore font"
description="colore del carattere " />
<field
name="color_line"
type="text"
default="#b00808"
label="colore linea"
description="colore della linea" />
</fieldset>
</fields>
</config>
Il primo campo serve per chiedere a Joomla! di darti un elenco di tutti i menu esistenti nel CSM
I campi successivi mi servono per dare dei valori ai file CSS
Ne potremmo aggiungere quanto ne vogliamo, così da render e il modulo molto più facile da gestire dal lato amministratore senza andare a lavorare sul codice crudo.
FASE 2
ho creato una cartella "script" nella root principale del modulo per inserirci le librerie Jquery neccessarie... in questo caso il file "jquery.easing.min.js"
poi, sempre nella root principale del modulo, ho creato la cartella "css", ed il file css all'interno con questi dati:
nav {
float: right;
list-style-type: none;
position: relative;
z-index: 1;
}
nav ul li {
display: block;
float: left;
padding-right: 15px;
padding-top: 15px;
padding-left: 15px;
}
nav ul li a {
text-decoration: none;
color: #000;
font-family: 'Open Sans Condensed', sans-serif;
font-size: 16px;
}
nav ul li a:hover {
color: #b00808;
}
nav ul li a:visited {
color: #000;
}
FASE 3
Ora compiliamo il file
helper.php , dove ficcare le classi e i mettodi che ci servono
Non conoscendo le JApplication ho lavorato direttamente con query sul database, mi piacerebbe moltissimo se qualcuno correggesse i miei errori sostituendo le query in mysql con le jApplication...
class modMenuHoverlineFlxHelper {
public function getFollexEx_vociMenu($scelta_menu) {
// connessione al db.
$db = JFactory::getDbo();
// creare un nuovo query object.
$query = $db->getQuery(true);
// Seleziono tutti i nomi dei menu
$query->select('*');
$query->from('#__menu');
$query->where('menutype = "'.$scelta_menu.'" AND published = 1');
//
$db->setQuery($query);
// Carico la lista dei risultati stdClass objects.
$results = $db->loadObjectList();
return $results;
}
}
FASE 4
andiamo a compilare il file principale del modulo:
$scelta_menu = $params->get( 'scelta_menu' );
$font_size = $params->get( 'font_size' );
$color_text = $params->get( 'color_text' );
$color_line = $params->get( 'color_line' );
$user = JFactory::getUser();
$dati_menu = modMenuHoverlineFlxHelper::getFollexEx_vociMenu($scelta_menu);
FASE 5
ora andiamo a compilare il file tmpl/default.php ovvero il file darà il template che visualizzerà l'utente sul lato client
<div class="menu_hoverline_flx">
<link href="modules/mod_menu_hoverline_flx/css/style.css" rel="stylesheet"/>
<style>
.main_nav_hover_box {
position: absolute;
top: 0;
z-index: -1;
border-bottom-width: thick;
border-bottom-style: solid;
border-bottom-color: <?php echo $color_line ?>;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>';
<script src="modules/mod_menu_hoverline_flx/scripts/jquery.easing.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('<div class="main_nav_hover_box"></div>').css({
'width': 0,
'height': $('.main_nav_menu li:first a').height() + 15,
}).appendTo('.main_nav_menu');
// Animate the hover box
$('.main_nav_menu a').hover(function(){
$el = $(this);
//mouseover function
// .stop() kills exsisting animations on the
// selected element
$('.main_nav_hover_box').stop();
$('.main_nav_hover_box').animate({
// opacity will fade it up if it is not visible
'opacity': 1,
// $(this) - selects the html element that
// fired the function
// Grab the width of the selected element
'width': $(this).width(),
// Grab the height of the selected element
'left': $(this).position().left,
},
// {} = adds extra options that you can set to
// the animate action
{
duration: 'slow',
easing: 'easeOutCirc',
queue: false
}
);
},function(){
// mouseout function
// Select the hover box and fade it out
$('.main_nav_hover_box').animate({
'opacity': 0
}, 1500);
});
});
</script>
<?php
if (!$user->guest) {
echo "connesso"."[br /]";
$permessi = max($user->groups);
echo $permessi;
}
?>
<nav>
<ul class="main_nav_menu">
<?php
foreach ($dati_menu as $dati_voce){
if ( $permessi >= $dati_voce->access) {
echo '<li><a style="font-size:'.$font_size.'px;color:'.$color_text.';" href="'.$dati_voce->link.'" title="'.$dati_voce->title.'">'.$dati_voce->title.'[/url]</li>';
}
}
?>
</ul>
</nav>
ecco qui mi servirebbe molto aiuto per capire come dare i permessi...
Io ho creato un sistema semplicistico per filtrare i permessi di visualizzazione delle voci di menu con l'if:
if ( $permessi >= $dati_voce->access)
ma sicuramente ci sono modi più efficenti e eleganti per farlo con le JApplication
sarebbe utile conoscerli...
