Webplayer Control panel customization: possible?
18 November 2015 14:42
Hi all,
I'm very new to Blend4web, but I really appreciate this tool, and the results are fantastic.
So I've purchased the Blend4Web SDK Pro version to have full access to all functionalities.
We are in mind to use the Webplayer to show our 3D contents, but we want to customize the control panel of the webplayer itself, leaving all the buttons related to social network connections (Facebook, Twitter, etc.), and also adding a brand new control panel to add some functionalities and interactions with the 3D model.
My questions are:
1. Is it possible to customize the control panel?
2. is ti possible to add a new customized control panel?
3. is it possible to interact with my 3D content via HTML5 buttons?
4. is it possible to obtain a HTML5 output without the embedded 2D control panel buttons and external CSS and js files more understandable and friendly?
thank you in advance.
Francesco
I'm very new to Blend4web, but I really appreciate this tool, and the results are fantastic.
So I've purchased the Blend4Web SDK Pro version to have full access to all functionalities.
We are in mind to use the Webplayer to show our 3D contents, but we want to customize the control panel of the webplayer itself, leaving all the buttons related to social network connections (Facebook, Twitter, etc.), and also adding a brand new control panel to add some functionalities and interactions with the 3D model.
My questions are:
1. Is it possible to customize the control panel?
2. is ti possible to add a new customized control panel?
3. is it possible to interact with my 3D content via HTML5 buttons?
4. is it possible to obtain a HTML5 output without the embedded 2D control panel buttons and external CSS and js files more understandable and friendly?
thank you in advance.
Francesco
18 November 2015 17:27
Hello and welcome to the forum!
1) In the webplayer.css you can change any image as required. If you want to encode images to Base64 strings, you can use a service like this: https://www.base64-image.de/
2) In the webplayer_dev.html file you can add/remove buttons. They are in the div tag with "buttons_container" id:
After you've made some changes to these two files you can compile webplayer with our new project manager with just one click.
1. Is it possible to customize the control panel?You need to modify two files under the sdk/apps_dev/webplayer folder:
2. is ti possible to add a new customized control panel?
1) In the webplayer.css you can change any image as required. If you want to encode images to Base64 strings, you can use a service like this: https://www.base64-image.de/
2) In the webplayer_dev.html file you can add/remove buttons. They are in the div tag with "buttons_container" id:
<div id="buttons_container">
<div id="opened_button" class="control_panel_button"></div>
<div id="hor_button_section">
HERE YOU CAN PUT THE DESCRIPTION OF THE BUTTONS
</div>
</div>
After you've made some changes to these two files you can compile webplayer with our new project manager with just one click.
3. is it possible to interact with my 3D content via HTML5 buttons?Yes, it is possible. We have several tutorials, which use such kind of interactions. For example this or this. In both these tutorials controls are just simple html elements.
4. is it possible to obtain a HTML5 output without the embedded 2D control panel buttons and external CSS and js files more understandable and friendly?If I understood you correctly, you want to be able to change some page-elements without any coding, with only Blender's interface. For now, it is not possible, but our logic nodes constantly receive new abilities and this feature can also be supported in future.
18 November 2015 19:12
Thank you for your answers.
A little issue on your "index.html" page.
I tried to launch Project Manager under "tools" section, but the link is incorrect.
It searches a path like "../projects/" and so it reports an error "page not found".
How can I launch the Project Manager manually?
thank you.
A little issue on your "index.html" page.
I tried to launch Project Manager under "tools" section, but the link is incorrect.
It searches a path like "../projects/" and so it reports an error "page not found".
How can I launch the Project Manager manually?
thank you.
Isselnord S.r.l.
Digital Content Creation & Virtual Reality
Innovative Technologies Dept
Digital Content Creation & Virtual Reality
Innovative Technologies Dept
19 November 2015 00:09
How can I launch the Project Manager manually?Project Manager should be run from Blender. Switch to Blend4Web renderer and you will find the following button in the render section:
