##Color Change Update Last week I got my color changing web app working.  It was only a one page website with a button on it. When a user visited the website, they could click the button to change to color of the background. This color was selected randomly from an array I made.  This array was filled with hexadecimals that I got from colourlovers.com. After showing it to professors in the department, I got some feedback I needed to incorporate.  When you hit the button on the web app, it changes to a random color. But you don’t know as the user what color you changed it to. I was advise to list only 3 or 5 colors on the page as buttons. And the user could click one to change the website to that color. This way the user knows they are impacting the app.

To do this, I set up custom data attributes on the color buttons holding their hexadecimal value. When a button is pressed, JS strips the value form the data attribute, sends it to the server. The server then sends that value to all the people online and the browser’s background color is updated. This newer version can be viewed at https://color-change.herokuapp.com/.

##Device Motion

Next week I need to have device data detected by a smartphone display on the desktop. This will help me drive an “cursor” like object later in my project. I did a lot of research this week on JavaScript’s  devicemotion detection. There are a good amount of tutorials out there now.  It did a few of them to understand how these functions were set up and then collected my own. I found that some of them we more complex than what was needed. I have a running static version online here: http://chelmyers.github.io/device-motion/. I ran into one hiccup along the way though. I developed only locally on my desktop first. I did this because Chrome has a motion emulator. You can change the rotation of the device. So I set up everything and was going crazy because the emulator was not working. After some time I decided to put all my work online (at that URL)  and try on my iPhone. Everything was working. There was just some issue with Chrome. The emulator was not actually emulating.

What my current example does is shows you what the device’s orientation is, on the actual device. It does NOT use websockets. Next week, I need to set up a websocket example that take the device’s data and broadcasts is to all devices also connected.

##Emoji Chat

To continue working with WebSockets I also made my own chat room. This project is the “Hello World” of websockets. I call is Emoji Chat. All users are given an emoji and enter a chat room. They can then posts messages and read the messages of others. See it live here: https://emoji-chat.herokuapp.com/

##Other Research

I continued my research on other projects and found one that combines websockets and device motion detection. It is from 2012 though. Web I initially downloaded it, it would not run. Some of the code is depreciated and needed an update. After I did that, I actually got it to work. It uses a phones rotation to rotate a logo on the page. This will be a great help further into my project. https://github.com/hadimichael/DeviceOrientationEvent-demo

###Next Week

Next week I will have device motion detection working with websockets.

Time Breakdown:

• Update Color Changing App: 2hrs
• Device motion detection tutorials and desktop attempts: 3hrs 30mins
• Set up device motion detection on iPhone: 1hr 45 mins
• Emoji Chat: 1hr 20 mins
• Work on multi-user motion detection on remote: 2hrs 15 mins
• Total: 10hrs 45 min