client/src/components/Clock.js
author ymh <ymh.work@gmail.com>
Fri, 30 Nov 2018 10:53:15 +0100
changeset 183 f8f3af9e5c83
parent 170 7da1d5137b0b
permissions -rw-r--r--
Change the settings to avoid using Session authentication for rest framework as it raise exceptions in case client and backend are on the same domain On the filter, adapt to take into account new version of django_filters
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