Skip to content

Commit beb8a71

Browse files
dmarcosdmarcos
committed
Refactors component updates to minimize the number of string parsings and
component data stringifications (fixes #1311)
1 parent e799790 commit beb8a71

34 files changed

+503
-244
lines changed

‎examples/stress-animation/index.html‎

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Animation</title>
6+
<meta name="description" content="Animation - A-Frame">
7+
<script src="../../dist/aframe.js"></script>
8+
</head>
9+
<body>
10+
<a-scene stats="true">
11+
<a-assets>
12+
<a-mixin id="ball" geometry="primitive: sphere; radius:1" material="shader: flat; color: red">
13+
</a-mixin>
14+
<a-mixin id="opacity" attribute="material.opacity" dur="2000" direction="alternate" fill="forwards"
15+
ease="linear" repeat="indefinite" from="0.3" to="1.0"><a-mixin>
16+
<a-mixin id="spin" attribute="rotation" dur="4000"
17+
repeat="indefinite" easing="linear" dur="3000" to="0 0 360"><a-mixin>
18+
</a-assets>
19+
20+
<a-entity position="0 0 80">
21+
<a-entity camera look-controls wasd-controls></a-entity>
22+
</a-entity>
23+
24+
<a-entity id="fans"></a-entity>
25+
26+
</a-scene>
27+
</body>
28+
<script>
29+
var i;
30+
var fansEl = document.querySelector('#fans');
31+
var numRows = 4;
32+
var numFans = 3
33+
var numFanRows = 3;
34+
var numBalls = 11;
35+
var ball =
36+
'<a-entity>' +
37+
'<a-entity mixin="ball">' +
38+
'<a-animation mixin="opacity"></a-animation>' +
39+
'</a-entity>' +
40+
'</a-entity>';
41+
var ballEl;
42+
var rowEl;
43+
var ballInitX = -15;
44+
var fanInitX = -60;
45+
var fanInitY = -40;
46+
var offset;
47+
48+
for (var n = 0; n < numFanRows; ++n) {
49+
var fanRow = document.createElement('a-entity');
50+
fanRow.setAttribute('position', { x: 0, y: fanInitY - (n * fanInitY), z: 0 });
51+
for (var k = 0; k < numFans; ++k) {
52+
var fanEl = document.createElement('a-entity');
53+
fanEl.setAttribute('position', { x: fanInitX - (k * fanInitX), y: 0, z: 0});
54+
var animationEl = document.createElement('a-animation');
55+
animationEl.setAttribute('mixin', 'spin');
56+
fanEl.appendChild(animationEl);
57+
for (var i = 0; i < numRows; ++i) {
58+
var rowEl = document.createElement('a-entity');
59+
rowEl.setAttribute('rotation', { x: 0, y: 0, z: i * (180 / numRows) });
60+
for (var j = 0; j < numBalls; ++j) {
61+
offset = ballInitX + 3 * j;
62+
if (offset === 0) { continue; }
63+
var ballEl = document.createElement('a-entity');
64+
ballEl.setAttribute('position', { x: ballInitX + 3 * j, y: 0, z: 0 });
65+
ballEl.innerHTML = ball;
66+
animationEl = ballEl.querySelector('a-animation');
67+
animationEl.setAttribute('begin', Math.random() * 2000);
68+
rowEl.appendChild(ballEl)
69+
}
70+
fanEl.appendChild(rowEl);
71+
}
72+
fanRow.appendChild(fanEl);
73+
}
74+
fansEl.appendChild(fanRow);
75+
}
76+
</script>
77+
</html>

‎examples/test-panoexplorer/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@
8484

8585
var el = document.createElement('a-entity');
8686
el.dataset.id = idx;
87-
el.setAttribute('position', {x: xPos});
87+
el.setAttribute('position', {x: xPos, y: 0, z: 0});
8888
el.setAttribute('mixin', 'link');
8989
el.setAttribute('material', {shader: 'flat', src: pano.thumb});
9090
panos[idx].el = el;

‎src/components/camera.js‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,15 @@ module.exports.Component = registerComponent('camera', {
1919
*/
2020
init: function () {
2121
var camera = this.camera = new THREE.PerspectiveCamera();
22+
this.system.addCamera(this.el);
2223
this.el.setObject3D('camera', camera);
2324
},
2425

2526
/**
2627
* Remove camera on remove (callback).
2728
*/
2829
remove: function () {
30+
this.system.removeCamera(this.el);
2931
this.el.removeObject3D('camera');
3032
},
3133

@@ -51,7 +53,7 @@ module.exports.Component = registerComponent('camera', {
5153
// If `active` property changes, or first update, handle active camera with system.
5254
if (data.active && system.activeCameraEl !== this.el) {
5355
// Camera enabled. Set camera to this camera.
54-
system.setActiveCamera(el, camera);
56+
system.setActiveCamera(el);
5557
} else if (!data.active && system.activeCameraEl === this.el) {
5658
// Camera disabled. Set camera to another camera.
5759
system.disableActiveCamera();

‎src/components/obj-model.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* global HTMLElement */
21
var debug = require('../utils/debug');
32
var registerComponent = require('../core/component').registerComponent;
43
var THREE = require('../lib/three');
@@ -39,7 +38,7 @@ module.exports.Component = registerComponent('obj-model', {
3938

4039
if (mtlUrl) {
4140
// .OBJ with an .MTL.
42-
if (HTMLElement.prototype.getAttribute.call(el, 'material')) {
41+
if (el.components.material && el.components.material.attr !== undefined) {
4342
warn('Material component properties are ignored when a .MTL is provided');
4443
}
4544
mtlLoader.setBaseUrl(mtlUrl.substr(0, mtlUrl.lastIndexOf('/') + 1));

0 commit comments

Comments
 (0)