#830: First spike of welcome page and option to turn it on/off in pre…

…ference.
hawtio · Dec 11, 2013 · b0e6748 · b0e6748
1 parent edf24c5
commit b0e6748
Show file tree

Hide file tree

Showing 7 changed files with 117 additions and 2 deletions.
diff --git a/hawtio-web/src/main/webapp/app/core/doc/welcome.md b/hawtio-web/src/main/webapp/app/core/doc/welcome.md
@@ -0,0 +1,29 @@
+<h3 class="help-header">Welcome to <img class='no-shadow' ng-src='{{branding.appLogo}}'>{{branding.appName}} </h3>
+
+Don't cha wish your console was <a href="http://www.youtube.com/watch?v=YNSxNsr4wmA">hawt like me</a>? I'm <i>hawt</i> so you can stay cool!
+
+<b>{{branding.appName}}</b> is a lightweight and <a href="http://hawt.io/plugins/index.html">modular</a> HTML5 web console with <a href="http://hawt.io/plugins/index.html">lots of plugins</a> for managing your Java stuff
+
+##### General Navigation #####
+Primary navigation in [{{branding.appName}}](http://hawt.io "{{branding.appName}}") is via the top navigation bar.
+
+![Main Navigation Bar](app/core/doc/img/main-nav.png "Main Navigation Bar")
+
+Clicking on a navigation link will take you to that plugin's main page.
+
+<i class='yellow text-shadowed icon-warning-sign'></i> **Note:** The available links in the navigation bar depend on what plugins are available and what JMX MBeans are available in the JVM, and so may differ from what is shown here.
+
+##### Getting Help #####
+Click the Help icon (<i class='icon-question-sign'></i>) in the main navigation bar to access [{{branding.appName}}](http://hawt.io "{{branding.appName}}")'s help system. Browse the available help topics for plugin-specific documentation using the help navigation bar on the left.
+
+![Help Topic Navigation Bar](app/core/doc/img/help-topic-nav.png "Help Topic Navigation Bar")
+
+Available sub-topics for each plugin can be selected via the secondary navigation bar above the help display area.
+
+![Help Sub-Topic Navigation Bar](app/core/doc/img/help-subtopic-nav.png "Help Sub-Topic Navigation Bar")
+
+##### Preferences #####
+Click the Preferences icon (<i class='icon-cogs'></i>) in the main navigation bar to access the [Preferences](#/preferences) page.  Available configuration options include, but not limited to:
+
+
+
diff --git a/hawtio-web/src/main/webapp/app/core/html/preferences.html b/hawtio-web/src/main/webapp/app/core/html/preferences.html
@@ -8,8 +8,15 @@
       <form class="form-horizontal">
 
         <div class="control-group">
-          <label class="control-label" for="updateRate">Update Rate</label>
+          <label class="control-label">Welcome Page</label>
+          <div class="controls">
+            <input type="checkbox" ng-model="showWelcomePage">
+            <span class="help-block">Show welcome page on startup</span>
+          </div>
+        </div>
 
+        <div class="control-group">
+          <label class="control-label" for="updateRate">Update Rate</label>
           <div class="controls">
             <select id="updateRate" ng-model="updateRate">
               <option value="0">No refreshes</option>

diff --git a/hawtio-web/src/main/webapp/app/core/html/welcome.html b/hawtio-web/src/main/webapp/app/core/html/welcome.html
@@ -0,0 +1,16 @@
+<div ng-controller="Core.WelcomeController">
+  <div class="row-fluid">
+    <div class="span8">
+      <div class="row welcome-display">
+        <!-- the html to display as welcome page -->
+        <div compile="html"></div>
+      </div>
+
+      <!-- TODO: have a nicer button -->
+      <div>
+        <button type="button" class="close" ng-click="stopShowingWelcomePage()">Do not show welcome page on startup</button>
+      </div>
+
+    </div>
+  </div>
+</div>
diff --git a/hawtio-web/src/main/webapp/app/core/js/corePlugin.ts b/hawtio-web/src/main/webapp/app/core/js/corePlugin.ts
@@ -79,6 +79,7 @@ angular.module(Core.pluginName, ['bootstrap', 'ngResource', 'ui', 'ui.bootstrap.
 
           $routeProvider.
                   when('/login', {templateUrl: 'app/core/html/login.html'}).
+                  when('/welcome', {templateUrl: 'app/core/html/welcome.html'}).
                   when('/preferences', {templateUrl: 'app/core/html/preferences.html'}).
                   when('/help', {
                     redirectTo: '/help/index'
@@ -406,6 +407,7 @@ angular.module(Core.pluginName, ['bootstrap', 'ngResource', 'ui', 'ui.bootstrap.
           viewRegistry['fullscreen'] = layoutFull;
           viewRegistry['notree'] = layoutFull;
           viewRegistry['help'] = layoutFull;
+          viewRegistry['welcome'] = layoutFull;
           viewRegistry['preferences'] = layoutFull;
           viewRegistry['login'] = layoutFull;
 

diff --git a/hawtio-web/src/main/webapp/app/core/js/preferences.ts b/hawtio-web/src/main/webapp/app/core/js/preferences.ts
@@ -35,6 +35,7 @@ module Core {
     $scope.updateRate = localStorage['updateRate'];
     $scope.url = localStorage['url'];
     $scope.autoRefresh = localStorage['autoRefresh'] === "true";
+    $scope.showWelcomePage = localStorage['showWelcomePage'] === "true";
 
     $scope.hosts = [];
     $scope.newHost = {};
@@ -135,7 +136,14 @@ module Core {
       localStorage['autoRefresh'] = $scope.autoRefresh;
     });
 
-    var names = ["gitUserName", "gitUserEmail", "activemqUserName", "activemqPassword",
+    $scope.$watch('showWelcomePage', (newValue, oldValue) => {
+      if (newValue === oldValue) {
+        return;
+      }
+      localStorage['showWelcomePage'] = $scope.showWelcomePage;
+    });
+
+    var names = ["showWelcomePage", "gitUserName", "gitUserEmail", "activemqUserName", "activemqPassword",
       "logCacheSize", "fabricAlwaysPrompt",  "fabricEnableMaps", "camelIgnoreIdForLabel", "camelMaximumLabelWidth",
       "camelMaximumTraceOrDebugBodyLength"];
 

diff --git a/hawtio-web/src/main/webapp/app/core/js/welcome.ts b/hawtio-web/src/main/webapp/app/core/js/welcome.ts
@@ -0,0 +1,38 @@
+/**
+ * @module Core
+ */
+module Core {
+
+  export function WelcomeController($scope, $location, branding, localStorage) {
+
+    var log:Logging.Logger = Logger.get("Welcome");
+
+    $scope.stopShowingWelcomePage = () => {
+      log.info("Stop showing welcome page");
+      localStorage['showWelcomePage'] = false;
+
+      log.info("Redirecting to default page");
+      $location.path("/");
+    };
+
+    // load the welcome.md file
+    $.ajax({
+      url: "app/core/doc/welcome.md",
+      dataType: 'html',
+      cache: false,
+      success: function (data, textStatus, jqXHR) {
+        $scope.html = "Unable to download welcome.md";
+        if (angular.isDefined(data)) {
+          $scope.html = marked(data);
+          $scope.branding = branding;
+        }
+        Core.$apply($scope);
+      },
+      error: function (jqXHR, textStatus, errorThrown) {
+        $scope.html = "Unable to download welcome.md";
+        Core.$apply($scope);
+      }
+    })
+  }
+
+}
diff --git a/hawtio-web/src/main/webapp/app/perspective/js/perspectiveHelpers.ts b/hawtio-web/src/main/webapp/app/perspective/js/perspectiveHelpers.ts
@@ -191,6 +191,10 @@ module Perspective {
    * @return {String}
    */
   export function defaultPage($location, workspace: Workspace, jolokia, localStorage) {
+    if (shouldShowWelcomePage(localStorage)) {
+      return "/welcome/";
+    }
+
     var answer = Perspective.defaultPageLocation;
     if (!answer && $location && workspace) {
       var topLevelTabs = Perspective.topLevelTabs($location, workspace, jolokia, localStorage);
@@ -207,6 +211,17 @@ module Perspective {
     return answer || '/help/index';
   }
 
+  /**
+   * Whether to show the welcome page
+   */
+  export function shouldShowWelcomePage(localStorage) {
+    var value = localStorage["showWelcomePage"];
+    if (angular.isString(value)) {
+      return "true" === value;
+    }
+    return true;
+  }
+
   /**
    * Returns true if there is no validFn defined or if its defined
    * then the function returns true.