brentongunning / voodoo.js Goto Github PK
View Code? Open in Web Editor NEWJavascript framework for mixing 2D and 3D
Home Page: https://brentongunning.github.io/voodoo.js
License: MIT License
Javascript framework for mixing 2D and 3D
Home Page: https://brentongunning.github.io/voodoo.js
License: MIT License
There should be a store, or cache, where the user can put loaded geometry and materials so they don't have to be reloaded each time an instance of the control is created.
this.view.store.add();
this.view.store.remove().
Same for model.
Store.add(object, opt_name, opt_organization);
Model.organization
The utility function findAbsolutePosition is not a great long-term solution for positioning 3D objects relative to 2D. The user is still forced to calculate bounding rectangles.
One idea:
-Model.attach(element)
-This begins to fire elementmove events whenever the element boundaries change. The object passed to the event contains the element's bounding rectangle, size and its centerpoint since that is a common way to position elements.
-This event would not fire every frame, unlike the user positioning with update today.
Thoughts
-Model.unattach() needed?
-Is this fundamental enough to be part of the contructor, so that if the user passes and object with element in it to the constructor we automatically attach?
Needs more thinking.
To save on battery life
2D always has an element being focused on. Somehow, Voodoo should support this too, and ideally, it would be great if somehow 3D focus was integrated with the dom too.
Developer should be able to fire their own events that the user can listen to by using the same 'on' interface that voodoo fires events over. This can be useful for say a toggle button where the user might want to respond to the toggle up and toggle down events separately.
for local coordinate systems
Test on mobile firefox. The main page's github logo may be obsuring the menu. See if Voodoo works as expected. If there are any issues, fix them.
When an object is destroyed, it should fire a destroy event that users may listen to.
On Win7, type about:flags in Chrome and enable smooth scrolling. Scroll down down with the mouse wheel is fast, but scrolling up is slower and feels off. The Canary build works better.
This may be a bug in the current Smooth Scroll implementation, and since smooth scroll is still experimental, going to keep this in the backlog until the next release of Chrome.
Would be great to have a LICENSE file with the license information and some info about the license the web page and the README.
Like SSAO
Right now the version number has to be changed in too many places when doing a release. A script should automate this.
http://www.voodoojs.com/
return ERR_NAME_NOT_RESOLVED.
Right now we still clip halfway at Z=0. No need.
For supporting overflow hidden and similar constructors. Basically, be able to block out regions. Draws the normal scene by default like the stencil view.
If an object isn't positioned AND scaled relative to a 2D div, then its pixels will not be correct when the user page zooms in and out.
Noticed on FF23 they sometimes fail:
Total 54 tests (Passed: 51; Fails: 3; Errors: 0) (7476.00 ms)
Chrome 28.0.1500.95 Windows: Run 27 tests (Passed: 27; Fails: 0; Errors 0) (1777.00 ms)
Firefox 23.0 Windows: Run 27 tests (Passed: 24; Fails: 3; Errors 0) (7476.00 ms)
EventTests.testMouseEvents failed (615.00 ms): AssertError: expected 1 but was 0
EventTests.prototype.testMouseEvents@http://localhost:46576/test/C:/Users/brentgun/Documents/GitHub/voodoo/test/EventTests.js:110
EventTests.testStencilClicks failed (365.00 ms): AssertError: expected 1 but was 0
EventTests.prototype.testStencilClicks@http://localhost:46576/test/C:/Users/brentgun/Documents/GitHub/voodoo/test/EventTests.js:162
EventTests.testMultipleTriggerIds failed (366.00 ms): AssertError: expected 1 but was 0
EventTests.prototype.testMultipleTriggerIds@http://localhost:46576/test/C:/Users/brentgun/Documents/GitHub/voodoo/test/EventTests.js:223
Tests failed: Tests failed. See log for details.
[Error] Testing failed
Sample 2 is too complicated for what it is designed to demo --- stencil views. The checkboxes at the top are fine, but instead of three cubbies we should just have one and it should be an inward beveled picture frame. It should also go deeper than the current cubbies so that toggling stencils is more obvious.
There are two types of shadowing:
Hello,
I am trying to use Voodoo for my application and I am not starting off very good.
I tried to use the Torus example as shown at the bottom of the main page and when I change it to a cube, it doesn't work. CubeGeometry doesn't show anything, which I found it has been changed to BoxGeometry. BoxGeometry is undefined, so it seems that 0.9.0 is using an older version of Three.js?
This library seems perfect for my needs, but from what I read on the blog it seems that there isn't that much drive for it, and it seems that support is affected by that.
Thanks!
EDIT: Netbeans installed Three.js and it was ver 58, so that was the issue. It works now.
Use python and mimic what's done with Batch today.
Run tests and samples to make sure nothing breaks
zMin and zMax were originally written with the idea of having multiple of 3D layers sandwiching 2D content, but the more I think about it, I'm not sure we want to support this. I still can't think of a good use case, so instead, I think we should focus on the 99.99% scenario and make a simple View.layer = Both|Above|Below. This is much more intuitive.
Hello all,
I'm really enjoying this library so far, and I think it's the perfect one for my project, and I'm surprised it's not as big as it should be.
I was trying the traffic light example where hover would light up the light and clicking would throw an alert event.
It took me awhile to get rid of the divs, and display the objects normally(couldn't get the sphere to, but could get a cube to).
When looking at the cube, the color itself is red, and when hovering, it turns black, when in reality hover is set to red, so it's the opposite.
When I take my mouse off it still is black, and just sits there. Clicking does work, but that's it.
Here's my code.
<title>Voodoo Sample - Mouse Events</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.js"></script> <script src="js/voodoo.min.debug.js"></script> <style type="text/css"> #content { position:absolute; left:0px; top:300px; width:100%; } #redLight { width:150px; height:150px; } #yellowLight { width:150px; height:150px; } #greenLight { width:150px; height:150px; } </style>This sample demonstrates how to respond to create triggers that respond to mouse events. Move your mouse and click the objects below.
</center>
It also seems that the lights with the div are dark red, yellow and green, and the hover makes it regular, while for some reason my cube is black (which is correct according to the value above), but doesn't seem to be utilizing the ambient color, which I noticed is an issue in my other example (still need to work on that one so I think that will one), but this one seems to just be broken, but it might be my fault too.
Thanks :).
// I am not good at English.
// I hope that my message gets through to you.
Get source code at voodoo learn more page (http://www.voodoojs.com/demos/ClockScreencastDemo.zip) , and run.
-> It's work.
Update voodoo.min.debug.js to ver 0.8.8
-> The clock hands doesn't work.
scrolling page
-> It's work, but one time.
testing browser
Right now the mouseup event only fires on an object when the mouse is over it, but this is problematic for say buttons that want to be notified regardless to animate back to their up state. Instead, mouseup should fire on the current object but also fire on the last object that had a mousedown. The model property of the event should be set to the new model though so the user can differentiate between these types of mouse events.
Sample 3 is just a demo of mouse events, so there is no need to use the stencil view and complicate things. Three simple spheres that are clickable and change color is sufficient.
Somehow, creating the engine the way we do today isn't totally clean. First we have to create an options object. Then we have to set each option individually. Then we have to pass this object to the Engine and assign that engine to voodoo.engine. This can be simpler.
There should be an antialias quality engine option, and when high quality is specified, we create a new seam layer that renders an unantialiased thin seam. This should only be used when the object is in both the above and below layers though.
I found some bugs manually that should have been caught by unit tests
Like focus and blur, tabindex is a fundamental part of 2D pages and somehow Voodoo should work with it too.
See Layer. This standard should be enforced across all the project since it is inconsistent right now.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.