Activating sounds with scripting
01 May 2017 15:54
Dear friends,
I'm a long time Blender and Blender Game Engine user (since 2000). I'm new to Blend4Web and I'm loving it. Congratulations for the great work being done!
I'm making a virtual gallery project with some 100 painting in it. Here's the project so far, with placeholder audio files: http://www.quasecinema.org/expo/
What I have done to play the audio files is a gigantic node tree![]( "cold-sweat")
, with 100 connections. When the user clicks on a painting, the corresponding audio plays.
Could the audio picking be done by scripting? To make things easier, each speaker has the same name of the painting, like object "paintingABC" has a speaker named "paintingABC.Speaker".
It would be great if the script could also stop all other audio playing before playing the selected one.
Thank you very much!
I'm a long time Blender and Blender Game Engine user (since 2000). I'm new to Blend4Web and I'm loving it. Congratulations for the great work being done!
I'm making a virtual gallery project with some 100 painting in it. Here's the project so far, with placeholder audio files: http://www.quasecinema.org/expo/
What I have done to play the audio files is a gigantic node tree
, with 100 connections. When the user clicks on a painting, the corresponding audio plays.Could the audio picking be done by scripting? To make things easier, each speaker has the same name of the painting, like object "paintingABC" has a speaker named "paintingABC.Speaker".
It would be great if the script could also stop all other audio playing before playing the selected one.
Thank you very much!
04 May 2017 11:49
Hi Alexandre, welcome to the forum and thanks for your kind words!
setup_speaker_logic() function should be called after the scene was loaded, for example, in the standard "load_cb" function. You can find more info about it and blend4web scripting here: Application Development.
Could the audio picking be done by scripting? To make things easier, each speaker has the same name of the painting, like object "paintingABC" has a speaker named "paintingABC.Speaker".Yes, this can be done by the following snippet:
It would be great if the script could also stop all other audio playing before playing the selected one.
var m_cont = require("container");
var m_input = require("input");
var m_mouse = require("mouse");
var m_scenes = require("scenes");
var m_sfx = require("sfx");
var _prev_played_speaker = null;
function setup_speaker_logic() {
var canvas_elem = m_cont.get_canvas();
m_input.add_click_listener(canvas_elem, function(event) {
var x = m_mouse.get_coords_x(event);
var y = m_mouse.get_coords_y(event);
var obj = m_scenes.pick_object(x, y);
if (obj) {
var obj_name = m_scenes.get_object_name(obj);
if (_prev_played_speaker && m_sfx.is_playing(_prev_played_speaker))
m_sfx.stop(_prev_played_speaker);
var speaker_obj = m_scenes.get_object_by_name(obj_name + ".Speaker");
m_sfx.play(speaker_obj);
_prev_played_speaker = speaker_obj;
}
});
}
setup_speaker_logic() function should be called after the scene was loaded, for example, in the standard "load_cb" function. You can find more info about it and blend4web scripting here: Application Development.
05 May 2017 00:05
Hello Ivan. Looks GREAT! Thank you.
I can understand the code and learned a lot from it… but I cannot make it work. It doesn't throw an error, but doesn't play the speakers.
The blend file originating the JSON has the objectname and objectname.Speaker structure.
Here's my fotografia.js file:
I can understand the code and learned a lot from it… but I cannot make it work. It doesn't throw an error, but doesn't play the speakers.
The blend file originating the JSON has the objectname and objectname.Speaker structure.
Here's my fotografia.js file:
"use strict"
// register the application module
b4w.register("fotografia_app", function(exports, require) {
// import modules used by the app
var m_app = require("app");
var m_cfg = require("config");
var m_data = require("data");
var m_preloader = require("preloader");
var m_ver = require("version");
var m_cont = require("container");
var m_input = require("input");
var m_mouse = require("mouse");
var m_scenes = require("scenes");
var m_sfx = require("sfx");
var _prev_played_speaker = null;
var DEBUG = (m_ver.type() == "DEBUG"); // detect application mode
var APP_ASSETS_PATH = m_cfg.get_assets_path("fotografia"); // auto detect assets path
//////////////////////////////////////////////////////////////////////
// function setup_speaker_logic
//////////////////////////////////////////////////////////////////////
function setup_speaker_logic() {
var canvas_elem = m_cont.get_canvas();
m_input.add_click_listener(canvas_elem, function(event) {
var x = m_mouse.get_coords_x(event);
var y = m_mouse.get_coords_y(event);
var obj = m_scenes.pick_object(x, y);
if (obj) {
var obj_name = m_scenes.get_object_name(obj);
if (_prev_played_speaker && m_sfx.is_playing(_prev_played_speaker))
m_sfx.stop(_prev_played_speaker);
var speaker_obj = m_scenes.get_object_by_name(obj_name + ".Speaker");
m_sfx.play(speaker_obj);
_prev_played_speaker = speaker_obj;
}
});
}
//////////////////////////////////////////////////////////////////////
// export the method to initialize the app (called at the bottom of this file)
//////////////////////////////////////////////////////////////////////
exports.init = function() {
m_app.init({
canvas_container_id: "main_canvas_container",
callback: init_cb,
show_fps: DEBUG,
console_verbose: DEBUG,
autoresize: true,
physics_enabled: true,
assets_dds_available: true
});
}
//////////////////////////////////////////////////////////////////////
// callback executed when the app is initialized
//////////////////////////////////////////////////////////////////////
function init_cb(canvas_elem, success) {
if (!success) {
console.log("b4w init failure");
return;
}
m_preloader.create_preloader();
// ignore right-click on the canvas element
canvas_elem.oncontextmenu = function(e) {
e.preventDefault();
e.stopPropagation();
return false;
};
load();
}
//////////////////////////////////////////////////////////////////////
// load the scene data
//////////////////////////////////////////////////////////////////////
function load() {
m_data.load(APP_ASSETS_PATH + "fotografia.json", load_cb, preloader_cb);
}
//////////////////////////////////////////////////////////////////////
// update the app's preloader
//////////////////////////////////////////////////////////////////////
function preloader_cb(percentage) {
m_preloader.update_preloader(percentage);
}
//////////////////////////////////////////////////////////////////////
// callback executed when the scene data is loaded
//////////////////////////////////////////////////////////////////////
function load_cb(data_id, success) {
if (!success) {
console.log("b4w load failure");
return;
}
m_app.enable_fps_controls();
m_app.set_cam_smooth_factor(FPS_GAME_CAM_SMOOTH_FACTOR);
m_app.set_cam_sensitivity(FPS_GAME_SENSITIVITY);
setup_speaker_logic();
}
});
//////////////////////////////////////////////////////////////////////
// import the app module and start the app by calling the init method
//////////////////////////////////////////////////////////////////////
b4w.require("fotografia_app").init();
05 May 2017 01:36
It works!!! Had to make the objects selectable.
Thank you very much!
Thank you very much!