NICOpenSource (archive) - Tag - développementUn blog pour parler de moi, de l'actualité, du logiciel libre et de tout ce qui peut bien me passer par la tête. Des pages pour présenter mes créations : des extensions pour Firefox comme Page Hacker et IE NetRenderer et des sites Web, entre autres.2017-05-08T16:51:52+02:00Nicolas Turcoturn:md5:edcb69ffc54e06bfa1d2bf41a991a557DotclearPage Hacker 2.0α2urn:md5:ebc36002e8238efb84a24bf0ba72da132008-09-13T11:56:00+02:002011-06-22T22:03:01+02:00NicolasLogiciel libredéveloppementenglishextensionfirefoxpage hackerà tester <blockquote><p><em>Suivez les nouveautés de Page Hacker avec le tag <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a>.</em><br />
<em>For latest news from Page Hacker, watch for articles with <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a> or <a href="http://nicopensource.free.fr/index.php?tag/english">english</a> tag!</em></p></blockquote>
<p>Une grosse bêtise (merci Dsiliumpu et <a href="http://www.geckozone.org/forum/viewtopic.php?t=58207">bormat</a> de m'avoir averti) rendant l'<a href="http://nicopensource.free.fr/index.php?post/2008/08/24/Page-Hacker-201">alpha1</a> inutilisable a été corrigée, les 10 traductions mises à jour ajoutées par l'occasion (désormais inclu : en-US, en-GB, ru-RU, ja-JP, hu-HU, fr-FR, es-ES, cs-CZ, zh-CN, nl-NL, pl-PL, pt-PT, ar* - * : partiel).</p>
<p><a href="http://nicopensource.free.fr/pages/pagehacker.php#nav-dev">Installer Page Hacker 2.0α2</a> (clic-droit > <code>Enregistrer la cible sous</code> pour télécharger)</p>
<p><em>A small error making <a href="http://nicopensource.free.fr/index.php?post/2008/08/24/Page-Hacker-202">alpha1</a> unusable has been fixed (thanks Dsiliumpu and bormat for alerting me) and 10 updated translations have been added (now included: en-US, en-GB, ru-RU, ja-JP, hu-HU, fr-FR, es-ES, cs-CZ, zh-CN, nl-NL, pl-PL, pt-PT, ar* - *: partial).</em></p>
<p><em><a href="http://nicopensource.free.fr/pages/pagehacker-en.php#nav-dev">Download Page Hacker 2.0α2</a> (right-click > <code>Save link as</code> to download)</em></p>Page Hacker 2.0α1urn:md5:57d816a879d11c2028d0242438b65ac62008-08-24T21:33:00+02:002011-06-22T22:02:36+02:00NicolasLogiciel libredéveloppementenglishextensionfirefoxpage hackerà tester <blockquote><p><em>Également disponible <a href="http://nicopensource.free.fr/index.php?post/2008/08/24/Page-Hacker-201">en français</a>.</em></p></blockquote>
<blockquote><p><em>For latest news from Page Hacker, watch for articles with <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a> or <a href="http://nicopensource.free.fr/index.php?tag/english">english</a> tag!</em></p></blockquote>
<p>Page Hacker now comes with a formatting toolbar appearing in "edition mode". It enables you to play with bold, font sizes, colors, links, images and much more!</p>
<p><a href="http://nicopensource.free.fr/index.php?post/2008/08/24/Page-Hacker-202#" title="Formatting toolbar screenshot"><img src="http://nicopensource.free.fr/dotclear/public/pagehacker/.pagehacker-barre_m.jpg" alt="Capture de la barre de mise en forme" style="display:block; margin:0 auto;" /></a></p>
<p>But more functionalities sounds like more potential problems. That's why I release today an alpha1 of version 2.0. It only includes English (en-US & en-GB) and French, and some small bugs (for free!):</p>
<ul>
<li>"Save As" button isn't fully working (if you can help me, have a look at <a href="http://forums.mozillazine.org/viewtopic.php?f=19&t=813085" hreflang="en">this MozillaZine forum topic</a>), I hope it'll enable to toggle "edition mode" and save page with changes soon. A workaround: quit "edition mode" and use <code>Ctrl+S</code> or <code>File</code> > <code>Save As</code>.</li>
<li>There is a lot of buttons on the toolbar, and they may not be all visible with small screens. Though you can do a right-click on the toolbar and <code>Customize</code>, I hope I'll find something more practical.</li>
<li>That's it! Please report any other bug you may notice!</li>
</ul>
<p><a href="http://nicopensource.free.fr/pages/pagehacker-en.php#nav-dev">Install Page Hacker 2.0α1</a></p>Page Hacker 2.0α1urn:md5:14265582c89d68ad5dc46de03d8a2d932008-08-24T21:33:00+02:002011-06-22T22:02:22+02:00NicolasLogiciel libredéveloppementextensionfirefoxpage hackerà tester <blockquote><p><em>Also available <a href="http://nicopensource.free.fr/index.php?post/2008/08/24/Page-Hacker-202">in English</a>.</em></p></blockquote>
<blockquote><p><em>Suivez les nouveautés de Page Hacker avec le tag <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a>.</em></p></blockquote>
<p>Page Hacker est maintenant équipé d'une barre d'outils apparaissant automatiquement en mode d'édition. Elle permet de mettre en forme le texte, de jouer avec les couleurs, d'insérer des images, des liens… de quoi aller beaucoup plus loin qu'avec la première version !</p>
<p><a href="http://nicopensource.free.fr/index.php?post/2008/08/24/Page-Hacker-201#" title="Capture de la barre de mise en forme"><img src="http://nicopensource.free.fr/dotclear/public/pagehacker/.pagehacker-barre_m.jpg" alt="Capture de la barre de mise en forme" style="display:block; margin:0 auto;" /></a></p>
<p>Mais qui dit plus de fonctionnalités dit aussi plus de problèmes potentiels. Je met donc à disposition une alpha1 de la version 2.0. Elle ne contient que l'anglais (en-US et en-GB) et le français (fr-FR), et quelques petits bugs en prime :</p>
<ul>
<li>Le bouton pour enregistrer la page n'est pas entièrement fonctionnel (si vous pouvez m'aider, jetez un coup d'oeil à <a href="http://forums.mozillazine.org/viewtopic.php?f=19&t=813085" hreflang="en">ce sujet du forum MozillaZine</a>), à terme il devrait permettre d'enregistrer la page avec ses modifications. Vous pouvez pour l'instant quitter le "mode d'édition" et passer par <code>Ctrl+S</code> ou <code>Ficher</code> > <code>Enregistrer sous</code>.</li>
<li>La barre comporte de nombreux boutons et risque d'être coupée sur de petits écrans. On peut certes en enlever ou en déplacer par un clic-droit dessus > <code>Personnaliser</code>, mais je cherche un système plus pratique.</li>
<li>C'est tout ce que j'ai repéré. N'hésitez pas à me signaler tout problème que vous rencontreriez !</li>
</ul>
<p><a href="http://nicopensource.free.fr/pages/pagehacker.php#nav-dev">Installer Page Hacker 2.0α1</a></p>Page Hacker 2.0 en préparationurn:md5:be39411281f8bb0e20a143691f83cb5e2008-08-17T22:26:00+02:002009-04-20T12:04:59+02:00NicolasLogiciel libredéveloppementextensionfirefoxpage hacker <blockquote><p><em>Suivez les nouveautés de Page Hacker avec le tag <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a>.</em></p></blockquote>
<p>Si le principe d'<a href="https://addons.mozilla.org/fr/firefox/addon/6455" hreflang="fr">IE NetRenderer</a> ne permet pas d'ajouter grand chose à cette extension, <a href="http://nicopensource.free.fr/index.php?static/Page-Hacker">Page Hacker</a> a vocation à évoluer perpétuellement.</p>
<p>Je prépare donc actuellement la prochaine version (probablement une "2.0") qui devrait apporter au moins une barre d'outils permettant de mettre en forme le texte, d'ajouter des images, des liens... en gros, ce qu'un logiciel de <a href="http://fr.openoffice.org/" hreflang="fr">traitement de texte</a> permet. Il s'agira donc là d'un grand pas en avant quant à l'intérêt de l'extension.</p>
<p>Il y a encore un peu de boulot, mais j'espère que cette version sera disponible d'ici un ou deux mois (selon les arrivages de traductions également). <img src="/dotclear/themes/nicoNew/smilies/smile.png" alt=":-)" class="smiley" /></p>Page Hacker 1.0 est arrivé !urn:md5:9acc0f4aab2e59b8c5da068587f61e732008-06-03T23:00:00+02:002008-08-26T22:26:53+02:00NicolasLogiciel libredéveloppementextensionfirefoxpage hacker <blockquote><p><em>Suivez les nouveautés de Page Hacker avec le tag <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a>.</em></p></blockquote>
<p>Et voici la version 1.0 de mon extension Page Hacker pour <a href="http://www.getfirefox.com">Firefox</a>.</p>
<p>Le principe : un bouton à ajouter à la barre d'outils, permettant en un clic d'éditer la page consultée comme si vous utilisiez un <a href="http://fr.openoffice.org/" hreflang="fr">traitement de texte</a> ou <a href="http://www.kompozer.net/" hreflang="en">éditeur WYSIWYG de pages Web</a>. Vous pouvez aussi passer par un raccourci clavier : <code>Ctrl+F2</code>.</p>
<p>La nouveauté (en plus de la disparition des bugs recensés liés à la précédente méthode d'édition) est qu'un deuxième clic sur le bouton permet de quitter le mode d'édition tout en conservant vos modifications.</p>
<p>Installer et testez la version 1.0, disponible dans le bac à sable de Mozilla Add-ons : <a href="https://addons.mozilla.org/firefox/addon/5753">https://addons.mozilla.org/firefox/addon/5753</a> !</p>
<p>Et enfin un grand merci à martin (<a href="http://joliclic.free.fr/" hreflang="fr">joliclic.free.fr</a>) pour sa précieuse aide de Javascripteur. <img src="/dotclear/themes/nicoNew/smilies/wink.png" alt=";)" class="smiley" /></p>Page Hacker 1.0 is now available!urn:md5:2d1cdf87bb5c987ad025220bf742d5ad2008-06-03T23:00:00+02:002008-08-26T22:06:26+02:00NicolasLogiciel libredéveloppementenglishextensionfirefoxpage hacker <blockquote><p><em>For latest news from Page Hacker, watch for articles with <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a> or <a href="http://nicopensource.free.fr/index.php?tag/english">english</a> tag!</em></p></blockquote>
<p>Version 1.0 of my <a href="http://www.getfirefox.com">Firefox</a> extension Page Hacker is now ready!</p>
<p>It consists of a button to add to the toolbar (or if you prefer, a keyboard shortcut: <code>Ctrl+F2</code>), allowing to modify in a single click the displayed page as if you were using a <a href="http://www.openoffice.org/" hreflang="en">word processor</a> or a <a href="http://www.kompozer.net/" hreflang="en">WYSIWYG webpage editor</a>.</p>
<p>What is new? First, all the known bugs caused by the previous edition method are fixed. And the most important: a second clic on the button allows to quit the edition mode, while keeping your modifications.</p>
<p>Install and try version 1.0, available in Mozilla Add-ons sandbox: <a href="https://addons.mozilla.org/firefox/addon/5753">https://addons.mozilla.org/firefox/addon/5753</a>!</p>
<p>And a very big thank you to martin (<a href="http://joliclic.free.fr/" hreflang="fr">joliclic.free.fr</a>) for his great help with Javascript matters. <img src="/dotclear/themes/nicoNew/smilies/wink.png" alt=";)" class="smiley" /></p>Juke-box Deezer reloadedurn:md5:f9e1648e3b25aff74e2925eb9719a4022008-05-24T22:55:00+02:002008-05-24T22:55:29+02:00NicolasLe sitedeezerdéveloppementgratuitjuke-boxmusiqueradio <p>Un site a révolutionné la musique en ligne en permettant une écoute gratuite, illimitée et légale : <a href="http://www.deezer.com/" hreflang="fr">Deezer</a>. Peu après, j'ai conçu un simple "juke-box", qui permet de lire des playlists (listes de lecture) Deezer dans une interface sympathique. C'était il y a huit mois.</p>
<p>Je vous propose aujourd'hui une nouvelle version de ce juke-box, permettant toujours d'écouter mes horribles sélections, mais également les votre, grâce au Magic Jukebox.</p>
<p><a href="http://nicopensource.free.fr/dotclear/public/divers/jukebox/jukebox3.png" rel="lightbox[jkbx]" title="Le Magic Jukebox, pour lire vos propres listes."><img src="http://nicopensource.free.fr/dotclear/public/divers/jukebox/.jukebox3_s.jpg" alt="Le Magic Jukebox, pour lire vos propres listes." /></a></p>
<p>Une nouvelle fonctionnalité de Deezer, les radios thématiques, fait également son apparition.</p>
<p><a href="http://nicopensource.free.fr/dotclear/public/divers/jukebox/jukebox1.png" rel="lightbox[jkbx]" title="Un vaste choix de radios thématiques (23 actuellement)."><img src="http://nicopensource.free.fr/dotclear/public/divers/jukebox/.jukebox1_s.jpg" alt="Un vaste choix de radios thématiques (23 actuellement)." /></a> <a href="http://nicopensource.free.fr/dotclear/public/divers/jukebox/jukebox2.png" rel="lightbox[jkbx]" title="Une radio choisie."><img src="http://nicopensource.free.fr/dotclear/public/divers/jukebox/.jukebox2_s.jpg" alt="Une radio choisie." /></a></p>
<p>Pour découvrir ou redécouvrir ce juke-box, c'est par ici : <a href="http://nicopensource.free.fr/jukebox/jukebox.php">http://nicopensource.free.fr/jukebox/jukebox.php</a>.</p>
<p>Un petit conseil : jouez avec la touche F11 de votre clavier pour passer en mode plein écran. 8-)</p>IE NetRenderer 0.8 sur Mozilla Add-onsurn:md5:9d683e67b1d53b6a012d02c48e48acd52008-04-16T14:52:00+02:002008-04-16T14:53:28+02:00NicolasLogiciel libredéveloppementextensionfirefoxienetrenderer <p>Mon <a href="http://nicopensource.free.fr/index.php?post/2008/04/16/index.php?post/2008/02/09/Une-nouvelle-extension-%3A-IE-NetRenderer">extension</a> passe en version 0.8 et est désormais disponible dans la section publique de Mozilla Add-ons : <a href="https://addons.mozilla.org/fr/firefox/addon/6455" hreflang="fr">https://addons.mozilla.org/fr/firefox/addon/6455</a>.</p>
<p>Les nouveautés :</p>
<ul>
<li>Rendu sous IE8 Beta 1</li>
<li>Traduction allemande (en plus du français, anglais, espagnol, japonais, polonais et portugais)</li>
</ul>
<p><img src="https://addons.mozilla.org/en-US/firefox/images/preview/6455/1" alt="Les boutons proposés" style="display:block; margin:0 auto;" /></p>
<p>Une mise à jour automatique sera proposée aux utilisateurs des versions 0.6 et 0.7 d'ici peu.</p>Juke-box Deezer : utilisez vos playlistsurn:md5:81774d901bc1d8f64b53eb06a0ef3f4c2007-09-22T14:59:00+02:002009-04-20T11:38:15+02:00NicolasLe sitedeezerdéveloppementjuke-boxmusique<p>Lorsque j'ai sorti <a href="http://nicopensource.free.fr/index.php?post/2007/08/29/Mon-Juke-Box">mon juke-box</a> pour Deezer, ZaZoox <a href="http://nicopensource.free.fr/index.php?post/2007/08/29/Mon-Juke-Box#c7">m'a demandé</a> s'il est possible d'utiliser ses propres playlists. J'ai étudié ça hier, et je suis fier de vous présenter en exclusivité mondiale…</p>
<p><img src="/dotclear/themes/nicoNew/smilies/note.png" alt="o/" class="smiley" /> <strong>Le <a href="http://nicopensource.free.fr/jukebox/jukeboxmagic.php">Magic Juke-box</a></strong> <img src="/dotclear/themes/nicoNew/smilies/note.png" alt="o/" class="smiley" /></p>
<p>Vous pouvez utiliser votre propre playlist Deezer, et ce en quatre simples étapes…</p> <ol>
<li>Sur Deezer, cliquer sur <em>Blogger</em> (pour une playlist) ou <em>Blog et partage</em> (pour un seul morceau) : <br /><img src="http://nicopensource.free.fr/jukebox/cap1.png" alt="Capture des boutons sur la page de Deezer" /></li>
<li>Sélectionner l'URL du lecteur parmi le code proposé (elle y est à deux reprises)</li>
<li>Copier l'URL sélectionnée : <br /><img src="http://nicopensource.free.fr/jukebox/cap23.png" alt="Capture de l'URL à sélectionner sur Deezer" /></li>
<li>La coller dans le formulaire du <em>Magic Juke-box</em> et cliquer sur <em>Lire !</em>. : <br /><img src="http://nicopensource.free.fr/jukebox/cap4.png" alt="Capture du formulaire du Magic Juke-box" /></li>
</ol>
<p>J'essaierai peut-être de faire quelque chose permettant d'associer une playlist perso à chacun des 6 bouton (avec un cookie je pense), mais c'est déjà un bon début !</p>Ma première extension : Page Hackerurn:md5:b5e891250283aeed7ce1c970a3c8abb22007-09-14T17:11:00+02:002008-08-26T22:27:02+02:00NicolasLogiciel libredéveloppementextensionfirefoxpage hacker<blockquote><p><em>Suivez les nouveautés de Page Hacker avec le tag <a href="http://nicopensource.free.fr/index.php?tag/page%20hacker">page hacker</a>.</em></p></blockquote>
<p>J'ai découvert il y a quelques mois qu'on peut activer l'<a href="http://www.mozilla.org/editor/midas-spec.html" hreflang="en">éditeur de texte riche</a> de Firefox (également connu sous le nom de Midas) sur la page consultée en tapant</p>
<pre>
javascript:document.designMode='on'; void 0
</pre>
<p>dans la barre d'adresse de Firefox. Ça permet de bien s'amuser, exemple en image (garanti sans trucage, réalisé avec le code indiqué ci-dessus) :</p>
<p><a href="http://nicopensource.free.fr/dotclear/public/pagehacker/a-la-une-du-monde.png" rel="lightbox" title="Tiens, on parle de moi à la une du Monde !"><img src="http://nicopensource.free.fr/dotclear/public/pagehacker/.a-la-une-du-monde_s.jpg" alt="Tiens, on parle de moi à la une du Monde !" style="display:block; margin:0 auto;" /></a></p> <p>On peut également l'utiliser comme éditeur de texte, pour modifier des pages avant l'impression, pourquoi pas comme éditeur WYSIWIG de page Web, et à bien d'autres utilités !</p>
<p>J'ai trouvé ça plutôt amusant et intéressant, et ai donc cherché un moyen de l'avoir sous la main rapidement. La barre personnelle aurait pu convenir, mais je ne l'utilise pas, faute d'espace vertical. Un mot-clef sur un marque-page aurait également pu coller, mais ça reste un peu long. Et j'ai récemment trouvé sur le Developper's wiki de Mozilla un <a href="http://developer.mozilla.org/en/docs/Custom_Toolbar_Button" hreflang="en">tutoriel</a> pour réaliser une extension permettant d'ajouter un bouton à la barre d'outils. Ayant déjà quelques connaissances de la structure des extensions, je me suis lancé, et le résultat est cette extension : <strong>Page Hacker</strong> !</p>
<p>Plus d'informations sur la <a href="http://nicopensource.free.fr/index.php?static/Page-Hacker">page dédiée à l'extension</a>.</p>Mon Juke-Boxurn:md5:31d69d3e5ab2fc61cdf6f57835033db02007-08-29T10:22:00+02:002009-04-20T11:46:34+02:00NicolasLe sitedeezerdéveloppementjuke-boxmusique<p>Moins cher que <a href="http://search.ebay.fr/search/search.dll?satitle=juke-box" hreflang="fr">sur eBay</a>, je me suis concocté un joli juke-box numérique !</p>
<p>C'est mon oncle qui a eu cette idée après le lancement de Deezer : se faire un juke-box à installer dans le salon. Enfin plutôt “à installer dans son écran”. J'ai repris l'idée, et voilà le résultat :</p>
<p><a href="http://nicopensource.free.fr/dotclear/public/jukebox.png" rel="lightbox" title="Mon Juke-box"><img src="http://nicopensource.free.fr/dotclear/public/./.jukebox_m.jpg" alt="Mon Juke-box" style="display:block; margin:0 auto;" /></a></p> <p>Vous pouvez y jeter un coup d'œil <a href="http://nicopensource.free.fr/jukebox/jukebox.php">ici</a></p>
<p>Le tout est fonctionnel, entièrement fabriqué à la main en xhtml + css + php, à part l'image de fond trouvée sur Internet (libre de droits évidemment). Le code des boutons n'est pas très très propre toutefois, j'essaierai d'améliorer ça d'ici peu. Je vais aussi essayer de "rendre fonctionnel" le compteur du juke-box, pour qu'il affiche le numéro de la liste. Et puis améliorer les gros boutons parce qu'ils sont vraiment mal intégrés</p>
<p>À améliorer également : les listes de lecture :-O , ça fait un moment que je n'ai pas écouté la radio (il va falloir que je trouve une radio française bien, parce que la prog de nuit de NRJ Nouvelle-Calédonie commence à être un peut saoûlante ! <img src="/dotclear/themes/nicoNew/smilies/sick.png" alt=":*" class="smiley" /> )</p>