summaryrefslogtreecommitdiff
path: root/ui/app/components/bye_splash.js
diff options
context:
space:
mode:
authorelijah <elijah@riseup.net>2017-04-19 19:51:50 -0700
committerKali Kaneko (leap communications) <kali@leap.se>2017-04-20 18:08:32 +0200
commit3810cfb433308dd9ced9c2185ecbb5f206e07f4c (patch)
tree73aceadb032cdfa9ba5c81944c05bc8e42cdc385 /ui/app/components/bye_splash.js
parent73836440b099f10174bc0b79ad4b8c85fcb9caf1 (diff)
[feat] added app buttons (quit & about bitmask)
- Closes #8803
Diffstat (limited to 'ui/app/components/bye_splash.js')
-rw-r--r--ui/app/components/bye_splash.js99
1 files changed, 99 insertions, 0 deletions
diff --git a/ui/app/components/bye_splash.js b/ui/app/components/bye_splash.js
new file mode 100644
index 0000000..633aa3d
--- /dev/null
+++ b/ui/app/components/bye_splash.js
@@ -0,0 +1,99 @@
+/*
+ * a parting window
+ */
+
+import React from 'react'
+import Center from 'components/center'
+import bitmask from 'lib/bitmask'
+
+export default class ByeSplash extends React.Component {
+
+ static get defaultProps() {return{
+ delay: 1000
+ }}
+
+ constructor(props) {
+ super(props)
+ this.state = {
+ errorMessage: null,
+ readyToQuit: false
+ }
+ this.tick = this.tick.bind(this)
+ }
+
+ componentDidMount() {
+ this.interval = setInterval(this.tick, this.props.delay)
+ bitmask.core.stop().then(msg => {
+ console.log(msg)
+ this.setState({readyToQuit: true})
+ }, error => {
+ console.log(error)
+ this.setState({errorMessage: error})
+ })
+ }
+
+ componentWillUnmount() {
+ clearInterval(this.interval)
+ }
+
+ tick() {
+ if (this.state.readyToQuit) {
+ if (typeof(bitmaskApp) == 'undefined') {
+ window.close()
+ } else {
+ bitmaskApp.shutdown()
+ }
+ } else {
+ clearInterval(this.interval)
+ this.interval = setInterval(this.tick, 200)
+ }
+ }
+
+ render () {
+ let message = null
+ let messageClass = "ok"
+ if (this.state.errorMessage) {
+ messageClass = "error"
+ message = this.state.errorMessage
+ }
+
+ let backgroundStyle = {
+ position: "absolute",
+ width: "100%",
+ height: "100%",
+ backgroundColor: "#333"
+ }
+ let foregroundStyle = {
+ marginTop: "10px",
+ color: "#999",
+ textAlign: "center"
+ }
+ let style = `
+ .mask, .ok {
+ animation: fadeout 2s infinite ease-in-out;
+ -webkit-animation: fadeout 2s infinite ease-in-out;
+ }
+ @keyframes fadeout {
+ 0% {opacity: 1}
+ 50% {opacity: 0}
+ 100% {opacity: 1}
+ }
+ @-webkit-keyframes fadeout {
+ 0% {opacity: 1}
+ 50% {opacity: 0}
+ 100% {opacity: 1}
+ }
+ `
+ return (
+ <div style={backgroundStyle}>
+ <style>{style}</style>
+ <Center>
+ <img className="mask" src='img/mask.svg' width='200px' />
+ <div className={messageClass} style={foregroundStyle}>
+ {message}
+ </div>
+ </Center>
+ </div>
+ )
+ }
+} \ No newline at end of file