v0.2.0, un pas de géant

baz_april_options.php

@@ -3,7 +3,7 @@ if (!defined("_ECRIRE_INC_VERSION")) return;
 
 // les blocs de baz
 if (!isset($GLOBALS['z_blocs'])) {
-	$GLOBALS['z_blocs'] = array('content','aside','extra','head','head_js','header','footer','breadcrumb');
+	$GLOBALS['z_blocs'] = array('content','aside','extra','connex','head','head_js','header','footer','breadcrumb');
 }
 
 // les images de plus de 2000*1000 pixels de haut seront réduites en 2000x1000 maximum

footer/dist.html

@@ -1,30 +0,0 @@
-<p class="colophon">
-<BOUCLE_annee(ARTICLES){par date}{0,1}>[(#DATE|annee|!={#VAL{Y}|date}|oui)[(#DATE|annee)]]</BOUCLE_annee>-</B_annee>[(#DATE|annee) ] &mdash; #NOM_SITE_SPIP<br />
-<a rel="contents" href="#URL_PAGE{plan}"><:plan_site:></a><span class="sep"> |
-</span><a href="#URL_PAGE{backend}" rel="alternate" title="<:syndiquer_site:>">RSS&nbsp;2.0</a>
-<B_mentions>
-<span class="sep"> |
-</span><BOUCLE_mentions(ARTICLES){page=mentions}>
-<a href="#URL_ARTICLE">#TITRE</a>
-</BOUCLE_mentions>
-<B_contact>
-<span class="sep"> | </span>
-<BOUCLE_contact(ARTICLES){page=contact}>
-<a href="#URL_ARTICLE">#TITRE</a>
-</BOUCLE_contact>
-</p>
-<p class="colophon"><?php
-if (isset($GLOBALS['visiteur_session']['id_auteur']) AND $GLOBALS['visiteur_session']['id_auteur']) {
-?><a href="#URL_LOGOUT" rel="nofollow"><:icone_deconnecter:></a><?php
-	if (include_spip('inc/autoriser') AND autoriser('ecrire')){
-	?><span class="sep"> | </span><a href="#EVAL{_DIR_RESTREINT_ABS}"><:espace_prive:></a>
-<span class="sep"> | </span><?php
-	}
-}
-else {
-?><a href="[(#URL_PAGE{login}|parametre_url{url,#SELF|parametre_url{url,''}})]" rel="nofollow" class='login_modal'><:lien_connecter:></a>
-<span class="sep"> | </span><?php
-}
-?>
-<span class="generator"><a href="http://www.spip.net/" title="<:site_realise_avec_spip:>" class="spip_out">SPIP</a></span>
-</p>

inclure/boussole.html

@@ -1,7 +0,0 @@
-<div class="header__boussole">
-	<div class="page--container">
-		<nav class="nav">
-			<a href="#">inclure un menu</a>
-		</nav>
-	</div>
-</div>

lang/baz_april_fr.php

@@ -5,11 +5,18 @@ if (!defined('_ECRIRE_INC_VERSION')) return;
 
 $GLOBALS[$GLOBALS['idx_lang']] = array(
 
+	'cfg_baz_april' => 'Configuration du jeu de squelettes<br /> 
+	APRIL - base',
+	
+	'site_april' => 'Sites April ...',
+	'des_initiatives_april' => 'Des initiatives de l’April',
+	
 	'actualites' => 'Actualités',
 	'archives' => 'Archives',
 	'articles_recents_du_site' => 'Articles publiés récemment sur ce site',
 	'articles_lies' => 'Articles liés',
 	'aucun_article_dans_cette_periode' => 'Aucun article durant cette période',
 	'tags' => 'Tags',
-	'tri_periodique' => 'Tri périodique'
+	'tri_periodique' => 'Tri périodique',
+	
 );

lang/paquet-baz_april_fr.php

@@ -8,5 +8,5 @@ if (!defined('_ECRIRE_INC_VERSION')) return;
 $GLOBALS[$GLOBALS['idx_lang']] = array(
 
 	'baz_april_description' => 'squelettes HTML5 avec scss et Tiny Typo',
-// 	'baz_april_slogan' => 'squelettes APRIL',
+	'baz_april_slogan' => 'squelettes de base pour les sites APRIL',
 );

paquet.xml

@@ -1,11 +1,10 @@
 <paquet
 	prefix="baz_april"
 	categorie="squelette"
-	version="0.1.3"
+	version="0.2.0"
 	schema="0.0.1"
 	etat="dev"
 	compatibilite="[3.2.7;3.3.*]"
-	logo="img/baz-32.png"
 >
 	<nom>APRIL - base</nom>
 	<!-- Base de développement sur Z-core + SCSSPHP (SASS) + Tiny Typo + FontAwesome v5 -->
@@ -18,24 +17,31 @@
 	<licence lien="https://www.gnu.org/licenses/gpl-3.0.html">GPL 3 pour le squelette SPIP</licence>
 	<licence lien="http://scripts.sil.org">SIL pour les typographies</licence>
 	
-	<necessite nom="Zcore" compatibilite="[2.6.7;[" />
-	<necessite nom="scssphp" compatibilite="[1.4.7;[" />
-	<necessite nom="noizetier" compatibilite="[3.0.109;[" />
-	<necessite nom="pages" compatibilite="[1.3.7;[" />
-	<necessite nom="crayons" compatibilite="[1.26.3;[" />
-	<necessite nom="porte_plume_intertitres" compatibilite="[1.1.3;[" />
-	<necessite nom="compositions" compatibilite="[3.3.0;[" />
-	<necessite nom="mailcrypt" compatibilite="[2.2.0;[" />
-	<necessite nom="bellespuces" compatibilite="[0.1.1;[" />
-	<necessite nom="facteur" compatibilite="[3.4.7;[" />
-	<necessite nom="ppp" compatibilite="[1.0.7;[" />
-	<necessite nom="roles_documents" compatibilite="[0.2.2;[" />
-	<necessite nom="feuillederoute" compatibilite="[1.2.0;[" />
-	<necessite nom="tri_par_rubrique" compatibilite="[1.4.2;[" />
-	<necessite nom="basicone" compatibilite="[0.1.3;[" />
-	<necessite nom="menus" compatibilite="[1.7.25;[" />
+	<necessite nom="Zcore" />
+	<necessite nom="scssphp" />
+	<necessite nom="noizetier" />
+	<necessite nom="pages" />
+	<necessite nom="crayons" />
+	<necessite nom="porte_plume_intertitres" />
+	<necessite nom="compositions" />
+	<necessite nom="mailcrypt" />
+	<necessite nom="bellespuces" />
+	<necessite nom="facteur" />
+	<necessite nom="ppp" />
+	<necessite nom="roles_documents" />
+	<necessite nom="feuillederoute" />
+	<necessite nom="tri_par_rubrique" />
+	<necessite nom="basicone" />
+	<necessite nom="menus" />
+	<necessite nom="prive_fluide_remix" />
+<!-- 	<necessite nom="rang" /> -->
 	
-	<utilise nom="compositions" compatibilite="[3.5.9;[" />
-	<utilise nom="photoswipe" compatibilite="[0.3.4;[" />
+	<utilise nom="compositions" />
+	<utilise nom="photoswipe" />
+	<utilise nom="sociaux" />
+	
+	<chemin path="squelettes" />
+	<chemin path="squelettes/scss" />
+	<chemin path="" />
 	
 </paquet>

readme.md

@@ -41,3 +41,5 @@ git clone https://github.com/nd-/tri_par_rubrique.git
 git clone https://git.spip.net/spip-contrib-extensions/role_documents.git
 
 git clone https://git.spip.net/spip-contrib-extensions/menus.git
+
+git clone https://git.spip.net/spip-contrib-extensions/prive_fluide_remix.git

sociaux_pipelines.php

@@ -0,0 +1,68 @@
+<?php
+/**
+ * Plugin sociaux
+ * Licence GPL3
+ *
+ */
+
+if (!defined("_ECRIRE_INC_VERSION")) {
+	return;
+}
+
+/**
+ * Inserer une CSS pour le contenu embed
+ *
+ * @param $head
+ *
+ * @return string
+ */
+function sociaux_insert_head_css($head) {
+	include_spip('inc/config');
+	if (lire_config('sociaux/css', 0)) {
+		$head .= '<link rel="stylesheet" type="text/css" href="' . find_in_path('lib/socicon/style.css') . '" />' . "\n";
+		$head .= '<link rel="stylesheet" type="text/css" href="' . find_in_path('css/sociaux.css') . '" />' . "\n";
+	}
+
+	return $head;
+}
+
+function sociaux_sociaux_lister($flux) {
+	/**
+	 * On reprend les éléments initiaux de la v1 du plugin :
+	 * facebook, twitter, instagram, blogger, pinterest, linkedin, youtube, rss, email, tripadvisor, vimeo, flickr
+	 *
+	 */
+	if (isset($flux['data'])) {
+		$flux['data']['mail'] = 'E-mail';
+		$flux['data']['rss'] = 'RSS';
+		$flux['data']['facebook'] = 'Facebook';
+		$flux['data']['twitter'] = 'Twitter';
+		$flux['data']['mastodon'] = 'Mastodon';
+		$flux['data']['instagram'] = 'Instagram';
+		$flux['data']['blogger'] = 'Blogger';
+		$flux['data']['pinterest'] = 'Pinterest';
+		$flux['data']['linkedin'] = 'Linkedin';
+		$flux['data']['youtube'] = 'Youtube';
+		$flux['data']['tripadvisor'] = 'TripAdvisor';
+		$flux['data']['vimeo'] = 'Vimeo';
+		$flux['data']['flickr'] = 'Flickr';
+		$flux['data']['viber'] = 'Viber';
+		$flux['data']['whatsapp'] = 'Whatsapp';
+		$flux['data']['skype'] = 'Skype';
+	}
+
+	return $flux;
+}
+
+/**
+ * Ajoute les scripts JS et CSS de saisies dans l'espace privé
+ *
+ * @param string $flux
+ * @return string
+ **/
+function sociaux_header_prive($flux){
+	$css = find_in_path('lib/socicon/style.css');
+	$flux .= "\n<link rel='stylesheet' href='$css' type='text/css' media='all' />\n";
+	return $flux;
+}
+

squelettes/body.html

@@ -3,7 +3,6 @@
 	<li class="accesrapide"><a class="accesrapide__lien visuallyhidden focusable" href="#contenu"><:baz_april:evitement_contenu:></a></li>
 	<li class="accesrapide"><a class="accesrapide__lien visuallyhidden focusable" href="#navigation"><:baz_april:evitement_navigation:></a></li>
 </ul>
-<div id="boussole_spip">[(#REM) La boussole SPIP va s'insérer ici ]</div>
 <div class="page__wrapper">
 
 	<header class="page__header">
@@ -11,7 +10,7 @@
 			<INCLURE{fond=header/#ENV{type-page},env} />
 			<INCLURE{fond=inclure/nav-secteurs,env} />
 		</div>
-		<INCLURE{fond=inclure/boussole} />
+		[<div class="header__boussole" data-page="(#URL_PAGE{boussole}|parametre_url{var_zajax,content})"></div>]
 	</header>
 	
 	<div class="page__content page--container">
@@ -27,15 +26,12 @@
 		</aside><!--.aside-->]
 	</div>
 	
+	<aside class="connex">
+		<INCLURE{fond=connex/#ENV{type-page},env} />
+	</aside>
+	
 	<footer class="page__footer">
 		<div class="page--container">
-			<div class="menus_footer flex flex5">
-				#INCLURE{fond=inclure/menu, env, identifiant=pied1}
-				#INCLURE{fond=inclure/menu, env, identifiant=pied2}
-				#INCLURE{fond=inclure/menu, env, identifiant=pied3}
-				#INCLURE{fond=inclure/menu, env, identifiant=pied4}
-				#INCLURE{fond=inclure/menu, env, identifiant=pied5}
-			</div>
 			<INCLURE{fond=footer/#ENV{type-page},env} />
 		</div>
 	</footer>

squelettes/connex/dist.html

@@ -0,0 +1,3 @@
+<!-- connex -->[(#REM) charger un fichier different pour chaque page ]
+<!--<div class="page--container">
+</div>-->

squelettes/content/boussole.html

@@ -0,0 +1,18 @@
+<div class="page--container">
+	<span class="initiatives"><:baz_april:des_initiatives_april:></span>
+	<button type="button" class="btn-boussole"><:baz_april:site_april:></button>
+	<nav class="nav"><BOUCLE_csv(DATA){source csv, #CHEMIN{csv/boussole.csv}}>
+		<a href="#VALEUR{1}">#VALEUR{0}</a></BOUCLE_csv>
+	</nav>
+</div>
+<script type="text/javascript">
+jQuery(function($){
+	
+	// afficher/masquer la boussole < medium
+	$('.btn-boussole').on('click', function(){
+		$(this).toggleClass('actif').siblings('.nav').toggleClass('ouvert');
+		$('.principale .btn-nav').removeClass('actif').siblings('.nav-list').removeClass('ouvert');
+	});
+	
+});
+</script>

squelettes/csv/boussole.csv

@@ -0,0 +1,6 @@
+April,https://www.april.org
+Expolibre,https://www.expolibre.org
+Chapril,https://www.chapril.org
+Libre à vous,https://www.libreavous.org
+Libre à lire,https://www.librealire.org
+Candidat.fr,https://www.candidat.fr

squelettes/csv/boussole_cachee.csv

@@ -0,0 +1,6 @@
+April,https://www.april.org
+Expolibre,https://www.expolibre.org
+Chapril,https://www.chapril.org
+Libre à vous,https://www.libreavous.org
+Libre à lire,https://www.librealire.org
+Candidat.fr,https://www.candidat.fr

squelettes/footer/dist.html

@@ -0,0 +1,14 @@
+<p class="colophon">
+	
+	<span class="april"><img src="#CHEMIN{scss/img/logo_april_b.png}" /></span>
+
+	<BOUCLE_contact(ARTICLES){page=contact}>
+	<a href="#URL_ARTICLE">#TITRE</a>
+	</BOUCLE_contact>
+	<INCLURE{fond=inclure/rezo} />
+	<BOUCLE_mentions(ARTICLES){page=mentions}>
+	<a href="#URL_ARTICLE">#TITRE</a>
+	</BOUCLE_mentions>
+	<a rel="contents" href="#URL_PAGE{plan}"><:plan_site:></a>
+	
+</p>

squelettes/inclure/boussole.html

@@ -0,0 +1,7 @@
+<div class="header__boussole">
+	<div class="page--container">
+		<nav class="nav"><BOUCLE_csv(DATA){source csv, #CHEMIN{csv/boussole.csv}}>
+			<a href="#VALEUR{1}">#VALEUR{0}</a></BOUCLE_csv>
+		</nav>
+	</div>
+</div>

squelettes/inclure/head.html

@@ -8,8 +8,10 @@
 [(#REM) Lien vers le flux RSS du site ]
 [<link rel="alternate" type="application/rss+xml" title="<:syndiquer_site:>" href="(#URL_PAGE{backend})" />]
 
-[(#REM) baz css ]
+[(#REM) baz scss ]
 [<link rel="stylesheet" href="(#CSS{scss/baz.css})" type="text/css" />]
+[(#REM) surcharge facile pur css ]
+[<link rel="stylesheet" href="(#CSS{css/perso.css})" type="text/css" />]
 
 #INSERT_HEAD_CSS
 

squelettes/inclure/nav-secteurs.html

@@ -1,5 +1,5 @@
 <B_nav>
-<nav class="nav" aria-label="Menu principal">
+<nav class="nav principale" aria-label="Menu principal">
 	<ul class="nav-list">
 		 <BOUCLE_nav(RUBRIQUES) {racine} {par num titre, titre}>
 		 <li class="nav-item[ (#EXPOSE)][ (#COMPTEUR_BOUCLE|=={1}|oui)first][ (#COMPTEUR_BOUCLE|=={#TOTAL_BOUCLE}|oui)last]"><a href="#URL_RUBRIQUE"[ class="(#EXPOSE)"]>#TITRE</a></li>

squelettes/inclure/rezo.html

@@ -0,0 +1,7 @@
+[(#REM) Avec plugin sociaux ]
+<!-- sociaux -->[(#SET{rezo,[(#PIPELINE{sociaux_lister,#ARRAY{args,#ARRAY{skel,#SQUELETTE,date,#ENV**{date}},data,#ARRAY}})]})]
+<span class="sociaux">
+<BOUCLE_rezo (DATA) {source tableau,#GET{rezo}}>[(#CONFIG{sociaux/#CLE}|oui)
+		<a href="[(#CLE|=={mail}|oui)mailto:][(#CLE|=={skype}|oui)callto:]#CONFIG{sociaux/#CLE}" class="#CLE[(#CLE|in_array{#LISTE{rss,mail,whatsapp,skype}}|non)spip_out]">[(#CONFIG{sociaux/css}|oui)<span class="socicon socicon-#CLE"></span>]<span class="name">[(#VALEUR)]</span></a>]</BOUCLE_rezo>
+</span>
+<!-- #sociaux -->

squelettes/js/baz_script.js

@@ -11,7 +11,7 @@ jQuery(function($){
 	// masquer les mois des annees precedentes, les afficher au clic sur l'annee
 	$.each( ['.annees.archive'], function(i,hi){
 		$( ".periode div" ).find(hi).each(function(index) {
-			// Creer un div apres le h3 et y placer tout ce qui se trouve apres et jusqu'au hi suivant
+			// Creer un div apres et y placer tout ce qui se trouve apres et jusqu'au hi suivant
 			$(this).after("<span class=\"mois_archives\"></span>").next().append($(this).next().nextUntil(hi));
 			// plier/deplier le contenu
 // 			$(this).next().hide();
@@ -23,4 +23,20 @@ jQuery(function($){
 		});
 	});
 	
+	// charger la boussole 
+	function boussole(){
+		var boussole = $('.header__boussole').attr('data-page');
+		$('.header__boussole').load(boussole);
+	}
+	boussole();
+	
+	// placer le html du bouton du menu, visible < medium
+	$('.nav.principale').prepend('<button type="button" class="btn-nav"><span class="ham"></span>MENU</button>');
+	// afficher/masquer le menu
+	$('.principale .btn-nav').on('click', function(){
+		$(this).toggleClass('actif').siblings('ul').toggleClass('ouvert');
+		$('.btn-boussole').removeClass('actif');
+		$('.header__boussole .nav').removeClass('ouvert');
+	});
+	
 });