I cannot reproduce, can you tell me where you are seeing this problem? I’m trying to go to that url and it works.
For example, if you visit this url http://assets-lib.glitch.me in Safari, do you see both images, or just one?
I cannot reproduce, can you tell me where you are seeing this problem? I’m trying to go to that url and it works.
For example, if you visit this url http://assets-lib.glitch.me in Safari, do you see both images, or just one?
I’m seeing the problem in https://draggable-cubes.glitch.me
I see both of your images, and see no errors in the console. But if I look at the console with my draggable-cubes example, I see the errors.
I tried to load https://draggable-cubes.glitch.me with Safari, and I don’t see any error.
Are you running the latest version of Safari?
Define “latest”? I am still running 10.0.3, MacOS 10.12.3. I haven’t updated to any of the 10.12.4 beta’s or the 10.12.4 that was release today! Planning on updating tonight.
If you are running something more recent, that may be the cause: it appears preflight + redirects + CORS used to be disallowed, and when the spec changed, Safari was one of the last to update? https://github.com/google/shaka-player/issues/666
This is the version of Safari that I am using:
And this is the only error that I see in the console when I go to draggable-cubes:
Perhaps you are still seeing the errors because of browser caching? Perhaps clearing the Safari cache might fix the issue for you as well.
Sigh. Same version of safari. I don’t see that google error, btw. If I empty (or completely disable) cache’s, nothing changes. If I disable cross-origin restrictions, it goes away (obviously).
But, if I quit safari and reload the page, I don’t get the error. Until I refresh a few times, then the error comes back. So, my guess: safari bug.
Let’s see what happens with 10.12.4 tonight.
Alright,
we will keep the bug open on our backlog though, to make sure we don’t forget to check in the future
Thanks for your cooperation! I hope the current state works well enough for you, if you have any other problem don’t esitate to ask!
And… let’s see what happens with the new version of Safari! Keep us posted!
So, I think it’s working with the new Safari … but I’m not 100% sure (the joy of having the loading be deep inside someone else’s code). The previous errors go away, but I am worried that the file (the one that wasn’t downloading before) shows as unavailable in the resource browser in the debugger. That may just mean the Safari debugger can’t download it, I guess? And, of course, there are now new errors (mostly harmless, and unrelated) showing up!
Change is good, I hear. Will let you know how things pan out.
TL;DR I’m having the same problems. Texture images referenced inside 3D dae files are not loaded. In other words: I’d love a user (noob) friendly way to add files, or a noob tutorial on file organizing: explaining cdn and assets, …
A year ago I created a scene in Blender for a music album, afterwards it seemed like a fun experiment to try and animate it in A-Frame. The bands site where it was hosted is offline. So I thought of redoing it on glitch, to further experiment/enhance.
I’ve got basic web knowledge. That’s what I loved about A-Frame. I’m not experienced in using JavaScript.
I’ve got dae models with textures, the textures are inside the main folder; so all I need is the cdn hosted dae files to know that the textures are in the same assets folder. Would I need to change the paths/filenames inside the dae file? Or is there a simpler way using the assets-lib referenced in this thread?
The project: electrocat.glitch.me ; for easily viewing the content of a dae file i’ve created a file there as well (it’s not used, just there for reference).
After working through this with the help above, I’d say the asset-lib would work. You would just need to upload all the contents of the DAE files and rename them appropriately.
To make this easier for folks in the future, it seems a solution would be:
re paths in names: that’s a great suggestion. When the assets component was original written folder support from the html file api was pretty sketchy. But this may be possible now so I’ve added it to the feature backlog. Thanks
There may also be more we could do ui wise to help with managing assets uploaded with paths. Something we’ll look into as well.
Thanks for the asset-lib
suggestion, and putting it in the backlog!
For beginning 3D web developers, I’m not sure how clear that model is. We’d have to start exposing backend files in our tutorials, if you export the project I think that’d mean you have to run that specific server, and uploading one-by-one is not optimal.
The best thing I’ve come up with so far is to recommend dump assets into a GitHub repo, publish to GitHub pages via the Settings, and serve via rawgit.com.
I got the textures loading just fine and as expected by using the assets-lib script.
However I feel a bit out of my league as I’ve only accomplished it by some ‘blind’ copy-pasting between the example and my own electrocat A-frame project.
It’s indeed a far from intuitive experience for an intermediate 3D/Web developer.
E.g. I’ve got no prior knowledge of packages & the use of back-end / front-end folders loading automatically once using ‘package.json’ , etc…
I was just learning trough trial and error, which is fun, but was more cumbersome than just using my own server and doing some plain old copy pasting there. None the less I can imagine the benefits and ease of use for more experienced users.
I do still believe that having a solid way to structure and organising files for a project are a necessity. While beautifully chaotic and nicely illustrated, the current folder overview is not the best user experience.
So to conclude my rant onto stepping into this rabbit hole via A-Frame:
The assets-lib script readme could perhaps have a more elaborate guide with steps to perform:
Update. I had to rewrite the assets.js script a bit to accomplish two things.
First, dealing with deleted assets. When an asset is deleted, it appears it’s line in the .glitch-assets file remains there, and a new line with it’s uuid and a deleted field is added:
{"uuid":"F43O5bp7fb4ObA7B","deleted":true}
I managed this by creating an object out of the parsed lines of the file, where each entry is a property whose name is the uuid
. So, by iterating through, these deleted: true
lines overwrite the previous line with the asset data. Kind of a hack, I suppose.
Second, dealing with caching in the CDN. If you delete and asset and upload a new version with the same name, they get the same URL. In the glitch UI, when you grab the URL, it puts a timestamp on the end (?37423684736
) to make each version unique. So I parsed the data
field into a number and added that to the URL redirect.
Here’s the updated code, if anyone wants it. I’m sure there are more elegant/compact ways of doing some of this.
var express = require('express');
var fs = require('fs');
var router = express.Router();
var content = fs.readFileSync('.glitch-assets', 'utf8');
var str = content.split("\n").join(",\n");
var elems = JSON.parse('{"elems":[' + str + "{}]}").elems;
elems.pop(); // get rid of that last empty element I added to account for the final ","
var myAssets = {};
for (var val of elems) {
myAssets[val.uuid] = val;
}
router.use((request, response) => {
response.header("Access-Control-Allow-Origin", "*");
response.header("Access-Control-Allow-Methods", "GET");
response.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization");
console.log(request.path);
var name = request.path.substring(1); // get rid of leading /. used to be encodeURIComponent(request.path) + '"';
console.log(name)
for (val in myAssets) {
if (myAssets.hasOwnProperty(val)) {
var e = myAssets[val];
if (e.hasOwnProperty("name") && e.name === name) {
var time = 0;
if (e.hasOwnProperty("date")) {
time = Date.parse(e.date);
}
var url = e.url + "?" + time;
console.log(url);
return response.redirect(url);
}
}
}
return response.sendStatus(404);
});
module.exports = router;
What would it take to get asset.js to handle space in filenames? I uploaded some pdfs to my assets folder, but only the ones without spaces are viewable by going to (xxxxx).glitch.me/assets/(xxxx).pdf
Are the spaces not being url encoded, so replaced with ‘%20’?
They are not. For example, this link works:
( since it works the forums interface automatically replaced the URL so you can’t read it, but it was my glitch domain with “/assets/Shapes.pdf” added on)
But these do not:
http://encyclopediaofcode.glitch.me/assets/Matrix Intro.pdf
http://encyclopediaofcode.glitch.me/assets/Matrix%20Intro.pdf
http://encyclopediaofcode.glitch.me/assets/Matrix-Intro.pdf
The actual URLs are, respectively,
and
Edited a note in, to mention that the forums automatically hides my original link
(Apologies for bumping an old topic, but this seemed to be the main place for talking about assets.js)
Ok, update assets.js in your project with the code at https://glitch.com/edit/#!/assets-lib?path=assets.js and files with spaces will now work
It works now! Thank you for this fix! (Hopefully it was a new fix and not a case of me using an old version of the file)