skyquake/plugins/launchpad/src/launchpad_card/launchpadNSInfo.jsx

   1
   2 /*
   3  *
   4  *   Copyright 2016 RIFT.IO Inc
   5  *
   6  *   Licensed under the Apache License, Version 2.0 (the "License");
   7  *   you may not use this file except in compliance with the License.
   8  *   You may obtain a copy of the License at
   9  *
  10  *       http://www.apache.org/licenses/LICENSE-2.0
  11  *
  12  *   Unless required by applicable law or agreed to in writing, software
  13  *   distributed under the License is distributed on an "AS IS" BASIS,
  14  *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  15  *   See the License for the specific language governing permissions and
  16  *   limitations under the License.
  17  *
  18  */
  19 //THIS SHOULD BE REMOVED ONCE EPA PARAMS ARE MOVED OVER
  20
  21 import React from 'react';
  22 let ReactCSSTransitionGroup = require('react-addons-css-transition-group');
  23 class LaunchpadNSInfo extends React.Component {
  24   constructor(props) {
  25     super(props);
  26     // this.state = {metrics: props.data};
  27   }
  28   render() {
  29     let metricSet = [];
  30     let toDisplay;
  31     this.props.data.map((metric, index)=> {
  32       if (metric.hasOwnProperty('label') && this.props.name != "NFVI-METRICS") {
  33
  34       let displayValue = '';
  35       if (metric.hasOwnProperty('vm')) {
  36         displayValue = metric.vm + ' ' + metric.unit;
  37       }
  38       if (metric.hasOwnProperty('active-vm')) {
  39         displayValue = metric["active-vm"] + ' of ' + (parseInt(metric["active-vm"]) + parseInt(metric["inactive-vm"])) + ' Active';
  40       }
  41       if (metric.hasOwnProperty('used')) {
  42         displayValue = metric.used.value + ' / ' + metric.total.value + metric.total.unit;
  43       }
  44
  45          metricSet.push((
  46             <li key={index}>
  47               <dl>
  48                 <dt>{metric.label}:</dt>
  49                 <dd>{displayValue}</dd>
  50               </dl>
  51             </li>
  52           ))
  53       };
  54       if(this.props.name == "NFVI-METRICS") {
  55         toDisplay = <NfviMetricBars metrics={this.props.data} />
  56       }
  57     });
  58         var infoClass = {
  59       'EPA-PARAM' : {
  60         height: '300px',
  61         overflow: 'scroll',
  62         width: '707px',
  63       },
  64       'NFVI-METRICS' : {
  65         height: '400px'
  66       }
  67     }
  68     // style={infoClass[this.props.name]}
  69     if (!metricSet.length) {
  70       let msgString = ''
  71
  72       //DEMO ONLY
  73       if(this.props.name == "NFVI-METRICS") {
  74         toDisplay = <NfviMetricBars metrics={this.props.data} />
  75       } else {
  76         toDisplay = (<div className="empty">{ msgString }</div>);
  77       }
  78     } else {
  79       toDisplay = (
  80         <ul >
  81           {
  82             metricSet
  83           }
  84         </ul>
  85       )
  86     }
  87
  88     return (
  89       <div style={{overflow: 'hidden'}}>
  90         <div className="launchpadCard_title">
  91           { this.props.name }
  92         </div>
  93         <div className={"launchpadCard_data-list" + ' ' + this.props.name}>
  94           { toDisplay }
  95         </div>
  96       </div>
  97     )
  98   }
  99 }
 100 LaunchpadNSInfo.propTypes = {
 101   data: React.PropTypes.array,
 102   name: React.PropTypes.string
 103  };
 104 LaunchpadNSInfo.defaultProps = {
 105   name: 'Loading...',
 106   data: []
 107 };
 108
 109 export default LaunchpadNSInfo;