From cbe58b9437a591d17300c5a829f192cb8b6de2de Mon Sep 17 00:00:00 2001
From: Kevin Nadro <khomer8@yahoo.com>
Date: Sun, 28 May 2017 02:08:11 -0500
Subject: [PATCH] fixed the state change and cleaned up code for eslint

---
 browser/main/Detail/MarkdownNoteDetail.js | 42 +++++++++++-----------
 browser/main/Detail/SnippetNoteDetail.js  | 43 +++++++++++------------
 2 files changed, 40 insertions(+), 45 deletions(-)

diff --git a/browser/main/Detail/MarkdownNoteDetail.js b/browser/main/Detail/MarkdownNoteDetail.js
index 6f16e9d0..cc2a375e 100644
--- a/browser/main/Detail/MarkdownNoteDetail.js
+++ b/browser/main/Detail/MarkdownNoteDetail.js
@@ -200,27 +200,25 @@ class MarkdownNoteDetail extends React.Component {
   }
 
   handleFullScreenButton (e) {
-    const currentScreenState = !Object.assign({}, this.state).fullScreen
-    this.setState({ fullScreen: currentScreenState })
-
-    const noteDetail = document.querySelector('.NoteDetail')
-    const mainBody = document.querySelector('#main-body')
-    const sliderRight = document.querySelector('#slider-right')
-    const sliderLeft = document.querySelector('#slider-left')
-
-    if (currentScreenState) {
-      this.state.widthOfNoteDetail = noteDetail.style.left
-      this.state.widthOfMainBody = mainBody.style.left
-      noteDetail.style.left = '0px'
-      mainBody.style.left = '0px'
-      sliderRight.style.display = 'none'
-      sliderLeft.style.display = 'none'
-    } else {
-      noteDetail.style.left = this.state.widthOfNoteDetail
-      mainBody.style.left = this.state.widthOfMainBody
-      sliderRight.style.display = 'block'
-      sliderLeft.style.display = 'block'
-    }
+    this.setState({ fullScreen: !this.state.fullScreen }, () => {
+      const noteDetail = document.querySelector('.NoteDetail')
+      const mainBody = document.querySelector('#main-body')
+      const sliderRight = document.querySelector('#slider-right')
+      const sliderLeft = document.querySelector('#slider-left')
+      if (this.state.fullScreen) {
+        this.state.widthOfNoteDetail = noteDetail.style.left
+        this.state.widthOfMainBody = mainBody.style.left
+        noteDetail.style.left = '0px'
+        mainBody.style.left = '0px'
+        sliderRight.style.display = 'none'
+        sliderLeft.style.display = 'none'
+      } else {
+        noteDetail.style.left = this.state.widthOfNoteDetail
+        mainBody.style.left = this.state.widthOfMainBody
+        sliderRight.style.display = 'block'
+        sliderLeft.style.display = 'block'
+      }
+    })
   }
 
   handleLockButtonMouseDown (e) {
@@ -317,7 +315,7 @@ class MarkdownNoteDetail extends React.Component {
             <button styleName='control-fullScreenButton'
               onMouseDown={(e) => this.handleFullScreenButton(e)}
             >
-              <i className={'fa fa-arrows-alt'} styleName='fullScreen-button' />
+              <i className='fa fa-arrows-alt' styleName='fullScreen-button' />
             </button>
           </div>
         </div>
diff --git a/browser/main/Detail/SnippetNoteDetail.js b/browser/main/Detail/SnippetNoteDetail.js
index 4c288b17..2c3d57d7 100644
--- a/browser/main/Detail/SnippetNoteDetail.js
+++ b/browser/main/Detail/SnippetNoteDetail.js
@@ -52,7 +52,6 @@ class SnippetNoteDetail extends React.Component {
       fullScreen: false,
       widthOfNoteDetail: 0,
       widthOfMainBody: 0
-
     }
   }
 
@@ -195,27 +194,25 @@ class SnippetNoteDetail extends React.Component {
   }
 
   handleFullScreenButton (e) {
-    const currentScreenState = !Object.assign({}, this.state).fullScreen
-    this.setState({ fullScreen: currentScreenState })
-
-    const noteDetail = document.querySelector('.NoteDetail')
-    const mainBody = document.querySelector('#main-body')
-    const sliderRight = document.querySelector('#slider-right')
-    const sliderLeft = document.querySelector('#slider-left')
-
-    if (currentScreenState) {
-      this.state.widthOfNoteDetail = noteDetail.style.left
-      this.state.widthOfMainBody = mainBody.style.left
-      noteDetail.style.left = '0px'
-      mainBody.style.left = '0px'
-      sliderRight.style.display = 'none'
-      sliderLeft.style.display = 'none'
-    } else {
-      noteDetail.style.left = this.state.widthOfNoteDetail
-      mainBody.style.left = this.state.widthOfMainBody
-      sliderRight.style.display = 'block'
-      sliderLeft.style.display = 'block'
-    }
+    this.setState({ fullScreen: !this.state.fullScreen }, () => {
+      const noteDetail = document.querySelector('.NoteDetail')
+      const mainBody = document.querySelector('#main-body')
+      const sliderRight = document.querySelector('#slider-right')
+      const sliderLeft = document.querySelector('#slider-left')
+      if (this.state.fullScreen) {
+        this.state.widthOfNoteDetail = noteDetail.style.left
+        this.state.widthOfMainBody = mainBody.style.left
+        noteDetail.style.left = '0px'
+        mainBody.style.left = '0px'
+        sliderRight.style.display = 'none'
+        sliderLeft.style.display = 'none'
+      } else {
+        noteDetail.style.left = this.state.widthOfNoteDetail
+        mainBody.style.left = this.state.widthOfMainBody
+        sliderRight.style.display = 'block'
+        sliderLeft.style.display = 'block'
+      }
+    })
   }
 
   handleTabPlusButtonClick (e) {
@@ -558,7 +555,7 @@ class SnippetNoteDetail extends React.Component {
             <button styleName='control-fullScreenButton'
               onMouseDown={(e) => this.handleFullScreenButton(e)}
             >
-              <i className={'fa fa-arrows-alt'} styleName='fullScreen-button' />
+              <i className='fa fa-arrows-alt' styleName='fullScreen-button' />
             </button>
           </div>
         </div>