Meteor-files: How can I implement CollectionFS's isUploaded feature?

[urakagi]

I'm trying to migrate from CollectionFS to Meteor-Files but is now stock at codes using isUploaded function.

The scenario is, the UI is rendered by a jade template, and it has code like this:

each attachments
  .attachment-item
    a.attachment-thumbnail.swipebox(href="{{url}}" title="{{name}}")
      if isUploaded
        if isImage
          img.attachment-thumbnail-img(src="{{url}}")
        else
          span.attachment-thumbnail-ext= extension
      else
        +spinner

I tried to add a meta field called isUploaded and use a helper to return this.meta.isUploaded, but I found neither in the onUploaded function nor .on('end', callback) I can get the FileCursor object to update meta.isUploaded. When I call Attachments.findOne(fileObj._id) it always returns undefined.

Since the UI is jade templated it's hard for me to do like "receive event, pass to another jade template, and update templated UI". I'm not that familiar to meteor-jade templating, so I'd rather have a reactive variable (function?) solution.

So is there a way to simply implement CollectionFS's isUploaded feature? Thank you!

[dr-dimitru]

Hello @urakagi

I'm not familiar with CFS's isUploaded feature, but here's how it can be done with Meteor-Files:

1. One of the options is to use a flag on meta object as you've mentioned above, the only thing is you got to publish/subscribe on this record before calling Attachments.findOne(fileObj._id)
2. Actually, you don't need to use isUploaded as if you're using pub/sub and a record exists in the collection — it's indeed uploaded

Take a look at this demo project, listing uploaded files as easy as that:

<template name="uploadedFiles">
  {{#if uploadedFiles.count}}
    <ul>
      {{#each file in uploadedFiles.each}}
        <li>
          <a href="{{file.link}}?download=true" download="{{file.name}}">{{file.name}}</a>
        </li>
      {{/each}}
    </ul>
  {{else}}
    <div>No files uploaded, yet</div>
  {{/if}}
</template>

[urakagi]

Thank you @dr-dimitru,

I actually use subscribe/publish feature, and if I upload a second file, the onUploaded() function can see the previous uploaded file. But in the onUploaded() callback, I can't get the file just uploaded.

The demo project works because the template can see the change of Image.find() since it's reactive, but in my case, there's nothing changed between start and end.

So if there's something reactive to file is uploaded I can just use it, or I need to re-build all related UI :(

[dr-dimitru]

@urakagi use second argument from uploaded and/or end event, see in the docs — https://github.com/VeliovGroup/Meteor-Files/wiki/Insert-(Upload)

[urakagi]

@dr-dimitru That argument is a plain object, not a FileCursor - it means I can't write meta into the database and trigger reactive UI changes. (Something like fileObj.meta.boo = 'bar' does nothing)

Am I misunderstanding this, and it can be used to write data into the Mongo database?

[dr-dimitru]

@urakagi to write (e.g. update) a record in MongoDB you have to use it as any other MongoDB collection (no magic here), good place to update your record would be onAfterUpload hook or afterUpload event

Lear more about Mongo.Collection instances here

[urakagi]

Great! Seems like it's what I want. Thank you very much.

dr.dimitru [e-mail] 於 2019年11月25日 週一 下午10:22寫道：

@urakagi https://github.com/urakagi to write (e.g. update) a record in
MongoDB you have to use it as any other MongoDB collection (no magic here),
good place to update your record would be onAfterUpload hook
https://github.com/VeliovGroup/Meteor-Files/blob/master/docs/constructor.md
or afterUpload event
https://github.com/VeliovGroup/Meteor-Files/blob/master/docs/constructor.md#event-map

Lear more about Mongo.Collection instances here
https://github.com/VeliovGroup/Meteor-Files/wiki/Collection-Instances

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/VeliovGroup/Meteor-Files/issues/718?email_source=notifications&email_token=AASCEPFM6WNLELCW2VH77D3QVPNRRA5CNFSM4JP6JXT2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEFCRYFA#issuecomment-558177300,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/AASCEPGMLNOHKENHTJAFW7DQVPNRRANCNFSM4JP6JXTQ
.

--
Romulus Urakagi Ts'ai

[dr-dimitru]

Feel free to close it in case if the issue is solved on your end.

[urakagi]

Sorry @dr-dimitru, I solved the uploaded problem but another problem comes - Meteor-Files does not really insert records into the MongoDB, so reactive UI does not respond in the timing of "File selected, upload starts but yet complete".

The current code is, there's a list of uploaded files, and when I upload a file it will increase show the uploaded file with "Uploading..." hint, and when the upload completes it will show the content of the file.

The list is a reactive UI using Files.find(...), so the best way is to actually insert the record into database. Is this even possible in Meteor-Files? Thank you!

[dr-dimitru]

does not really insert records into the MongoDB

🤔 where are you looking at? Where list of uploaded files coming from? It's indeed storing file's meta-data in regular mongodb collection and records.

[urakagi]

@dr-dimitru The list is coming from the .find() method of the same FilesCollection. This is what I observe: When the file starts to upload, the record is not inserted yet. Once the file is uploaded completely, I can see the record is inserted.

I tried to upload a big file, confirming the .on('start') is called, then I use meteor mongo to check the database and there's nothing updated.

Is this behavior meant to be or it's not so I'm misunderstanding something else? Thank you.

[dr-dimitru]

@urakagi

When the file starts to upload, the record is not inserted yet. Once the file is uploaded completely, I can see the record is inserted.

This sounds very much correct, are you expecting different behaviour?

[urakagi]

@dr-dimitru Yes, CollectionFS's behavior is: When the file starts to upload, insert a record with uploaded=false and leave relative meta null. When the upload is completed, update uploaded=true and the relative meta.

[dr-dimitru]

@urakagi ostrio:files package has different behaviour, MongoDB record added only after full file upload. As an option — try to subscribe on undocumented __pre-collection, which is used to track and resume unfinished uploads

[urakagi]

@dr-dimitru Got it, I think I need to modify the interface since __pre-colletion also is not the solution.
I'll close this issue, thank you very much.

[dr-dimitru]

@urakagi I'm sorry if my answer wasn't something you've been looking for. It's different package and it never meant to copy API of CFS. I recommend to at the demos codebase for inspiration and ideas how to handle and display files which are in upload progress and not yet in primary DB.

Please support this project with:

• Star this package on GitHub;
• Like at Facebook;
• Follow on Twitter;
• Support via patreon;
• Support via PayPal;
• Check and star our other open source projects on GitHub.