Salut,

Mon pseudo est uaip, je suis ici depuis longtemps.

Ancien étudiant en école d'ingé, je développe dans tout et n'importe quel langage, (C, C++, Perl, TCL, PHP, Ruby, Java, Javascript, Flash, Lustre, ADA, et j'en passe...).

Je découvre depuis peu nodeJS et constate que trop peu de projets en font l'apologie. Du coup, voici une webApp sans prétention développée pour un besoin personnel, mais qui peut s'étendre à plusieurs utilisateurs. J'ai commencé ce projet il y a tout juste une semaine.

En savoir plus sur le projet

Génèse

Pur challenge, au départ une volonté de publier ma playlist sur le net pour pouvoir écouter mes morceaux n'importe où, sans besoin d'ordinateur particulier (ex: en soirée).

Je me dis que le concept peut séduire, ce qui me laisse penser à la possibilité d'ouverture à d'autres utilisateurs.

Généralité et avancement

Pur challenge :

- Reprendre l'interface exacte de iTunes (je sais, c'est risqué niveau poursuites de la part d'Apple)

- N'utiliser aucune image, tout est en pur CSS (comme quoi, c'est possible !)

- Utiliser la puissance et la rapidité de nodeJS au maximum -> playlist de 867 morceaux chargée en moins d'une seconde, via des commandes shell + cache + pagination Ajax

- N'utiliser aucune ressource externe. Ni BDD, ni script, ni rien d'autre. L'application est auto-suffisante.

- 100% Javascript

Niveau sécurité, on peut piquer toutes mes musiques, m'enfin. Qu'on les pique ici, ou sur Youtube... (mais je cherche déjà un moyen d'empécher le dl non désiré).

Il y a beaucoup de bogues, notamment au niveau de la lecture et des barres d'avancement / playlist. J'y travaille.

Objectif

- Challenge, comme dit plus haut.

- Ecouter mes musiques partout, et profiter de mes bookmarks youtube et soundcloud

Evolution : L'application est très évolutive, et fonctionne par fichiers JSON. On peut donc très simplement ajouter des types de liens (ex: dailymotion, ...), ou ajouter des musiques. L'interface s'adapte.

Le projet et son originalité

Le concept existe déjà, mais le coté visuel me semble sympa. Mais le principal objectif de cette application est l'utilisation de nodeJS.

Lien : http://wtunes.fr

 (redirection http://winky.fr:90 (attention, ce n'est pas le port HTTP standard, JS peut devenir chiant avec les iframes))

-
Edité par uaip 19 mai 2013 à 17:52:55

Testée sous Chrome et Firefox seulement. Je précise aussi que l'API Audio HTM5 est utilisée dynamiquement, et comme les 9/10 de mes musiques sont en MP3, exit Firefox...

-
Edité par uaip 10 mai 2013 à 17:04:18

J'applaudis des deux mains.

Plus pour la prouesse technique que pour l'intérêt réel du projet !

Serais-tu interessé par l'écriture d'un tutoriel node Js pour le site du zéro ?

Chromium 24.0.1304.0 (163234) : votre navigateur ne supporte pas l'HTML5.

Dafuq?

GG sinon.

Merci les gens.

Hm... J'ai la version 26. Mais c'est étrange, parce-que pour ça, je créé un lecteur audio virtuel et teste les formats supportés. Si aucun, alors -> pas de support audio HTML5.

A priori ça devrait être bon (tu auras encore le message d'erreur, mais le chargement de l'app se poursuit). Etrange, à creuser.

@PaperKrop, j'ai participé à un topic pour la rédac d'un tuto nodeJS (ici), ça s'est fini par des insultes en MP + intervention d'un modo...

Oh et c'est tout récent en plus... Bon ben tant pis, j'apprendrai le NodeJs ailleurs

Ouais enfin si tu a lu les 3 pages du thread tu aurais remarqué que Mateo21 est en train d'en écrire un, et a déjà bien avancé. http://www.siteduzero.com/informatique/tutoriels/des-applications-ultra-rapides-avec-node-js /hs

-
Edité par elyppire 10 mai 2013 à 18:47:45

Hm, d'autant plus que niveau nodeJS, il n'y a pas grand chose d'exceptionnel dans cette app. Voilà les 2 routes (+ 2, 3 bricoles à côté) :

app.get("/",function(_req,_res){
	_res.render("index",{
		lists:["Morceaux","Youtube","Soundcloud"],
		titles:["Titre","Artiste","Album","Genre","Durée","Année","Format"]
		},function(_err,_data){
		var data=_data.replace(/\n\s*/g,"");
		_res.send(200,data);
	});
});

app.get("/load/:type/:from/:to",function(_req,_res){
	switch(_req.params.type) {
		case "tracks":
			fs.readFile(file_lib,function(_err,_data){
				if (_err)
					_res.send(200,JSON.stringify({size:0,empty:true}));
				else {
					var tab=JSON.parse("["+_data+"]");
					_res.send(200,JSON.stringify({
						size:tab.length,
						data:tab.slice(_req.params.from,_req.params.to)
					}));
				}
			});
			break;
		case "youtube":
		case "soundcloud":
			fs.readFile(file_links,function(_err,_data){
				if (_err)
					_res.send(200,JSON.stringify({size:0,empty:true}));
				else {
					var obj=JSON.parse(_data)[_req.params.type];
					if (!obj)
						_res.send(200,JSON.stringify({size:0,empty:true}));
					else {
						_res.send(200,JSON.stringify({
							size:obj.data.length,
							data:obj.data.slice(_req.params.from,_req.params.to),
							width:obj.width,
							height:obj.height
						}));
					}
				}
			});
		break;
	}
});

Ca m'a pris 20min à tout casser pour installer + coder le serveur + debug. Je pense pas être assez calé pour écrire un tuto sur nodeJS

-
Edité par uaip 10 mai 2013 à 19:54:32

Salut,

Juste pour signaler que j'ai corrigé la plupart des bogues et ajouté le support des fichiers WAV et OGG (ça rajoute une centaine de morceaux de plus dans ma playlist perso).

Bonjour !

Excellent travail, interface très agréable et intuitive !

Je signal juste un problème : "Type 'MP3' non pris en compte par votre navigateur". Pourtant je suis sous firefox...

J'ai le même problème pour le type MP3, à part ça, je te tire mon chapeau, c'est vachement bien!
Juste, je suis pressé de pouvoir mettre mes propres musiques (en espérant que ça devienne un objectif futur).

Sinon, petit aparté, très bon choix musical

Salut,

Merci à tous les deux. Aucun problème, c'est simplement que Firefox n'accepte pas les MP3 (histoire de licence). C'est pour ça qu'il y a un label à droite de l'application "Formats supportés par votre navigateur : ***", parce-qu'il ne supportent pas tous les mêmes.

Je pense développer le système pour que chacun puisse créer sa playlist (ça peut être cool d'avoir accès à ses musiques partout) avec accès protégé, etc, ça me prendra pas trop de temps je pense. Dans ce cas là, il y aura conversion MP3/OGG pour un support sur tous les navigateurs. Mais actuellement, j'ai simplement uploadé ma playlist iTunes

Merci effectivement ça marche

Remarquable travail ! Tu pourrais peut être ajouter une inscription, et puis une liste de favoris dans une version ultérieur !

Aha génial, t'écoutes toute ma musique , dommage que je ne puisse pas l'écouter (sacré Firefox )

Et en effet l'idée est géniale ce serait un bonheuuuuurrrrr, ainsi qu'une synchronisation en ligne pour les téléphones et mp3 et compagnie, sans vouloir trop en demander aha bon courage en tout cas si tu continues le projet !

Ravi de voir que ça plait

Du coup oui, je l'ai continué depuis mon dernier message. Faut juste savoir je veux absolument respecter mes contraintes :

- aucune image / fichier extérieur pour l'affichage

- aucune ressource extérieure pour le serveur (BDD, etc)

- penser webApp à 1 vue, et pas un site navigable

Du coup, ça complique un peu, mais j'ai trouvé un bon compromis. Dorénavant, on peut créer un "compte" (une simple URL qu'on peut rendre publique (pour partager ses playlists) ou non (utiliser l'app pour soi), avec mot de passe pour ajout/édition de médias), et posséder donc son propre espace (playlist avec upload de média + liens youtube, soundcloud, ...).

@laurinehu, qu'entends-tu par "synchronisation en ligne pour telephone ?".

Merci en tout cas.

Le concept est très sympa et l'appli est très bien foutue ! Quand un projet repose sur nodejs, ça m'intéresse toujours

Félicitations et bonne continuation, je vais suivre de près Et en passant, tes morceaux ne sont pas mal du tout

Excellent projet !

Si tu ouvre au publique le site, fait attention, car il est très facile de récupérer le fichier MP3 original en cours de lecture puisque le lien apparaît dans les ressources de la page. Ce qui pourrait t'attirer des problèmes... L'idée serait d'observer comment Spotify Web player ou Deezer ou résolu ce soucis pour l'appliquer sur ta webapp.

Salut,

Merci !

J'ai analysé comment fonctionnait soundcloud. Et figure-toi que malgré leur option "acheter ce titre", il suffit d'un bête clic droit pour le télécharger librement. Par contre, impossible de partager les liens, etc. J'ai repris un système similaire, afin de bloquer les liens directs vers les musiques. Donc ça sera jamais inviolable (impossible en HTML5) mais plutôt complexe pour un novice.

Sinon pour l'avancement, ça a pas mal changé, mais avec ce fichu challenge "pas de BDD", c'est pas si évident de gérer et stocker les données.