Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

gltf-model update not working with assets #4341

Closed
paolis92 opened this issue Dec 9, 2019 · 6 comments · May be fixed by #4579
Closed

gltf-model update not working with assets #4341

paolis92 opened this issue Dec 9, 2019 · 6 comments · May be fixed by #4579

Comments

@paolis92
Copy link

paolis92 commented Dec 9, 2019

Description:

Since AFrame 0.9 it seems that gltf-model component is not working when using setAttribute to update the model with an asset id.

How to replicate:

The problem can be replicated here:
https://glitch.com/edit/#!/serious-sunspot?path=index.html:10:0

We have 2 models in the assets: stool and sofa.

We have 4 aframe versions available:

  1. 0.8.2
  2. 0.9.2
  3. master as of today (12/09/2019)
  4. aframe-master-build-data,that is the latest master with an edit at line 76705
    removed this // this.data = attrValue; with this this.data = this.buildData(attrValue);

The procedure to update the model can be done via console with:
let model = document.querySelector('[gltf-model]')
model.setAttribute('gltf-model', '#sofa')

If you change aframe versions, you will see that this will work on 0.8.2 (1) and the modified master (4) but it will not work with 0.9.2 (2) and latest master (3).

After some logging I found out that, when it works, the data of the gltf-model component is https://..
while when it does not work, the data is #asset-id
I found out that this.buildData is responsible for converting #asset-id to https://..

I think that this commit
5759e99#diff-af69d6ecdd80a14b4e4df0784d3dc8d9
might be responsible for this.

I look forward your response.

Regards, Marco
@fcor
Copy link
Contributor

fcor commented May 6, 2020 •
edited
Loading

I'm Facing this same issue with v1.0.4. I was updating some code from v.0.8.0 and setAttribute to update the model with an asset id doesn't work anymore.

I managed to "solve" it by removing the atttribute and then setting the new model.

myModel.removeAttribute("gltf-model");

...

myModel.setAttribute("gltf-model", "#newAsset");

@paolis92
Copy link
Author

paolis92 commented May 7, 2020

Hi fcor,
sorry for the late response.
That is my solution as well at the moment.

After more digging I found out that the problem occurs only with components that have isSingleProperty === true

I tested and transformed gltf-model schema in more properties from this:
schema: {type: 'model'},
to this:

schema: {
model: {type: 'model'},
foo: {type: 'string'}
}

and the update is working as expected.

As mentioned in the first comment, before buildData was done always and now only the first time during initialization.
No buildData means no parse of model value, so #asset-id is not transformed to assetUrl that is needed in data.

Another solution could be to force parse of singleProperties schemas like it happens for multiProperties or be more selective and do it only for assets.
For example from this: (updateComponent function present in src/core/component.js)

    if (this.isSingleProperty) {
      if (this.isObjectBased) {
        parseProperty(attrValue, this.schema);
      }
      // Single-property (already parsed).
      this.data = attrValue;
      return;
    }
    parseProperties(attrValue, this.schema, true, this.name);

to this:

   if (this.isSingleProperty) {
      if (this.isObjectBased) {
        parseProperty(attrValue, this.schema);
      }
      // assets need parsing
      if (this.schema.parse.name === "assetParse") {
        this.data = parseProperty(attrValue, this.schema);
        return;
      }
      // Single-property (already parsed).
      this.data = attrValue;
      return;
    }
    parseProperties(attrValue, this.schema, true, this.name);

As you can notice parseProperties(attrValue, this.schema, true, this.name); is for when isSingleProperty !== true

@paolis92 paolis92 mentioned this issue May 7, 2020
Open
@fcor
Copy link
Contributor

fcor commented May 7, 2020 •
edited
Loading

Great job on digging into it!

I managed to make it work as I mentioned earlier and worked fine locally, but when deploying the app to Firebase, GLTF files doesn't load and I'm always getting:

Error: JSON.parse: unexpected character at line 1 column 1 of the JSON data

Even in the first load, before trying to update.

Also, when trying to load a .obj I get this:

THREE.OBJLoader: Unexpected line: "<!DOCTYPE html>"

Weird thing is that everything works as expected running a local server.

@dmarcos Any suggestion 😃 ?

@paolis92
Copy link
Author

paolis92 commented May 7, 2020 •
edited
Loading

That seems more like a Firebase problem about resolving the src of the assets correctly.
--
In the network monitor you should see what is the response of the asset request.
I managed to replicated the obj loader error by passing this url as src https://aframe.io/docs/1.0.0/introduction/

@fcor
Copy link
Contributor

fcor commented May 7, 2020

Yes, that was it. Firebase was unable to resolve the src of the assets. It's working now, thanks!

@dmarcos
Copy link
Member

dmarcos commented Oct 23, 2020

It seems you figured out and everything is working. I close this and can reopen if necessary. Thanks

@dmarcos dmarcos closed this as completed Oct 23, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Asset property type needs to parse attrValue when updating paolis92/aframe
3 participants
@dmarcos @paolis92 @fcor