Added js code. Could anyone be kind to look at this code and ...
04 March 2018 03:40
….,let me know why the sliders are not loading?
Something is out of order and the function that create the sliders is not working.
Im using the morphing snippet example. Im not good with javascript and I know some "expert eyes here" can eyeball easily the problem.
The rest of formatting, sizing, etc, i can do. It is a syntax issue I think.
Please. I would be very thankful !!!
Something is out of order and the function that create the sliders is not working.
Im using the morphing snippet example. Im not good with javascript and I know some "expert eyes here" can eyeball easily the problem.
The rest of formatting, sizing, etc, i can do. It is a syntax issue I think.
Please. I would be very thankful !!!
"use strict"
b4w.register("ARETRY_main", function(exports, require) {
// import modules used by the app
var m_app = b4w.app;
var m_cfg = b4w.config;
var m_data = b4w.data;
var m_preloader = b4w.preloader;
var m_ver = b4w.version;
var m_scenes = b4w.scenes;
var m_obj = b4w.objects;
var m_cont = b4w.container;
// detect application mode
var DEBUG = (m_ver.type() == "DEBUG");
// automatically detect assets path
var APP_ASSETS_PATH = m_cfg.get_assets_path("ARETRY");
/**
* 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: true,
autoresize: true,
assets_dds_available: !DEBUG,
assets_min50_available: !DEBUG,
console_verbose: 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 + "ARETRY.json", load_cb, preloader_cb);
}
function load_cb(data_id) {
var main_interface_container = document.createElement("div");
main_interface_container.className = "main_sliders_container";
main_interface_container.setAttribute("id", "main_sliders_container");
document.body.appendChild(main_interface_container);
m_app.enable_camera_controls(false, false, false, null, true);
var obj = m_scenes.get_object_by_name("JUST-HEAD-SPINE.001");
if (obj)
create_interface(obj);
}
/**
* 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_camera_controls();
// place your code here
function create_interface(obj) {
if (!m_geom.check_shape_keys(obj))
return;
create_dual_slider(obj, "fatten", "shrink", "Weight");
var shape_keys_names = m_geom.get_shape_keys_names(obj);
for (var i = 0; i < shape_keys_names.length; i++) {
if (shape_keys_names[i] == "fatten" || shape_keys_names[i] == "shrink")
continue;
create_slider(obj, shape_keys_names[i], shape_keys_names[i]);
}
}
function create_slider(obj, key_name, slider_name) {
var slider = init_slider(slider_name);
var value_label = document.getElementById(slider_name);
var value = m_geom.get_shape_key_value(obj, key_name);
slider.min = 0;
slider.max = 1;
slider.step = 0.02;
slider.value = value;
value_label.textContent = slider.value;
function slider_changed(e) {
m_geom.set_shape_key_value(obj, key_name, slider.value);
m_obj.update_boundings(obj);
value_label.textContent = slider.value;
}
if (is_ie11())
slider.onchange = slider_changed;
else
slider.oninput = slider_changed;
}
function create_dual_slider(obj, key_name_1, key_name_2, slider_name) {
var slider = init_slider(slider_name);
var value_label = document.getElementById(slider_name);
var value = m_geom.get_shape_key_value(obj, key_name_1)
- m_geom.get_shape_key_value(obj, key_name_2)
slider.min = -1;
slider.max = 1;
slider.step = 0.02;
slider.value = value;
value_label.textContent = Math.floor(slider.value*100)/100;
function slider_changed(e) {
if (slider.value < 0) {
var key_name = key_name_2;
var reset_name = key_name_1;
var value = -slider.value;
} else {
var key_name = key_name_1;
var reset_name = key_name_2;
var value = slider.value;
}
m_geom.set_shape_key_value(obj, key_name, value);
if (m_geom.get_shape_key_value(obj, reset_name))
m_geom.set_shape_key_value(obj, reset_name, 0);
value_label.textContent = slider.value;
}
if (is_ie11())
slider.onchange = slider_changed;
else
slider.oninput = slider_changed;
}
function init_slider(name) {
var container = document.createElement("div");
container.className = "slider_container";
var name_label = document.createElement("label");
name_label.className = "text_label";
name_label.textContent = name;
var slider = document.createElement("input");
slider.className = "input_slider";
slider.setAttribute("type", "range");
var value_label = document.createElement("label");
value_label.className = "value_label";
value_label.setAttribute("id", name);
container.appendChild(name_label);
container.appendChild(slider);
container.appendChild(value_label);
var main_slider_container = document.getElementById("main_sliders_container");
main_slider_container.appendChild(container);
return slider;
}
function is_ie11() {
return !(window.ActiveXObject) && "ActiveXObject" in window;
}
}
});
// import the app module and start the app by calling the init method
b4w.require("ARETRY_main").init();
05 March 2018 23:05
You have duplicated load_cb. And create_interface(obj) is not invoking. The second load_cb is calling. Note that it has something strange in it's body, find the closing brace.
Alexander (Blend4Web Team)
twitter
06 March 2018 05:16
Alexander, I apologize for being so persistent. I need to get this right. I can pay you for your time and I think i wd feel better in that case. I decided to do this differently.
Here is the code with the sliders that loads properly without issues:
And this is the code that loads correctly with the logic nodes only:
IM SO SORRY AND i feel really bad for bugging so much. I need a way that when the project with the logic nodes load, sees the sliders I did for it and loads it as well. They both work. I know I still have a lot of tune-ups to do on it, but first I need to get it to load to start working on them. I work exhaustively today on this and it is beyond my current knowledge of javascript. Please tell me how much and I can pay for your time if you want. This is really worth for me. Thank you again!! and again…
Here is the code with the sliders that loads properly without issues:
"use strict"
import b4w from "blend4web";
var m_app = b4w.app;
var m_data = b4w.data;
var m_scenes = b4w.scenes;
var m_geom = b4w.geometry;
var m_cfg = b4w.config;
var m_obj = b4w.objects;
var m_version = b4w.version;
var DEBUG = (m_version.type() === "DEBUG");
var APP_ASSETS_PATH = m_cfg.get_assets_path("01-29-JOINEDKEYS");
export function init() {
m_app.init({
canvas_container_id: "main_canvas_container",
callback: init_cb,
show_fps: true,
autoresize: true,
assets_dds_available: !DEBUG,
assets_min50_available: !DEBUG,
console_verbose: true
});
}
function init_cb(canvas_elem, success) {
if (!success) {
console.log("b4w init failure");
return;
}
load();
}
function load() {
m_data.load(APP_ASSETS_PATH + "morphing.json", load_cb);
}
function load_cb(data_id) {
var main_interface_container = document.createElement("div");
main_interface_container.className = "main_sliders_container";
main_interface_container.setAttribute("id", "main_sliders_container");
document.body.appendChild(main_interface_container);
m_app.enable_camera_controls(false, false, false, null, true);
var obj = m_scenes.get_object_by_name("JUST-HEAD-SPINE.001");
if (obj)
create_interface(obj);
}
function create_interface(obj) {
if (!m_geom.check_shape_keys(obj))
return;
create_dual_slider(obj, "fatten", "shrink", "Weight");
var shape_keys_names = m_geom.get_shape_keys_names(obj);
for (var i = 0; i < shape_keys_names.length; i++) {
if (shape_keys_names[i] == "fatten" || shape_keys_names[i] == "shrink")
continue;
create_slider(obj, shape_keys_names[i], shape_keys_names[i]);
}
}
function create_slider(obj, key_name, slider_name) {
var slider = init_slider(slider_name);
var value_label = document.getElementById(slider_name);
var value = m_geom.get_shape_key_value(obj, key_name);
slider.min = 0;
slider.max = 1;
slider.step = 0.02;
slider.value = value;
value_label.textContent = slider.value;
function slider_changed(e) {
m_geom.set_shape_key_value(obj, key_name, slider.value);
m_obj.update_boundings(obj);
value_label.textContent = slider.value;
}
if (is_ie11())
slider.onchange = slider_changed;
else
slider.oninput = slider_changed;
}
function create_dual_slider(obj, key_name_1, key_name_2, slider_name) {
var slider = init_slider(slider_name);
var value_label = document.getElementById(slider_name);
var value = m_geom.get_shape_key_value(obj, key_name_1)
- m_geom.get_shape_key_value(obj, key_name_2)
slider.min = -1;
slider.max = 1;
slider.step = 0.02;
slider.value = value;
value_label.textContent = Math.floor(slider.value*100)/100;
function slider_changed(e) {
if (slider.value < 0) {
var key_name = key_name_2;
var reset_name = key_name_1;
var value = -slider.value;
} else {
var key_name = key_name_1;
var reset_name = key_name_2;
var value = slider.value;
}
m_geom.set_shape_key_value(obj, key_name, value);
if (m_geom.get_shape_key_value(obj, reset_name))
m_geom.set_shape_key_value(obj, reset_name, 0);
value_label.textContent = slider.value;
}
if (is_ie11())
slider.onchange = slider_changed;
else
slider.oninput = slider_changed;
}
function init_slider(name) {
var container = document.createElement("div");
container.className = "slider_container";
var name_label = document.createElement("label");
name_label.className = "text_label";
name_label.textContent = name;
var slider = document.createElement("input");
slider.className = "input_slider";
slider.setAttribute("type", "range");
var value_label = document.createElement("label");
value_label.className = "value_label";
value_label.setAttribute("id", name);
container.appendChild(name_label);
container.appendChild(slider);
container.appendChild(value_label);
var main_slider_container = document.getElementById("main_sliders_container");
main_slider_container.appendChild(container);
return slider;
}
function is_ie11() {
return !(window.ActiveXObject) && "ActiveXObject" in window;
}
init();
And this is the code that loads correctly with the logic nodes only:
"use strict"
// register the application module
b4w.register("01PIA-PROJECT_main", 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");
// detect application mode
var DEBUG = (m_ver.type() == "DEBUG");
// automatically detect assets path
var APP_ASSETS_PATH = m_cfg.get_assets_path("01PIA-PROJECT");
/**
* 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
});
}
/**
* 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 + "01PIA-PROJECT.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_camera_controls();
// place your code here
}
});
// import the app module and start the app by calling the init method
b4w.require("01PIA-PROJECT_main").init();
IM SO SORRY AND i feel really bad for bugging so much. I need a way that when the project with the logic nodes load, sees the sliders I did for it and loads it as well. They both work. I know I still have a lot of tune-ups to do on it, but first I need to get it to load to start working on them. I work exhaustively today on this and it is beyond my current knowledge of javascript. Please tell me how much and I can pay for your time if you want. This is really worth for me. Thank you again!! and again…
06 March 2018 05:19
By the way, "JUST-HEAD-SPINE.001" its the name of the center object in the scene that i did shape keys utilized by the sliders in the code. I will be checking every hour over here if you need anything.
07 March 2018 00:54
My help can be very fast if you will attach the full sources. Otherwise I have to guess everytime. If you have something secret in your blend file, you can strip it - just keep the simplified objects which are used in the code.
Alexander (Blend4Web Team)
twitter
08 March 2018 02:39
Have you seen this answer?https://www.blend4web.com/en/forums/post/21001/
I've attached there the project which was exported with Project Manager which you can import on your side. That's what I wanted you to do. I can't import you project it has no required metadata. Thus I have to make unwanted and meaningless things and it's exhausting. Are you sure you can't export?
I've attached there the project which was exported with Project Manager which you can import on your side. That's what I wanted you to do. I can't import you project it has no required metadata. Thus I have to make unwanted and meaningless things and it's exhausting. Are you sure you can't export?
Alexander (Blend4Web Team)
twitter
08 March 2018 03:56
Man…you are awesome!! i just now got to it…let me see what I can do…i will follow your instructions and will let you know what happens..
09 March 2018 01:13
ALL GOOD, THANKS TO YOU!!!! I dont think american companies get to the level of attention and dedication of technical support that you guys give!! Alexander Romanov Rocks!!!! The product is awesome and the service you provide as well!!! I wouldnt be able to finish it if it wasnt for you!! Actually Im not finished, but Im close to the end. Keep up the fantastic service and attention you guys from Moscow give to the rest of the world!!