Bonjour tout le monde!

Ça fait longtemps que je ne suis pas repassée par ici... Entre-temps j'ai développé tout un projet en WebGL qui applique un shader sur de la video. Alors j'ai déjà bien ramé pour implémenter ça en javaScript sur base de divers bricolages et patchworks trouvés ailleurs, et finalement ça marche ça donne ça: ça. Tout le code source est disponible avec l'inspecteur.

Seulement, le projet existe aussi en une version live sur projection, et l'APi jS, qui se compile automatiquement dans le navigateur, est assez insuffisante pour la distribution du son sur plusieurs canaux (ce que Pd a l'air de gérer très très bien) et aussi pour gérer la projection en continu avec variables capteurs (bien que possible, ça fait planter le navigateur à la longue, parce qu'il manque d'espace de calcul alloué). Qui plus est, le projet doit être montré en continu pendant trois jours à un festival en octobre, alors je suis un peu dans la m*! Plutôt que de poser interminablement des rustines sur mon pauvre javaScript, je m'étais dit que passer en PureData donnerait quelque chose de beaucoup plus élégant et fiable.

Or, si la gestion de la partie son semble être une comptine pour enfants (ben oui c'est fait pour me direz-vous), la gestion OpenGL/GEM a l'air tout bonnement terrifiante. Je n'ai aucune idée de l'ordre dans lequel il faut injecter : la vidéo, la génération de la texture verticale, la génération de la texture horizontale, les vertex, et le composite (qui seuille la texture sur la vidéo). Dans le javascript se trouvent également toutes, en vrac, des fonctions advance, initTexture, drawScene, updateTexture, qui sont écrites dans l'indigeste langage d'interface WebGL/JavaScript, basé sur des objets GL en built-in.

Petit exemple ici:

	function composite() {
		gl.viewport(0, 0, viewX, viewY);
		gl.useProgram(prog_composite);
		setUniforms(prog_composite);
		if (it < 0) {
			gl.activeTexture(gl.TEXTURE0);
			gl.bindTexture(gl.TEXTURE_2D, texture_main_l);
			gl.activeTexture(gl.TEXTURE1);
			gl.bindTexture(gl.TEXTURE_2D, my_texture);
		} else {
			gl.activeTexture(gl.TEXTURE0);
			gl.bindTexture(gl.TEXTURE_2D, texture_main2_l);
			gl.activeTexture(gl.TEXTURE1);
			gl.bindTexture(gl.TEXTURE_2D, my_texture);
		}
		gl.bindFramebuffer(gl.FRAMEBUFFER, null);
		gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
		gl.flush();
		frames++;
	}

	function anim() {
		if (!halted)
			advance();
		composite();
		switch (animation) {
		case "animate":
			setTimeout("requestAnimFrame(anim)", delay);
			break;
		case "reset":
			load();
			break;
		}
	}

Vous remarquerez que le programme appelle des variables globales situées plus haut dans le script JS.

Ce sont ces fonctions là que j'ai piquées et auxquelles je ne comprends pas grand-chose, sinon qu'elles sont essentielles au chargement de chaque frame vidéo pour que le shader-composite.frag puisse appliquer son effet.

En fait, ce qui me bloque tout à fait c'est de savoir quelles fonctions il faut que j'aille extraire (et modifier, pour les passages en JS) dans mon code pour les injecter comme shaders et programmes d'avancement sur Pd.
JavaScript dispose d'objets OpenGL built-in, et je me demande si c'est également le cas sous Pd, ou s'il faut charger les librairies?

Par voie de sécurité, je rustine tout de même mon application JS, mais je crois qu'une transition en Pd serait vraiment souhaitable. Je suis artiste, pas du tout informaticienne, et c'est la première fois que j'utilise un langage de programmation visuel, et je dois avouer que je me sens un peu dépassée. Je trouve peu de tutoriels et d'exemples ressemblant à mon problèmes, au point que je doute (mais vous allez m'assurer le contraire! ) de l'adaptabilité du projet en Pd.

Dernière modification par upermuk (2015-07-20 17:08:10)