Avec tout le merdier qui traîne dans mon bureau, sur mon armoire, j'ai de quoi fabriquer une douzaine de satellites de télécommunication... Je récupère les pièces éventuellement utiles des trucs qui tombent en panne: prises (jack, usb, courant, alims...), interrupteurs, composants, leds, fils, blocks d'alimentation, moteurs, spikeurs etc... J'en ai des boîtes entières...

Pour mon gamin de neuf ans, mon bureau, c'est la caverne d'Ali Baba, Alice au pays des merveilles et Minecraft en mode créatif réunis en un seul espace merveilleux où tout est possible...

Parfois, le temps que je range les derniers composants arrachés aux entrailles encore fumantes du dernier appareil qui a rendu l'âme victime de la poisse hardware qui me caractérise, ces derniers gisent un temps sur mon bureau... à la vue de mon gamin dont les doigts lui démangent déjà de me subtiliser lesdits composants...

Or donc, comme je rangeais une plaque de leds dans une boîte, il me dit : «Hé, papa, tu pourrais faire une lampe... c'est une bonne idée ça, une lampe, hein papa, dis, hein que c'est une bonne idée ?!»

Je réunis les composants nécessaires: un interrupteur récupéré sur une carte graphique qui avait lâché, deux fils, une prise usb articulée servant d'adaptateur pour un format aujourd'hui disparu et ma plaque de leds.

Quelques soudures plus tard, j'ai une lampe fonctionnelle et compacte...

Étape suivante: mesure, réfléchis et passe sous freecad: design des deux parties, le dessus et le boîtier (destinés à être collés, j'ai pas envie de me faire chmir avec des vis...

Reste le montage, le collage en mode gros babouin: moitié superglu moitié pistolet à colle (la fanfreluche, c'est pas mon rayon aujourd'hui...)

Au final, ça donne ça !

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> RSS<script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires

Dire qu'aujourd'hui, il suffit d'ajouter loading="lazy" à une balise image pour implémenter le lazyload...

C'est beau.

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires

Intéressant : des onglets css only... Je garde !

// boutons
<input type="radio" name="tabs" id="tab1" checked />
<label for="tab1">Tab1</label> 
<input type="radio" name="tabs" id="tab2" />
<label for="tab2">Tab2</label>

// contenus
<div class="tab content1">Tab1 Contents </div>
<div class="tab content2">Tab2 Contents </div>

// css pour cacher/montrer
input { display: none; }                /* hide radio buttons */
input + label { display: inline-block } /* show labels in line */
input ~ .tab { display: none }          /* hide contents *//* show contents only for selected tab */
#tab1:checked ~ .tab.content1,
#tab2:checked ~ .tab.content2 { display: block; }

// css pour styler
input + label {             /* box with rounded corner */
  border: 1px solid #999;
  background: #EEE;
  padding: 4px 12px;
  border-radius: 4px 4px 0 0;
  position: relative;
  top: 1px;
}
input:checked + label {     /* white background for selected tab */
  background: #FFF;
  border-bottom: 1px solid transparent;
}
input ~ .tab {          /* grey line between tab and contents */
  border-top: 1px solid #999;
  padding: 12px;
}

            <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/>
                <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/>
                <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"></script>
                <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});</script>

---

► Commentaires

Une excellente production d'Heliox: un pied articulé pour un éclairage de bureau (qui pourrait être adapté pour servir de support de caméra ou de portable lorsqu'on filme un tuto par exemple...

On y voit notamment comment inclure des écrous dans une pièce imprimée en 3D.

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires

Certains se souviennent peut-être de goofi, pour récupérer des google fonts en local; sur la base de ce script, j'ai bricolé une version qui permettra de faire la même chose avec les bibliothèques et frameworks (notamment js) que tout un chacun utilise et dont l'appel participe aux stats de google et consorts à chaque requête sur leur serveur.

Donc, en gros, il suffit de remplacer l'appel du script dans le en ajoutant getlib.php?url= devant.

Ainsi

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

deviendra

<script src="http://monserveur/getlib.php?url=https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Le fichier est récupéré une seule fois et seule la vertsion locale sera renvoyée par la suite.

Au cas où vous voulez que le script récupère une éventuelle mise à jour, il suffit d'ajouter update dans l'url:

<script src="http://monserveur/getlib.php?update&url=https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Getlib vérifiera alors si le fichier distant a changé et le retéléchargera si c'est nécessaire.

Comme avec Goofi, seule l'IP du serveur qui héberge le script est connue du serveur distant, jamais celle du visiteur.

C'est tout! Je n'ai pas testé à fond encore et les erreurs ne sont pas gérées pour le moment, mais ça fonctionne quand même pas mal !

<?php 
# get libs from distant servers to local (& avoid unnecessary requests to servers who can log user's connections)
# ex:  
# https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js
# becomes
# getlib.php?url=https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js
# if you want to update local file if the distant one changes, just add "update" 
# getlib.php?update&url=https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js
# author: warriordudimanche.net
# 
$lib_folder='libs/';
$check_updates=isset($_GET['update']);

if (!empty($_GET['url'])){
    if (!is_dir($lib_folder)){mkdir($lib_folder);}

    $url=strip_tags($_GET['url']);
    define('LOCAL_FILENAME',$lib_folder.basename($url));
    $flag='non';
    if (
        !is_file(LOCAL_FILENAME)
        ||
        ($check_updates && !isSameFile($url))

    ){
        $lib=file_get_contents($url);
        file_put_contents(LOCAL_FILENAME,$lib);
        $head = array_change_key_case(get_headers($url, TRUE));
        file_put_contents(LOCAL_FILENAME.'.info', $head['last-modified']);
        $flag='oui';
    }
    header('Content-Type: '.mime_content_type(LOCAL_FILENAME));
    exit(file_get_contents(LOCAL_FILENAME));
}

function getDistantFile($url){
    $lib=file_get_contents($url);
    file_put_contents(LOCAL_FILENAME,$lib);
    $head = array_change_key_case(get_headers($url, TRUE));
    file_put_contents(LOCAL_FILENAME.'.info', $head['last-modified']);
}

function isSameFile($url){
    $head = array_change_key_case(get_headers($url, TRUE));
    $local=file_get_contents(LOCAL_FILENAME.'.info');
    $distant=$head['last-modified'];
    return $distant==$local;
}

getlib.zip le dépôt

<link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/style.css"/> <link rel="stylesheet" href="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.css"/> <script src="http://www.warriordudimanche.net/./plugins/Galart/assets/lightbox.js"> <script>[].forEach.call(document.querySelectorAll("[lightbox]"), function(el) { el.lightbox = new Lightbox(el);});

---

► Commentaires