1. Developing an Online Menu
Leveraging SharePoint, HTML, CSS, JavaScript, and JQuery
By Michael Chard, PMP

2. SPONSORS

3. About Me
Michael Chard is a Program Manager and SharePoint Power User/Trainer with Koniag Information Security Services in Chantilly, VA. He is a US Navy Veteran and a certified Project Management Professional (PMP). Mike has over 20 years' experience in the IT industry with positions ranging from systems administrator to developer and trainer. Mike has been working with SharePoint since 2006 with a focus on Project and Portfolio Management. 

4. Overview The Challenge / Current Situation Gathering Requirements
Building A Proof Of Concept 
Refining The Requirements
Enhancing The Proof Of Concept
How Was The Proof Of Concept Developed?
DEMO
HTML, CSS, JavaScript, and JQuery

5. The Challenge Can you create an online ordering website in SharePoint?
Over the weekend can you create a proof of concept to demo Monday morning?

6. Current Situation Automate the meal ordering process
Orders taken by phone and manually entered in a Point of Sale (POS) system
Requires 2 – 3 personnel to answer the phones during meal hours
The POS system - standalone network
All systems need to be on premise 

7. Gather Requirements Meet with Key Stakeholders People placing orders
People currently taking orders
Leadership

9. Gather Requirements Phase 1: Web portal to place orders
Use existing menu to model the same look and feel
Breakfast, Lunch, and Dinner menus
Daily special food choices based on the date available added to the existing menu
Meal items can include options such as type of bread or additions to an omelette
An is sent to the person when placing the order and when food is ready for pickup
After an order is placed it will be transferred to the POS system manually 

10. Gather Requirements
Phase 2: The POS system will be moved to the same network as the website
The website would be set to push the order directly to the POS system
Making the ordering process automated from the person ordering all the way to the kitchen

11. Building A Proof Of Concept
Work on an on-premises government system
Work within SharePoint
No server-side code
May be able to use Advanced Workflows for Phase 2
SharePoint 2013 or Nintex (neither currently installed) 

12. Proof of Concept

13. Refining The Requirements
Meet with Stakeholders
Add other features
Choice and radio options to food items
Delegate ordering for multiple people
Specific meal ordering times

14. Enhancing The Proof Of Concept

15. Enhancing The Proof Of Concept

16. How Was The Proof Of Concept Developed?
OOTB SharePoint will not provide the functionality nor the look and feel
How was the proof of concept developed?
HTML, CSS, JavaScript, and JQuery
On-line Demo of the Menu 
The Code

17. JQuery call to retrieve Main Menu

18. Call to retrieve the Categories list

19. Set the Main Variables 

20. Checking ordering time

21. Creating the Menu for Dinner

22. Building a menu item

23. Adding the Menu item to table

24. Building the item option popup

25. Creating the final order

26. Saving the order to a list

27. Questions?