User:HgO/PatateBox: Difference between revisions

From Pirate Party Belgium
Jump to navigation Jump to search
(PatateBox)
No edit summary
 
Line 5: Line 5:
== Matériel ==
== Matériel ==


Le modèle que j'ai choisi est le TP-Link MR3020 ([http://www.ldlc.be/fiche/PB00123703.html 30€ sur LDLC.be], par ex), muni d'une batterie PowerBank 7800mAh ([http://www.ldlc.be/fiche/PB00181947.html 20€ sur LDLC.be], ~10h d'autonomie) et d'une clé USB 3.0 de 32GB (~20€).
Le modèle que j'ai choisi est le TP-Link MR3020 ([http://www.ldlc.be/fiche/PB00123703.html 30€ sur LDLC.be], par ex), muni d'une batterie PowerBank 7800mAh ([http://www.ldlc.be/fiche/PB00181947.html 20€ sur LDLC.be], ~10h d'autonomie) et d'une clé USB 3.0 de 32Go (~20€).


Vous n'êtes bien entendu pas obligé de prendre le même routeur que moi (bien que le MR3020 soit le plus utilisé), voyez plutôt la [http://piratebox.cc/openwrt:hardware liste des routeurs compatibles] à ce sujet. Le TP-Link MR3040 possède les mêmes performances que le MR3020, sauf qu'il a une batterie intégrée. Néanmoins, je ne l'ai pas choisi, car je préfère pouvoir réutiliser ma batterie pour d'autres appareils.
Vous n'êtes bien entendu pas obligé de prendre le même routeur que moi (bien que le MR3020 soit le plus utilisé), voyez plutôt la [http://piratebox.cc/openwrt:hardware liste des routeurs compatibles] à ce sujet. Le TP-Link MR3040 possède les mêmes performances que le MR3020, sauf qu'il a une batterie intégrée. Néanmoins, je ne l'ai pas choisi, car je préfère pouvoir réutiliser ma batterie pour d'autres appareils.
Line 17: Line 17:
= PatateBox =
= PatateBox =


J'ai donc nommé ma PirateBox la « PatateBox » parce que… Hum. Parlons plutôt des modifications que j'y ai apporté.
J'ai donc nommé ma PirateBox la « PatateBox » parce que… Parlons plutôt des modifications que j'y ai apporté.


== Carte OpenStreetMap ==
== Carte OpenStreetMap ==
Line 28: Line 28:


Sinon, [http://wiki.openstreetmap.org/wiki/Maperitive Maperitive] faisait assez bien le boulot, mais j'ai eu quelques soucis de polices d'écriture, ce qui rendait la carte moche, au final.
Sinon, [http://wiki.openstreetmap.org/wiki/Maperitive Maperitive] faisait assez bien le boulot, mais j'ai eu quelques soucis de polices d'écriture, ce qui rendait la carte moche, au final.
== Affichage des dossiers ==
Comme je trouvais l'affichage des dossiers très simple, voire pas très beau, j'ai cherché un moyen d'améliorer tout ça. Je suis tombé sur [http://bibliobox.net/blog/post/2014/11/20/installer-h5ai-v0261-sur-une-librarybox h5ai], écrit en PHP, qui fait très bien le travail, une fois que l'on a désactivé la plupart des fonctionnalités, telles que la création d'aperçus des images et vidéos.
L'ennui est que cela m'a obligé à [http://piratebox.cc/openwrt:mods#php_for_piratebox installer PHP], ce qui non seulement n'était pas évident à faire, mais en plus qui pourrait ralentir ma PatateBox. Je devrai donc garder ceci à l'œil.
J'ai également rencontré un sérieux ralentissement lors du calcul de la taille de gros fichiers, et j'ai dû modifier quelques lignes de code pour que cela fonctionne. Apparemment, la fonction <code>filesize()</code> de PHP déconne pour les fichiers de plus de 2Gio sur les machines 32bit. Or il se trouve que le routeur MR3020 est un système 32bit. Les développeurs de h5ai ont contourné le problème en permettant de calculer la taille des fichiers via la commande UNIX <code>du</code>, mais je n'ai pas encore eu l'occasion de tester tout ceci.


== Chat ==
== Chat ==


J'ai eu quelques soucis avec le chat intégré par défaut dans la PirateBox. Celui-ci est en effet écrit en python, et je pense que le lancement du script était vraiment lent (ce qui est bizarre, car je n'ai rien vu à ce sujet sur les forums de la PirateBox). J'ai donc décidé de le remplacer par un chat écrit en javascript et php, utilisant les websockets. Néanmoins, ces derniers étant une technologie assez récente, je dois encore voir ce que je peux faire au niveau de la compatibilité avec les anciens smartphones.
J'ai eu quelques problèmes avec le chat intégré par défaut dans la PirateBox. Celui-ci est en effet écrit en Python, et je pense que le lancement du script était vraiment lent (j'ai trouvé [http://forum.piratebox.cc/read.php?2,13921,13921 une discussion] sur le forum de la PirateBox, mais je ne suis pas sûr qu'ils aient résolu le problème…)
 
J'ai donc décidé de le remplacer par un chat écrit en Javascript et PHP, utilisant les websockets. L'intérêt est qu'ils permettent de faire tourner un serveur ou un client dans n'importe quel langage (on pourrait réécrire le serveur en C++ par exemple, ce qui permettrait d'économiser beaucoup de ressources sur la PirateBox). Néanmoins, les websockets étant une technologie relativement récente, ils ne sont [http://caniuse.com/#search=websocket pas compatibles] avec d'anciens smartphones. Je suis tombé sur [https://github.com/gimite/web-socket-js web-socket-js] qui permet d'assurer la compatibilité avec les smartphones ayant Flash installé, mais je dois encore faire des tests.


== Affichage des dossiers ==
Le code se trouve sur mon [https://git.framasoft.org/HgO/chatbox dépôt Git].
 
== Thème ==
 
Le moins que l'on puisse dire, c'est que le thème de la PirateBox est austère, voire rebutant pour les visiteurs. J'ai donc un peu cherché et suis tombé sur [http://sylvain.naud.in/post/2013/06/15/Personnaliser-votre-PirateBox-avec-Bootstrap un thème] utilisant Bootstrap, le framework web de Twitter. Je placerai mes modifications sur un dépôt Git quand j'aurai le temps.
 
Par ailleurs, si vous avez vous aussi d'autres thèmes, n'hésitez pas à me le faire savoir (je ne suis pas très bon en graphisme, même si je me débrouille).
 
== Envoi de fichiers ==
 
L'activation de PHP pose un problème de sécurité potentiel : il se pourrait que quelqu'un décide d'envoyer un script PHP malicieux. Par ailleurs, je n'ai pas vu de restrictions en ce qui concerne l'envoi des fichiers Javascript ou autres, et je ne connais pas suffisamment Lighttpd (le serveur web installé sur les PirateBoxes) pour pouvoir contourner cela.
 
Néanmoins, j'ai fait quelques recherches en ce qui concerne le système d'upload, dans le but de limiter le type des fichiers envoyés, mais aussi d'améliorer l'interface utilisateur. Pour information, le logiciel installé par défaut s'appelle [http://stackp.online.fr/?p=28 Droopy].
 
Je suis donc tombé sur [http://blueimp.github.io/jQuery-File-Upload/basic-plus.html JQuery File Upload] (via cette [https://github.com/PirateBox-Dev/PirateBoxScripts_Webserver/issues/32 discussion]) qui m'a l'air pas mal du tout. J'ai dû enlever certaines fonctionnalités, comme le redimensionnement des images, puisque cela était inutile pour mon usage. Cependant, je n'ai pas réussi a le faire fonctionner sur un relativement vieux smartphone.
 
Je mettrai mon code disponible sur mon dépôt Git prochainement.
 
== Wiki ==
 
La prochaine étape dans l'évolution de ma PatateBox sera d'y installer un petit wiki écrit en Javascript : [http://tiddlywiki.com/ TiddlyWiki]. L'avantage est que la plupart du travail est effectuée au niveau du client (à savoir : le navigateur de l'internaute). De plus, l'[http://bibliobox.net/blog/post/2014/07/16/un-wiki-sur-votre-bibliobox-avec-tiddlywiki installation] semble vraiment simple.
 
== Bibliothèque d'eBooks ==
 
Enfin, j'envisage également d'installer une bibliothèque de livres électroniques. La bibliothèque devra être créée via [http://calibre-ebook.com/ Calibre], puis les pages web seront générées via [http://calibre2opds.com/ calibre2opds]. L'avantage étant que ce ne sont que de simple pages HTML statiques. Le problème est qu'il n'y a pas de moteur de recherche pour le moment (enfin si, mais il est expérimental et utilise WebSQL, qui n'est pas reconnu par Firefox, entre autres.).


Comme je trouvais l'affichage des dossiers très simple, voire pas très beau, j'ai cherché un moyen d'améliorer tout ça. Je suis tombé sur [http://bibliobox.net/blog/post/2014/11/20/installer-h5ai-v0261-sur-une-librarybox h5ai], écrit en php, qui fait très bien le travail, une fois que l'on a désactivé la plupart des fonctionnalités, telle que la création d'aperçus des images et vidéos.
Bref, cela m'a poussé à écrire un petit moteur de recherche en PHP, disponible sur [https://git.framasoft.org/HgO/search4opds/ ce dépôt Git]. Peu de temps après, j'ai découvert [https://github.com/kripken/sql.js/ sql.js] qui permet de gérer une base de données côté client, ce qui est exactement ce que je cherchais ! J'ai donc traduit mon moteur de recherche en Javascript, que vous trouverez sur le [https://git.framasoft.org/HgO/search4opds/ même dépôt] que la version en PHP. Néanmoins, je n'ai pas encore eu l'occasion de tester tout ceci ni sur ma PatateBox, ni sur de vieux smartphones.


L'ennui est que cela m'a obligé à [http://piratebox.cc/openwrt:mods#php_for_piratebox installer php], ce qui pourrait ralentir ma PatateBox. Je devrai donc garder ceci à l'œil.
Notons tout de même qu'il existe aussi [http://blog.slucas.fr/en/oss/calibre-opds-php-server cops] (Calibre OPDS), et l'association Framasoft projette de l'améliorer pour ses besoins. Je ne l'ai pas retenu, car il me semblait trop complexe pour ce que je voulais en faire, mais son évolution future est à suivre de très près tout de même.


J'ai également rencontré un sérieux ralentissement lors du calcul de la taille de gros fichiers, et j'ai dû modifier quelques lignes de code pour que cela fonctionne.
= Contact =


[[Category:PirateBox]]
Si vous avez besoin d'aide ou si vous avez des questions au sujet des PirateBoxes, je serai ravi de vous donner un coup de main ! Il vous suffit de m'envoyer un mail à hadrien [chez] pirateparty [dot] be

Latest revision as of 13:50, 10 May 2015

Introduction

J'ai fait l'acquisition récemment d'une PirateBox. Pour ceux qui ne connaissent pas le principe, cela consiste en un petit routeur permettant de partager des fichiers, de discuter, etc., et de ce fait, créer un réseau local anonyme, coupé d'internet. Bref, c'est une clé USB en wifi, comme j'aime à le dire.

Matériel

Le modèle que j'ai choisi est le TP-Link MR3020 (30€ sur LDLC.be, par ex), muni d'une batterie PowerBank 7800mAh (20€ sur LDLC.be, ~10h d'autonomie) et d'une clé USB 3.0 de 32Go (~20€).

Vous n'êtes bien entendu pas obligé de prendre le même routeur que moi (bien que le MR3020 soit le plus utilisé), voyez plutôt la liste des routeurs compatibles à ce sujet. Le TP-Link MR3040 possède les mêmes performances que le MR3020, sauf qu'il a une batterie intégrée. Néanmoins, je ne l'ai pas choisi, car je préfère pouvoir réutiliser ma batterie pour d'autres appareils.

Notez qu'il est aussi possible de faire tourner sa PirateBox sur un Raspberry Pi, ce qui peut être intéressant pour les connaisseurs ou pour ceux qui veulent faire tourner des logiciels un peu plus puissants. On peut également transformer son ordinateur portable en PirateBox temporaire via une clé Live-USB. Enfin, il existe une application Android permettant de transformer votre smartphone en PirateBox.

Installation

Je vous invite à visiter la page PirateBox#Tutorials où vous trouverez divers tutoriels d'installation. Sachez juste qu'il existe plusieurs forks de la PirateBox, comme la LibraryBox — et sa dérivée française la BiblioBox. La principale différence entre une LibraryBox et une PirateBox est l'absence d'upload de fichiers (après tout, c'est une bibliothèque, l'objectif n'est donc pas le même). Il faut aussi savoir que la LibraryBox a fait l'objet d'un crowdfunding, ce qui fait que le projet est sans doute plus actif que celui de la PirateBox. Cependant, je n'ai pas encore eu l'occasion de tester tout ceci. Enfin, remarquons que les deux projets sont compatibles, puisqu'il est tout à fait possible de réactiver l'upload sur une LibraryBox, ou d'installer des logiciels qui tournent sur l'un des deux projets.

PatateBox

J'ai donc nommé ma PirateBox la « PatateBox » parce que… Parlons plutôt des modifications que j'y ai apporté.

Carte OpenStreetMap

Une des fonctionnalités que je trouve très intéressante est l'ajout d'une carte OpenStreetMap hors-ligne. J'utilise Leaflet pour intégrer la carte dans une page html. L'installation est expliquée sur la page des modules de la PirateBox.

Pour la génération des tuiles (les petites images qui, mises bout-à-bout, formeront notre carte), j'ai dû me résoudre à installer un serveur de tuiles sur mon ordinateur. Cependant, le processus étant relativement complexe et long, je suis toujours à la recherche d'une meilleure alternative.

Pour ceux qui n'auraient pas le courage d'installer un serveur de tuiles, vous pouvez télécharger les tuiles directement depuis les serveurs d'OSM (mais c'est tout de même fortement déconseillé pour de grandes régions, car vous risquez de saturer leur serveur et de vous faire blacklister).

Sinon, Maperitive faisait assez bien le boulot, mais j'ai eu quelques soucis de polices d'écriture, ce qui rendait la carte moche, au final.

Affichage des dossiers

Comme je trouvais l'affichage des dossiers très simple, voire pas très beau, j'ai cherché un moyen d'améliorer tout ça. Je suis tombé sur h5ai, écrit en PHP, qui fait très bien le travail, une fois que l'on a désactivé la plupart des fonctionnalités, telles que la création d'aperçus des images et vidéos.

L'ennui est que cela m'a obligé à installer PHP, ce qui non seulement n'était pas évident à faire, mais en plus qui pourrait ralentir ma PatateBox. Je devrai donc garder ceci à l'œil.

J'ai également rencontré un sérieux ralentissement lors du calcul de la taille de gros fichiers, et j'ai dû modifier quelques lignes de code pour que cela fonctionne. Apparemment, la fonction filesize() de PHP déconne pour les fichiers de plus de 2Gio sur les machines 32bit. Or il se trouve que le routeur MR3020 est un système 32bit. Les développeurs de h5ai ont contourné le problème en permettant de calculer la taille des fichiers via la commande UNIX du, mais je n'ai pas encore eu l'occasion de tester tout ceci.

Chat

J'ai eu quelques problèmes avec le chat intégré par défaut dans la PirateBox. Celui-ci est en effet écrit en Python, et je pense que le lancement du script était vraiment lent (j'ai trouvé une discussion sur le forum de la PirateBox, mais je ne suis pas sûr qu'ils aient résolu le problème…)

J'ai donc décidé de le remplacer par un chat écrit en Javascript et PHP, utilisant les websockets. L'intérêt est qu'ils permettent de faire tourner un serveur ou un client dans n'importe quel langage (on pourrait réécrire le serveur en C++ par exemple, ce qui permettrait d'économiser beaucoup de ressources sur la PirateBox). Néanmoins, les websockets étant une technologie relativement récente, ils ne sont pas compatibles avec d'anciens smartphones. Je suis tombé sur web-socket-js qui permet d'assurer la compatibilité avec les smartphones ayant Flash installé, mais je dois encore faire des tests.

Le code se trouve sur mon dépôt Git.

Thème

Le moins que l'on puisse dire, c'est que le thème de la PirateBox est austère, voire rebutant pour les visiteurs. J'ai donc un peu cherché et suis tombé sur un thème utilisant Bootstrap, le framework web de Twitter. Je placerai mes modifications sur un dépôt Git quand j'aurai le temps.

Par ailleurs, si vous avez vous aussi d'autres thèmes, n'hésitez pas à me le faire savoir (je ne suis pas très bon en graphisme, même si je me débrouille).

Envoi de fichiers

L'activation de PHP pose un problème de sécurité potentiel : il se pourrait que quelqu'un décide d'envoyer un script PHP malicieux. Par ailleurs, je n'ai pas vu de restrictions en ce qui concerne l'envoi des fichiers Javascript ou autres, et je ne connais pas suffisamment Lighttpd (le serveur web installé sur les PirateBoxes) pour pouvoir contourner cela.

Néanmoins, j'ai fait quelques recherches en ce qui concerne le système d'upload, dans le but de limiter le type des fichiers envoyés, mais aussi d'améliorer l'interface utilisateur. Pour information, le logiciel installé par défaut s'appelle Droopy.

Je suis donc tombé sur JQuery File Upload (via cette discussion) qui m'a l'air pas mal du tout. J'ai dû enlever certaines fonctionnalités, comme le redimensionnement des images, puisque cela était inutile pour mon usage. Cependant, je n'ai pas réussi a le faire fonctionner sur un relativement vieux smartphone.

Je mettrai mon code disponible sur mon dépôt Git prochainement.

Wiki

La prochaine étape dans l'évolution de ma PatateBox sera d'y installer un petit wiki écrit en Javascript : TiddlyWiki. L'avantage est que la plupart du travail est effectuée au niveau du client (à savoir : le navigateur de l'internaute). De plus, l'installation semble vraiment simple.

Bibliothèque d'eBooks

Enfin, j'envisage également d'installer une bibliothèque de livres électroniques. La bibliothèque devra être créée via Calibre, puis les pages web seront générées via calibre2opds. L'avantage étant que ce ne sont que de simple pages HTML statiques. Le problème est qu'il n'y a pas de moteur de recherche pour le moment (enfin si, mais il est expérimental et utilise WebSQL, qui n'est pas reconnu par Firefox, entre autres.).

Bref, cela m'a poussé à écrire un petit moteur de recherche en PHP, disponible sur ce dépôt Git. Peu de temps après, j'ai découvert sql.js qui permet de gérer une base de données côté client, ce qui est exactement ce que je cherchais ! J'ai donc traduit mon moteur de recherche en Javascript, que vous trouverez sur le même dépôt que la version en PHP. Néanmoins, je n'ai pas encore eu l'occasion de tester tout ceci ni sur ma PatateBox, ni sur de vieux smartphones.

Notons tout de même qu'il existe aussi cops (Calibre OPDS), et l'association Framasoft projette de l'améliorer pour ses besoins. Je ne l'ai pas retenu, car il me semblait trop complexe pour ce que je voulais en faire, mais son évolution future est à suivre de très près tout de même.

Contact

Si vous avez besoin d'aide ou si vous avez des questions au sujet des PirateBoxes, je serai ravi de vous donner un coup de main ! Il vous suffit de m'envoyer un mail à hadrien [chez] pirateparty [dot] be