client/src/components/Clock.js
author ymh <ymh.work@gmail.com>
Tue, 06 Nov 2018 16:19:26 +0100
changeset 170 7da1d5137b0b
parent 161 a642639dbc07
permissions -rw-r--r--
Upgrade dependencies and correct theme colors
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
21
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     1
import React, { Component } from 'react';
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     2
import moment from 'moment';
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     3
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     4
class Clock extends Component {
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     5
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     6
  state = {
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     7
    time: moment().format('H:mm:ss'),
28
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
     8
    intervalID: null
21
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
     9
  }
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    10
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    11
  componentDidMount() {
28
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
    12
    const intervalID = setInterval(() => {
21
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    13
      const time = moment().format('H:mm:ss');
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    14
      this.setState({ time });
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    15
    }, 1000);
28
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
    16
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
    17
    this.setState({ intervalID });
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
    18
  }
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
    19
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
    20
  componentWillUnmount() {
abf9f3ff2635 Clear interval when component unmounts.
Alexandre Segura <mex.zktk@gmail.com>
parents: 21
diff changeset
    21
    clearInterval(this.state.intervalID);
21
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    22
  }
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    23
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    24
  render() {
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    25
    return (
170
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 161
diff changeset
    26
      <span className="text-warning bg-irinotes-headers">{ this.state.time }</span>
21
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    27
    );
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    28
  }
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    29
}
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    30
284e866f55c7 First version of categories tooltip.
Alexandre Segura <mex.zktk@gmail.com>
parents:
diff changeset
    31
export default Clock