Added instructions and tests

Change-Id: I18e491c4a0c188866dcad1f9db52c4f781054e62
diff --git a/views/ngXosViews/UITutorial/src/js/main.js b/views/ngXosViews/UITutorial/src/js/main.js
index bc5c27e..c89f1da 100644
--- a/views/ngXosViews/UITutorial/src/js/main.js
+++ b/views/ngXosViews/UITutorial/src/js/main.js
@@ -16,7 +16,7 @@
 .config(function($httpProvider){
   $httpProvider.interceptors.push('NoHyperlinks');
 })
-.directive('jsShell', function(){
+.directive('jsShell', function(TemplateHandler){
   return {
     restrict: 'E',
     scope: {},
@@ -24,23 +24,28 @@
     controllerAs: 'vm',
     templateUrl: 'templates/js-shell.tpl.html',
     controller: function(ExploreCmd){
-      var history = new Josh.History({ key: 'helloworld.history'});
-      var shell = Josh.Shell({history: history});
+      var history = new Josh.History({ key: 'jsshell.history'});
+      this.shell = Josh.Shell({history: history});
 
-      shell.onNewPrompt(function(done) {
+      this.shell.onNewPrompt(done => {
         done('[ngXosLib] $ ');
       });
 
-      shell.setCommandHandler('explore', {
+      this.shell.setCommandHandler('explore', {
         exec: (cmd, args, done) => {
-          ExploreCmd.setup(shell);
-          done();
+          ExploreCmd.setup(this.shell);
+          done(TemplateHandler.instructions({
+            title: `You can now explore the API use angular $resouces!`,
+            messages: [
+              `Use <code>resource list</code> to list all the available resources and <code>resource {resoureName} {method} {?paramters}</code> to call the API.`,
+              `An example command is <code>resource Slices query</code>`,
+              `You can also provide paramters with <code>resource Slices query {max_instances: 10}</code>`
+            ]
+          }));
         }
       });
 
-
-
-      shell.activate();
+      this.shell.activate();
     }
   };
 });
\ No newline at end of file