From 8f42222f4794a034889738348a3e286c26055bb5 Mon Sep 17 00:00:00 2001
From: Landon Taylor <landon.autumn.taylor@gmail.com>
Date: Thu, 22 Aug 2019 14:28:36 -0500
Subject: [PATCH] Landon Taylor

---
 package-lock.json                   | 82 +++++++++++++++++++++--------
 src/components/ChangeTemperature.js |  2 +
 src/components/CityDropDown.js      |  3 +-
 src/components/Counter.js           | 17 ++++--
 src/components/CounterButton.js     |  5 +-
 src/components/CurrentCity.js       | 18 +++++--
 src/components/Modal.js             | 19 +++++--
 src/components/ScaleVideo.js        |  3 +-
 src/components/SearchTextBox.js     |  3 +-
 src/components/ShowModal.js         |  3 +-
 src/components/SortUsers.js         |  3 +-
 src/components/SpecialText.js       | 15 ++++--
 src/components/SpecialTextBox.js    |  3 +-
 src/components/Thermostat.js        | 14 +++--
 src/components/UserButtons.js       |  5 +-
 src/components/Users.js             | 15 ++++++
 src/components/VideoPlayer.js       | 19 +++++--
 src/components/VideoTextBox.js      |  3 +-
 src/index.js                        |  4 +-
 src/reducers/index.js               | 69 +++++++++++++++++++++---
 20 files changed, 238 insertions(+), 67 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 20071db..2affb7a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3065,7 +3065,8 @@
             "ansi-regex": {
               "version": "2.1.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "aproba": {
               "version": "1.2.0",
@@ -3086,12 +3087,14 @@
             "balanced-match": {
               "version": "1.0.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "brace-expansion": {
               "version": "1.1.11",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "balanced-match": "^1.0.0",
                 "concat-map": "0.0.1"
@@ -3106,17 +3109,20 @@
             "code-point-at": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "concat-map": {
               "version": "0.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "console-control-strings": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "core-util-is": {
               "version": "1.0.2",
@@ -3233,7 +3239,8 @@
             "inherits": {
               "version": "2.0.3",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "ini": {
               "version": "1.3.5",
@@ -3245,6 +3252,7 @@
               "version": "1.0.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "number-is-nan": "^1.0.0"
               }
@@ -3259,6 +3267,7 @@
               "version": "3.0.4",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "brace-expansion": "^1.1.7"
               }
@@ -3266,12 +3275,14 @@
             "minimist": {
               "version": "0.0.8",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "minipass": {
               "version": "2.3.5",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "safe-buffer": "^5.1.2",
                 "yallist": "^3.0.0"
@@ -3290,6 +3301,7 @@
               "version": "0.5.1",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "minimist": "0.0.8"
               }
@@ -3370,7 +3382,8 @@
             "number-is-nan": {
               "version": "1.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "object-assign": {
               "version": "4.1.1",
@@ -3382,6 +3395,7 @@
               "version": "1.4.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "wrappy": "1"
               }
@@ -3467,7 +3481,8 @@
             "safe-buffer": {
               "version": "5.1.2",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "safer-buffer": {
               "version": "2.1.2",
@@ -3503,6 +3518,7 @@
               "version": "1.0.2",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "code-point-at": "^1.0.0",
                 "is-fullwidth-code-point": "^1.0.0",
@@ -3522,6 +3538,7 @@
               "version": "3.0.1",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "ansi-regex": "^2.0.0"
               }
@@ -3565,12 +3582,14 @@
             "wrappy": {
               "version": "1.0.2",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "yallist": {
               "version": "3.0.3",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             }
           }
         },
@@ -7466,7 +7485,8 @@
             "ansi-regex": {
               "version": "2.1.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "aproba": {
               "version": "1.2.0",
@@ -7487,12 +7507,14 @@
             "balanced-match": {
               "version": "1.0.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "brace-expansion": {
               "version": "1.1.11",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "balanced-match": "^1.0.0",
                 "concat-map": "0.0.1"
@@ -7507,17 +7529,20 @@
             "code-point-at": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "concat-map": {
               "version": "0.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "console-control-strings": {
               "version": "1.1.0",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "core-util-is": {
               "version": "1.0.2",
@@ -7634,7 +7659,8 @@
             "inherits": {
               "version": "2.0.3",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "ini": {
               "version": "1.3.5",
@@ -7646,6 +7672,7 @@
               "version": "1.0.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "number-is-nan": "^1.0.0"
               }
@@ -7660,6 +7687,7 @@
               "version": "3.0.4",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "brace-expansion": "^1.1.7"
               }
@@ -7667,12 +7695,14 @@
             "minimist": {
               "version": "0.0.8",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "minipass": {
               "version": "2.3.5",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "safe-buffer": "^5.1.2",
                 "yallist": "^3.0.0"
@@ -7691,6 +7721,7 @@
               "version": "0.5.1",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "minimist": "0.0.8"
               }
@@ -7771,7 +7802,8 @@
             "number-is-nan": {
               "version": "1.0.1",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "object-assign": {
               "version": "4.1.1",
@@ -7783,6 +7815,7 @@
               "version": "1.4.0",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "wrappy": "1"
               }
@@ -7868,7 +7901,8 @@
             "safe-buffer": {
               "version": "5.1.2",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "safer-buffer": {
               "version": "2.1.2",
@@ -7904,6 +7938,7 @@
               "version": "1.0.2",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "code-point-at": "^1.0.0",
                 "is-fullwidth-code-point": "^1.0.0",
@@ -7923,6 +7958,7 @@
               "version": "3.0.1",
               "bundled": true,
               "dev": true,
+              "optional": true,
               "requires": {
                 "ansi-regex": "^2.0.0"
               }
@@ -7966,12 +8002,14 @@
             "wrappy": {
               "version": "1.0.2",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             },
             "yallist": {
               "version": "3.0.3",
               "bundled": true,
-              "dev": true
+              "dev": true,
+              "optional": true
             }
           }
         }
diff --git a/src/components/ChangeTemperature.js b/src/components/ChangeTemperature.js
index fa894bc..86c1654 100644
--- a/src/components/ChangeTemperature.js
+++ b/src/components/ChangeTemperature.js
@@ -1,4 +1,5 @@
 import React from "react";
+import store from '../store';
 
 function ChangeTemperature(props){
     return(
@@ -6,6 +7,7 @@ function ChangeTemperature(props){
         <br/>
         <label>Change Temp -  Enter a value from 1-100<br/>
           <input onChange={(e)=>{
+            store.dispatch({type: "SET_TEMP", value: e.target.value})
            
           }} type="number" min="0" max="100" />
         </label>
diff --git a/src/components/CityDropDown.js b/src/components/CityDropDown.js
index d43df20..27ad1dd 100644
--- a/src/components/CityDropDown.js
+++ b/src/components/CityDropDown.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import store from '../store';
 
 function CityDropDown(props) {
   return (
@@ -6,7 +7,7 @@ function CityDropDown(props) {
         CurrentCity: 
         <select onChange={
           (e)=>{
-           
+           store.dispatch({type: "SET_CURRENT_CITY", value: e.target.value})
           }
         }>
           <option value="Austin">Austin</option>
diff --git a/src/components/Counter.js b/src/components/Counter.js
index 281c6ff..8611ead 100644
--- a/src/components/Counter.js
+++ b/src/components/Counter.js
@@ -1,12 +1,23 @@
 import React from 'react';
+import store from '../store';
 
 class Counter extends React.Component {
   
   state={count:0}
+
+  componentDidMount(){
+    let currentCount = store.getState().currentCount;
+    this.setState({count:currentCount});
+    store.subscribe(()=>{
+      let currentCount = store.getState().currentCount;
+      this.setState({count:currentCount});
+    })
+  }
+
   render() {
-    const {
-      props,
-    } = this;
+    // const {
+    //   props,
+    // } = this;
 
     return (
         <div>
diff --git a/src/components/CounterButton.js b/src/components/CounterButton.js
index 96eaa08..1e4eea7 100644
--- a/src/components/CounterButton.js
+++ b/src/components/CounterButton.js
@@ -1,16 +1,17 @@
 import React from 'react';
+import store from '../store';
 
 function CounterButton(props) {
   return (
       <div>
         <button onClick={
           ()=>{
-            
+            store.dispatch({type: "INCREASE_COUNTER"})
           }
         }>Increase Counter By One</button>
         <button onClick={
           ()=>{
-           
+            store.dispatch({type: "DECREASE_COUNTER"})
           }
         }>Decrease Counter By One</button>
       </div>
diff --git a/src/components/CurrentCity.js b/src/components/CurrentCity.js
index a073d8e..d14e31b 100644
--- a/src/components/CurrentCity.js
+++ b/src/components/CurrentCity.js
@@ -1,18 +1,28 @@
 import React from 'react';
+import store from '../store';
 
 class CurrentCity extends React.Component {
   state={
     text:""
   }
 
+  componentDidMount(){
+    let currentCity = store.getState().currentCity;
+    this.setState({text:currentCity});
+    store.subscribe(()=>{
+      let currentCity = store.getState().currentCity;
+      this.setState({text:currentCity});
+    })
+  }
+
   render() {
-    const {
-      props,
-    } = this;
+    // const {
+    //   props,
+    // } = this;
 
     return (
         <div>
-          CurrentCity: {this.state.text}
+          CurrentCity: {this.state.text || "Austin"}
         </div>
     );
   }
diff --git a/src/components/Modal.js b/src/components/Modal.js
index 1789040..c33dbbb 100644
--- a/src/components/Modal.js
+++ b/src/components/Modal.js
@@ -1,24 +1,33 @@
 import React from 'react';
 import Modal from 'react-modal';
+import store from '../store';
 
 class LoadingModal extends React.Component {
   state={
     isLoading:false
   }
+
+  componentDidMount(){
+    store.subscribe(()=>{
+      let isLoading = store.getState().isLoading;
+      this.setState({isLoading:isLoading});
+    })
+  }
+
   render() {
-    const {
-      props,
-    } = this;
+    // const {
+    //   props,
+    // } = this;
 
     return (
       <Modal
-        isOpen={props.isLoading}
+        isOpen={this.state.isLoading}
         style={customStyles}
         contentLabel="Example Modal"
       >
         <button onClick={
           ()=>{
-           
+           store.dispatch({type: "SET_IS_LOADING", value: false})
           }
           }>close</button>
         <div>Loading .......</div>
diff --git a/src/components/ScaleVideo.js b/src/components/ScaleVideo.js
index 803b257..c16e87c 100644
--- a/src/components/ScaleVideo.js
+++ b/src/components/ScaleVideo.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import store from '../store';
 
 function ScaleVideo(props) {
   return (
@@ -6,7 +7,7 @@ function ScaleVideo(props) {
         Scale Video: <input
         onChange={
           (e)=>{
-            
+            store.dispatch({type: "SET_VIDEO_SCALE", value: e.target.value}) 
           }
         }
          type="range" min="1" max="10" step="1" />
diff --git a/src/components/SearchTextBox.js b/src/components/SearchTextBox.js
index 43f3416..83c6c00 100644
--- a/src/components/SearchTextBox.js
+++ b/src/components/SearchTextBox.js
@@ -1,11 +1,12 @@
 import React from 'react';
+import store from '../store';
 
 function SearchTextBox(props) {
   return (
       <div>
         Search Users on First Name:
         <input onChange={(e)=>{
-           
+           store.dispatch({type: "SET_SEARCH_TEXT", value: e.target.value})
         }} />
       </div>
   );
diff --git a/src/components/ShowModal.js b/src/components/ShowModal.js
index 1e73950..5587646 100644
--- a/src/components/ShowModal.js
+++ b/src/components/ShowModal.js
@@ -1,11 +1,12 @@
 import React from 'react';
+import store from '../store';
 
 function ShowModal(props) {
   return (
       <div>
         <button onClick={
           ()=>{
-            
+            store.dispatch({type: "SET_IS_LOADING", value: true})
           }
         }>Show Modal</button>
 
diff --git a/src/components/SortUsers.js b/src/components/SortUsers.js
index fd6cb04..4cb2d1d 100644
--- a/src/components/SortUsers.js
+++ b/src/components/SortUsers.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import store from '../store';
 
 function SortUsers(props) {
   return (
@@ -6,7 +7,7 @@ function SortUsers(props) {
         Sort Users On: 
         <select onChange={
           (e)=>{
-           
+            store.dispatch({type: "SET_CURRENT_USER_SORT", value: e.target.value})
           }
         }>
           <option value="first_name">First Name</option>
diff --git a/src/components/SpecialText.js b/src/components/SpecialText.js
index 7d3b5e9..f200def 100644
--- a/src/components/SpecialText.js
+++ b/src/components/SpecialText.js
@@ -1,15 +1,22 @@
 import React from 'react';
+import store from '../store';
 
 class SpecialText extends React.Component {
   state={text:""}
+  componentDidMount(){
+    store.subscribe(()=>{
+      let specialText = store.getState().specialText;
+      this.setState({text:specialText})
+    })
+  }
   render() {
-    const {
-      props,
-    } = this;
+    // const {
+    //   props,
+    // } = this;
 
     return (
         <div>
-          Special Text: {this.state.text}
+          Special Text: {this.state.text || "Your Message Here"}
         </div>
     );
   }
diff --git a/src/components/SpecialTextBox.js b/src/components/SpecialTextBox.js
index 63cb01f..463aeb3 100644
--- a/src/components/SpecialTextBox.js
+++ b/src/components/SpecialTextBox.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import store from '../store';
 
 
 function SpecialTextBox(props) {
@@ -6,7 +7,7 @@ function SpecialTextBox(props) {
       <div>
         Enter Special Text:
         <input onChange={(e)=>{
-            
+            store.dispatch({type:"SET_SPECIAL_TEXT",value: e.target.value})
         }} />
       </div>
   );
diff --git a/src/components/Thermostat.js b/src/components/Thermostat.js
index 2e43fbe..56614ca 100644
--- a/src/components/Thermostat.js
+++ b/src/components/Thermostat.js
@@ -1,13 +1,21 @@
 import React from "react";
 import DonutChart from "./ignore/DonutChart";
+import store from '../store';
 
 class Thermostat extends React.Component {
   state={temp:""}
 
+  componentDidMount(){
+    store.subscribe(()=>{
+      let currentTemp = store.getState().currentTemp;
+      this.setState({temp:currentTemp});
+    })
+  }
+
   render() {
-    const {
-      props,
-    } = this;
+    // const {
+    //   props,
+    // } = this;
 
     return (<DonutChart value={this.state.temp || 23 } />)
   }
diff --git a/src/components/UserButtons.js b/src/components/UserButtons.js
index f857369..f58a692 100644
--- a/src/components/UserButtons.js
+++ b/src/components/UserButtons.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import store from '../store';
 
 function UserButtons(props) {
   return (
@@ -13,12 +14,12 @@ function UserButtons(props) {
                 "occupation": "father",
                 "avatar": "https://s3.amazonaws.com/uifaces/faces/twitter/calebogden/128.jpg"
               };
-            
+              store.dispatch({type:"ADD_USER",value: user})
           }
         }>Add User</button>
         <button onClick={
           ()=>{
-           
+            store.dispatch({type:"REMOVE_USER"})
           }
         }>Remove User</button>
       </div>
diff --git a/src/components/Users.js b/src/components/Users.js
index 79bfbef..2a94419 100644
--- a/src/components/Users.js
+++ b/src/components/Users.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import store from '../store';
 
 class Users extends React.Component {
  
@@ -8,6 +9,20 @@ class Users extends React.Component {
     firstNameFilter:""
   }
 
+  componentDidMount() {
+    let users = store.getState().users
+    this.setState({users:users})
+    // fetch("https://jsonplaceholder.typicode.com/users")
+    //   .then(res=>res.json())
+    //   .then(users=>this.setState({users}));
+    store.subscribe(()=>{
+      let users = store.getState().users
+      let searchText = store.getState().searchText
+      let currentUserSort = store.getState().currentUserSort
+      this.setState({users:users, sortOn:currentUserSort, firstNameFilter:searchText})
+    })
+  }
+
   render() {
     let {users,sortOn,firstNameFilter} = this.state;
     var usersDivs = null;
diff --git a/src/components/VideoPlayer.js b/src/components/VideoPlayer.js
index f4fc08b..a37e97c 100644
--- a/src/components/VideoPlayer.js
+++ b/src/components/VideoPlayer.js
@@ -1,18 +1,27 @@
 import React from 'react';
+import store from '../store';
 
 class VideoPlayer extends React.Component {
   state={scale:0,URL:""}
 
+  componentDidMount(){
+    store.subscribe(()=>{
+      let videoURL = store.getState().videoURL;
+      let videoScale = store.getState().videoScale;
+      this.setState({URL:videoURL, scale:videoScale});
+    })
+  }
+
   render() {
-    const {
-      props,
-    } = this;
+    // const {
+    //   props,
+    // } = this;
 
     let width = 200;
     let height = 200;
     if(this.state.scale){
-      width = 200 * props.scale;
-      height = 200 * props.scale;
+      width = 200 * this.state.scale;
+      height = 200 * this.state.scale;
     }
     return (
         <div><iframe title="YouTube video player"  type="text/html" 
diff --git a/src/components/VideoTextBox.js b/src/components/VideoTextBox.js
index 62cb230..77b5cbe 100644
--- a/src/components/VideoTextBox.js
+++ b/src/components/VideoTextBox.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import store from '../store';
 
 function VideoTextBox(props) {
   return (
@@ -6,7 +7,7 @@ function VideoTextBox(props) {
         Enter URL of YouTube video
         <input 
       onChange={(e)=>{
-       
+       store.dispatch({type: "SET_VIDEO_URL", value: e.target.value})
       }}
       type="text" />
 
diff --git a/src/index.js b/src/index.js
index 592f053..098a6f8 100644
--- a/src/index.js
+++ b/src/index.js
@@ -2,9 +2,7 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import App from './App';
 
-
-
 ReactDOM.render(
-  <App />,
+  <App/>,
   document.getElementById('root')
 );
diff --git a/src/reducers/index.js b/src/reducers/index.js
index e4e85c8..dd069a7 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -2,25 +2,24 @@ import { combineReducers } from 'redux'
 
 function currentCount(state=0, action){
   if(action.type === "INCREASE_COUNTER"){
-
+    return state +1
   }
   if(action.type === "DECREASE_COUNTER"){
-    
+    return state -1
   }
   return state;
-}   
+}
 
 function users(state =[], action){
   if(action.type === "ADD_USER"){
-
+    return [...state,action.value]
   }
   if(action.type === "REMOVE_USER"){
-    
+    return state.slice(1)
   }
   return state;
 }
 
-
 function specialText(state = "", action){
   if(action.type === "SET_SPECIAL_TEXT"){
     return action.value;
@@ -28,8 +27,64 @@ function specialText(state = "", action){
   return state;
 }
 
+function currentCity(state="",action){
+  if(action.type === "SET_CURRENT_CITY") {
+    return action.value;
+  }
+  return state;
+}
+
+function searchText(state = "", action){
+  if(action.type === "SET_SEARCH_TEXT"){
+    return action.value;
+  }
+  return state;
+}
+
+function currentTemp(state=0,action){
+  if(action.type==="SET_TEMP") {
+    return action.value;
+  }
+  return state;
+}
+
+function isLoading(state=false,action){
+  if(action.type==="SET_IS_LOADING") {
+    return action.value;
+  }
+  return state;
+}
+
+function videoURL(state="",action){
+  if(action.type==="SET_VIDEO_URL") {
+    return action.value;
+  }
+  return state;
+}
+
+function currentUserSort(state="first_name",action){
+  if(action.type==="SET_CURRENT_USER_SORT") {
+    return action.value;
+  }
+  return state;
+}
+
+function videoScale(state=1,action){
+  if(action.type==="SET_VIDEO_SCALE") {
+    return action.value;
+  }
+  return state;
+}
+
 export default combineReducers({
   currentCount,
   users,
-  specialText
+  specialText,
+  currentCity,
+  searchText,
+  currentTemp,
+  isLoading,
+  videoURL,
+  currentUserSort,
+  videoScale
 })
\ No newline at end of file