added loader to attribute list component

mvillis · Feb 7, 2016 · 6ef5f0f · 6ef5f0f
1 parent 618ddb3
commit 6ef5f0f
Showing 1 changed file with 17 additions and 13 deletions.
diff --git a/measure_mate/templates/assessment.html b/measure_mate/templates/assessment.html
@@ -38,15 +38,17 @@
         template: null,
         assessment: null,
         next_hide: false,
-        previous_hide: false
+        previous_hide: false,
+        initial_load: false
       };
     },
     componentWillMount: function(){
       this.dataSource("/api/assessments/" + this.props.assess_id + "/", this.assessment_callback);
     },
     measurement_callback: function (data) {
       this.setState( {
-        measurements: data
+        measurements: data,
+        initial_load: true
       });
       this.handleSelect(1);
     },
@@ -141,17 +143,19 @@
       }
       return (
         <div id="att-list">
-          <PageHeader>
-            {!!this.state.assessment == true ? this.state.assessment.template.name : ""} <small> {!!this.state.assessment ? this.state.assessment.template.short_desc : ""}</small>
-          </PageHeader>
-          <Tabs position="right" activeKey={this.state.active_attribute} onSelect={this.handleSelect} tabWidth={3}>
-            {attributeNodes}
-            <Pager>
-              <PageItem disabled={this.state.previous_hide} onClick={this.handlePrevious}>&larr; Previous</PageItem>
-              {' '}
-              <PageItem disabled={this.state.next_hide} onClick={this.handleNext}>Next &rarr;</PageItem>
-            </Pager>
-          </Tabs>
+          <Loader loaded={this.state.initial_load}>
+            <PageHeader>
+              {!!this.state.assessment == true ? this.state.assessment.template.name : ""} <small> {!!this.state.assessment ? this.state.assessment.template.short_desc : ""}</small>
+            </PageHeader>
+            <Tabs position="right" activeKey={this.state.active_attribute} onSelect={this.handleSelect} tabWidth={3}>
+              {attributeNodes}
+              <Pager>
+                <PageItem disabled={this.state.previous_hide} onClick={this.handlePrevious}>&larr; Previous</PageItem>
+                {' '}
+                <PageItem disabled={this.state.next_hide} onClick={this.handleNext}>Next &rarr;</PageItem>
+              </Pager>
+            </Tabs>
+          </Loader>
         </div>
       );
     }