2018-04-02 08:29:19 +02:00
/**
* This file is part of Zwii .
*
* For full copyright and license information , please see the LICENSE
* file that was distributed with this source code .
*
* @ author Rémi Jean < remi . jean @ outlook . com >
* @ copyright Copyright ( C ) 2008 - 2018 , Rémi Jean
* @ license GNU General Public License , version 3
* @ link http :// zwiicms . com /
*/
/**
* Aperçu en direct
*/
$ ( " input, select " ) . on ( " change " , function () {
2018-12-09 00:52:05 +01:00
// Import des polices de caractères
var menuFont = $ ( " #themeMenuFont " ) . val ();
var css = " @import url('https://fonts.googleapis.com/css?family= " + menuFont + " '); " ;
2018-04-02 08:29:19 +02:00
var colors = core . colorVariants ( $ ( " #themeMenuBackgroundColor " ) . val ());
2018-12-09 00:52:05 +01:00
// Couleurs du menu
css += " nav,nav a { background-color: " + colors . normal + " } " ;
2018-04-02 08:29:19 +02:00
css += " nav a,#toggle span,nav a:hover { color: " + $ ( " #themeMenuTextColor " ) . val () + " } " ;
css += " nav a:hover { background-color: " + colors . darken + " } " ;
css += " nav a.active { background-color: " + colors . veryDarken + " } " ;
// Taille, hauteur, épaisseur et capitalisation de caractères du menu
2018-12-09 00:52:05 +01:00
css += " #toggle span,#menu a { padding: " + $ ( " #themeMenuHeight " ) . val () + " ;font-family:' " + menuFont . replace ( / \ +/ g , " " ) + " ',sans-serif;font-weight: " + $ ( " #themeMenuFontWeight " ) . val () + " ;font-size: " + $ ( " #themeMenuFontSize " ) . val () + " ;text-transform: " + $ ( " #themeMenuTextTransform " ) . val () + " } " ;
2018-04-02 08:29:19 +02:00
// Alignement du menu
css += " #menu { text-align: " + $ ( " #themeMenuTextAlign " ) . val () + " } " ;
// Marge
if ( $ ( " #themeMenuMargin " ) . is ( " :checked " )) {
if (
< ? php echo json_encode ( $this -> getData ([ 'theme' , 'menu' , 'position' ]) === 'site-first' ); ?>
|| < ? php echo json_encode ( $this -> getData ([ 'theme' , 'header' , 'position' ]) === 'body' ); ?>
) {
css += 'nav{margin:20px 20px 0 20px}' ;
}
else {
css += 'nav{margin:0 20px}' ;
}
}
else {
css += 'nav{margin:0}' ;
}
// Ajout du css au DOM
$ ( " #themePreview " ) . remove ();
$ ( " <style> " )
. attr ( " type " , " text/css " )
. attr ( " id " , " themePreview " )
. text ( css )
. appendTo ( " head " );
2019-01-22 13:46:35 +01:00
2018-04-02 08:29:19 +02:00
// Position du menu
switch ( $ ( " #themeMenuPosition " ) . val ()) {
case 'hide' :
$ ( " nav " ) . hide ();
break ;
case 'site-first' :
$ ( " nav " ) . show () . prependTo ( " #site " );
break ;
case 'site-second' :
if ( < ? php echo json_encode ( $this -> getData ([ 'theme' , 'header' , 'position' ]) === 'site' ); ?> ) {
$ ( " nav " ) . show () . insertAfter ( " header " );
}
else {
$ ( " nav " ) . show () . prependTo ( " #site " );
}
break ;
case 'body-first' :
$ ( " nav " ) . show () . insertAfter ( " #bar " );
2019-01-22 09:04:05 +01:00
$ ( " #menu " ) . removeClass ( 'container-large' );
2019-02-07 17:26:39 +01:00
$ ( " nav " ) . removeClass ( '#navfixedconnected' );
2019-01-22 09:04:05 +01:00
$ ( " #menu " ) . addClass ( 'container' );
2018-12-17 16:30:28 +01:00
break ;
2018-04-02 08:29:19 +02:00
case 'body-second' :
if ( < ? php echo json_encode ( $this -> getData ([ 'theme' , 'header' , 'position' ]) === 'body' ); ?> ) {
$ ( " nav " ) . show () . insertAfter ( " header " );
}
else {
$ ( " nav " ) . show () . insertAfter ( " #bar " );
}
2019-02-07 17:26:39 +01:00
$ ( " nav " ) . removeClass ( '#navfixedconnected' );
2018-04-02 08:29:19 +02:00
break ;
2019-01-22 13:46:35 +01:00
case 'top' :
$ ( " nav " ) . show () . insertAfter ( " #bar " );
$ ( " #menu " ) . removeClass ( 'container' );
$ ( " #menu " ) . addClass ( 'container-large' );
2019-02-07 17:26:39 +01:00
$ ( " nav " ) . addClass ( '#navfixedconnected' );
2019-01-22 13:46:35 +01:00
break ;
2018-04-02 08:29:19 +02:00
}
});
// Lien de connexion (addClass() et removeClass() au lieu de hide() et show() car ils ne conservent pas le display-inline: block; de #themeMenuLoginLink)
$ ( " #themeMenuLoginLink " ) . on ( " change " , function () {
if ( $ ( this ) . is ( " :checked " )) {
$ ( " #menuLoginLink " ) . removeClass ( 'displayNone' );
}
else {
$ ( " #menuLoginLink " ) . addClass ( 'displayNone' );
}
}) . trigger ( " change " );
// Affiche / Cache les options de la position
$ ( " #themeMenuPosition " ) . on ( " change " , function () {
if ( $ ( this ) . val () === 'site-first' || $ ( this ) . val () === 'site-second' ) {
2018-04-07 23:31:15 +02:00
$ ( " #themeMenuPositionOptions " ) . slideDown ();
2018-04-02 08:29:19 +02:00
}
else {
$ ( " #themeMenuPositionOptions " ) . slideUp ( function () {
$ ( " #themeMenuMargin " ) . prop ( " checked " , false ) . trigger ( " change " );
});
}
2019-01-24 14:26:54 +01:00
}) . trigger ( " change " );
// Affiche / Cache les options du menu fixe
$ ( " #themeMenuPosition " ) . on ( " change " , function () {
if ( $ ( this ) . val () === 'top' ) {
$ ( " #themeMenuPositionFixed " ) . slideDown ();
}
else {
$ ( " #themeMenuPositionFixed " ) . slideUp ( function () {
$ ( " #themeMenuFixed " ) . prop ( " checked " , false ) . trigger ( " change " );
});
}
2018-04-02 08:29:19 +02:00
}) . trigger ( " change " );