Partager c’est aussi Apprendre…

Posté le 9 février 2017 à 02:16
Rubrique(s) : Divers

blog informatiqueVous arrivez sur le blog informatique d’un passionné de programmation et photographe amateur à ses heures. Il n’y a aucune régularité dans la rédaction des articles, c’est ‘quand’ j’ai le temps :). Le principale but c’est le partage, mais cela me permet également de centraliser de nombreuses informations. Un peu comme une base de connaissances…

 

Sur Pajagus.fr vous trouverez principalement des article sur :

  • La programmation (PHP, Bash, CSS, Js, HTML…)
  • macOS, Linux et même Windows
  • La Photographie
  • La Musique, L’Eurovision
  • Des Trucs & Astuces divers

Media Query CSS Responsive

Posté le 17 février 2017 à 10:11
Rubrique(s) : HTML/CSS

CSSVoici un petit bout de CSS qui peut être utiliser comme point de départ pour créer des pages responsives.

Pages Responsive, veut dire que le contenu de la page s’adapter automatiquement à la taille du périphérique (écran) utilisé :  Ordinateur, Tablette, Smartphone…

La méthode préconisée pour créer ce genre de page c’est de créer les styles par défaut pour le plus petit écran (smartphone) et ensuite via des media query de modifier certaines règles CSS lorsque l’écran est plus grand. Il est plus facile d’agrandir un contenu que de le réduire.

Voici le code, ce dernier utilise EM comme unité de base. Un EM correspond à 16px. Pour l’exemple j’utilise une div avec les différentes tailles pour chaque résolution.

/* taille la plus petite par défaut */
div.main { width:300px; }

/************************************************************* 400 */
@media screen and (min-width: 26em) {
  div.main { width:400px;} /* on passe à 400 si la taille de l'écran est mini 400px */
}

/************************************************************  768 */
@media screen and (min-width: 48em) {
  div.main { width:700px; } 
}
/************************************************************  992 */
@media screen and (min-width: 62em) {
   div.main { width: 1100px; }
}
/************************************************************  1200 */
@media screen and (min-width: 75em) {
  div.main { width:90% } /* on prend 90% de l'espace disponible */ 
}

Il faut également ajouter dans le HEADER de votre page HTML le tag suivant :

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Cela peut parâitre un peu lourd de gérer tous ces cas de figure, mais en fait on doit uniquement affecter les dimensions des différents objets (width, font-size, height…). Le reste des propriétés CSS est commun pour toutes les tailles.

Le site Pajagus.fr est aujourd’hui entièrement responsive depuis sa dernière mise à jour en Décembre 2016.

Calculer la durée d’un Timelapse

Posté le 15 février 2017 à 08:41
Rubrique(s) : Divers / Photos divers

Durée Timelapse

Lorsque l’on veut faire un Timelapse (séquence accélérée de photos prises à intervalles réguliers) le point important c’est de bien choisir la durée de prise entre chaque photo fonction de la longueur de film que l’on souhaite obtenir et également du type de sujet (rapide ou lent).

Ayant besoin de faire ce calcul je partage avec vous une formule simple qui permet de calculer la durée finale du Timelapse avec les données suivantes :

  • La durée en minutes de la prise de vue
  • L’intervalle entre chaque photo

NB: la formule est valable pour une vidéo à 25i/s.

Voici le calcul complet pour une durée de prise de 1h (60mn*60s) => (60 * 60) / (10 * 25).

Ce n’est pas très compliqué mais on peut encore simplifier et ne garder uniquement les valeurs variables :

  • Durée en minute
  • Duré de l’intervalle

(60 / 10) * (60/25) = (60 / 10) * 2.4

Donc pour calculer la longueur de notre Timelapse (en s) on a :  2.4 * durée prise de vue en minutes / intervalle en secondes .

Pour une prise de vue de 2h (120mn) et un intervalle de 10s => 2.4 * 120 / 10 = 28 s

Notre Timelapse (25i/s) fera donc 28s au final, pour une prise de 2h avec une photo toutes les 10 secondes (total de 720 photos !!!).

En ce qui concerne les intervalles, pour les sujets rapides en général 1 à 3 secondes max. Pour les sujets plus lents on peut monter jusqu’à plusieurs dizaines de secondes, voir des minutes si on veut par exemple filmer la construction d’un bâtiment sur plusieurs mois…

Pour continuer cette série le prochain article présentera un exemple pour assembler les photos avec le logiciel FFMPEG.

Compatibilité CSS/Navigateur

Posté le 14 février 2017 à 09:12
Rubrique(s) : HTML/CSS

CSSLa norme CSS avance à grand pas et de nouvelles fonctionnalités arrivent comme GRID, Flexbox etc… Le problème en tant que développeur c’est souvent de connaître le niveau de compatibilité par rapport aux principaux navigateurs du marché.

Certains navigateurs, pour se démarquer de la concurrence, implémentent certaines fonctionnalités alors qu’elles ne sont pas encore définitivement validées par le W3C, mais sont encore à l’état de ‘brouillons’ (Draft).

Ajouter à cela la course aux versions (Firefox 45+, Chrome 50+ !!!) difficile de s’y retrouver.

La solution existe via le site : http://caniuse.com/, ce site permet de connaitre le niveau de compatibilité d’une fonctionnalité spécifque.

Par exemple pour CSS-GRID (encor en Draft!)  : http://caniuse.com/#feat=css-grid

 

Cloner un disque avec Linux

Posté le 11 février 2017 à 09:32
Rubrique(s) : Linux

Cloner un disqueSous Linux il est très facile de cloner un disque entier (ou simplement une partition). Pour cela il existe la commande dd. Cette commande, très puissante, existe depuis toujours sur Linux. Une autre de ses fonctions  c’est qu’elle permet de facilement faire un backup du secteur MBR (Master Boot Record).

Avant de vous montrer quelques exemples, petite précision concernant les disques durs et les partitions sous Linux.

Chaque disque dur est identifié par une entré dans /dev, le premier disque sera /dev/sda, le deuxième /dev/sdb etc…

Ensuite les partitions sont numérotées de 1 à X pour chaque disque, par exemple /dev/sda1 est la première partition du premier disque, /dev/sdc3 c’est la troisième partition du disque 3, etc.. .

En ce qui concerne la commande dd, il faudra soit préciser le nom du disque /dev/sda, ou celui de la partition /dev/sda1 en fonction de ce que vous voulez faire. Attention à ne pas vous tromper !. Vérifiez bien avant la lancer la commande que vous pointer vers le bon disque (ou la bonne partition) surtout en mode écriture ! Dernière précision, il faut être connecter en root pour pouvoir utiliser cette commande.

Dernière information, il est possible de cloner vers un disque plus grand ou une partition plus grande mais pas le contraire!

Suivants