MooTools

SEO

HTML 5

Cheat Sheet dédiée à l’utilisation des Canvas dans HTML5

CSS 3

Vim

Python

Cheat sheet dédiée au framework web Django

Ruby On Rails

Subversion

GIT

Mercurial

Apache’s Mod Rewrite

WordPress

Enjoy ! =)

<?
if (eregi('msie', $HTTP_USER_AGENT) && !eregi('opera', $HTTP_USER_AGENT))
{
// Internet Explorer
$navigateur="Internet Explorer";
}
elseif (eregi('opera', $HTTP_USER_AGENT))
{
// Opera
$navigateur="Opera";
}
elseif (eregi('Mozilla/4.', $HTTP_USER_AGENT))
{
// Netscape 4.x
$navigateur="Netscape 4.x";
}
elseif (eregi('Mozilla/5.0', $HTTP_USER_AGENT) && !eregi('Konqueror', $HTTP_USER_AGENT))
{
// Netscape 6
$navigateur="Netscape 6.x";
}
else
{
// Autres navigateurs
$navigateur="Navigateur inconnu";
}
echo $navigateur;
?>

Comme vous pouvez le constater, c’est laid et imprécis à souhait =P

Parant de cette constatation, je me suis mis en quête d’une fonction ou d’une class plus performante, et je suis tombé sur la fonction standard de PHP get_browser(), qui est une vraie bénédiction comparée à notre fonction d’amateur disponible plus haut. Sans plus attendre, voici un bout de code (tiré de PHP.net) montrant son fonctionnement, et surtout les informations renvoyées :

echo $_SERVER['HTTP_USER_AGENT'] . "\n\n";

$browser = get_browser(null, true);
print_r($browser);
?>
/*
Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7) Gecko/20040803 Firefox/0.9.3

Array
(
[browser_name_regex] => ^mozilla/5\.0 (windows; .; windows nt 5\.1; .*rv:.*) gecko/.* firefox/0\.9.*$
[browser_name_pattern] => Mozilla/5.0 (Windows; ?; Windows NT 5.1; *rv:*) Gecko/* Firefox/0.9*
[parent] => Firefox 0.9
[platform] => WinXP
[browser] => Firefox
[version] => 0.9
[majorver] => 0
[minorver] => 9
[cssversion] => 2
[frames] => 1
[iframes] => 1
[tables] => 1
[cookies] => 1
[backgroundsounds] =>
[vbscript] =>
1 => 1
[javaapplets] => 1
[activexcontrols] =>
[cdf] =>
[aol] =>
[beta] => 1
[win16] =>
[crawler] =>
[stripper] =>
[wap] =>
[netclr] =>
)
*/

Le seul inconvénient à l’utilisation de cette fonction est qu’elle nécéssite un fichier browscap.ini à jour, fichier qui n’est bien évidemment pas distribué avec PHP =p

Qu’à cela ne tienne, le site distribuant ce fameux browscap.ini met aussi à disposition une classe émulant le fonctionnement de get_browser(), mais étant capable de télécharger elle-même (pour ensuite mettre en cache) le fichier browscap.ini dont elle a tant besoin. La solution ultime à notre problème est donc toute trouvée, et comble du bonheur elle est téléchargeable sur la page Google Code du projet ! =)

Pour mon dernier site web (coming soon …), j’ai décidé d’étendre mes connaissances en Python au développement web, et plus particulièrement à Django. Je ne m’étenderai pas sur ce choix, ce dernier n’étant fondé que sur des conseils d’utilisateurs de django (ceci dit je ne regrette pas du tout de les avoir écoutés =D).

Parmi les « raccourcis » que met en place django, on retrouve le decorator « login_required » qui permet de restreindre l’accès à une vue aux utilisateurs authentifiés et de rediriger les autres vers la page de connexion. Sur le papier, c’était exactement ce qu’il me fallait. Mais en pratique, j’avais quelques améliorations à apporter =p

En effet, j’utilise dans tout le reste du site une fonction de redirection maison qui fait transiter le visiteur via une page dédiée à l’affichage d’un message explicitant la redirection (ex : « Vous devez être connecté pour voir cette page », « Connexion réussie », etc.). Mon but est donc de retrouver le même comportement avec le decorator de django, comportement qui est d’après mes recherches impossible d’obtenir …

Soit, je vais coder moi-même un decorator répondant à mes besoins

#-*- encoding:utf-8 -*-

from django.shortcuts import render_to_response

def if_logged_in(f, message='Vous devez être connecté pour pouvoir voir cette page.'):
    """ Décorator pour refuser l'accès à une page aux users non connectés """

    def wrap(request, *args, **kwargs):
        if not request.user.is_authenticated():
            return redirection(request, '/connexion/', message)
        return f(request, *args, **kwargs)

    wrap.__doc__ = f.__doc__
    wrap.__name__ = f.__name__

    return wrap

def redirection(request, REDIR_URL, REDIR_MESSAGE='Erreur !', REDIR_TIME=4):
    """
    Fonction permettant de rediriger un user
    les variables locales à la fonction pourront être utilisées dans le template
    """

    return render_to_response('redirection.html', locals())

Pour ce qui est de l’utilisation, elle est identique à celle de n’importe quel decorator, y compris « login_required »
Enjoy !

Généralités

J’utilise toujours les tags longs et en minuscules (<?php … ?>). Vous ne verrez jamais un de mes codes commencer par un short tag (<? …. ?>) ou un tag en majuscules (<?PHP … ?>).
Un fichier définissant une class sera nommé selon le modèle « NomDeLaClass.class.php » en vue de faciliter l’utilisation de la méthode __autoload().
En ce qui concerne l’indentation, 4 espaces me suffisent pour marquer un niveau.

Structures de contrôle

Pour les instructions if, switch, for, while, foreach, etc. je laisse un espace entre le mot clé de l’instruction et la condition. Les accolades occupent à elles seules une ligne.
Si une seule instruction est soumise à condition, j’omets souvent les accolades.
Exemple :

if (condition1 AND condition2)
{
    //action;
    //action;
}

if (condition1 AND condition2)
    //action;

foreach ($tableau as $key => $value)
{
    //action;
    //action;
}

Définitions des fonctions

Comme pour les structures de contrôle, les accolades de la fonctions sont placées sous le nom de la fonction et le code est indenté d’un niveau. Les paramètres sont espacés d’un seul espace, et je spécifie la valeur d’un paramètre optionnel en joignant avec le signe « = » et sans espace la définition du paramètre et sa valeur par défaut.
Exemple :

function somme($var1, $var2=0)
{
    return $var1+$var2;
}

Utilisation des fonctions

Les fonctions sont appelées sans aucun espace entre le nom de la fonction et les parenthèses. Cependant, un espace sépare chaque paramètre.
Si la fonction est retournée dans une variable, on mettra au moins un espace de part et d’autre du signe égal.
Exemple :

$ma_var = ma_fonction($var1, $var2);
fait_quelque_chose();

Règles de nommage

Les noms des variables doivent avoir un sens et ne pas commencer par « _ ». Les mots sont en minuscules et séparés par un underscore, tout comme les fonctions.

Les noms de class sont en CamelCase et doivent aussi (évidemment ? =p) avoir un sens.

Commentaires

Là, j’avoue que c’est un peu freestyle Je commente souvent assez bien les fonctions et méthodes de class, mais le reste du code est assez peu voire pas du tout commenté (honte à moi d’ailleurs).
Exemple de commentaire d’une fonction :

/**
 * Envoi d'un mail au format HTML
 * @param string $dest adresse mail du destinataire
 * @param string $titre sujet du mail
 * @param string $cont contenu du mail
 * @return bool
 */

Voilà, le principal est dit, n’hésitez pas à me poser des questions, à critiquer mes habitudes et aussi à nous expliquer les votres

C’est inutile, mais tellement geek

iHologram – iPhone application from David OReilly on Vimeo.

En effet, j’ai profité de ma période « creuse » du mois de juillet pour corriger quelques bugs sur le moteur, améliorer les performances globales/temps de chargement, et évidemment ajouter quelques nouveaux moteurs de recherches
Ce sont pas moins de 5 sources font leur apparition : BeeMP3, MP3gle, Seeqpod, Songza et Youtube !
On peut donc désormais réellement dire que MP3 Finder est un « multi-moteurs » de recherche :p

Je l’ai dit plus haut, ce qui m’intéressait le plus dans ce site était le défi qu’il représentait. Ayant relevé ce défi, je dois avouer que je me retrouve avec un joli jouet, certe, mais avec lequel je ne jouerai pas. D’où ma décision de mettre en vente le MP3 Finder.
Donc si ce site intéresse quelqu’un, n’hésitez pas à me contacter (par mail ou en laissant un commentaire), je vous dirai tout ce que vous voudrez savoir sur mon site =)

Parmi les nouveautés coté utilisateur (je vous parle même pas des changements dans le code et sa structure ) :

• un nouveau design, libre et créé par Arcsin
• un espace membre
• la possibilité de sauvegarder des chansons ou répertoires que vous aimez (les favoris)
• la possibilité de créer des playlists avec vos chansons favorites
• le partage de favoris
• les nouvelles options de recherche (musique, torrents et archives)

J’ajouterai même que le MP3 Finder compte au moment où j’écris ces quelques lignes pas moins de 34361 recherches totales, pour 2800 (tout pile !) mots-clés différents

Conclusion :: bien que le MP3 Finder soit loin d’être terminé (toujours en version bêta), je suis assez content de moi

P.S : n’hésitez pas à vous inscrire et à me dire ce que vous aimeriez voir ajouté/modifié/enlevé sur le MP3 Finder

En effet, outre le développement de la V2 du MP3 Finder (V2 qui sera d’ailleurs disponible en bêta d’ici quelques jours, voire cet après-midi même :p ), j’ai ressorti de mes cartons ce que j’appelle une « class Packer » =)

Les utilisateurs de Dotclear connaissent le principe, il s’agit d’un unique fichier qui permet l’installation d’un design ou d’une extension, ma class packer servant ici à « réunir » les fichiers et dossiers qui composent le thème dans un même fichier, et à les restituer sous leur forme originelle grâce à de simples commandes.

Pour ce qui est de la simplicité d’utilisation, je vais vous la démontrer =D :


$packer = new packer();
$packer->pack('./js/', 'js_test');
// "./js" étant l'adresse du dossier à "packer"
//et "js_test" le nom du fichier une fois packé
$packer->unpack('js_test.pk', './yop/');
//"js_test.pk" est ici le fichier packé
//et "./yop/" le répertoire dans lequel le pack sera extrait
?>

Comme d’hab, le reste se passe du coté du portfolio

Enjoy ! :jap:

Thème à trois colonnes réalisé par Teresa. Peut-être légèrement féminin, ce thème n’en demeure pas moins très sympa =)

2. Xplosive (démo)

Résolument « Web 2.O », le thème à trois colonnes de Jai ravira les blogueurs les plus exigeants

3. Xplosive Reloaded (démo)

La nouvelle version du thème Reloaded est, comme on pouvait s’y attendre, toujours aussi orientée « Web 2.0″ et couleurs vives (ici, 4 couleurs prédéfinies sont proposées)

4. Vertigo

Disponible en version deux ou trois colonnes, ce thème sobre et professionnel se personnalise facilement, et accepte les widgets nativement

5. Vertigo Electrified

Déclinaison « électrifiée » du thème Vertigo. Disponible aussi bien en version deux colonnes que trois colonnes.

6. Light (démo)

Comme l’annonce son nom, ce thème est sobre et léger, alors mangez-en ! =D

7. Indigo (démo)

Designé par Arcsin, ce thème  deux colonnes est simple, propre, agréable à utiliser, et il est « widget-ready ». Mais que demander de plus ? ^^

8. Andharra

Minimaliste et agréable à utiliser, ce thème de Nofie Iman privilégie largement le contenu du blog.

9. Several3 (démo)

La couleur du header prédestinera sûrement ce design aux blogs féminins, mais je trouve ce design très réussi graphiquement et ergonomiquement =)

10. Sexy Back (démo)

Le très joli header de ce thème feront certainement tomber tous les hommes normalement conçus à la renverse

11. Elixir

Que se soit pas sa disposition (sidebar à gauche et colonne principale relativement étroite), ou par ses couleurs assez flashy, ce thème se démarque par son originalité

12. Fluid Yellow Black (démo)

Thème sobre, passe-partout, alliant parfaitement le jaune et le noir afin de faire ressortir le titre du blog et les éléments de navigation

13. dfMarine (démo)

Typiquement « web 2.0″, ce design associe un header graphiquement travaillé avec une sidebar simple et sobre pour une efficacité optimale, et surtout pour le plaisir des yeux ! mdr:

14. Jstheme – PolarLight

Avec ce dernier thème, je vais vous surprendre (ou pas d’ailleurs :p ), puisque j’ai encore choisi un thème assez flashy, 2.0 à souhait, et multi-couleurs (comprendre que vous pouvez choisir celle qui vous plait le plus :p ). Notez que ce thème existe en version fixe (la largeur du thème est prédéfinie), ou en version large (la largeur s’adapte à la taille de l’écran)

Enjoy ! :jap:

Introduction

En effet, AIR permet aux développeurs qui, comme moi, n’ont pas beaucoup de connaissances dans la programmation « logicielle » de pouvoir construire des applications de bureau grâce à des langages qu’ils maîtrisent : HTML/CSS, Javascript, Flash/Flex/ActionScript, etc…
De plus, une fois votre programme compilé, l’exécutable obtenu tournera sans problème sur n’importe quel OS, la seule condition étant, évidemment, d’avoir installé AIR ainsi que son SDK (si vous comptez compiler vos programmes =p ).

Installation

Pour installer AIR lui-même, rien de plus simple. Il suffit de vous rendre sur cette page du site d’Adobe, et de télécharger la version qui correspond à votre système (officiellement, seules les versions Windows et Mac sont disponibles, la version Linux étant encore une version Alpha).

En ce qui concerne le SDK, élément indispensable au développement d’applications AIR puisqu’il s’occupe de la compilation de ces derniers, les choses sont un poil plus laborieuses …
Je ne détaillerai ici que l’installation du SDK sous Windows, n’ayant pas testé la version Linux (encore en Alpha), et ne possédant pas de Mac =p

Tout d’abord, commençons par télécharger le SDK, puis par dé-zipper le fichier ainsi obtenu.
Remarque : je vous conseille fortement de placer le contenu de cette archive dans un dossier « AIR«  (par exemple), et se trouvant à la racine de votre disque dur principal (il porte le plus souvent la lettre « C« ). En effet, nous serons très bientôt amené à configurer la variable d’environnement Path, variable qui représente l’adresse de de votre SDK =)

Passons maintenant à la configuration de cette fameuse variable d’environnement. Pour ce faire, il suffit de cliquer-droit sur « Poste de travail« , d’aller dans l’onglet « Avancé« , et de cliquer sur le bouton « Variables d’environnement » en bas de la fenêtre.
Dans la liste des variables d’environnement, trouvez la variable « Path« , et cliquez sur « Modifier« .
Afin d’ajouter l’adresse du répertoire « bin«  du SDK, il vous faut placer votre curseur à la fin du champ « Valeur de la variable« , d’entrer un point-virgule, ainsi que le chemin complet vers le répertoire « bin » (dans mon cas : « C:\AIR\bin\« ). Pour que les changements soient pris en compte par Windows, vous devez redémarrer votre PC.

Et maintenant, le moment de vérité, celui de la vérification du bon déroulement de l’installation :p Pour ceci, ouvrez un terminal MS-DOS ( « Exécuter … » -> « cmd » ), puis entrez la commande « adl« .
Si le terminal vous insulte ou vous dit que la commande n’est pas reconnue, bon courage, il ne vous reste plus qu’à relire ce tuto car vous avez sûrement dû faire une bourde quelque part
Dans la cas contraire, vous serez impatient de lire le prochain billet traitant de AIR et d’y apprendre comment coder un programme (vous aurez même droit à un programme d’exemple : un client Twitter )

Enjoy !