import React, {Component} from 'react'

import NoPositionBanner from 'components/NoPositionBanner'
import GeneralBanner from 'components/GeneralBanner'
import SecurityBanner from 'components/SecurityBanner'
import Header from 'components/Header'

const GENERAL_BANNER_LEVEL = 'GENERAL_BANNER_LEVEL'
const GENERAL_BANNER_TEXT = 'GENERAL_BANNER_TEXT'
const GENERAL_BANNER_TITLE = 'Announcement'
const GENERAL_BANNER_VISIBILITY = 3
const visible = {
    USERS: 1,
    SUPER_USERS: 2,
    USERS_AND_SUPER_USERS: 3
}

export default class TopBar extends Component {
    constructor(props) {
        super(props)
        this.state = { 
            bodyPaddingTop: 0 
        }
        this.updateBodyPaddingTop = this.updateBodyPaddingTop.bind(this)
    }

    componentDidMount() {
        this.updateBodyPaddingTop()
        window.addEventListener("resize", this.updateBodyPaddingTop)
    }

    componentWillUnmount() {
        window.removeEventListener("resize", this.updateBodyPaddingTop)
    }

    componentDidUpdate() {
        this.updateBodyPaddingTop()
    }

    updateBodyPaddingTop() {
        let topbarPaddingHeight = document.getElementById('topbar').offsetHeight + 20
        if (this.state.bodyPaddingTop !== topbarPaddingHeight){
            document.body.style.paddingTop=`${topbarPaddingHeight}px` 
            this.setState({ bodyPaddingTop: topbarPaddingHeight })
        }
    }

    showBanner(){
        if(GENERAL_BANNER_VISIBILITY === visible.USERS && this.props.currentUser && !this.props.currentUser.isSuperUser()){
            return true
        }
        if(GENERAL_BANNER_VISIBILITY === visible.SUPER_USERS && this.props.currentUser && this.props.currentUser.isSuperUser()){
            return true
        }
        if(GENERAL_BANNER_VISIBILITY === visible.USERS_AND_SUPER_USERS && (this.props.currentUser || this.props.currentUser.isSuperUser()) ){
            return true
        } else {
            return false
        }
    }

    bannerOptions(){
        return {
            level: this.props.settings[GENERAL_BANNER_LEVEL],
            message: this.props.settings[GENERAL_BANNER_TEXT],
            title: GENERAL_BANNER_TITLE,
            visibility: GENERAL_BANNER_VISIBILITY
        } || {}
    }

    render() {
        return (
            <div id="topbar" className="navbar navbar-fixed-top">
                {this.props.currentUser && this.props.position && this.props.position.id === 0 && !this.props.isNewUser() && <NoPositionBanner />}
                <GeneralBanner showBanner={this.showBanner()} banner={this.bannerOptions()} />
                <SecurityBanner location={this.props.location} />
                <Header minimalHeader={this.props.minimalHeader} />
            </div>
        )
    }
}

@@ -367,29 +367,47 @@
 NER_
-TITLE = 'Announcement
+VISIBILITY = 'GENERAL_BANNER_VISIBILITY
 '%0Aco
@@ -429,22 +429,30 @@
 NER_
-VISIBILITY = 3
+TITLE = 'Announcement'
 %0Acon
@@ -679,17 +679,53 @@
 ngTop: 0
- 
+,%0A            bannerVisibility: false
 %0A       
@@ -930,32 +930,70 @@
 BodyPaddingTop)%0A
+        this.updateBannerVisibility()%0A
     %7D%0A%0A    compo
@@ -1150,24 +1150,62 @@
 addingTop()%0A
+        this.updateBannerVisibility()%0A
     %7D%0A%0A    u
@@ -1541,58 +1541,182 @@
     
-showBanner()%7B%0A        if(GENERAL_BANNER_VISIBILITY
+updateBannerVisibility()%7B%0A        let visibilitySetting = parseInt(this.props.settings%5BGENERAL_BANNER_VISIBILITY%5D, 10)%0A        let output = false%0A        if(visibilitySetting
  ===
@@ -1803,38 +1803,40 @@
 ))%7B%0A            
-return
+output =
  true%0A        %7D%0A
@@ -1850,33 +1850,25 @@
  if(
-GENERAL_BANNER_VISIBILITY
+visibilitySetting
  ===
@@ -1960,38 +1960,40 @@
 ))%7B%0A            
-return
+output =
  true%0A        %7D%0A
@@ -2007,33 +2007,25 @@
  if(
-GENERAL_BANNER_VISIBILITY
+visibilitySetting
  ===
@@ -2138,22 +2138,24 @@
         
-return
+output =
  true%0A  
@@ -2166,39 +2166,115 @@
   %7D 
-else %7B%0A            return false
+%0A        if(this.state.bannerVisibility !== output)%7B%0A            this.setState(%7B bannerVisibility: output%7D)
 %0A   
@@ -2512,40 +2512,39 @@
 isib
-ility: GENERAL_BANNER_VISIBILITY
+le: this.state.bannerVisibility
 %0A   
@@ -2843,45 +2843,15 @@
 ner 
-showBanner=%7Bthis.showBanner()%7D banner
+options
 =%7Bth

Update banner visibility according to admin settings and user roles