aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/loading.js
blob: 9288256de10136cb7d93dd0373a80de494ab7d2c (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
const inherits = require('util').inherits
const Component = require('react').Component
const h = require('react-hyperscript')
const connect = require('react-redux').connect
const actions = require('./actions')
const ReactCSSTransitionGroup = require('react-addons-css-transition-group')

module.exports = connect(mapStateToProps)(LoadingIndicator)

function mapStateToProps(state) {
  return {
    isLoading: state.appState.isLoading,
  }
}

inherits(LoadingIndicator, Component)
function LoadingIndicator() {
  Component.call(this)
}

LoadingIndicator.prototype.render = function() {
  var isLoading = this.props.isLoading

  return (
    h(ReactCSSTransitionGroup, {
      transitionName: "loader",
      transitionEnterTimeout: 150,
      transitionLeaveTimeout: 150,
    }, [

      isLoading ? h('div', {
        style: {
          position: 'absolute',
          display: 'flex',
          justifyContent: 'center',
          alignItems: 'center',
          height: '100%',
          width: '100%',
          background: 'rgba(255, 255, 255, 0.5)',
        }
      }, [
        h('img', {
          src: 'images/loading.svg',
        }),
      ]) : null,
    ])
  )
}