inovus-labs / resource-server

Just a simple file-server for effective sharing and access of learning resources among the fellows of Inovus Labs

Resource Server

The project aims at building a file-server for the effective sharing and access of learning resources among the fellows of Inovus Labs. Currently, its planned to be hosted locally (May change in the future)

Technology Stack

• Frontend : HTML, CSS, JavaScript, Bootstrap (Handlebars)
• Backend : Node.js
• Database : MySQL

---

How to contribute to the Project (Guidelines)

• Fork the Repository to your account
• Clone it to Local Machine
• Start contributing to the project...
• Commit and Push it to your remote Repository
• Create a Pull Request towards this Main Repository

---

What to contribute (Project Requirements)

Frontend

• Home Page
  • Searchbar with SEARCH button
• Upload File Page
  • Name (Autofill)
  • Drag 'n' Drop Area and CLICK HERE TO UPLOAD link within it
  • Description for the File
  • UPLOAD button
• Download File - A List with each item having (if):
  • Thumbnail or Preview (Not necessary)
  • Name of the File
  • Description of the File
  • Type of the File
  • Size of the File
  • DOWNLOAD button

Note:

• Using Illustrations (Instead of Images) as backgrounds is appreciated

Backend

• Home Page
  • Searchbar must assist with autocomplete feature
  • Searches for filenames in the SQL database
• Upload File Page
  • Drag 'n' Drop feature (By default, autofill the name field)
  • Upload files of any sizes (Various types)
• Download File
  • List down the resources along with DOWNLOAD button to download the file

---

Contributors

1. Arjun Krishna

resource-server's Issues

Drag and Drop - File Upload

Issue to tackle

• Create the drag and drop functionality for the existing File Upload Page
• New updations mustn't affect the existing file-browse-button feature
• When a file is dragged onto drop-zone some :hover effect will be ideal to have

Here's quick look at the existing File Upload Page:

Desktop View

Mobile View

• Happy Coding

MySQL jQuery UI Autocomplete Feature

Issue to tackle

• Get the File Name from MySQL Database and display it in the jQuery UI Autocomplete List
• When clicked on a list item, it must either just fill in the search bar (If leads directly to the resource, it's better...)
• Present version of Autocomplete is created using the sample code from the jQuery UI demo website (Direct Array fill)
• Think, we could use AJAX (keyup) to solve the issue

Here's quick look at the existing File Home Page:

Desktop View

Mobile View

• Happy Coding

Design a Better UI

• Design a better-looking UI without compromising the functionality of the project elements

How to Contribute:

• Fork the Repository
• Clone it to Local Machine
• Start designing a New User Interface
• Design as much as you can...
• Commit and Push it to your remote Repository
• Create a Pull Request towards this Main Repository

Things to Remember

1. Design should not compromise the functionality of the tool
2. Design must be Device Responsive (Desktop View and Mobile View)
3. Use HTML, CSS, and JavaScript (HBS Templating Engine (.hbs files))
4. Use Bootstrap

Here is the Present View of the Page:

1. Home Page:

2. File Upload Page:

3. File Upload Page:

1. Home Page:

2. File Upload Page:

3. File Upload Page:

Happy Coding:

Autofill the filename input field, when a file is selected for uploading (To rename, if needed)

Issue to tackle

• When a file is selected for uploading, the filename input field must autofill with the name of the selected file, so that the user could edit it more effectively (Without refreshing the page)
• Think, we could use AJAX to solve the issue.

Here's quick look at the existing File Upload Page:

Desktop View

Mobile View

• Happy Coding