creation de fonction et variables

Répondre
Citer ce message
Umondel
le 17/03/2011 à 16:58
Umondel
Bonjour,

Je suis en train de programmer une page reprenant diverses radios.

Le clic sur le logo ouvre une pop-up lancant la radio sur le site-meme de la station de radio.

Dans le but d'éviter de devoir afficher trop de choses en BODY, je souhaiterais faire appel à une fonction, mais je bloque sur le choix de la fonction et des variables.

je verrais bien :

dans le body :
onclick="fonction("RTL", "w", "h")";

(w pour width et h pour heigh)
et ainsi de suite pour chacune des stations de radios.

Mais que mettre en HEAD pour définir la fonction et les variables et comment les appeler ?

quelque chose du genre
window.open(theURL,"width="+w+",height="+h+",toolbar=no,menubar=no,resizable=no,location=no,directories=no,status=no,scrollbars=no,copyhistory=no");

rtl="http://player.rtl.fr"
europe1="http://player.europe1.fr"
etc...

mieux encore, les width et height étant spécifiques à chaque radio, comment simplement indiquer onclick="fonction(rtl)";
et les width et high seraient définis en HEAD.

Je ne trouve pas la solution...

Please help...
Citer ce message
LupusMic
le 18/03/2011 à 02:24
LupusMic
Dans le but d'éviter de devoir afficher trop de choses en BODY […].

J'avoue ne pas comprendre cette phrase.

En ce qui concerne le problème, tu pourrais écrire un code dans ce goût là :
tuner = new (function() {

	var channels =

		{ 'Europe 1': {'url': 'url vers la radio', 'layout': {'height': '110', 'width': '20'}}

		}



	this.open = function(name)

	{

		var channel = channels[name] ;

		open(channel.url, createOptions(channel.layout))

	}



	var createOptions = function(layout)

	{

		var options = [] ;

		if(layout.hasOwnProperty('height') > -1)

			options.push('height=' + layout.height) ;

		return options.join(';') ;

	}

})


Bien sûr il faut ajouter les canaux (channels) nécessaires pour chaque radio, ajouter des options pour la construction de la chaîne d'options de la fonction window.open, etc.
Développeur récurrent, procédural et relationnel. Caustique soupe-au-lait.
Citer ce message
Umondel
le 20/03/2011 à 08:46
Umondel
Merci infiniment, c'est intéressant.

Comme je débute en JS, je me permets trois remarques sans doute stupides, mais c'est ainsi qu'on apprend.

1. ligne 1 : j'aurais plutot compris tuner=new function() etc. pourquoi une parenthese AVANT function ?

2. en ligne 12, pourquoi ne traites-tu pas le width également ?

3. en ligne 20, dois-je donc rajouter
window.open(channel.url, channel.layout) pour ouvrir la fenetre désirée ?

et appeler cette fonction dans le BODY par javascript:tuner('europe 1');
Citer ce message
LupusMic
le 20/03/2011 à 18:35
LupusMic
Non, ce n'est pas stupide. Ce qui l'est c'est de ne pas progresser ;)

1. Certes, j'ai été un peu zelé. Je suis moi-même un chasseur de parenthèses inutiles. Mais parfois, ça aide à clarifier le code, donc elles ont toute leur utilité.
À noter que tu n'as pas compris ce qu'est la variable tuner. La variable tuner est une instance de la fonction anonyme définie (celle que j'ai mis entre parenthèses).

2. Et tu ne veux pas tout le programme en plus ? :p Il faut bien que tu ais encore des choses à faire, pour te prouver que tu as compris le sens du code. En l'occurrence, tu as compris ce point, et tu sais donc comment ajouter toutes les options dont tu as besoin. C'est d'ailleurs le sens de ma dernière phrase.

3. J'ai effectivement oublié de te montrer comment utiliser ce code. Au temps pour moi. En fait, le window.open est effectué à la ligne 9 (window est l'objet global, toutes les portées de variables « héritent » de la portée supérieure à leur déclaration. Ceci signifie que tout les attributs de l'objet global window sont toujours vu depuis une fonction, sauf s'ils sont cachés par une variable déclarée dans une portée intermédiaire.

En fait, pour utiliser le code, il suffit d'associer l'appel de méthode de l'objet tuner dans un événement.

Si tu utilise jQuery :
$('button.tune').click(function () { tuner.open(this.value) }) ;


Avec des bouttons dans ce genre : 
<button class='tune' value='Europe 1'>
Développeur récurrent, procédural et relationnel. Caustique soupe-au-lait.
Répondre

Ecrire un message

Votre message vient d'être créé avec succès.
LoadingChargement en cours