superframe
superframe copied to clipboard
[template] Is it possible to use external templates as assets?
Hi again! :D
Is it currently possible to use an external template file as an A-Frame asset?
I figured there was added benefit to having the templates defined as assets, but have not seen it working with an external file.
Here are some of the things I've tried:
index.html:
<a-assets>
<script id="red-ball" src="./templates/red-ball.template" type="text/html"></script>
<!--
<script id="red-ball" src="./templates/red-ball.html" type="text/html"></script>
<a-asset-item id="red-ball" src="./templates/red-ball.template" type="text/html"></a-asset-item>
<a-asset-item id="red-ball" src="./templates/red-ball.html" type="text/html"></a-asset-item>
-->
</a-assets>
<a-entity template="src: #red-ball" position="0 1 -3"><a-entity>
red-ball.template || red-ball.html:
<a-entity geometry="primitive: sphere;" material="color: red; roughness: 0;"></a-entity>
It works if I embed the code locally in the script tag or if I use the source directly (template="src: ./templates/red-ball.template"
) , but this can get messy if there are a lot of templates or if there is a complex directory structure. Also, not sure if there is a downside to the latter since they are not defined as assets.
Any guidance would be great. Thanks, Kevin.
Code: https://glitch.com/edit/#!/lake-squid
Demo: https://lake-squid.glitch.me/
Note that the red ball is not appearing.
So, I realized that I could set a template as a mixin, which occurred to me when I was considering object pooling and seems to do what I was asking in the original question regarding having external templates as assets:
<a-mixin id="ball" template="src: ./templates/ball.html;"></a-mixin>
However, if I add a data attribute like data-color="red"
to the mixin definition, it fails completely and throws an error:
TypeError: Unable to resolve expression:
args: ""
body: "color"
If I add it to the entity utilizing the mixin:
<a-entity mixin="ball" data-color="red"></a-entity>
That works and the color takes, so this may suit my needs for now.
If you have a minute, I'd love your input on whether or not this is a good practice.
Thanks.
Code: https://glitch.com/edit/#!/rainy-chinchilla
Demo: https://rainy-chinchilla.glitch.me/