var Phenix = function () {

Troll du Web depuis 1996

Limiter le pouvoir d’Iedit-mode

Petit pense-bête pour Iedit-mode et Spacemacs.
Cela peut vous faire gagner un temps fou !

Iedit permet de replacer toutes les occurrences d’une sélection en une seule fois. Mais par défaut, il le fait dans tout le buffer.

Il existe cependant quelques possibilités pour limiter le « scope », la sélection :

  • F pour limiter Iedit à la fonction en court. C’est parfait pour renommer une variable !
  • L pour limiter à la ligne en court.
  • J pour ajouter une ligne du dessous a la sélection Iedit.
  • K pour ajouter une ligne au-dessus de la sélection Iedit.
  • Naviguer entre les occurrences : n et N ou TAB.

Il est aussi possible de sélectionner une zone pour réduire la sélection Iedit :

  1. SPC s e pour activer Iedit.
  2. Sélectionnée la zone (v en Evil-mode, les autres comme V ne fonctionne pas).
  3. SPC s e pour réactiver Iedit qui limitera l’effet.
Voir en ligne : How to replace words in a region using iedit ?

Une marge sur le « scroll » des ancres HTML

Voici une petite astuce pour avoir une marge, entre le « haut du browser » et l’emplacement réel de l’ancres, lorsque l’on clic sur une ancre.

  1. /**
  2.  * Appliquer une marge sur les ancres HTML c'est plus
  3.  * ergonomique.
  4.  */
  5. :target {
  6. border-top: 75px solid transparent;
  7. margin: -75px 0 0;
  8. -webkit-background-clip: padding-box;
  9. -moz-background-clip: padding;
  10. background-clip: padding-box;
  11. outline: none; /* Supprimer la outline disgracieuse de Chrome */
  12. }

:target est une sélécteur css bien supporté qui cible toutes les ancres. Du coup on lui ajouter une fausse marge.
L’avantage ce code, c’est qu’il va fonctionner même si l’ancre est dans un texte. Ce que n’est pas le cas de la majorité des techniques à base de display: block; et de :before.

Voir en ligne : offsetting an html anchor to adjust for fixed header

Recherche ajax avec les formulaires SPIP

Une recherche « live »

Le but de ce formulaire est une recherche dynamique : a chaque nouvelle lettre dans l’input la recherche s’affine.

La bonne nouvelle c’est qu’on peut faire cela nativement avec les fonctions présentent dans SPIP.

Dans un premier temps, il faut créer un fichier formulaires/recherche_ajax.php. Il va mettre à jour le contexte du formulaire.

  1. <?php
  2.  
  3. if (!defined('_ECRIRE_INC_VERSION')) {
  4. return;
  5. }
  6.  
  7. function formulaires_recherche_ajax_charger_dist($ajax_bloc) {
  8. return array(
  9. 'ajax_bloc' => $ajax_bloc,
  10. 'recherche_'.$ajax_bloc => _request('recherche_'.$ajax_bloc),
  11. 'lang' => $lang,
  12. );
  13. }

Ensuite un peu de JavaScript et d’HTML pour recharger un bloc ajax, dans un fichier formulaires/recherche_ajax.html.
Ici, j’ai simplement repris le formulaire de recherche de SPIP en modifiant le name de l’input de recherche.

  1. <div class="formulaire_spip formulaire_recherche[ (#ENV{class})]" id="formulaire_recherche">
  2. <form action="[(#ENV{action})]" method="get">
  3. <div class="editer-groupe">
  4. [(#ENV{action}|form_hidden)]
  5. [<input type="hidden" name="lang" value="(#ENV{lang})" />]
  6. <label for="#ENV{_id_champ}"><:info_rechercher_02:></label>
  7. <input type="[(#HTML5|?{search,text})]" class="search text" name="recherche_#ENV{ajax_bloc}" id="#ENV{_id_champ}"[ value="(#ENV{recherche})"] />
  8. <input type="submit" class="submit" value="&gt;&gt;" title="<:info_rechercher:>" />
  9. </div>
  10. </form>
  11. </div>

Dans le même fichier, à la fin, un peu de javascript pour actualiser la recherche :

  1. <script type="text/javascript">
  2. // Chaque input déclenche la recherche ajax
  3. $("#recherche_#ENV{ajax_bloc}").on("input", function () {
  4. ajaxReload(
  5. "#ENV{ajax_bloc}",
  6. {
  7. args: {
  8. // Envoyer le contenu du formulaire dans le
  9. // contexte de recherche SPIP
  10. recherche: $(this).val()
  11. }
  12. }
  13. );
  14. });
  15. </script>

Dans le bloc ajax, je place simplement ma boucle de recherche :

  1. <B_article_ajax>
  2. #ANCRE_PAGINATION
  3. <BOUCLE_article_ajax(articles){recherche ?}{par date}{inverse}{pagination}>
  4. <INCLURE{fond=inclure/article_resume}{id_article} />
  5. </BOUCLE_article_ajax>
  6. [<p class="pagination">(#PAGINATION)</p>]
  7. </B_article_ajax>

Il ne reste qu’à appeler tout cela :

  1. [(#FORMULAIRE_RECHERCHE_AJAX{grille_article})
  2.  
  3. ]<INCLURE{fond=inclure/grille_article}{env, ajax=grille_article} />

Pour en savoir plus sur les formulaires de SPIP, rien ne vaut la documentation de spip.net :).


Laravel + Foundation 6

Laraval vient par défaut avec Boostrap. Personnellement, en matière de Framework frontend, je préfère largement Foundation.

Heureusement, il existe un preset pour changer cela proprement dans Laravel. Les autres Tuto ou tout était fait à la main était quand même barbant.

Installer le preset :

Facile, on demande à composer :

  1. composer require laravel-frontend-presets/zurb-foundation

Activé le preset :

Soit on veut juste activer foundation :

  1. php artisan preset foundation

Soit on veut aussi que les templates de base de Laravel soit adapté :

  1. php artisan preset foundation-auth

Il ne reste plus qu’à installer :

  1. npm install && npm run dev
Voir en ligne : Zurb Foundation 6 Preset For Laravel 5.5

Éxecuter du code quand une commande est payée

Lorsque l’on utilise le plugin commande et que l’on souhaite exécuter une peu de code lorsqu’une commande est payée, il suffit d’utiliser ce petit pipeline :

  1. function prefixe_post_edition($flux) {
  2. if ($flux['args']['table'] == table_objet_sql('commande')
  3. and $flux['args']['action'] == 'instituer'
  4. and $flux['args']['statut_ancien'] == 'encours'
  5. and $flux['data']['statut'] == 'paye'
  6. ) {
  7. $id_commande = $flux['args']['id_objet'];
  8. // Coder ici
  9. }
  10. return $flux;
  11. }