Jkmarx/pass refinery intro config (#3132)

* Add new user config setting for intro paragraph. * Add intro paragraph to landing page. * Add markdown library. * Show intro paragraph. * Fix unit tests. * Add unit test. * Fix duplicate. * Correct default paragraph. * Fix another typo. * Empty string as default. * Adjust paragraph for clarity.
refinery-platform · Dec 7, 2018 · d7ca54b · d7ca54b
1 parent 83fd78c
commit d7ca54b
Show file tree

Hide file tree

Showing 19 changed files with 108 additions and 12 deletions.
diff --git a/deployment/terraform/live/main.tf b/deployment/terraform/live/main.tf
@@ -127,6 +127,7 @@ module "web" {
   refinery_google_analytics_id         = "${var.refinery_google_analytics_id}"
   refinery_google_recaptcha_site_key   = "${var.refinery_google_recaptcha_site_key}"
   refinery_google_recaptcha_secret_key = "${var.refinery_google_recaptcha_secret_key}"
+  refinery_intro                       = "${var.refinery_intro}"
   refinery_s3_user_data                = "${var.refinery_s3_user_data}"
   refinery_welcome_email_subject       = "${var.refinery_welcome_email_subject}"
   refinery_welcome_email_message       = "${var.refinery_welcome_email_message}"

diff --git a/deployment/terraform/live/vars.tf b/deployment/terraform/live/vars.tf
@@ -162,6 +162,11 @@ variable "refinery_google_recaptcha_secret_key" {
   default     = ""
 }
 
+variable "refinery_intro" {
+  description = "Mark-down to be displayed in the intro paragraph on the landing page."
+  default = "The refinery platform is for managing, analyzing, and visualizing data.\s\s Users can upload various types of files, annotated with pertinent metadata, and can choose to share those files with their own lab and collaborators. Users can also run common analyses via customizable [Galaxy](https://galaxyproject.org/) workflows and explore subsequent results with interactive visualization tools.\s\s Watch feature-specific tutorial videos below to get started. Once you have registered an account, log in, and click [My Dashboard](/dashboard) to start managing your own workspace."
+  }
+
 variable "refinery_s3_user_data" {
   description = "Whether or not to use S3 as user data file storage backend"
   default     = "false"

diff --git a/deployment/terraform/modules/ec2/main.tf b/deployment/terraform/modules/ec2/main.tf
@@ -191,6 +191,7 @@ export FACTER_REFINERY_CUSTOM_NAVBAR_ITEM="${var.refinery_custom_navbar_item}"
 export FACTER_REFINERY_GOOGLE_ANALYTICS_ID="${var.refinery_google_analytics_id}"
 export FACTER_REFINERY_GOOGLE_RECAPTCHA_SITE_KEY="${var.refinery_google_recaptcha_site_key}"
 export FACTER_REFINERY_GOOGLE_RECAPTCHA_SECRET_KEY="${var.refinery_google_recaptcha_secret_key}"
+export FACTER_REFINERY_INTRO="${var.refinery_intro}"
 export FACTER_REFINERY_S3_USER_DATA="${var.refinery_s3_user_data}"
 export FACTER_REFINERY_S3_MEDIA_BUCKET_NAME="${var.media_bucket_name}"
 export FACTER_REFINERY_S3_STATIC_BUCKET_NAME="${var.static_bucket_name}"

diff --git a/deployment/terraform/modules/ec2/vars.tf b/deployment/terraform/modules/ec2/vars.tf
@@ -32,6 +32,7 @@ variable "refinery_custom_navbar_item" {}
 variable "refinery_google_analytics_id" {}
 variable "refinery_google_recaptcha_site_key" {}
 variable "refinery_google_recaptcha_secret_key" {}
+variable "refinery_intro" {}
 variable "refinery_s3_user_data" {}
 variable "refinery_welcome_email_subject" {}
 variable "refinery_welcome_email_message" {}

diff --git a/refinery/config/config.json.erb b/refinery/config/config.json.erb
@@ -109,6 +109,7 @@
   "REFINERY_GOOGLE_RECAPTCHA_SITE_KEY": "<%= @refinery_google_recaptcha_site_key || "6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI" %>",
   "REFINERY_GOOGLE_RECAPTCHA_SECRET_KEY": "<%= @refinery_google_recaptcha_secret_key || "6LeIxAcTAAAAAGG-vFI1TnRWxMZNFuojJ4WifJWe" %>",
   "REFINERY_INNER_NAVBAR_HEIGHT": 20,
+  "REFINERY_INTRO": "<%= @refinery_intro || "" %>",
   "REFINERY_LOG_LEVEL": "DEBUG",
   "REFINERY_MAIN_LOGO": "",
   "REFINERY_REGISTRATION_CLOSED_MESSAGE": "",

diff --git a/refinery/config/settings/base.py b/refinery/config/settings/base.py
@@ -617,6 +617,8 @@ def get_setting(name, settings=local_settings, default=None):
 # HTML-safe item to be displayed to the right of the `About` link in the navbar
 REFINERY_CUSTOM_NAVBAR_ITEM = get_setting("REFINERY_CUSTOM_NAVBAR_ITEM")
 
+REFINERY_INTRO = get_setting("REFINERY_INTRO")
+
 USER_FILES_COLUMNS = get_setting("USER_FILES_COLUMNS")
 USER_FILES_FACETS = get_setting("USER_FILES_FACETS")
 

diff --git a/refinery/core/context_processors.py b/refinery/core/context_processors.py
@@ -67,6 +67,7 @@ def extra_context(context):
         "MEDIA_BUCKET": settings.MEDIA_BUCKET,
         "UPLOAD_BUCKET": settings.UPLOAD_BUCKET,
         "REFINERY_DEPLOYMENT_PLATFORM": settings.REFINERY_DEPLOYMENT_PLATFORM,
+        "REFINERY_INTRO": settings.REFINERY_INTRO,
         "USER_FILES_COLUMNS": settings.USER_FILES_COLUMNS,
         "REFINERY_GOOGLE_RECAPTCHA_SITE_KEY":
             settings.REFINERY_GOOGLE_RECAPTCHA_SITE_KEY,

diff --git a/refinery/templates/base.html b/refinery/templates/base.html
@@ -35,6 +35,7 @@
       launchpad_tut_viewed: `{{ user.profile.has_viewed_launchpad_tut }}`,
       data_upload_tut_viewed: `{{ user.profile.has_viewed_data_upload_tut}}`,
       admins: '{{ ADMIN_EMAIL|safe }}',
+      refineryIntro: '{{ REFINERY_INTRO }}',
       repositoryMode: {{ REFINERY_REPOSITORY_MODE|yesno:"true,false,undefined" }},
       repositoryModeHomePageHtml: '{{ REFINERY_REPOSITORY_MODE_HOME_PAGE_HTML.strip|safe }}',
       solrSynonymSearch: {{ SOLR_SYNONYM_SEARCH|lower }},
@@ -266,6 +267,7 @@
   <script src="{% static "vendor/filesize/lib/filesize.min.js" %}"></script>
   <script src="{% static "vendor/lodash/lodash.min.js" %}"></script>
   <script src="{% static "vendor/lodash-migrate/dist/lodash-migrate.min.js" %}"></script>
+  <script src="{% static "vendor/markdown/lib/markdown.js" %}"></script>
   <script type="text/javascript">
     // Assign lodash v3.9.3 to a special variable so it doesn't conflict with
     // lodash v2 or other libraries like underscore.

diff --git a/refinery/ui/bower.json b/refinery/ui/bower.json
@@ -55,7 +55,8 @@
     "filesize": "3.3.0",
     "angular-local-storage": "0.5.2",
     "intro.js": "2.4.0",
-    "angular-intro.js": "2.1.2"
+    "angular-intro.js": "2.1.2",
+    "markdown": "0.5.0"
   },
   "resolutions": {
     "d3": "3.5.16",

diff --git a/refinery/ui/config.json b/refinery/ui/config.json
@@ -104,7 +104,8 @@
         "spark-md5/spark-md5.min.js",
         "spectrum/spectrum.js",
         "svgxuse/svgxuse.min.js",
-        "aws-sdk-js/dist/aws-sdk.min.js"
+        "aws-sdk-js/dist/aws-sdk.min.js",
+        "markdown/lib/markdown.js"
       ],
       "maps": [
         "angular/angular.min.js.map",

diff --git a/refinery/ui/source/js/home/ctrls/data-set-chart-ctrl.spec.js b/refinery/ui/source/js/home/ctrls/data-set-chart-ctrl.spec.js
@@ -17,7 +17,7 @@
       });
     }));
 
-    it('HomeCtrl ctrl should exist', function () {
+    it('DataSetChartCtrl ctrl should exist', function () {
       expect(ctrl).toBeDefined();
     });
 

diff --git a/refinery/ui/source/js/home/ctrls/home-ctrl.js b/refinery/ui/source/js/home/ctrls/home-ctrl.js
@@ -0,0 +1,28 @@
+/**
+ * Home Ctrl
+ * @namespace HomeCtrl
+ * @desc Main ctrl for the home view
+ * @memberOf refineryApp.refineryHome
+ */
+(function () {
+  'use strict';
+  angular
+    .module('refineryHome')
+    .controller('HomeCtrl', HomeCtrl);
+
+  HomeCtrl.$inject = ['MarkdownJS', '$window'];
+
+  function HomeCtrl (MarkdownJS, $window) {
+    var vm = this;
+
+    vm.$onInit = function () {
+      if ($window.djangoApp && $window.djangoApp.refineryIntro.length) {
+        var introParagraphs = $window.djangoApp.refineryIntro.split('   ');
+        vm.htmlIntros = [];
+        for (var i = 0; i < introParagraphs.length; i++) {
+          vm.htmlIntros[i] = MarkdownJS.toHTML(introParagraphs[i]);
+        }
+      }
+    };
+  }
+})();
diff --git a/refinery/ui/source/js/home/ctrls/home-ctrl.spec.js b/refinery/ui/source/js/home/ctrls/home-ctrl.spec.js
@@ -0,0 +1,43 @@
+(function () {
+  'use strict';
+
+  describe('Controller: Home Ctrl', function () {
+    var ctrl;
+    var markdown;
+    var scope;
+    var window;
+
+    beforeEach(module('refineryApp'));
+    beforeEach(module('refineryHome'));
+    beforeEach(inject(function (
+      $controller,
+      MarkdownJS,
+      $rootScope,
+      $window
+    ) {
+      scope = $rootScope.$new();
+      ctrl = $controller('HomeCtrl', {
+        $scope: scope
+      });
+      markdown = MarkdownJS;
+      window = $window;
+      window.djangoApp = {
+        refineryIntro: 'Test text for the refinery intro paragraph.   Contact.'
+      };
+    }));
+
+    it('HomeCtrl ctrl should exist', function () {
+      expect(ctrl).toBeDefined();
+    });
+
+    it('sets intro paragraph', function () {
+      ctrl.$onInit();
+      expect(ctrl.htmlIntros[0]).toEqual(
+        markdown.toHTML(window.djangoApp.refineryIntro.split('   ')[0])
+      );
+      expect(ctrl.htmlIntros[1]).toEqual(
+        markdown.toHTML(window.djangoApp.refineryIntro.split('   ')[1])
+      );
+    });
+  });
+})();
diff --git a/refinery/ui/source/js/home/directives/data-set-chart.js b/refinery/ui/source/js/home/directives/data-set-chart.js
@@ -16,7 +16,7 @@
   function rpDataSetChart ($window) {
     return {
       restrict: 'AE',
-      controller: 'DataSetChartCtrl as $ctrl',
+      controller: 'DataSetChartCtrl as DSCtrl',
       templateUrl: function () {
         return $window.getStaticUrl('partials/home/partials/data-set-chart.html');
       },

diff --git a/refinery/ui/source/js/home/directives/data-set-chart.spec.js b/refinery/ui/source/js/home/directives/data-set-chart.spec.js
@@ -41,19 +41,19 @@
 
     it('initializes a new Chart class which is an object', function () {
       // eslint-disable-next-line no-undef
-      expect(scope.$ctrl.homeChart).toEqual(jasmine.any(Chart));
+      expect(scope.DSCtrl.homeChart).toEqual(jasmine.any(Chart));
     });
 
     it('initializes a bar chart', function () {
-      expect(scope.$ctrl.homeChart.config.type).toEqual('bar');
+      expect(scope.DSCtrl.homeChart.config.type).toEqual('bar');
     });
 
     it('sets a hover function', function () {
-      expect(angular.isFunction(scope.$ctrl.homeChart.config.options.hover.onHover)).toBe(true);
+      expect(angular.isFunction(scope.DSCtrl.homeChart.config.options.hover.onHover)).toBe(true);
     });
 
     it('sets a hover function', function () {
-      var chartConfig = scope.$ctrl.homeChart.config.options;
+      var chartConfig = scope.DSCtrl.homeChart.config.options;
       expect(angular.isFunction(chartConfig.tooltips.callbacks.label)).toBe(true);
     });
   });

diff --git a/refinery/ui/source/js/home/directives/home.js b/refinery/ui/source/js/home/directives/home.js
@@ -9,6 +9,7 @@
   angular
     .module('refineryHome')
     .component('rpHome', {
+      controller: 'HomeCtrl',
       templateUrl: ['$window', function ($window) {
         return $window.getStaticUrl('partials/home/views/home.html');
       }]

diff --git a/refinery/ui/source/js/home/partials/data-set-chart.html b/refinery/ui/source/js/home/partials/data-set-chart.html
@@ -1,16 +1,16 @@
 <div>
   <ui-select
     append-to-body="true"
-    ng-model="$ctrl.selectedAttribute.select"
-    on-select="$ctrl.updateAttribute($item)"
+    ng-model="DSCtrl.selectedAttribute.select"
+    on-select="DSCtrl.updateAttribute($item)"
     theme="select2"
     class="text-left p-l-1 p-b-1">
      <ui-select-match placeholder="Select an attribute">
        {{$select.selected.name }}
      </ui-select-match>
     <ui-select-choices
       position="down"
-      repeat="attribute in $ctrl.attributes | orderBy:'name' track by $index">
+      repeat="attribute in DSCtrl.attributes | orderBy:'name' track by $index">
       <span ng-bind-html="attribute.name"></span>
     </ui-select-choices>
   </ui-select>

diff --git a/refinery/ui/source/js/home/views/home.html b/refinery/ui/source/js/home/views/home.html
@@ -1,6 +1,13 @@
 <div>
   <div class="row p-t-1">
-    <div class="col-md-4 col-md-offset-7">
+    <div class="col-md-6">
+      <ul class="list-unstyled m-l-1-2 p-l-1-3 p-r-1-3">
+        <li ng-repeat="htmlIntro in $ctrl.htmlIntros">
+          <p ng-bind-html="htmlIntro"></p>
+        </li>
+      </ul>
+    </div>
+    <div class="col-md-6">
        <rp-data-set-chart></rp-data-set-chart>
     </div>
   </div>

diff --git a/refinery/ui/source/js/refinery-libraries.js b/refinery/ui/source/js/refinery-libraries.js
@@ -13,4 +13,5 @@ angular
   .constant('bootbox', window.bootbox)
   .constant('SparkMD5', window.SparkMD5)
   .constant('ListGraphVis', window.ListGraph)
+  .constant('MarkdownJS', window.markdown)
   .constant('angular-intro', window['angular-intro']);