search

publiclab / plots2

a collaborative knowledge-exchange platform in Rails; we welcome first-time contributors! :balloon:
https://publiclab.org
GNU General Public License v3.0
958 stars 1.83k forks source link

Basic UI design for file upload for Sensor Data Library #5671

Open IshaGupta18 opened 5 years ago

IshaGupta18 commented 5 years ago

So commencing the summer of code here's the very basic thing to start with for the Sensor Data project:

Designing the UI for file upload:

I plan to design it something like this (just the "Upload File" section)

image

I hope the design is okay @namangupta01 . If you have any suggestions, please chime in!

Since the file is to be stored against a user, we can do it asynchronously (as mentioned in my proposal) by sending the file as data to the controller that will save it.

But before any of the work at the backend, I just want to get started with the basic page design, so that the rest can be handled smoothly.

Any suggestions are welcome!

IshaGupta18 commented 5 years ago

@jywarren @namangupta01 @SidharthBansal @gauravano is this okay for starters?

SidharthBansal commented 5 years ago

Great start Isha. Just wanna know which functionality is built till yet? A. Upload with link B. Drag file. In case both of them are implemented it is great start. If something is left, then we can work at the back end first and then come back here. What do you suggest Isha?

IshaGupta18 commented 5 years ago

Right now, I am generating a model and controller file for csvfiles, so that I have a basic MVC structure ready, then I am gonna start building the 2 things you have listed. I have created this issue so that I can get a consensus on what everyone thinks and can start the work! Thanks a lot!

SidharthBansal commented 5 years ago

UI looks perfect to me. You should now start focusing on the back end.

IshaGupta18 commented 5 years ago

The UI isn't designed yet, this is the wireframe, I have to design it first!

SidharthBansal commented 5 years ago

Cool. What will you place in the buttons, if back end is not created? I mean to say, its better to complete the back end and then front end.

On Tue, May 7, 2019, 8:04 PM Isha Gupta notifications@github.com wrote:

The UI isn't designed yet, this is the wireframe, I have to design it first!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/plots2/issues/5671#issuecomment-490106157, or mute the thread https://github.com/notifications/unsubscribe-auth/AFAAEQ26D2BDNUJL2S7IWMLPUGHOJANCNFSM4HLJATCA .

IshaGupta18 commented 5 years ago

Yes! So this is the basic MVC I have created for the CSVfiles This is what the table looks like:

image

The controller image

The model:

image

And I have added a filename column to the user table:

image

I am really sorry if I am elaborating too much. It's just the first day and I want to be super sure if I have started off correctly or not. Thanks a lot!

SidharthBansal commented 5 years ago

I guess it is right way. Where is the pr?

On Tue, May 7, 2019, 8:21 PM Isha Gupta notifications@github.com wrote:

Yes! So this is the basic MVC I have created for the CSVfiles This is what the table looks like:

[image: image] https://user-images.githubusercontent.com/40794215/57309149-320d0500-7105-11e9-8de6-aa08f90ef08f.png

The controller [image: image] https://user-images.githubusercontent.com/40794215/57309069-0a1da180-7105-11e9-8798-19ede4a53bcc.png

The model:

[image: image] https://user-images.githubusercontent.com/40794215/57309238-5537b480-7105-11e9-898e-fb4ceb157793.png

And I have added a filename column to the user table:

[image: image] https://user-images.githubusercontent.com/40794215/57309334-8dd78e00-7105-11e9-9056-a337d48bcd0e.png

I am really sorry if I am elaborating too much. It's just the first day and I want to be super sure if I have started off correctly or not. Thanks a lot!

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/plots2/issues/5671#issuecomment-490113347, or mute the thread https://github.com/notifications/unsubscribe-auth/AFAAEQ6A4OUZ7OGKGYYAJXLPUGJNXANCNFSM4HLJATCA .

IshaGupta18 commented 5 years ago

Here's the PR for the first half of this issue! Thanks a lot!

jywarren commented 5 years ago

Hi, Isha! I wanted to note my suggestion on your proposal here from today: https://publiclab.org/notes/IshaGupta18/03-04-2019/gsoc-proposal-sensor-data-upload-and-display-library

I think actually we may want to set aside the integration portion for later -- and even then, I think the current ability to upload CSVs using the normal file upload is pretty reasonable.

I encourage you to think about how to develop this as a stand-alone JavaScript library that gets to a pretty high level of functionality before starting the integration phase. This'll give you some time to decide on architectural questions, code organization, etc, and also enable you to commit code faster without having to worry about the overall Rails app yet. And it'll be good to connect with @namangupta01 as well whose proposal includes parts of this project. What do you think?

Thank you for your amazing energy!!!!

jywarren commented 5 years ago

So, for one, you could create a very minimal UI on an HTML page in a new repository, and start iterating on that quite quickly, without yet thinking about integration. That'll let you get started real fast!

I can make a new repository and give you and @namangupta01 admin rights to it for now. What name?

publiclab/data-grapher to keep it simple for now? Or something more fun?

IshaGupta18 commented 5 years ago

Oh this name's good. This would be great! Let's get started then! Thanks a lot.

IshaGupta18 commented 5 years ago

And so what do you think about the PR I have made above. That is done just for uploading the CSV files against the current user. Is that okay?

jywarren commented 5 years ago

Well, I think that since users can currently already upload CSVs, the main thing we really need is a way to view all CSVs uploaded by a user. So, this may be a controller action, not a whole new table, you know?

I've made https://github.com/publiclab/simple-data-grapher/ and made @namangupta01 and @IshaGupta18 admins on it.

It publishes to https://publiclab.github.io/simple-data-grapher/ when you push to the gh-pages branch!

jywarren commented 5 years ago

I love the design at top. You could open an issue there and begin copying your proposal steps into it, and also @namangupta01 can, and you could start seeing what parts of your proposals overlap and where you both want to start work on it!

IshaGupta18 commented 5 years ago

Oh, actually I thought that by making a new table, it would be easier to handle the library because a lot of stuff is to be done on the uploaded files, like I mentioned in the proposal. But that be okay if we don't wanna use that.

IshaGupta18 commented 5 years ago

About the new repo, thank you so much for giving us an entire workspace. Although, I am not sure how to begin working on it. I created the PR above, so that a view on a route say /data-grapher could be rendered, where the design will be implemented. Could you please explain how that can be done through the new repo?

jywarren commented 5 years ago

I think let's start with the existing infrastructure, and see how far we can go that way, and consider an expansion as a follow-up once a lot of the other portions of the project are running? There is always a balance to be considered between new systems adding complexity and efficient re-use of existing systems. But since the existing system provides the most basic needed functions, I think we can put off the decision a bit! Thank you Isha!!!

On Tue, May 7, 2019 at 11:37 AM Isha Gupta notifications@github.com wrote:

Oh, actually I thought that by making a new table, it would be easier to handle the library because a lot of stuff is to be done on the uploaded files, like I mentioned in the proposal. But that be okay if we don't wanna use that.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/plots2/issues/5671#issuecomment-490132648, or mute the thread https://github.com/notifications/unsubscribe-auth/AAAF6JYJZPU63GXY46SRADTPUGOZJANCNFSM4HLJATCA .

IshaGupta18 commented 5 years ago

So this means that I can create this design here in plots2 for now, before moving it up to the new repo?

jywarren commented 5 years ago

I think you can start by making an index.html file in the new repository, and including in the necessary files. Take a look over projects like https://github.com/publiclab/PublicLab.Editor, https://github.com/publiclab/webjack/, and https://github.com/publiclab/inline-markdown-editor/ and ask questions of some of the folks above to get a sense of how you can work in a stand-alone library like this. Some time may be needed to get the basics set up. But start with a prototype and see how it goes! Maybe, fork one of those and play around with it a bit, read the docs. This is a fun part of the process! Good luck and thank you, Isha!!!

On Tue, May 7, 2019 at 11:43 AM Isha Gupta notifications@github.com wrote:

So this means that I can create this design here in plots2 for now, before moving it up to the new repo?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/plots2/issues/5671#issuecomment-490134928, or mute the thread https://github.com/notifications/unsubscribe-auth/AAAF6J3U74JTYBGQSZ7EK6LPUGPOXANCNFSM4HLJATCA .

IshaGupta18 commented 5 years ago

Oh okay, I can start with index.html and see how it goes. I did read up about the editor while writing the proposal, and I saw that the basic functioning of views and controllers is in plots2 itself and the library's stylesheets and scripts are imported to apply to the files in plots2, that's why I decided to begin building something on the same line. https://github.com/publiclab/plots2/blob/master/app/views/editor/rich.html.erb

So do you think we should do something like this, since the project is similar to editor ie a lot of JS. We can create the views here and call in the scripts from the new repo. What do you think? Thanks a lot!

jywarren commented 5 years ago

That's right! Yes, and that file corresponds to this demo file: https://github.com/publiclab/PublicLab.Editor/blob/master/examples/index.html which is designed to be functional even without a parent app. Great!

On Tue, May 7, 2019 at 11:55 AM Isha Gupta notifications@github.com wrote:

Oh okay, I can start with index.html and see how it goes. I did read up about the editor while writing the proposal, and I saw that the basic functioning of views and controllers is in plots2 itself and the library's stylesheets and scripts are imported to apply to the files in plots2, that's why I decided to begin building something on the same line.

https://github.com/publiclab/plots2/blob/master/app/views/editor/rich.html.erb

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/plots2/issues/5671#issuecomment-490139957, or mute the thread https://github.com/notifications/unsubscribe-auth/AAAF6JYQCEZTM4OJNMQMUPLPUGQ6DANCNFSM4HLJATCA .

IshaGupta18 commented 5 years ago

Also, about the PR, should we do the new table thing, so that the code remains a little more maintainable and modular, instead of grouping everything about files in one place. It could probably be a little more efficient too. What do you all think? We can discuss over it!

IshaGupta18 commented 5 years ago

I am actually asking this because once we'll have to integrate like in PL editor, we would need boundaries like the editor controller, model, and view which couple well together. I wanted to achieve something similar here, might help in maintaining uniformity too. Your views?

jywarren commented 5 years ago

Hi, Isha - I think there are pros and cons, for sure, and yeah, let's discuss! Let's continue thinking about it, but the important part is that we can proceed in a stand-alone library for now, without the decision about a separate table needing to block progress. So there's no rush to come to a decision in a hurry.

Let's also be sure our discussion of the plots2 storage is in a good location, not just in the comments at the bottom of an unrelated PR, you know? Maybe open an issue from your proposal text laying out the pros and cons?

Thanks a lot!!!

jywarren commented 5 years ago

Also noting that this model is quite short and simple: https://github.com/publiclab/plots2/blob/master/app/models/image.rb

We could develop a new controller but use the same model, as one option.

IshaGupta18 commented 5 years ago

I agree with you, let's have a more organized discussion on it but keep the work going and not let this block the work. But once we get flowing, I think it will be good to land on a decision, because we will be needing it to save a CSV file against a user and then taking the rest of the work from there on. Thanks a lot!

IshaGupta18 commented 5 years ago

@jywarren @namangupta01 I am happy to tell you that the basic UI for file upload is ready in the `simple-data-grapher' and you can view it on https://publiclab.github.io/simple-data-grapher/upload_file.html. This is just the basic one, I'll be coming up with the toggle navbar and the rest of the 2 panels, once the parsing function is implemented! Thanks a lot!

namangupta01 commented 5 years ago

Hi @jywarren and @IshaGupta18, sorry for not replying. I have my exams going on and also had one today. Have created the basic project structure for the project. Have a look.

jywarren commented 5 years ago

Good luck with your exams!!!

On Wed, May 8, 2019 at 11:34 AM Naman Gupta notifications@github.com wrote:

Hi @jywarren https://github.com/jywarren and @IshaGupta18 https://github.com/IshaGupta18, sorry for not replying. I have my exams going on and also had one today. Have created the basic project structure for the project. Have a look.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/plots2/issues/5671#issuecomment-490535494, or mute the thread https://github.com/notifications/unsubscribe-auth/AAAF6J3AFFT6IJRS5RE2K5DPULXFNANCNFSM4HLJATCA .