0

This is not really a "code" question, more of a tools question.

I have a Web App deployed to a single custom client. I own the code, and its gotten to the point where I want to build a demo web site in order to show the app to other potential clients. The UI is built using Angular JS.

Are there any good plugins/libraries/other tools to facilitate adding tutorial information to a web app? Specifically, I'm looking for the ability to add a modal "help popup" to each page that will apear when they first enter a page. It should have a "don't show again" checkbox. I'm open to other ideas as well.

I've tried Googling, but every combination of Angular App & Demo returns tips on using Angular JS itself.

I known it would be fairly easy to go through my app and add modal dialogs and add a table to my database to store the "show" setting. I could add this page to each form in my application, probably with a service to keep it consistent. But I'd like to do this in the least intrusive way possible so that the code for my demo site stays in synch with my base code.

Does anyone know if any such libraries?

Thanks

Steve Wash
  • 986
  • 4
  • 23
  • 50
  • Generally, it's called "walk through", and there are plugins for angularjs: https://github.com/souly1/ng-walkthrough OR https://github.com/abhikmitra/ng-joyride is that what you need? – Alon Eitan Feb 07 '16 at 13:51
  • search for the term "tour" – charlietfl Feb 07 '16 at 14:15
  • Thanks! Both ng-walkthrough and ng-joyride are exactly what I was looking for. I'll also check out the Bootstrap tour, but the look and feel was less impressive at first glance. The best is going to be the once that has least impact on my code. – Steve Wash Feb 07 '16 at 20:17

2 Answers2

0

You can create a popup per page which explains all the points you want the user to know.

You can keep a flag firstTime to be true initially. Then on the client side, show the popup and save a cookie, let say { 'visited' : true }

Always check that if a cookie visited is present or not and based on that display or hide the popup.

For the do not show again feature, whenever user clicks on that, save the cookie visited as true and then whenever user visits the page, hide the popup.

ashfaq.p
  • 5,379
  • 21
  • 35
0

You can also use bootstrap tour for that : http://bootstraptour.com/

didjoman
  • 90
  • 1
  • 8