[KRPano] Bouton Son on/off avec réglage du volume

[Mael B.]

En attendant que quelqu'un nous ponde un petit plugin flash pour contrôler le son comme celui de FPP (c-a-d avec un réglage du volume), j'ai repris un partie du code de l'exemple 'slider/blending' pour en faire une barre de réglage de volume

Voilà ce que ça donne en pratique :

Code : Tout sélectionner

http://perso.numericable.fr/mael.bathfield/krpano/boutons_son/

La barre de contrôle de volume apparaît au survol du bouton son, puis si la souris ne la survole pas, elle disparaît après 1 sec. Si l'utilisateur utilise cette barre de contrôle de volume, elle disparaît dès que la souris la quitte.

Voici le code complet de cet exemple:

Code : Tout sélectionner

<krpano version="1.0.8" >

	<!-- showtext style -->
	<textstyle name="DEFAULT" font="Arial" fontsize="10" border="false" background="false" textcolor="0xFFFFFF" effect="glow(0x000000,0.7,4,2);dropshadow(2,45,0x000000,3,1);" />

 <view hlookat="90"
	  vlookat="0"
	  maxpixelzoom="1.0" fovmax="110"  />

<preview type="CUBESTRIP" url="preview.jpg" />


<!-- boutons Son ON/OFF -->
<plugin name="sound_off" url="boutons_son.png" crop="150|0|50|80" visible="false" zorder="2" keep="true" width="25" height="40" align="leftbottom" x="100" y="10"  blendmode="screen" onhover="showtext(Arrêter son)"
 onover="set(blendmode,layer); set(NOHIDE,false); set(plugin[slider_bg].visible,true); tween(plugin[slider_bg].alpha,1,0.1);" onout="set(blendmode,screen); delayedcall(1, if(NOHIDE== false, tween(plugin[slider_bg].alpha,0,0.2);)); " onclick="action(sound_off)" />
 
<plugin name="sound_on" url="boutons_son.png" crop="0|0|50|80" visible="true" zorder="2" keep="true" width="25" height="40" align="leftbottom" x="100" y="10" blendmode="screen"
 onhover="showtext(Jouer Son)" onover="set(blendmode,layer);" onout="set(blendmode,screen);" onclick="action(sound_on1)"/>
 
<action name="sound_off">
tween(plugin[slider_bg].alpha,0,0.2,null,set(plugin[slider_bg].visible,false));  
set(plugin[sound_off].visible,false);
set(plugin[sound_on].visible,true); 
stopallsounds(); 
</action>

	<!-- chargement plugin son -->
<plugin name="soundinterface" 
        url="../plugins/soundinterface.swf" 
		keep="true"
		preload="true"
		rootpath=""
		volume="1"
		onloaded="preloadsound(son1.mp3);"
		/>


<!-- Son à lancer -->
<action name="sound_on1">
stopallsounds();
set(plugin[sound_on].visible,false);
set(plugin[sound_off].visible,true); 
playsound(son1,son1.mp3,1,set(plugin[sound_on].visible,true);set(plugin[sound_off].visible,false); );  
</action>	
	
<!-- Barre de volume -->	
	<plugin name="slider_bg"   url="boutons_son.png" crop="201|0|270|80" zorder="2" keep="true" align="leftbottom" width="150" height="40" x="130" y="10" visible="false" handcursor="false" alpha="0" onhover="" onover="set(NOHIDE,true); set(plugin[slider_bg].visible,true); tween(plugin[slider_bg].alpha,1,0.1); " onout="set(NOHIDE,false); tween(plugin[slider_bg].alpha,0,0.2) ;" />
	<plugin name="slider_grip" url="boutons_son.png" crop="470|0|25|80" zorder="3" keep="true" align="lefttop" parent="slider_bg" width="15" height="48" x="133" y="-4" onhover=""
			ondown="startdragingslider();"
			onup="stopdragingslider();"
			/>

	<action name="startdragingslider">
		set(plugin[slider_grip].backup_align, get(plugin[slider_grip].align));
		set(plugin[slider_grip].backup_edge,  get(plugin[slider_grip].edge));

		plugin[slider_grip].changeorigin(lefttop,lefttop);

		sub(mouse_x_offset, plugin[slider_grip].x, mouse.x);
		sub(mouse_y_offset, plugin[slider_grip].y, mouse.y);

		set(image_dragging,true);

		dragslider();
	</action>

	<action name="stopdragingslider">
		set(image_dragging, false);
	</action>

	<action name="dragslider">
		if(image_dragging,
			add(xpos, mouse.x, mouse_x_offset);
			sub(xmax, plugin[slider_bg].width, plugin[slider_grip].width);
			if(xpos LT 0, set(xpos,0));
			if(xpos GT xmax, copy(xpos,xmax));
			copy(plugin[slider_grip].x, xpos);

			<!-- val = 0.0 ... 1.0 -->
			div(val, xpos, xmax);
			setvolume(get(val));
			
			if(val == 0, set(plugin[sound_off].crop,0|0|50|80););
			if(val GT 0.2, set(plugin[sound_off].crop,50|0|50|80););
			if(val GT 0.4, set(plugin[sound_off].crop,100|0|50|80););
			if(val GT 0.7, set(plugin[sound_off].crop,150|0|50|80););
			
			delayedcall(0.01, dragslider() );
		  ,
			plugin[slider_grip].changeorigin(get(plugin[slider_grip].backup_align), get(plugin[slider_grip].backup_edge));
		  );
	</action>
	
	  	<action name="setvolume">
		set(soundinterface.volume,%1)
	</action>



</krpano>

Les boutons sont regroupés dans cette image

Code : Tout sélectionner

http://perso.numericable.fr/mael.bathfield/krpano/boutons_son/boutons_son.png

Edit Sagedavid : elles n'y sont plus, apparemment...
... libre à vous d'en changer si vous voulez quelque chose de personnalisé

[Mattpano]

Très sympathique ! Un p'tit soucis : Si on maintient le clic de la souris pour faire varier le son, mais qu'on bouge de la zone de l'image, la barre disparait, et après, on a beau revenir dessus, rien n'apparait et pourtant, je suis toujours resté cliqué !

Mais bon, ça doit être un détail à peaufiner Merci de nous faire partager ce travail !

[Mael B.]

Très sympathique ! Un p'tit soucis : Si on maintient le clic de la souris pour faire varier le son, mais qu'on bouge de la zone de l'image, la barre disparait, et après, on a beau revenir dessus, rien n'apparait et pourtant, je suis toujours resté cliqué !

Effectivement, j'avais pas pensé à ce cas de figure... mais ça y est, c'est corrigé et le code est même un peu plus simple

[Mattpano]

Ok merci ! Je n'arrive à rien ce soir, que ça soit en local ou hébergé, la barre de volume ne fonctionne pas, au moindre clic, elle se mets à 0, et on ne peux plus la bouger ! Pourtant j'ai bien copié tes fichiers Je verrais ça plus au clair demain...
Et pourtant, sur ton exemple, ça fonctionne parfaitement !

Fichier "krpano.swf" mis à jour avec la 1.0.8 béta9, je n'avais pas la toute dernière !

[Rick]

Bonsoir Mael,

Bon, première chose je n'ai pas pu m'empêcher de laisser le volume à fond pendant la première boucle !!

ensuite MERCI ! c'est tout pile ce que je cherchais ! je vais tester tout cela bientôt
et comme je suis bien incapable de créer ce genre de chose...

[estragon]

Bravo et merci pour ce bouton volume simple, sobre efficace et élégant

Crois-tu que ce serait possible d'avoir un genre de "time line" pour le son avec bouton pause un peu dans le genre du dewplayer ou justement il faut un plugin flash ?

Heu si ça existe déjà, n'hésite pas à me foutre la honte

[Mael B.]

Pour la 'time line', avec le plugin actuel soundinterface.swf je ne crois pas que cela soit possible
Je ne vois que la solution d'intégrer le dewplayer dans le pano pour lire les sons.

[estragon]

Ha mais si on peut faire ça c'est tout bon alors !

[sol]

Merci Mael pour cette nouvelle fonction que je viens de tester et qui marche parfaitement.
Cela permet d'avoir une option supplémentaire pour le son.

[Germain]

Cela permet d'avoir une option supplémentaire pour le son.

Wouah! observateur !
Bravo en tout cas pour ce beau boulot que tu nous proposes , et ... Euh .. A quand le vu-mètre ??

[Rick]

Bonjour Mael,

J'ai essayé de mettre ton bouton dans une des trois scènes que comporte mon pano, j'ai ce message d'erreur ? alors que j'ai bien tout copié ?!

ERROR: soundinterface - loading of "set(plugin[sound_on].visible,true);set(plugin[sound_off].visible,false);" failed

D'autre part malgré le fait que le bouton soit copié dans une seule scène, il apparait aussi dans les deux autres !

J'ai encore raté des trucs...

[Mael B.]

Rick, as-tu bien vérifié l'url du plugin soundinterface ? et as-tu bien la toute dernière version de ce plugin (et de krpano) ?

D'autre part malgré le fait que le bouton soit copié dans une seule scène, il apparait aussi dans les deux autres !

ça c'est normal ! c'est parce qu'il y a keep="true" pour les boutons. Mets keep="false" si tu ne veux pas qu'ils apparaissent dans les autres scènes

[Mael B.]

Mise à jour des liens morts du premier post :
l'exemple ici : http://www.maelbathfield.net/photo/krpano/sound_krpano/

le code xml ici :

Code : Tout sélectionner

http://www.maelbathfield.net/photo/krpano/sound_krpano/code_sound2.xml

et l'image utilisée dans le code :

[estragon]

Merci
Yapuka étudier tout ça

[Rick]

Merci Mael

[Germain]

.... Et le vu-mètre on attend toujours Maël

[quoideneufdocteur?]

Merci Mael

[vincen]

Merci bien pour le code, attention ton deuxième lien a été tronqué ! tu devrais le mettre entre balise code

Vince

[philippe]

Merci beaucoup Mael pour ce code

Cela me manquait , étant incapable de créer ce genre de chose , c'est d'une grande aide

Il me reste plus qu'a étudier le code et essayer de l'intégrer .

Merci encore pour le partage

[Dudu Tresca]

Merci pour le code Mael.