Как обращаться к функциям приложения извне?

27 декабря 2015 17:46
Привет, блендфорвебовцы !!! Сначала поздравляю с юбилеем ! 5 лет это уже приличный срок для веб-проекта, желаю успехов в развитии! И с наступающим ! Всем Бобра!

Интересующий меня вопрос скорее всего весьма примитивен, но ответа на него я пока не нашел, поэтому спрашиваю напрямую у разработчиков.

Как обратиться к функции приложения извне (при помощи onclick или из другой функции)? Например, у меня есть функция, отвечающая за остановку анимации в приложении:
function stop_animation (e) {
    if (e.preventDefault)
        e.preventDefault();

    m_animation.stop(_previous_selected_obj);
}


Я хочу повесить событие остановки анимации на кнопку (на событие onClick).
<div class="btnStop" onclick="stop_animation()">Стоп</div>


Очевидно, что это не будет работать, так как функция инициализируется только внутри приложения, но наверняка можно к ней обратиться напрямую или нет?
27 декабря 2015 21:11
Ну это же основы javascript.
Как самое простое, это повесить событие на объект, получив его по id.
Пример

Вообще от себя рекомендую по учить основы работы с DOM деревом и по тренироваться в работе с объектами.
Не стой, где попало… Попадет еще раз.
http://naviris.ru/
27 декабря 2015 22:56
Наверно надо еще сказать что событие надо указать "внутри приложения"
/**
 * callback executed when the app is initizalized 
 */
function init_cb(canvas_elem, success) {

    if (!success) {
        console.log("b4w init failure");
        return;
    }
//например тут 
document.getElementById('ButtonId').onclick = stop_animation;
}
    load();
}

<div id="ButtonId" class="btnStop" >Стоп</div>


Ну я делаю так

точнее я делаю так
ButtonId.onclick = stop_animation; 

Дорогу осилит идущий
27 декабря 2015 23:57
Спасибо, большое!

Каюсь, не хватает знаний в программировании. Исправлюсь.

24 марта 2016 16:02
А как можно обратиться к функции, определённой внутри одного из модулей из программы не входящей в область видимости?
24 марта 2016 16:20

Ответ на сообщение пользователя Igisdara
А как можно обратиться к функции, определённой внутри одного из модулей из программы не входящей в область видимости?

Добрый день.

Вы имеете ввиду, что у вас есть несколько ваших (пользовательских, написанных вами) модулей и вы хотите использовать в одном из них функции, объявленные в другом?

"use strict";


b4w.register("first_module", function(exports, require) {

var m_app       = require("app");
var m_data      = require("data");
//.................
exports.very_important_func = very_important_func;
function very_important_func(params) {
//.................
}
//.................
};

b4w.register("second_module", function(exports, require) {

var m_app       = require("app");
var m_data      = require("data");
var m_first_mod   = require("first_module");
//.................
function func(params) {
//.................
m_first_mod.very_important_func(params)
//.................
}
//.................
};


Функция very_important_func объявлена в одном модуле, а используется в другом. Для подобного существует объект exports. аналогичным образом можно предавать константы и т.д.
Разработчик Blend4Web
24 марта 2016 16:21
Между модулями общаемся так:
b4w.register("tools", function(exports, require) {

	exports.get_head = function(){
		//...
		var head = 23;
		return head;
	}

});

b4w.register("chat", function(exports, require) {

	var m_tools = require("tools");
	
	var tools_head = m_tools.get_head();
	// tools_head == 23

});


Обратиться к функции модуля из "корня" можно попробовать так
var _tools = b4w.require('tools');
var tools_head = _tools.get_head();
// tools_head == 23
Не стой, где попало… Попадет еще раз.
http://naviris.ru/
17 апреля 2017 04:37
И все-таки, как реализовать запуск функции на onClick? Я столкнулся с ситуацией, когда id кнопки заранее не известен. Например, есть объект которому нужно поменять цвет. Заранее палитра цветов не известна и у кнопки смены цвета не присвоен ID. Более того, не известно итоговое количество таких кнопок, зато известно, что на событие можно повесить функцию смены цвета с параметром нового:

<img src="button.png" onClick="ChangeColor([255,255,255])">


По идее в коде должна быть функция для смены цвета:

ChangeColor (newColor){
m_mat.set_diffuse_color(object, "Material", css_to_rgb(newColor[0], newColor[1], newColor[2]));
}


Но т.к. функция внутри приложения, достучаться к ней не получится.

Пока я решил проблему объявив глобальную переменную ColorBuffer и передавая через нее значение цвета в b4w.


ChangeColor (newColor){
ColorBuffer = newColor;
}

*****b4w********************

m_mat.set_diffuse_color(object, "Material", css_to_rgb(ColorBuffer[0], ColorBuffer[1], ColorBufferr[2]));


Но мне кажется этот вариант реализации может служить только заплаткой, тем более, что встает проблема отслеживания изменения значения переменной colorBuffer, сейчас оно реализовано на таймер, тогда как логичнее было бы запускать функцию на клик.

Подскажите, как правильно реализовать задачу?
17 апреля 2017 23:56
И все-таки, как реализовать запуск функции на onClick?

На самом деле всё просто.
В документации есть такой метод у модуля Input, с помощью которого можно повесить на нажатие любой кнопки любое событие (вообще вешать это можно как угодно, я предпочитаю jQuery, т.к. через него работать с DOM проще и понятнее), всё что вам нужно, это научиться вешать события внутри какого-нибудь модуля, чтобы получить доступ к методу изменения цвета.

Например, у вас всегда есть основной ваш модуль приложения, который создается в основном JS. Через него вы подключаете модули движка, также в нём можно написать эти методы, которые вешаются на клик на неизвестные кнопки (через функцию создания этих кнопок). В методах у вас есть полный доступ ко всем подключенным модулям.

Не знаю даже как проще написать)

Что касается варианта с постоянным сканированием какой-либо переменное - бросьте это. В JS отличная событийная модель и коль вы не подвержены декларативному стилю (а зря, такая штука…), то можно запросто навешать кучу слушателей определённого события в окружении. Будь то нажатие кнопки, окончание какого-то времени или чего угодно. Но только если это действительно нужно.

Как пример не самого верного, но понятного и подходящего для вас решения могу научить выкидывать вашу функцию наружу:

//...
b4w.register("my_project_app", function (exports, require) {

// import modules used by the app
    var m_app = require("app");
    //...

    window.changeColor = function(newColor){
        m_mat.set_diffuse_color(object, "Material", css_to_rgb(newColor[0], newColor[1], newColor[2]));
    }
});

// Мы снаружи уже и работает вызов
changeColor(color);


Но, это не есть круто, т.к. вы логику конкретного модуля прокидываете наружу, лучше вообще всю логику делать внутри модулей b4w, для этого вы можете регистрировать сколько угодно своих собственных модулей, описывать их, вызывать их и в них подключать модули движка.

Красота будет
18 апреля 2017 13:46
Дмитрий, спасибо!
 
Пожалуйста, зарегистрируйтесь или войдите под своей учетной записью , чтобы оставлять сообщения.