Next, you'll modify your Smart Security device app to allow a web app to interact with your Photon through the internet.
Remember that all your Photon's internet communications are routed through Particle Cloud, which provides these ways for your web app to interact with your Photon device:
A web app can get the value of a Photon device variable
A web app can call a custom function on a Photon device
A web app can get event notifications from a Photon device
The web app that you'll be creating for your Smart Security device will perform these tasks:
The web app will display whether the security device is currently armed or disarmed. The web app will do this by getting the value of the deviceMode variable in your Photon device app.
The web app will display a toggle switch that can be clicked to remotely toggle the security device between armed and disarmed mode. The web app will do this by calling the toggleMode() function in your Photon device app.
The web app will display a notification if the security device detects motion while the device is armed. The web app will also display the date and time when a motion event was last detected. The web app will do this by receiving event notifications sent from your Photon device app.
You'll need to add some code to your Photon device app to allow it to interact with your web app.
Your Photon app should have existing code statements from your Smart Light app which you modified that will share the deviceMode variable and toggleMode() function through Particle Cloud.
Be sure the following code statements are already listed within the setup() function (do not add this code again if it already exists):
Your Photon device app can send an event notification using theParticle.publish() method. This will create a "cloud event" in Particle Cloud that will stream the event notification to your web app.
By default, Particle Cloud will clear each cloud event after 60 seconds to prevent your web app from receiving outdated notifications.
An event notification can be sent with or without data:
An event notification sent without data acts like a simple alert that the event occurred.
An event notification sent with data will include additional information as a text string (up to 255 characters).
Particle Cloud will allow your Photon device to send about 1 event notification per second. If your device sends event notifications more frequently than this, Particle Cloud will intentionally slow down your event stream (with a 4-second delay), which can cause issues with your web app performance.
To prevent this, include a delay() of at least 1 second after a Particle.publish() statement (because a 1-second delay added by you is better than a 4-second delay added by Particle Cloud).
For your Smart Security device, your Photon app should send an event notification (without additional data) whenever the motion sensor detects motion.
Send an event notification through Particle Cloud by adding this code statement within your checkMotion() custom function (after the tone() statement but before the delay() statement):
The Particle.publish() method requires a parameter for the cloud event name, which can be up to 63 characters in length. The name must be listed within double quotation marks. In this case, "motion" will be the name of the cloud event.
Since your code already has a delay() statement on the next line for the motion sensor, this existing delay() will also prevent your Photon app from sending event notifications too frequently.
Flash your app code to your Photon device by clicking the Flash icon in the left navigation bar.
Once your Photon has downloaded the app and restarted, the updated app will start running. You shouldn't notice any changes in the device's behavior, but your Photon app will now send a "motion" event notification to Particle Cloud every time motion is detected while the device is armed.
