remove default components

src/components/position.js

@@ -7,5 +7,10 @@ module.exports.Component = registerComponent('position', {
     var object3D = this.el.object3D;
     var data = this.data;
     object3D.position.set(data.x, data.y, data.z);
+  },
+
+  remove: function () {
+    // Pretty much for mixins.
+    this.el.object3D.position.set(0, 0, 0);
   }
 });

src/components/rotation.js

@@ -12,5 +12,10 @@ module.exports.Component = registerComponent('rotation', {
     var object3D = this.el.object3D;
     object3D.rotation.set(degToRad(data.x), degToRad(data.y), degToRad(data.z));
     object3D.rotation.order = 'YXZ';
+  },
+
+  remove: function () {
+    // Pretty much for mixins.
+    this.el.object3D.rotation.set(0, 0, 0);
   }
 });

src/components/scale.js

@@ -16,5 +16,10 @@ module.exports.Component = registerComponent('scale', {
     var y = data.y === 0 ? zeroScale : data.y;
     var z = data.z === 0 ? zeroScale : data.z;
     object3D.scale.set(x, y, z);
+  },
+
+  remove: function () {
+    // Pretty much for mixins.
+    this.el.object3D.scale.set(1, 1, 1);
   }
 });

src/components/scene/vr-mode-ui.js

@@ -85,7 +85,7 @@ module.exports.Component = registerComponent('vr-mode-ui', {
 
   remove: function () {
     [this.enterVREl, this.orientationModalEl].forEach(function (uiElement) {
-      if (uiElement) {
+      if (uiElement && uiElement.parentNode) {
         uiElement.parentNode.removeChild(uiElement);
       }
     });

src/core/a-entity.js

@@ -22,15 +22,6 @@ var MULTIPLE_COMPONENT_DELIMITER = '__';
  * @member {boolean} isPlaying - false if dynamic behavior of the entity is paused.
  */
 var proto = Object.create(ANode.prototype, {
-  defaultComponents: {
-    value: {
-      position: '',
-      rotation: '',
-      scale: '',
-      visible: ''
-    }
-  },
-
   createdCallback: {
     value: function () {
       this.components = {};
@@ -393,11 +384,6 @@ var proto = Object.create(ANode.prototype, {
   removeComponent: {
     value: function (name) {
       var component;
-      var isDefault;
-
-      // Don't remove default or mixed-in components.
-      isDefault = name in this.defaultComponents;
-      if (isDefault) { return; }
 
       component = this.components[name];
       if (!component) { return; }
@@ -459,14 +445,6 @@ var proto = Object.create(ANode.prototype, {
         if (isComponent(name)) { componentsToUpdate[name] = true; }
       }
 
-      // Initialze or update default components first.
-      for (name in this.defaultComponents) {
-        data = mergeComponentData(this.getDOMAttribute(name),
-                                  extraComponents && extraComponents[name]);
-        this.updateComponent(name, data);
-        delete componentsToUpdate[name];
-      }
-
       // Initialize or update rest of components.
       for (name in componentsToUpdate) {
         data = mergeComponentData(this.getDOMAttribute(name),
@@ -490,10 +468,9 @@ var proto = Object.create(ANode.prototype, {
   updateComponent: {
     value: function (attr, attrValue, clobber) {
       var component = this.components[attr];
-      var isDefault = attr in this.defaultComponents;
       if (component) {
         // Remove component.
-        if (attrValue === null && !isDefault) {
+        if (attrValue === null && !checkComponentDefined(this, attr)) {
           this.removeComponent(attr);
           return;
         }
@@ -522,8 +499,6 @@ var proto = Object.create(ANode.prototype, {
       // Remove component.
       if (component && propertyName === undefined) {
         this.removeComponent(attr);
-        // Do not remove the component from the DOM if default component.
-        if (this.components[attr]) { return; }
       }
 
       // Reset component property value.
@@ -693,15 +668,14 @@ var proto = Object.create(ANode.prototype, {
   flushToDOM: {
     value: function (recursive) {
       var components = this.components;
-      var defaultComponents = this.defaultComponents;
       var child;
       var children = this.children;
       var i;
       var key;
 
       // Flush entity's components to DOM.
       for (key in components) {
-        components[key].flushToDOM(key in defaultComponents);
+        components[key].flushToDOM();
       }
 
       // Recurse.
@@ -738,20 +712,6 @@ var proto = Object.create(ANode.prototype, {
     writable: window.debug
   },
 
-  /**
-   * `getAttribute` used to be `getDOMAttribute` and `getComputedAttribute` used to be
-   * what `getAttribute` is now. Now legacy code.
-   *
-   * @param {string} attr
-   * @returns {object|string} Object if component, else string.
-   */
-  getComputedAttribute: {
-    value: function (attr) {
-      warn('`getComputedAttribute` is deprecated. Use `getAttribute` instead.');
-      return this.getAttribute(attr);
-    }
-  },
-
   /**
    * If `attr` is a component, returns JUST the component data defined on the entity.
    * Like a partial version of `getComputedAttribute` as returned component data
@@ -809,9 +769,6 @@ var proto = Object.create(ANode.prototype, {
  * @returns {boolean}
  */
 function checkComponentDefined (el, name) {
-  // Check if default components contain the component.
-  if (el.defaultComponents[name] !== undefined) { return true; }
-
   // Check if element contains the component.
   if (el.components[name] && el.components[name].attrValue) { return true; }
 

src/core/scene/a-scene.js

@@ -35,15 +35,6 @@ var warn = utils.debug('core:a-scene:warn');
  */
 module.exports.AScene = registerElement('a-scene', {
   prototype: Object.create(AEntity.prototype, {
-    defaultComponents: {
-      value: {
-        'inspector': '',
-        'keyboard-shortcuts': '',
-        'screenshot': '',
-        'vr-mode-ui': ''
-      }
-    },
-
     createdCallback: {
       value: function () {
         this.isIOS = isIOS;
@@ -75,6 +66,12 @@ module.exports.AScene = registerElement('a-scene', {
         this.resize();
         this.addFullScreenStyles();
         initPostMessageAPI(this);
+
+        // Default components.
+        this.setAttribute('inspector', '');
+        this.setAttribute('keyboard-shortcuts', '');
+        this.setAttribute('screenshot', '');
+        this.setAttribute('vr-mode-ui', '');
       },
       writable: true
     },

tests/core/a-entity.test.js

@@ -544,20 +544,6 @@ suite('a-entity', function () {
       });
       el.appendChild(childEl);
     });
-
-    test('flushes default component values', function (done) {
-      var parentEl = this.el;
-      var el = document.createElement('a-entity');
-      el.addEventListener('loaded', function () {
-        el.flushToDOM();
-        assert.equal(HTMLElement.prototype.getAttribute.call(el, 'position'), '0 0 0');
-        assert.equal(HTMLElement.prototype.getAttribute.call(el, 'rotation'), '0 0 0');
-        assert.equal(HTMLElement.prototype.getAttribute.call(el, 'scale'), '1 1 1');
-        assert.equal(HTMLElement.prototype.getAttribute.call(el, 'visible'), 'true');
-        done();
-      });
-      parentEl.appendChild(el);
-    });
   });
 
   suite('detachedCallback', function () {
@@ -717,18 +703,6 @@ suite('a-entity', function () {
       assert.shallowDeepEqual(el.getDOMAttribute('material'), {});
     });
 
-    test('returns null for a default component if it is not set', function () {
-      var el = this.el;
-      assert.shallowDeepEqual(el.getDOMAttribute('position'), null);
-    });
-
-    test('returns parsed data if default component is set', function () {
-      var el = this.el;
-      var position = {x: 5, y: 6, z: 6};
-      el.setAttribute('position', position);
-      assert.shallowDeepEqual(el.getDOMAttribute('position'), position);
-    });
-
     test('returns partial component data', function () {
       var componentData;
       var el = this.el;
@@ -867,13 +841,6 @@ suite('a-entity', function () {
       assert.ok('height' in componentData);
     });
 
-    test('returns default value on a default component not set', function () {
-      var el = this.el;
-      var defaultPosition = {x: 0, y: 0, z: 0};
-      var elPosition = el.getAttribute('position');
-      assert.shallowDeepEqual(elPosition, defaultPosition);
-    });
-
     test('returns full data of a multiple component', function () {
       var componentData;
       var el = this.el;
@@ -926,11 +893,13 @@ suite('a-entity', function () {
       var el = this.el;
       var quaternion = new THREE.Quaternion();
       var euler = new THREE.Euler();
+      var rotation;
       euler.order = 'YXZ';
       euler.set(Math.PI / 2, Math.PI, 0);
       quaternion.setFromEuler(euler);
       el.object3D.quaternion.copy(quaternion);
-      assert.shallowDeepEqual(el.getAttribute('rotation'), {x: 90, y: 180, z: 0});
+      rotation = el.getAttribute('rotation');
+      assert.equal(Math.round(rotation.x), 90);
     });
 
     test('returns scale previously set with setAttribute', function () {
@@ -989,14 +958,6 @@ suite('a-entity', function () {
       assert.notOk(el.components.sound__test);
     });
 
-    test('does not remove default component', function () {
-      var el = this.el;
-      assert.ok('position' in el.components);
-      el.removeAttribute('position');
-      assert.equal(el.getDOMAttribute('position'), null);
-      assert.ok('position' in el.components);
-    });
-
     test('can remove mixed-in component', function () {
       var el = this.el;
       var mixinId = 'geometry';
@@ -1282,10 +1243,11 @@ suite('a-entity', function () {
       assert.equal(el.getAttribute('material').color, 'blue');
     });
 
-    test('remove a component', function () {
+    test('removes a component', function () {
       var el = this.el;
       el.components.material = new components.material.Component(el, {color: 'red'});
       assert.equal(el.getAttribute('material').color, 'red');
+      el.components.material.attrValue = null;
       el.updateComponent('material', null);
       assert.equal(el.components.material, undefined);
     });
@@ -1378,10 +1340,10 @@ suite('a-entity', function () {
       mixinFactory('rotation', {rotation: '10 20 45'});
       el.setAttribute('mixin', '  material\t\nposition \t  rotation\n  ');
       el.setAttribute('material', 'color: red');
+      assert.equal(el.mixinEls.length, 3);
       assert.shallowDeepEqual(el.getAttribute('material'), {shader: 'flat', color: 'red'});
       assert.shallowDeepEqual(el.getAttribute('position'), {x: 1, y: 2, z: 3});
       assert.shallowDeepEqual(el.getAttribute('rotation'), {x: 10, y: 20, z: 45});
-      assert.equal(el.mixinEls.length, 3);
     });
 
     test('clear mixin', function () {

tests/core/component.test.js

@@ -288,18 +288,6 @@ suite('Component', function () {
       });
     });
 
-    test('emits componentchanged for value', function (done) {
-      el.addEventListener('componentchanged', function (evt) {
-        if (evt.detail.name !== 'visible') { return; }
-        assert.equal(el.getAttribute('visible'), false);
-        assert.equal(evt.detail.name, 'visible');
-        done();
-      });
-      setTimeout(() => {
-        el.setAttribute('visible', false);
-      });
-    });
-
     test('does not emit componentchanged for multi-prop if not changed', function (done) {
       el.addEventListener('componentinitialized', function (evt) {
         if (evt.detail.name !== 'material') { return; }