skyquake/plugins/composer/src/src/components/LoadingIndicator.js

   1 /*
   2  *
   3  *   Copyright 2016 RIFT.IO Inc
   4  *
   5  *   Licensed under the Apache License, Version 2.0 (the "License");
   6  *   you may not use this file except in compliance with the License.
   7  *   You may obtain a copy of the License at
   8  *
   9  *       http://www.apache.org/licenses/LICENSE-2.0
  10  *
  11  *   Unless required by applicable law or agreed to in writing, software
  12  *   distributed under the License is distributed on an "AS IS" BASIS,
  13  *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  14  *   See the License for the specific language governing permissions and
  15  *   limitations under the License.
  16  *
  17  */
  18 import React from 'react';
  19 import ReactDOM from 'react-dom';
  20 import '../../../node_modules/loaders.css/src/animations/line-scale-pulse-out-rapid.scss';
  21 import '../styles/LoadingIndicator.scss';
  22
  23 export default class Loader extends React.Component {
  24         constructor(props) {
  25                 super(props);
  26         }
  27         render() {
  28                 let loader = '';
  29                 var style = {
  30                         height: this.props.size + 'rem',
  31                         width: this.props.size * 0.15 + 'rem',
  32                         backgroundColor: this.props.color || 'white'
  33                 }
  34                 if (this.props.show) {
  35                         loader = (
  36                                 <div className = {"line-scale-pulse-out-rapid"}>
  37                                         <div style={style} ></div>
  38                                         <div style={style} ></div>
  39                                         <div style={style} ></div>
  40                                         <div style={style} ></div>
  41                                         <div style={style} ></div>
  42                                 </div>
  43                         );
  44                 }
  45                 return loader;
  46         }
  47 }
  48 Loader.defaultProps = {
  49         show: true,
  50         size: '5'
  51 }