Merge pull request #1924 from thostetler/fix-adscore-prerendering-issue

Quickfix for abstract disappearing after hydrating
adsabs · Sep 16, 2019 · 51a2a76 · 51a2a76
2 parents 3e8f29f + 8280fb7
commit 51a2a76
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 28 deletions.
diff --git a/src/js/page_managers/controller.js b/src/js/page_managers/controller.js
@@ -104,9 +104,12 @@ function ($, _,
               // create props on the widget
               _.assign(widget, { componentParams: $(widgetDom).data() });
 
-              if (window.__PRERENDERED && widget.view && PRIORITY_WIDGETS.indexOf(widgetName) > -1) {
-                var $el = $('*[data-widget="' + widgetName + '"]');
-                widget.view.handlePrerenderedContent($el);
+              var $el = $('*[data-widget="' + widgetName + '"]');
+              const content = $el.length > 0 ? $el.html().trim() : '';
+              if (window.__PRERENDERED && widget.view && PRIORITY_WIDGETS.indexOf(widgetName) > -1 && $el.length > 0 && content.length > 0) {
+                if (typeof widget.view.handlePrerenderedContent === 'function') {
+                  widget.view.handlePrerenderedContent(content, $el);
+                }
                 window.__PRERENDERED = false;
               } else {
                 el = widget.getEl ? widget.getEl() : widget.render().el;

diff --git a/src/js/utils.js b/src/js/utils.js
@@ -115,12 +115,30 @@ define([
     return $dd.promise();
   }
 
+  const withPrerenderedContent = (view) => {
+    view.handlePrerenderedContent = (content, $el) => {
+
+      // setup the elements so events are properly delegated
+      view.$el = $(view.tagName + '.' + view.className, $el);
+      view.el = view.$el.get(0);
+      view.delegateEvents();
+
+      // reset on first model change
+      view.model.once('change', () => view.getTemplate = () => view.getOption('template'))
+
+      // override the template to provide our pre-rendered content
+      view.getTemplate = () => content;
+    };
+    return view;
+  };
+
   return {
     qs: qs,
     updateHash: updateHash,
     difference: difference,
     getBrowserInfo: getBrowserInfo,
     TimingEvent: TimingEvent,
-    waitForSelector: waitForSelector
+    waitForSelector: waitForSelector,
+    withPrerenderedContent: withPrerenderedContent
   };
 });
diff --git a/src/js/widgets/abstract/widget.js b/src/js/widgets/abstract/widget.js
@@ -13,7 +13,8 @@ define([
   'js/mixins/link_generator_mixin',
   'js/mixins/papers_utils',
   'mathjax',
-  'bootstrap'
+  'bootstrap',
+  'utils'
 ],
 function (
   Marionette,
@@ -27,7 +28,8 @@ function (
   LinkGeneratorMixin,
   PapersUtils,
   MathJax,
-  Bootstrap
+  Bootstrap,
+  utils
 ) {
 
   var AbstractModel = Backbone.Model.extend({
@@ -182,23 +184,6 @@ function (
       return false;
     },
 
-    handlePrerenderedContent: function ($el) {
-      this.$el = $(this.tagName + '.' + this.className, $el);
-      this.el = this.$el.get(0);
-      this.delegateEvents();
-
-      var _getTemplate = _.bind(this.getTemplate, this);
-      // replace the template function to manually set the content
-      this.getTemplate = _.bind(function () {
-        if (this.model.has('bibcode')) {
-          this.getTemplate = _getTemplate;
-          return this.template;
-        } else {
-          return $el.html();
-        }
-      }, this);
-    },
-
     onRender: function () {
       this.$('.icon-help').popover({ trigger: 'hover', placement: 'right', html: true });
 
@@ -210,7 +195,7 @@ function (
     initialize: function (options) {
       options = options || {};
       this.model = options.data ? new AbstractModel(options.data, { parse: true }) : new AbstractModel();
-      this.view = new AbstractView({ model: this.model });
+      this.view = utils.withPrerenderedContent(new AbstractView({ model: this.model }));
 
       this.listenTo(this.view, 'all', this.onAllInternalEvents);
 

diff --git a/src/js/widgets/graphics/widget.js b/src/js/widgets/graphics/widget.js
@@ -7,8 +7,6 @@ define([
   'hbs!js/widgets/graphics/templates/grid',
   'hbs!js/widgets/graphics/templates/sidebar',
   'js/components/api_targets'
-
-
 ], function (
   Marionette,
   BaseWidget,
@@ -41,7 +39,6 @@ define([
     modelEvents: {
       change: 'render'
     }
-
   });
 
   var SidebarView = Marionette.ItemView.extend({
@@ -74,7 +71,8 @@ define([
     initialize: function (options) {
       options = options || {};
       this.model = new GraphicsModel();
-      this.view = (options.sidebar === true) ? new SidebarView({ model: this.model }) : new GridView({ model: this.model });
+      this.view = (options.sidebar === true) ?
+        new SidebarView({ model: this.model }) : new GridView({ model: this.model });
       BaseWidget.prototype.initialize.apply(this, arguments);
     },