Bonjour,

Cette petite brève pour vous raconter mes déboires du vendredi matin… Et oui ! De bon matin, mon environnement de bureau Gnome (notamment Gdm) ne voulait pas démarrer.

Je me rappelle alors avoir mis à jour mon environnement pour la version 3.6 disponible dans les repository d’Arch Linux.

[...] Plus de peur que de mal !

Il vous suffira d’ajouter le paramètre ci-dessous

init=/usr/lib/systemd/systemd

Dans votre gestionnaire de démarrage, GRUB dans mon cas.

Ci-dessous un exemple de ma configuration

title  Arch Linux
root   (hd0,5)
kernel /boot/vmlinuz36 root=/dev/sda6 ro fastboot quiet nomodeset radeon.modeset=1 init=/usr/lib/systemd/systemd
initrd /boot/kernel36.img

Au cas ou vous auriez oublié où se trouve le fichier de configuration de Grub, vous le trouverez dans /boot/grub/menu.lst

Et voilà, votre distribution préférée est repartie comme neuve :-D

Cette article est la suite logique de ce précédent billet sur la découverte de l’API Google Maps V3.
Nous repartirons donc de l’archive précédente que vous pouvez télécharger ici.

Alors aujourd’hui, nous allons réaliser un calcul d’itinéraire similaire à certains services tels que Mappy ou Viamichelin.

Commençons par créer le formulaire de saisie du point de départ et du point d’arrivée ainsi qu’une div que nous identifierons panel et qui sera destinée à contenir les différentes étapes de l’itinéraire.

        <div id="destinationForm">
            <form action="" method="get" name="direction" id="direction">
                <label>Point de départ :</label>
                <input type="text" name="origin" id="origin">
                <label>Destination :</label>
                <input type="text" name="destination" id="destination">
                <input type="button" value="Calculer l'itinéraire" onclick="javascript:calculate()">
            </form>

        </div>
       <div id="panel"></div>

Un formulaire tout à fait banal, vous remarquerez que nous associons l’action du clique sur notre bouton « Calculer l’itinéraire » à l’appel de la fonction javascript calculate().
Nous allons créer une variable globale que nous appellerons panel qui correspond au DOM de notre div panel et ajouter dans la fonction initialize, l’appel à la classe DirectionsRenderer qui comme son nom l’indique nous permettra plus tard d’afficher le trajet sur notre carte et les différentes étapes de l’itinéraire.
En-tête du fichier functions.js

var map;
var panel;
var initialize;
var calculate;
var direction;

Dans notre fonction initialize

direction = new google.maps.DirectionsRenderer({
    map   : map, 
    panel : panel 
});

Il ne nous reste plus qu’à créer la fonction calculate qui se chargera de récupérer les valeurs saisies dans le formulaire et faire appel à l’API de Google pour calculer et tracer l’itinéraire.

calculate = function(){
    origin      = document.getElementById('origin').value; // Le point départ
    destination = document.getElementById('destination').value; // Le point d'arrivé
    if(origin && destination){
        var request = {
            origin      : origin,
            destination : destination,
            travelMode  : google.maps.DirectionsTravelMode.DRIVING // Type de transport
        }
        var directionsService = new google.maps.DirectionsService(); // Service de calcul d'itinéraire
        directionsService.route(request, function(response, status){ // Envoie de la requête pour calculer le parcours
            if(status == google.maps.DirectionsStatus.OK){
                direction.setDirections(response); // Trace l'itinéraire sur la carte et les différentes étapes du parcours
            }
        });
    } //http://code.google.com/intl/fr-FR/apis/maps/documentation/javascript/reference.html#DirectionsRequest
};

Quelques explications… Lorsque l’on crée la requête, vous avez certainement remarqué la présence d’un paramètre nommé travelMode, il s’agit du type de transport (voiture, piéton…). Le mode DRIVING correspond bien-entendu au mode de conduite en voiture, les autres modes sont WALKING (piéton) et BICYCLING (vélo), attention à ce jour de rédaction de l’article, le mode BICYCLING est en beta.
A propos de la requête, il s’agit d’un objet de type DirectionsRequest auquel vous pouvez renseigner plus de paramètres par exemple l’unité de valeur de la distance ou encore le passage ou non par autoroute…etc
Voir http://code.google.com/intl/fr-FR/apis/maps/documentation/javascript/reference.html#DirectionsRequest pour plus d’informations
L’envoie de la requête se fait via la méthode route() de l’instance de DirectionsService, celle-ci nous met alors à jour un statut correspondant au bon déroulement ou non de la requête. Nous vérifions donc si le paramètre « OK » de l’objet DirectionsStatus vaut true pour tracer l’itinéraire et le détail du parcours via la méthode setDirections().

Attention : Vous remarquerez que le détail de l’itinéraire est rédigé en Anglais, pour modifier la langue il vous suffit de rajouter un paramètre de langue lors de l’inclusion de l’Api comme ci-dessous

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false&language=fr"></script>

Pour la démonstration cliquez sur le lien suivant http://www.shatimes.fr/googlemap/calcul-itineraire/

Pour télécharger la source c’est par ici http://www.shatimes.fr/googlemap/calcul-itineraire.zip

A bientôt les amis !

Buzz n’est pas une mouche non, et encore moins une abeille…
Il s’agit plutôt du nom d’une librairie audio javascript basé sur l’élément audio de l’html5.
Démonstration ci-dessous

Disponible en version beta 1.0.2, nous avons testé cette librairie et elle fonctionne plutôt bien, attention tout de même, elle ne fonctionne pas sur les versions antérieures à Internet Explorer 9, voir le tableau ci-dessous.

Son implémentation est assez simple

var mySound = new buzz.sound( "/sounds/myfile", {
    formats: [ "ogg", "mp3", "acc" ]
});

mySound.play()
    .fadeIn()
    .loop()
    .bind( "timeupdate", function() {
       var timer = buzz.toTimer( this.getTime() );
       document.getElementById( "timer" ).innerHTML = timer;
    });

Voilà donc de quoi donner plus de dynamisme à vos sites.

Site officiel : http://buzz.jaysalvat.com/

Je cherchais une application pour remplacer mon vieillissant Rhythmbox dont je me suis lassé et qui n’évolue plus vraiment…
C’est avec chance que je suis tombé sur Clementine, un lecteur audio multi-plateforme inspiré d’Amarok le célébre lecteur audio de Kde.
Clementine est donc disponible sur Windows, Mac et sur notre OS préféré Linux (sous licence GPL v3).
Si vous êtes sur ArchLinux, vous ne serez pas surpris d’apprendre qu’il est disponible dans les dépôts.

pacman -S clementine

Pour les autres si Clementine n’est pas dans les dépôts de votre distribution, vous pouvez tenter de le télécharger à cette adresse http://www.clementine-player.org/downloads. Les sources sont également disponibles si Clementine n’est pas proposé pour votre distribution.
Bon que dire sur ce lecteur, il a la particularité d’utiliser Qt et non GTK ce qui est un plus, et requiert très peu de dépendance.

Du côté des fonctionnalités, il permet d’écouter la radio depuis Last.fm, SomaFM, Magnatune, Jamendo et Icecast mais aussi de taguer automatiquement vos morceaux avec MusicBrainz, télécharge les jaquettes manquantes de vos albums, utilise les notifications natives de votre système (Mac et Linux).
Il récupère également différentes informations sur l’artiste (Biographique, photos…), possibilité de contrôler l’application à distance, d’utiliser les touches multimédias de votre clavier, de le minimiser  dans  la zone des notifications,  fondu entre les morceaux, listing par artistes & albums…

Vous l’aurez compris, il est vraiment très complet et je l’ai très vite adopté, si vous êtes à la recherche d’un lecteur musical ou que le votre ne vous satisfait plus ou que vous souhaitez tout simplement l’essayer, je vous encourage de vive voix !

Aloha Editor comme son nom l’indique est un éditeur Wysiwyg ou encore un Rte (Rich text editor). Il sera l’éditeur par défaut de la prochaine branche de Typo3, la 5.0 en cours de développement.

Il fonctionne sur la plupart des navigateurs  hormis le défunt IE6, supporte les sites développés au moins en HTML4. Il s’agit pourtant bien d’un éditeur HTML5 qui d’ailleurs implémente  toutes les spécifications de l’HTML5.

Disponible en plusieurs langues dont l’Anglais et le Français, inutile de préciser que c’est un projet développé par des passionnés et que chacun d’entre nous peuvent contribuer au projet.

Je vous propose un exemple ci-dessous :

Site officiel : http://www.aloha-editor.org/

Une mise à jour de WordPress est disponible depuis quelques heures, elle corrige d’importantes failles de sécurité présentes dans toutes les précédentes versions. C’est pourquoi il est fortement recommandé de mettre a jour WordPress. Pensez à faire une sauvegarde de la base de données avant la mise a jour, sait-on jamais…

Lors de la mise en place d’un module pour communiquer avec une plateforme bancaire, celle-ci me renvoyé une url contenant plusieurs paramètres passés en GET.
Il m’était impossible de récupérer la valeur de ces paramètres, j’ai d’abord pensé que le problème venait du module mais après quelques tests de debug, le module n’était pas le coupable !
Il s’agissait en réalité de Php Suhosin.

Php Suhosin est un patch pour renforcer la sécurité de PHP, par défaut il limite le nombre de caractères passés par paramètre GET à 512 caractères.
Pour outre passer ce nombre de caractère, il faut éditer le fichier php.ini et ajouter le paramètre ci-dessous

suhosin.get.max_value_length = 600

Nous venons ci-dessus de limiter le nombre de caractères à 600.

Un petit redémarrage du serveur, et vous voilà prêt à traiter des paramètres GET de plus de 512 caractères avec Php Suhosin !

Quelle surprise ce matin !

Pour ceux d’entre vous qui ont tenté d’accéder au blog, vous êtes probablement tombé sur un beau message d’erreur de type NOT FOUND ! Et oui, plus aucun article n’était accessible, je me suis donc empressé de jeter un oeil à la table wp_posts la fameuse table qui contient les articles, et bien figurez-vous que celle-ci était corrompue. Je ne sais pas ni comment ni pourquoi mais voici comment la réparer.

# Requête SQL à effectuer après avoir sélectionner la base de données
# Sinon précisez nomBdd.wp_posts
REPAIR TABLE wp_posts

Et le tour est joué !
Pour info, il s’agit d’une table de type MyISAM, et pour les plus fainéants d’entre vous, vous pouvez également faire cette opération depuis phpMyAdmin en cochant la table concernée, ouvrir le menu déroulant « Pour la sélection » et choisir réparer la table.

Have fun !

Depuis la version 1.4 de Prestashop, il est possible de surcharger proprement le core de Prestashop. Auparavant, ne serait-ce que pour l’ajout d’un hook, la modification du core était nécessaire et à la moindre mise à jour de Prestashop, les choses devenaient contraignantes…
J’ai donc décidé de vous présenter la méthode de surcharge qui vous évitera quelques soucis lors de la prochaine mise à jour de l’outil.

A la racine du site se trouve un dossier override qui lui même contient deux dossiers, classes et controllers.
Comme ces noms l’indiquent, le dossier classes contiendra les classes surchargées et le dossier controllers, les controllers.

Nous allons par exemple ci-dessous surcharger la class FrontController.php
Attention : ce controller a la particularité d’être surchargé dans le dossier classes

<?php
/* Créez ce fichier à l'emplacement suivant
  * override/classes/FrontController.php
*/
class FrontController extends FrontControllerCore{

  public function displayHeader(){
        global $css_files, $js_files;

        if (!self::$initialized)
        $this->init();

        // P3P Policies (http://www.w3.org/TR/2002/REC-P3P-20020416/#compact_policies)
        header('P3P: CP="IDC DSP COR CURa ADMa OUR IND PHY ONL COM STA"');

        /* Hooks are volontary out the initialize array (need those variables already assigned) */
        self::$smarty->assign(array(
        'time' => time(),
        'static_token' => Tools::getToken(false),
        'token' => Tools::getToken(),
        'logo_image_width' => Configuration::get('SHOP_LOGO_WIDTH'),
        'logo_image_height' => Configuration::get('SHOP_LOGO_HEIGHT'),
        'priceDisplayPrecision' => _PS_PRICE_DISPLAY_PRECISION_,
        'content_only' => (int)(Tools::getValue('content_only'))
        ));
        self::$smarty->assign(array(
          'HOOK_LEFT_FEATURES' => Module::hookExec('leftFeatures'),
          'HOOK_FEATURES'    => Module::hookExec('features'),
          'HOOK_FEATURED'    => Module::hookExec('homeFeatured'),
          'HOOK_CORNER'      => Module::hookExec('cornerHome'),
          'HOOK_TOPNAV'      => Module::hookExec('topNav'),
          'HOOK_MIDDLENAV'   => Module::hookExec('middleNav'),
          'HOOK_MAINNAV'     => Module::hookExec('mainNav'),
          'HOOK_HOMETEXT'    => Module::hookExec('homeText'),
          'HOOK_HEADER'      => Module::hookExec('header'),
          'HOOK_TOP'         => Module::hookExec('top'),
          'HOOK_LEFT_COLUMN' => Module::hookExec('leftColumn'),
          'HOOK_LOF_TOP'     => Module::hookExec('lofTop')
        ));

        if ((Configuration::get('PS_CSS_THEME_CACHE') OR Configuration::get('PS_JS_THEME_CACHE')) AND is_writable(_PS_THEME_DIR_.'cache'))
        {
        // CSS compressor management
        if (Configuration::get('PS_CSS_THEME_CACHE'))
        Tools::cccCss();

        //JS compressor management
        if (Configuration::get('PS_JS_THEME_CACHE'))
        Tools::cccJs();
        }

        self::$smarty->assign('css_files', $css_files);
        self::$smarty->assign('js_files', array_unique($js_files));
        self::$smarty->display(_PS_THEME_DIR_.'header.tpl');
    }

}
?>

Nous avons donc surchargé ci-dessus la méthode displayHeader() pour charger de nouveaux hooks (HOOK_CORNER, HOOK_MAINNAV…).

Et voilà ! Votre surcharge sera prise en compte par Prestashop.

Fin des mises à jours périlleuses !

J’ai découvert ce paquet dans le dépot extra d’ArchLinux, il s’agit de archlinux-wallpaper.

Ce paquet dépose les images de fond d’écran de notre Os préféré à l’emplacement  /usr/share/archlinux/wallpaper/

Il vous suffit alors de les parcourir et d’en choisir une à votre goût.

Je vous laisse découvrir les autres fonds d’écran en installant le paquet.
Et si vous connaissez d’autres paquets de ce genre n’hésitez pas à m’en faire profiter !