blog.roxing.net

[SPIP] Masquer les emails des auteurs

placido — 2017-03-14T17:07:33Z

Pour certains, l'email est une donnée privée qui peut déjà révéler certaines informations sur son propriétaire.

Ainsi, nombreux sont les administrateurs de sites SPIP soucieux de pouvoir préserver la confidentialité des auteurs dans l'espace privé, en ne divulgant leur adresse email qu'aux seuls webmestres.

Pour passer outre une fastidiese surcharge des squelettes du privé, j'avais proposé une solution sur le forum, et je la retranscris ici, pour qu'elle gagne en visibilité :

Déclarer un traitement automatique sur le champ #EMAIL :

# ./config/mes_options.php $GLOBALS['table_des_traitements']['EMAIL']['auteurs'] = 'camoufler_email(%s, $Pile[1]["id_auteur"])';

Déclarer les autorisations :

#./squelettes/mes_fonctions.php // voir une fiche auteur : être admin ou bien il s'agit de sa propre fiche function autoriser_auteur_voir($faire, $type, $id, $qui, $opt) { if ( ($qui['statut'] == '0minirezo') or ($qui['id_auteur'] == $id) ) { return true; } else return false; } // masquer un email si on est pas autorisé function camoufler_email($email,$id) { include_spip('inc/autoriser'); // on camoufle sauf autorisation if (!autoriser('voir','auteur', $id)) { $email = spip_substr($email,0,3) . "*****"; } return $email; }

Pour passer outre ce traitement automatique, on pourra toujours utiliser la syntaxe #EMAIL* dans son squelette si besoin.

Voir en ligne : http://forum.spip.net/fr_174451.htm...

[SPIP] Appeler le contenu d'un fichier distant directement à l'intérieur d'un squelette

placido — 2016-12-19T02:23:24Z

Récemment, j'ai eu besoin d'incorporer le contenu d'un fichier distant à l'intérieur d'un squelette de feuille de style. En l'occurence, il s'agissait de récupérer un fichier CSS dans sa dernière version (fréquemment mise à jour) et d'étendre certaines règles CSS via des directives @extend de SCSS à d'autres élémenst de mon choix.

Pour complexifier encore la chose, le document source question débute par un BOM [1] qui faisait planter le compilateur SCSSphp.

Mais à SPIP vaillant, rien d'impossible, sans quitter le squelette, en 2 lignes de code s'il vous plait :

[(#HTTP_HEADER{Content-type:text/css[; charset=(#CHARSET)]})] [(#VAL{url_abs_to_css}|recuperer_url{#ARRAY{transcoder,true}}|table_valeur{page}|texte_script)] .formulaire_spip { @extend .form--fancy; } /* etc ... */ #FILTRE{scss_compile}

[1] http://stackoverflow.com/questions/3255993/how-do-i-remove-%C3%AF-from-the-beginning-of-a-file

keepalive.sh : Relancer une commande en boucle

placido — 2016-11-20T09:10:45Z

Une petite astuce pour relancer en boucle une commande jusqu'à ce que le processus se termine en manière attendue :
# !/bin/bash # keepalive.sh
until $1 ; do echo "Processus terminé avec exit code $ ?. On relance..." >&2 sleep 1 done
exit 0
À l'usage (une fois que le fichier est dans le $PATH) :
keepalive.sh "youtube-dl -f hls-best http://www.tf6.ch/concours-super-menuisier.html"
Pratique, si le téléchargement connait des ratés, plus besoin de le (…)

- signets / bash, script, astuce, youtube-dl

KeePassX, Openbox et clavier fr_FR

placido — 2016-08-13T11:32:06Z

Pour une obscure raison, la fonctionnalité Auto-Type de KeePassX (v 0.4.3), utilise une disposition de clavier différente que celle définie par le système.

$ localectl status System Locale: LANG=fr_FR.UTF-8 VC Keymap: n/a X11 Layout: fr X11 Model: pc105 X11 Variant: latin9 X11 Options: terminate:ctrl_alt_bksp

Du coup, la saisie auto d'un mot de passe azerty donne qwerty.

Solution : rajouter cette ligne dans ~/.config/openbox/autostart :

setxkbmap fr &

[Bash] Minuterie et Chronomètre

placido — 2016-04-27T14:10:36Z

Voici 2 fonctions à rajouter à son .bash_aliases

function countdown(){ date1=$((<code class='spip_code spip_code_inline' dir='ltr'>date +%s</code> + $1)); while [ "$date1" -ge <code class='spip_code spip_code_inline' dir='ltr'>date +%s</code> ]; do echo -ne "$(date -u --date @$(($date1 - <code class='spip_code spip_code_inline' dir='ltr'>date +%s</code>)) +%H:%M:%S)\r"; sleep 0.1 done } function stopwatch(){ date1=<code class='spip_code spip_code_inline' dir='ltr'>date +%s</code>; while true; do echo -ne "$(date -u --date @$((<code class='spip_code spip_code_inline' dir='ltr'>date +%s</code> - $date1)) +%H:%M:%S)\r"; sleep 0.1 done }

Minuterie (countdown)

Une version remaniée de sleep qui affiche les secondes restantes. Vous voulez un réveil à la suite d'une micro sieste de 20 minutes ?!

countdown 60*20 && mplayer ~/music/La_chevauchée_des_Valkyries.mp3

Chronomètre (stopwatch)

A vos marques. Prêt ? feu !

stopwatch

ctrl + c pour remettre à zéro.

[SPIP] Mettre en exergue une partie d'un titre

placido — 2015-07-08T17:53:12Z

On est parfois confronté au souhait d'afficher une version raccourcie d'un #TITRE d'article ; typiquement dans un menu de navigation latéral où l'espace est précieux, ou bien si l'on souhaite mettre en exergue une partie seulement du titre (les n premiers mots).

Prenons l'exemple trivial d'un #TITRE un peu long :

La buvette des joyeux pétanqueurs reprend du service à la fin du mois de juin.

Comment faire pour gérer toute la longueur du titre dans une mise en page où la titraille est imposante ?

Il existe le fameux filtre |couper qui s'avère souvent très efficace, quoiqu'il peut opérer une césure malvenue, et que l'on perd une partie de l'information.
D'aucun serait tenté de jouer entre les valeurs des champs #TITRE, #SURTITRE (voire #SOUSTITRE) ; par exemple, ces derniers étant une version étendue du premier. Il s'agit, je pense, d'une mauvaise solution qui implique une certaine redondance d'information, sans compter un usage fastidieux.

Et donc l'astuce je vous la donne.
En insérant un espace insécable au bon endroit :

La buvette des joyeux pétanqueurs reprend du service à la fin du mois de juin.

Combiner à cela, un petit filtre maison à mettre dans son fichier mes_fonctions.php

function scinder($texte){ $txt = explode(" ", $texte); if (is_array($txt) AND isset($txt[1])) $texte = "<strong>".$txt[0]."</strong><span> ".$txt[1]."</span>"; return $texte;
}

On obtient un titre dont la première partie est contenue dans un , et la suite dans un .
Dès lors on peut faire ce que l'on veut avec du CSS, sans trop de vérification de conditions ni de variantes de squelette.

h2{} h2 strong {color: #954141;font-size: 3em} h2 span {color:#437788;font-size: 1em}

Libre à vous d'inclure le code où vous le souhaitez dans votre squelette, au cas par cas :

[(#TITRE|scinder) ]

Enfin, si vous souhaitez l'appliquer à toutes les balises #TITRE de manière automatique, vous pouvez définir une règle sur la table des traitements dans mes_options.php :

$GLOBALS['table_des_traitements']['TITRE'][]= 'scinder(%s)';

Markers & Jump : des raccourcis en bash

placido — 2015-03-13T00:14:07Z

Une fonction qui permet de créer/supprimer des liens symboliques facilement vers les répertoires couramment utilisés. Classe non ?

Il faut rajouter ceci dans son /.bash_aliases :
#Filesystem Markers & Jump ########################### export MARKPATH=$HOME/.marks function jump { cd -P $MARKPATH/$1 2>/dev/null || echo "No such mark: $1" } function mark { mkdir -p $MARKPATH; ln -s $(pwd) $MARKPATH/$1 } function unmark { rm -i $MARKPATH/$1 } function marks { ls -l $MARKPATH | sed 's/ / /g' | cut -d' ' -f9- | sed 's/ -/\t-/g' && echo }
Le code est assez explicite, mais à l'usage voilà ce que cela donne :

Créer un raccourci
cd chemin/vers/mon/projet1 mark projet1
Usage
jump projet1
Lister les raccourcis déjà créés
marks
Supprimer le raccourci
unmark projet1

Bonnes pratiques JQuery

placido — 2014-09-18T14:14:52Z

Charger le contenu depuis un CDN

Plutôt que de stocker JQuery sur votre serveur, vous pouvez choisir un CDN [1] notoire. Cela devrait réduire le temps de chargement de la page.

Voici une liste de CDN fournissant un accès à la bibliothèque JQuery :

Google CDN
Microsoft CDN
jQuery CDN
CDNJS CDN
jsDelivr CDN

Les bonnes pratiques ne concernent pas seuelement JQuery ; les éléments d'affichage - type CSS ou autre - peuvent aussi être chargés parallèlement.

Prévoir une méthode de chargement alternative en cas de défailllance du CDN
Préférer les versions compressées
Placer l'appel au script en fin de page plutôt qu'en en-tête
... ... ...
Utiliser des URLs en chemins relatif

Pas besoin de spécifier le protocole http ou https. Le navigateur optera de lui-même pour le protocole https s'il se trouve déjà dans un environemment sécurisé.

Raccourci pour l'événement ready
// Appel classique $(document).ready(function() { ... }); // Version rapide $(function() { });
Garder le $ lors de la déclaration d'une variable de type jQuery.

Grâce à cette convention de nommage, on distingue facilement la nature de l'objet JQuery.

// :( var form = $('#contactForm'); // :) var $form = $('#contactForm');
Du bon usage de $this

La variable $this s'utilise avantageusement au début des fonctions non déclarées, par exemple dans une boucle de type each.

// :( $('li').each(function() { $(this).on('click', function() { $(this).addClass('active'); }); }); // :) $('li').each(function() { var $this = $(this); $this.on('click', function() { $this.addClass('active'); }); });

Certains préfèrent utiliser that ou self. Attention de ne pas oublier qu'il s'agit d'un objet jQuery.

Mettre en cache les objets jQuery

Si un objet jQuery est utilisé plusieurs fois, le mettre en cache permet d'optimiser les performances.

// :( $('.menu li').each(function() { ... }); $('.menu li').each(function() { ... }); // :) var $items = $('.menu li'); $items.each(function() { ... }); // on recycle :) $items.each(function() { ... });
Enchaînement des fonctions

C'est asssurément l'une des fonctionalités les plus appréciée de jQuery. On peut ainsi appeler une série de méthodes dans la même foulée.

"Write less, do more", garder en tête le slogan de jQuery
// :( var $a = $('#about'); $a.hide(); $a.addClass(); $a.fadeIn(); $a.hide(); // :) $('#about').hide().addClass().fadeIn().hide(); // c'est mieux // Retour à la ligne et identation améliorent la visibilité $('#about') .hide() .addClass() .fadeIn() .hide();
Déclarer un nouvel élément

Lors de la création d'un élément, faîtes en sorte de manipuler les éléments via les méthodes jQuery plutôt que d'insérer du code HTML brut.

// Don't var $hidden = $('').appendTo('#form'); // :) var $hidden = $('') .addClass('form-control') .attr('type', 'hidden') .attr('name', 'foo') .val('bar') .appendTo('#form'); // ou bien var $hidden = $('', { class: 'form-control', type: 'hidden', name: 'foo', value: 'bar' }).appendTo('#form');
Garder le CSS loin des manipulations de jQuery

Pas la peine de déclarer le style CSS directement à un élément. Le recours aux classes est fait pour ça.

// :( $('#button').css({ 'background-color': '#5cb85c', 'border-color': '#4cae4c' }); // :) .success { background-color: #5cb85c; border-color: #4cae4c; } $('#button').addClass('success');
Choisir le bon sélecteur

Le sélecteur désignant l'id est le plus rapide

Pour retrouver un élément du DOM en fonction de son id, jQuery utilise la méthode native document.getElementById() qui s'avère bien plus efficace que Sizzle.

Sizzle is a pure-JavaScript CSS selector engine used by jQuery
// :( $('#wrapper #inner'); $('div#inner'); $('.wrapper #inner'); // :) $('#inner');

Du coup, mieux vaut introduire une recherche sur un id, quitte à enchaîner les recherches.

// :( $('#container .row'); // + rapide $('#container').find('.row');

Sélecteurs restrictifs

Il faut être spécifique sur le partie gauche de votre sélecteur, et moins en début.

// pas glup $('div.data .gonzalez'); // glup glup $('.data td.gonzalez');

Éviter le recours aux sélecteurs universels

// moins rapide $('div.container > *'); // Plus rapide $('.container').children();

Mieux vaut faire précéder les sélecteurs pseudo-class (ex :before) avec un tag ou un autre sélecteur. Car, si ce n'est pas le cas, le sélecteur universel * est implicitement employé.

// :( $('.category :radio'); // :) $('.category input:radio');

Privilégiez les méthodes de tri plutôt que les pseudos-sélecteurs.

Lorsque cele est possible, utiliser la méthode de tri jQuery plutôt que des pseudos-sélecteurs. La méthode querySelectorAll s'avère là encore plus rapide que la méthode Sizzle.

// :( $('.item:first') // :) $('.item').eq(0)
Pas de javascript inline sur les élements HTML

Mieux vaut attacher un écouteur d'événement à l'objet.

// :) $('#saveButton').on('click', function() { ... });
Choisir un namespace personnalisé pour les événements

Ainsi il est plus facile de désactiver un événement sans affecter les autres écouteurs d'événements assignés à l'élément.

$('#saveButton').on('click.bv', function() { ... }); //Plus tard, on peut retirer sans crainte l'écouteur l'événement $('#saveButton').off('click.bv');
Ne pas passer les paramètres Ajax "en dur"

Lorsque d'un requête de type xmlHttpRequest, il faut utiliser le paramètre data, et non concaténer l'information au sein de l'URL.

// :( $.ajax({ url: '/remote/url?param1=value1&param2=value2...' }}); // :) $.ajax({ url: '/remote/url', data: { param1: 'value1', param2: 'value2' ... } });

Dans le cas où les paramètres à transmettre sont très long (ex : le contenu intégral d'un article), on privilégiera la méthode POST, à la fois pour Ajax et le traitement côté serveur.

Internet Explorer 8 (and earlier) limits 2083 characters in URL

Voir en ligne : Best jQuery practices · Programmer Tips

[1] Content Delivery Network : Un content delivery network (CDN) est constitué d'ordinateurs reliés en réseau à travers Internet et qui coopèrent afin de mettre à disposition du contenu ou des données (généralement du contenu multimédia volumineux) à des utilisateurs.

[Firefox] Capture écran d'une page complète

placido — 2014-08-23T15:17:56Z

Pour faire une capture d'écran d'une page complète dans Firefox (même si ça dépasse l'écran), appelez la console développeur (MAJ+F2) et tapez : screenshot —fullpage nomfichier
Et cela va enregistrer un png de la page complète.
- billets / screenshots, astuce, firefox

blog.roxing.net

[SPIP] Masquer les emails des auteurs

[SPIP] Appeler le contenu d'un fichier distant directement à l'intérieur d'un squelette

keepalive.sh : Relancer une commande en boucle

KeePassX, Openbox et clavier fr_FR

[Bash] Minuterie et Chronomètre

Minuterie (countdown)

Chronomètre (stopwatch)

[SPIP] Mettre en exergue une partie d'un titre

Comment faire pour gérer toute la longueur du titre dans une mise en page où la titraille est imposante ?

(#TITRE|scinder)

Markers & Jump : des raccourcis en bash

Bonnes pratiques JQuery

Charger le contenu depuis un CDN

Prévoir une méthode de chargement alternative en cas de défailllance du CDN

Préférer les versions compressées

Placer l'appel au script en fin de page plutôt qu'en en-tête

Utiliser des URLs en chemins relatif

Raccourci pour l'événement ready

Garder le $ lors de la déclaration d'une variable de type jQuery.

Du bon usage de $this

Mettre en cache les objets jQuery

Enchaînement des fonctions

Déclarer un nouvel élément

Garder le CSS loin des manipulations de jQuery

Choisir le bon sélecteur

Pas de javascript inline sur les élements HTML

Choisir un namespace personnalisé pour les événements

Ne pas passer les paramètres Ajax "en dur"

[Firefox] Capture écran d'une page complète