This is a small summary of some new features of the latest A-Frame Inspector version that may pass unnoticed to some.

Image assets dialog

v0.5.0 introduces an assets management window to import textures in your scene without having to manually type URLs.

The updated texture widget includes the following elements:

  • Preview thumbnail: It will open the image assets dialog.
  • Input box: Hover the mouse over it and it will show the complete URL of the asset.
  • Open in a new tab: It will open a new tab with the full sized texture.
  • Clear: It will clear the value of the attribute.

Once the image assets dialog is open, you’ll see the list of images currently being used in your project, with the previous selection for the widget, if any, highlighted. You could click on any image from this gallery to set the value of the map attribute you’re editing.

If you want to include new images to this list, click on the LOAD TEXTURE button, and you’ll see several options to include a new image on your project:

Here you could add new image assets to your scene by:

  • Entering an image by URL.
  • Opening an Uploadcare dialog that will let you upload files from your computer, Google Drive, Dropbox, etc., and from other sources in. (This is currently uploading the images to our uploadcare account, so please be kind :); we’re working on letting you define your API key to use your own account.)
  • Drag-and-dropping files from your computer. This will upload to Uploadcare too.
  • Choosing a sample asset from the curated list of images we’ve included, which are populated from a GitHub repository for sample A-Frame assets, sample-assets.

Once added your image you’ll see a thumbnail showing some information about the image and the name that will have this texture in your project (the asset ID that can be referenced as #name).

After editing the name if needed, click on LOAD TEXTURE and it will add your texture to the list of assets available in your project, showing you the list of textures you saw when you opened the dialog.

Now just clicking on the newly created texture, you’ll set the new value for the attribute you were editing.

New features in the scene graph

Toggle visibility

  • Toggle panels: New shortcuts:
  • 1: Toggle scene-graph panel
  • 2: Toggle components panel
  • TAB: Toggle both panels
  • Toggle entity visibility of each element in the scene is now possible by pressing the eye icon in the scene graph.

Broader scene-graph filtering

In the previous version of the Inspector, we could filter by the tag name of the entity or by its id. In the new version, the filter will take into account also the names of the components that each entity has and the values of the attributes of these components.

For example, if we enter red, it will return the entities whose name contains red but also all of them with a red color in the material component. We could also filter by geometry, or directly by sphere, and so on.

We’ve added the keyboard shortcut Control/Command + f to set the focus on the filter input for a faster filtering, and the Esc key clears the filter.

Cut, copy and paste

Thanks to @vershwal, it’s now possible to cut, copy, and paste entities using the expected shortcuts:

  • Control/Command + x: Cut selected entity
  • Control/Command + c: Copy selected entity
  • Control/Command + v: Paste the latest copied or cut entity

New shortcuts

The list of the new shortcuts introduced in this version:

  • 1: Toggle scene-graph panel
  • 2: Toggle components panel
  • Tab: Toggle both scene-graph and components panel
  • Control/Command + x: Cut selected entity
  • Control/Command + c: Copy selected entity
  • Control/Command + v: Paste a new entity
  • Control/Command + f: Focus a scene-graph filter

Remember that you can press the h key to show the list of all the shortcuts available: