Molokoloco – Work Wild Web @ b2bWeb.fr

Posts Tagged ‘Molokoloco’

Orthographe, France et culture…

In Molokoloco | 13 Jul 2012 | Laisser un commentaire

Un de mes amis sur Facebook :

Fautes d’orthographe, de syntaxe, de style, d’inattention, erreurs de conjugaison, fautes de frappe, clavier anglais sans accentuation, indolence ou paresse intellectuelle, mésemploi de logiciels de correction ou inemploi de dictionnaires, de synonymes ou bien la mémoire qui flanche, je ne sais plus très bien…

Il avait été mentionné que l’écriture était la science des ânes. Ceci précéda : “l’orthographe est la science des ânes”. Ce à quoi Napoléon aurait ajouté : “Je ne parle pas aux cons, ça les instruit” remarquablement repris par Coluche. Nous sommes, nous-mêmes, pour la défense de la langue française et à l’instar de Jean Guéhenno, nous dirions que : “l’orthographe est la politesse de la langue”.

Ma Mes réponses :

Julien Guézennec Lol je suis si null en orthographe… et pourtant je parle plusieurs (un S a plusierus ?) langues… Espagnol, Anglais, HTML, JavaScript, AS3, Shell, et j’en passe… Tu veux jouer au plus fort avec l’orthographe ? Moi je te prends sur l’ingénierie, les maths, la mécanique… etc, c’est mes armes de nature.. mais pitié ! Les gens qui defoncent un bon texte car il il y une faute d’accord, un je ne sais plus de pas composé ! Et bien ca m’enerve. La forme oui le fond encore plus. L’orthographe c’est à faire de son mieux, c’est ce que je fais… mais ne me traite surtout pas de con si je n’ai pas la moyenne à la dictée de Pivot… please…. :)

Julien Guézennec C’est d’ailleurs peut être pas un hasard si aucun correcteur d’orthographe ne fonctionne bien… On n’arrive pas à computer cette connerie !! Cf le site http://bonpatron.com/ un des meilleurs correcteur… tu y mets un de mes textes.. il reste 300 fautes… (j’ai des textes sur mon blog si tu cherche(s?) ;)

« BonPatron » correcteur d’orthographe et de grammaire en ligne pour les textes français

« BonPatron » est un correcteur de grammaire qui trouve des fautes d’orthographe et de grammaire en français.

Julien Guézennec Tiens un film énorme sur les lettres silencieuses.. http://www.theverge.com/2012/7/1/3129227/silenc-project-silent-letters

‘Silenc’ project exposes the silent letters we never really say

www.theverge.com

The Roman alphabet is an unwieldy vessel for the multitude of sounds in many Wes..

Julien Guézennec Bon allé, dernier acharnement.. mais là ca me fait plus tripper que la grammaire ^^ une typo évolutive ->http://colloquy-type.com/ #typographie

Colloquy – affective type
colloquy-type.com

Tags : Code, Fail, French, Hacker, Molokoloco, Social

Paris JS 13 – Readr.js (So cute ! I’ve made a talk)

In Molokoloco | 7 Dec 2011 | Laisser un commentaire

Merci à @bobylito qui vient de mettre les vidéos (du live) en ligne sur Dailymotion.

On trouve entre autre ma présentation sur readr.js . Mais aussi plein de super autres sujets (http://www.dailymotion.com/ParisJS #ParisJS)

Ça fait drôle de se voir en vidéo, et ça fait drôle de parler devant beaucoup de gens avec plein de lumière dans les yeux :)

ReadR.JS by Julien Guézennec (@molokoloco) – ParisJS 13

Tags : HTML5, Interface, JavaScript, jQuery, Molokoloco, Multimedia, Open Source, UI, WebApp

Emitter Sprites/Particules factory with jQuery & CSS3

In Coding Projects,Molokoloco | 23 Oct 2011 | Laisser un commentaire

[UPDATE : Projet en cours de refonte ici : https://github.com/molokoloco/jQuery.boxFx]

J’ai voulu tester ce que pouvais donner un émetteur de particule en DOM jQuery/CSS (Sans canvas)…

C’est un plugin léger et hyper-customisable, son principe et de (re)générer, X fois par secondes, un élément HTML, de lui appliquer des propriétés CSS3 (de départ), de l’insérer dans le DOM.

Le plugin applique quasi immédiatement les propriétés CSS de fin, et, au bout d’un certain temps, recycle l’élément : L’animation n’est pas faite avec jQuery $.animate() mais grâce aux propriétés CSS3 de transition, afin de bénéficier de l’accélération matériel (GPU)

Live Demo V0.7 : http://jsfiddle.net/molokoloco/aqfsC/
Plain demo : http://www.b2bweb.fr/framework/jquery.emitter/jquery.emitter.html
Github repository : https://github.com/molokoloco/jquery.emitter
Cloud9ide editor : http://cloud9ide.com/molokoloco/jquery_emitter

En arrière plan, le plugin contient quelques méthodes qui permettent aux propriétés “cssFrom” et “cssTo” de supporter automatiquement l’ajout du “browser prefix” :

Fix and apply styles on element with correct browsers prefix
$(e).crossCss({borderRadius:’10px’}) >>> $(e).css({WebkitBorderRadius:’10px’})
Use Modernizer : https://github.com/Modernizr/Modernizr/blob/master/modernizr.js
Modernizr.prefixed(“borderRadius”); // e.g FF3.6 ‘MozBorderRadius’, FF4 ‘borderRadius’

$.fn.crossCss = function(css) {
	return this.each(function() {
		var $this = $(this);
		if (typeof css != 'object') return $this;
		for (var p in css)
			if (Modernizr.prefixed(p))
				css[Modernizr.prefixed(p)] = css[p];
		return $this.css(css);
	 });
};

Support cross-browser : Transition, borderRadius, borderImage, maskImage, Transform, boxShadow, etc

Le plugin écoute (bind) plusieurs événement via des méthodes publiques : start, stop, update, …
Exemple d’utilisation :

// Permet de mettre à jour, depuis n'importe quelle fonction, une ou des propriétés de l'émetteur
$emitter1.trigger('update', [{emitterRadius:16, rate:0}]);

Il envois (trigger) un évènement à chaque emission de particule (Cf. source) :

// Ecouter si un nouveau sprite à été émis
$emitter1.bind('emit', function(e, $sprite) { 
    $sprite.html('Ok'); // On modifie en live le contenu
});

Si la valeur “options.rate” est mise à Zéro, le plugin utilise la fonction “requestAnimationFrame()”, à la place de “setTimeout()”, afin de maximiser les performance.

Pour le moment il fait des bulles dans l’espace… mais on peu tout imaginer, des tweets, une cascade verticale, des images, beaucoup beaucoup de possibilités… de la synchro audio/vidéo,… Par exemple tapez une lettre entre les deux balises “<div></div>”
C’est pour cela que le code est ouvert sur Github ! :)

J’ai fais ce que j’ai pu pour chasser les bugs, mais il doit bien en rester ^^, vos commentaires sont les bienvenus…

PS : Cette ancienne démo est rigolote aussi :
http://jsfiddle.net/molokoloco/wRS8A/

Tags : Code, CSS3, Framework, HTML5, JavaScript, jQuery, Molokoloco, Plugin

Blobby Particules Factory with jQuery & CSS3 V0.1

In Coding Projects,Molokoloco | 13 Oct 2011 | Laisser un commentaire

@paulrouget à lancé un défis a @GeoffreyDorne pour refaire la bannière de son blog :
https://twitter.com/#!/paulrouget/status/123672623761719296

J’ai voulu tester ce que pouvais donner un émetteur de particule en DOM jQuery/CSS plutot qu’en canvas, histoire de comparer les performances…

C’est un plugin très customisable avec un principe d’emitter de particules contenu dans une div.
L’animation n’est pas faite avec $.animate() mais grâce aux propriétés CSS3 de transition, ce qui permet de bénéficier de l’accélération matériel (GPU)

La petite démo est ici (V0.1) : http://jsfiddle.net/molokoloco/KASGN/
La grosse démo est ici (V0.3) : http://jsfiddle.net/molokoloco/NGm4M/

[Update ! New code here http://www.b2bweb.fr/molokoloco/emitter-sprites-particules-factory-with-jquery-css3/]

Tags : CSS3, HTML5, jQuery, Molokoloco

Pixels polished jQuery & CSS3 analogue clock

In Coding Projects,Molokoloco | 8 Oct 2011 | Laisser un commentaire

Je voulais partager mon nouveau plugin jQuery d’horloge analogique. C’est un script léger, sans image, et uniquement basé sur CSS3 et jQuery.
J’ai essayé d’écrire un code compatible sur les différents navigateurs et c’est commenté… Merci à cet article “quick-look-math-animations-javascript” et d’autres, pour l’inspiration…

La petite démo est ici : http://jsfiddle.net/molokoloco/ajcRz/

La grosse démo (V2) est ici : http://jsfiddle.net/molokoloco/V2rFN/ [Edited]

—

I want to share my new jQuery analogue clock plug-in.
This is à lightweight code, with no images, and only powered with jQuery and CSS3.
I’ve intended to write a annotated cross-browser -past and futur-proof CSS3 code and a simple as possible jQuery extend… Thank to this article “quick-look-math-animations-javascript” and others, for the inspiration…

You can watch the demo here : http://jsfiddle.net/molokoloco/ajcRz/

Demo V2 : http://jsfiddle.net/molokoloco/V2rFN/ [Edited]

GitHub sources :

Tags : CSS3, Framework, HTML5, jQuery, Molokoloco, Plugin

My Book ReadR V1.12 – HTML5 / jQuery polished “Page as a Book” reader

In Coding Projects,Molokoloco | 29 Aug 2011 | Laisser un commentaire

[UPDATE 30/11/11 - Présentation en ligne : http://www.b2bweb.fr/bonus/my-book-readr/]

J’ai passé pas mal de temps pour réécrire complétement le code du lecteur de livre en ligne que j’avais publié avant les vacances.

My Book Readr, c’est un code source ouvert qui peut permettre à tout à chacun de publier un long texte sur Internet via une page dédiée à la lecture en ligne.

Voici donc un code tout frais, inspiré des recommendations officielles de la team jQuery.

Je ne suis pas parti dans un code purement orienté object, mais dans un concept qui me parait beaucoup plus souple, et adapté à une forte customisation de tous les paramètres.

Le mieux que vous puissiez faire, c’est jeter un coup d’oeuil sur le fichier JavaScript principal (Cf. lien plus bas…)

Au menu de cette V1.12 :

Mise en page simple, claire et typographique, compatible HTML5
Création d’un sommaire automatique, à partir des balises de titres (Ex. <H4>) du texte
Le texte est redimensionnale en largeur (Poignée à droite dans la marge) et en taille de police (CSS basé sur les .em)
Gestion du défilement vertical de la page, pour ne pas se perdre dans le texte
- Un indicateur sur le paragraphe en cours de lecture pour stabiliser visuellement le défilement vertical (Repère)
- Assouplissement du défillement par défaut de la molette, comportement progressif suivant la vitesse
- Le défilement des chapitres est indiqué dans le sommaire, fixe à l’écran
- Vignettes dynamiques indiquant le nombre “d’écrans” de la page (Nombre variant suivant l’affichage) et la position verticale actuelle
- Le fond de page est cliquable et peut glisser de haut en bas
- Flèches Haut/Bas pour défiler de page en page : Flèches Droite/Gauche pour défiler doucement
- Fonction de lecture automatique (La touche “Entrée” active un défilement vertical continu réglable)
Commentaires dynamiques
- Chaque paragraphe accueil un mini-forum Disqus. API gratuite, qui accepte plusieurs type d’identification (Open ID, Facebook, Google, Twitter, Disqus, etc))
- Possiblité de commenter le texte en utilisant les petites bulles sur la gauche
- Sélection du texte pour annoter, copier ou éditer
Edition WYSIWYG et HTML du texte, avec téléchargement d’une sauvegarde possible
Création de notes à partir d’extraits de texte et sauvegarde au format .txt
Défaut : Testé uniquement sous Firefox 6 et Chrome 14… (mais avec un code normalement générique !)

Utilisation du clavier

“Espace” ou “Entrée” : Lecture automatique
- Touches 1,2,3,…,9 pour régler la vitesse (5, valeur par défaut)
Flèches “Haut” et “Bas” : Défilement de la page
- Flèches “Gauche” et “Droite” : Défilement doux
“+” et “-” ~~ou “Ctrl” + “Molette de la souris“~~ : Ajustement de la taille du texte
… et “F11” pour le plein écran !

Exemple de code, créé pour l’application…

My Book ReadR V1.12 – Polished HTML5/CSS3 and jQuery powered “read-a-book” page

This start from the idea to design a page specially engineered to read a long book on the web…

Demo : http://www.b2bweb.fr/bonus/piratons-la-democratie.html
Infos : http://www.b2bweb.fr/molokoloco/my-book-readr-v1-12-html5-jquery-polished-page-as-a-book-reader/
Main Script : https://github.com/molokoloco/My-Book-ReadR/blob/master/js/jquery.readr.js
GIT Sources : https://github.com/molokoloco/My-Book-ReadR/

RESSOURCES :

BoilerPlate HTML5 starter pack : https://github.com/paulirish/html5-boilerplate
TinyMCE, JS WYSIWYG HTML editor (jQuery version) : http://tinymce.moxiecode.com
jQuery Waypoints v1.1 : https://github.com/imakewebthings/jquery-waypoints/
jQuery Mousewheel : http://adomas.org/javascript-mouse-wheel/
Copy to clipboard with ZeroClipboard.swf : http://www.steamdev.com/zclip/
DISCUS comment system API : http://docs.disqus.com/developers/universal/
Google Plus API : https://code.google.com/intl/fr/apis/+1button/
Twitter API : https://twitter.com/about/resources/tweetbutton
Facebook API : https://developers.facebook.com/docs/reference/plugins/like/
Use Google Fonts API : http://www.google.com/webfonts/v2

[Appel] Ce projet manque de contributeurs sur GitHub !!!

Il reste quelques pétouilles à corriger (évidemment… ;), deux ou trois TODOs dans les commentaires, et surtout, prendre un peu de temps pour le faire tourner sur les i-machins et autres Droids…

Tags : Code, HTML5, jQuery, Media, Molokoloco, Multimedia, Open Source, Tool, WebApp

Mix progressive électro ~Braincer~ (V6)

In Molokoloco | 14 Aug 2011 | Laisser un commentaire

Allé… je fais péter mon mix !!! Cadeau ;)

“Le mix tu peux pas l’ecouter en entier !!!” – Les Inrocks
“Pas vu a la radio, pas entendu a la télé, et pas en torrent non plus !” – Radio Nova
“C’est pas tombé dans l’oreille d’un sourd…” – Psychologie magazine
“Le mix avec un moteur dedans” – Michael Schumacher
NON ! OUI !
“Explicit arpège inside !!!” – Traxx
“Oh putain, t’as cassé les woofers !!!” – Tunning Mag
“Un mauvais DJ une bonne sélection” – Molokoloco
“Désolé, j’ai taché mon slip” – Rocco
“La musique rend sourd !!!” – Bernard kouchner
“Une tuerie” – Bowline for Colombia
“Breaking news : Dead can dance” – Reuters
“T’es trop à donf, tu bouges plus !” – Coda

Merci de régler le volume de manière satisfaisante. Oui merci.
Already pimped : Reset your equalizer and pump the volume !

PS : Le premier qui l’écoute en entier gagne un paquebot

Molokoloco Selecta – Progressive Electro – (#1) ~Braincer~

PLAYLIST :

Fuck friend – Brodinski
Maximum Joy – Shinichi Osawa
Think different – Agoria
Kickin Flowers – DjoZE
Disco Decay – Neelix
Xtatic Truth – Chrystal Fighters
& Down – Boys Noize
E Talking – Soulwax
Poison Lips – Vitalic
Escape velocity – The Chemical Brothers
Midnight Swim – Surkin Para One remix
Stereolove – Agoria feat. Villeneuve
Electro chox part 2 – Antoine Clamaran
Idealistic – Digitalism
Dare – Soulwax Gorillaz remix
Confesssion – Klaas
Discordance – Paraiba
Krack – Soulwax
One night in NYC – The Horrorist
The parachute ending – Birdy Nam Nam
Flashmob – Vitalic

Rock Star – Pro7 Frederic de Carvalho remix
The like mix – Sovnger
Emerge – Junkie XL Fisherspooner remix
Take a walk – Bolz Bolz
Compute – Soulwax
Satisfaction – Benny Benassi
Sweet light – Boys Noize
Prime time of your life – Daft Punk
Lovelight – Soulwax Robbie Riviera remix
Fucking mix party – Dj Thibaut
Move my body – Tiga
4 AM in Miami – Donald Glaude & Dj Exodus
Murder was the bass – DK8
Hanukkah – Etienne de Crécy
Hoax – Kring
Revolution 909 – Roger Daft Punk remix
Music is awesome – Housemeister
Sommer – Housemeister
Pulpalicious – Sovnger in love remix
…

http://soundcloud.com/molokoloco/1-braincer-1

Tags : Molokoloco, Music, Remix

My Book ReadR V0.91

In Molokoloco | 14 Jul 2011 | Laisser un commentaire

[EDIT] New release here – Stay tuned !

I come again, this time with a jQuery “polished” HTML5 “page-as-a-book”

Paul Da Silva a écrit un livre « Piratons la démocratie », hélas distribué au format PDF. Il était difficile à lire à l’écran… J’ai donc récupéré le texte pour le mettre dans une page HTML(5!)…

Et voila !

Features :

Mise en page simple claire et typographique, compatible HTML5
Création d’un sommaire automatique, à partir des balises <H4> du texte
- Le défilement des chapitres est indiqué dans le sommaire fixe
Gestion du défilement vertical de la page, pour ne pas se perdre dans le texte
- Barre d’espace pour défiler de page en page (et les flèches Haut/Bas)
- Flèches Droite/Gauche pour Agrandir/Reduire le texte
- Un indicateur visuel sur l’article en cours de lecture pour stabiliser le défilement vertical
- Assouplissement du scrolling par défaut de la “mousewheel“
Chaque paragraphe est linkés avec un forum via l’API DISQUS, ce qui permet d’annoter le texte (API gratuite, qui accepte plusieurs type d’identification (Open ID, Facebook, Google, Twitter, Disqus, etc))
Défaut : codé en une nuit, uniquement testé Firefox 4 et Chrome 12 ;)

Demo : http://www.b2bweb.fr/bonus/piratons-la-democratie.html

GIT Sources : https://github.com/molokoloco/My-Book-ReadR

Tags : HTML5, jQuery, Molokoloco, Open Source, Politics

Molokoloco Coding Project

In Coding Projects,Molokoloco | 13 Jul 2011 | Laisser un commentaire

Fork me on GitHub

Blog code entry
My feed on b2bweb.fr/coding-project/

Keep updated with the RSS feed

Public Repositories
My code on GitHub/molokoloco

FastWebStart Une page de démarrage rapide et pratique !
FRAMEWORK Sharing some code…
And more…

Personnal codingsheets
My wiki on “Molokoloco Coding Project“

! New source code is now hosted on Github !

What you can find on my WIKI !

JS/php Class & Fonctions

PHP/js Class and Fonctions

Mixed LAMPX TIPS

Others Services Tips

And also my Virtual Admin PHP4/JS Prototype Framework, for managing CMS (2005~2008)

Julien Guézennec 2011 | molokoloco@gmail.com | http://www.b2bweb.fr …. Work definitely in progress…

Tags : Code, Framework, Interactive, Internet, JavaScript, jQuery, Molokoloco, PHP, Prototype, WebApp, WebSite

HTML5 3D effect caroussel presentation

In Coding Projects,Molokoloco | 11 Jul 2011 | 1 commentaire !

So i finally come with some polish for the RoundAbout script…

I’ve made a sort of jQuery presentation slider with it.

jQuery Presentation SlidR V1.2

Fluid HTML5 3D carousel effect slider for presentation
One page HTML setup with a simple ul > li list
Screen adaptative and layout polish, User zoom extended
Rocking fast in Chrome, do the job in Firefox

Sample code mixed by molokoloco – 2011

Demo : http://www.b2bweb.fr/bonus/jx/
Infos : http://www.b2bweb.fr/molokoloco/javascript-from-1998-to-2011/
Main Script : https://github.com/molokoloco/FRAMEWORK/blob/master/jx/js/index.js
GIT Sources : https://github.com/molokoloco/FRAMEWORK/blob/master/jx/

RESSOURCES :

Based on : RoundAbout for jQuery V1.1 http://fredhq.com/projects/roundabout/
Mixed with : jQuery 2d transform (animate) http://www.binpress.com/app/jquery-2d-transform/145 (Donate if you plan to use)
Use Google Fonts API : http://www.google.com/webfonts/v2
Goole Plus API : https://code.google.com/intl/fr/apis/+1button/
Twitter API : https://twitter.com/about/resources/tweetbutton
Facebook API : https://developers.facebook.com/docs/reference/plugins/like/

I will try too improve again the script in the coming days…

Tags : HTML5, JavaScript, jQuery, Molokoloco, Open Source, parisJS

3 pages

Posts Tagged ‘Molokoloco’

Paris JS 13 – Readr.js (So cute ! I’ve made a talk)

Emitter Sprites/Particules factory with jQuery & CSS3

Blobby Particules Factory with jQuery & CSS3 V0.1

Pixels polished jQuery & CSS3 analogue clock

My Book ReadR V1.12 – HTML5 / jQuery polished “Page as a Book” reader

Au menu de cette V1.12 :

Utilisation du clavier

RESSOURCES :

Mix progressive électro ~Braincer~ (V6)

PLAYLIST :

My Book ReadR V0.91

[EDIT] New release here – Stay tuned !

Features :

Molokoloco Coding Project

Blog code entry
My feed on b2bweb.fr/coding-project/

Public Repositories
My code on GitHub/molokoloco

Personnal codingsheets
My wiki on “Molokoloco Coding Project“

What you can find on my WIKI !

JS/php Class & Fonctions

PHP/js Class and Fonctions

Mixed LAMPX TIPS

Others Services Tips

HTML5 3D effect caroussel presentation

My recents posts

Home made artworks

Tags

Code tooltips updates

Github sources activities

Molokoloco's JS fiddles

Recent Comments

Posts Tagged ‘Molokoloco’

Au menu de cette V1.12 :

Utilisation du clavier

RESSOURCES :

PLAYLIST :

Features :

Blog code entry My feed on b2bweb.fr/coding-project/

Public Repositories My code on GitHub/molokoloco

Personnal codingsheets My wiki on “Molokoloco Coding Project“

What you can find on my WIKI !

JS/php Class & Fonctions

PHP/js Class and Fonctions

Mixed LAMPX TIPS

Others Services Tips

Home made artworks

Recent Comments

Blog code entry
My feed on b2bweb.fr/coding-project/

Public Repositories
My code on GitHub/molokoloco

Personnal codingsheets
My wiki on “Molokoloco Coding Project“