dalofeco/slide-master

Web slide player with note taking ability with NodeJS

Slide-Master

##Introduction Slide Master is a web slide player that reads lecture slides from a JSON file. It is mainly composed of a single iframe, the slide viewer onto which content is injected and managed, a notes section that allows notes to be created for each slide, and a display section that displays the added notes. Slide Master has a very friendly user interface and includes features such as specialized notes for each individual slide, auto note saving feature and supports audio for each individual slide.

Development

Slide Master is primarly a collection of four sections: the slide viewer, the notes section, the display section, and the slide control buttons. The client side was built using bootstrap for great visuals and textillateJS for eye catching animations. The backend was developed with NodeJS, ExpressJS, and a json file store. ExpressJS is used for the web application framework, and the JSON file store is used for data storage. AJAX was used for interaction between the client side and server side. A lecture object is being passed back and forth from the client and server and then saved onto a json file store.

Tools Utilized

• JQuery
• JSON File Store
• Bootstrap
• NodeJS
• ExpressJS
• TextillateJS
• Font Awesome Icons
• Cloud9

Design

The software architecture design pattern used for Slide Master is MVC (Model View Controller). The MVC design pattern allowed the application to become split into three components. The model component directly managed the data, logic, and rules, of slide master. In this application the model component was on the server through the JSON file store where information was stored on a file, updated, and sent to the client. The View component was responsible for the visual representation of the lecture data. Slide master has a View.js file that contains a view object with all the necessary components and methods that manipulate the view. The Controller component accepts input from the user and uses AJAX to send the updated lecture object to the server and receives the updated information and passes it to the view to update the changes made such as the notes is and the controller is contained in controller.js.

Demo

More information and a live demo can be found here.

Team

Hozaifa Abdalla	Daniel Lopez	Alex Kiefer
github.com/abdallahozaifa	github.com/dalofeco	github.com/alkief