This blog assumes you have already setup your Ring security system and wish to integrate it with Home Assistant for automation. If you have not done that, you will need to start there first.
First, we need to setup MQTT. MQTT (Message Queuing Telemetry Transport) is a lightweight messaging protocol that plays well with IoT (Internet of Things) devices so it’s ideal for devices with limited bandwidth.
Head over to the Community Apps in UnRaid and search for MQTT. There are several options, but I chose “Spants’s Repository” app. Setup is super simple. In fact, I am pretty sure this container has the ports filled in for you, but you can change them if you need to.
Now that we have MQTT setup and configured, head back over to the Community Apps section again and search for Ring-MQTT. At the time of writing, there’s only one app so need to worry about which one to choose.
There are quite a few options here to fill out, but fortunately we do not need most of them to get up and running. To start with, we need to choose a DataPath for where the container will store the necessary configuration files. I usually leave it as the default path “/mnt/user/appdata/ring-mqtt” For now, we need to enter the localhost address for your MQTT instance. Enter “mqtt://192.xxx.x.xxx” for the format. If you have username and password setup for your MQTT instance, enter then in the respective fields. The port field should already be populated with the default port for MQTT, however, if you changed it during setup, you will need to enter whatever port you changed it to here.
The rest of these fields are option in my opinion as I only entered the Disarm code value. Select Apply to deploy the container. Now, you might be wondering why we did not enter anything for the Ring Token since that seems important. It is definitely important as we will need this for the integration to work, but we will need run some commands.
We need two commands from this page, but I’ll list them here for your convenience.
docker run -it –rm –mount type=bind,source= <enter_the_DataPath_variable_here>,target=/data –entrypoint /app/ring-mqtt/init-ring-mqtt.js tsightler/ring-mqtt
docker run –rm –mount type=bind,source= <enter_the_DataPath_variable_here>,target=/data tsightler/ring-mqtt
Now that we have the scripts we need, open up the Terminal in UnRaid. In the terminal, enter the first command, but be sure to enter the DataPath we set earlier in the “Source” section of the script.
If done correctly, the terminal will prompt you to enter your Ring account credentials: Email, Password, and 2FA if it’s setup. Once this has been all entered, the container will start creating the configuration files that were missing before. Now, we need to enter the second script to bring the container back up.
We are done with the Ring-MQTT and MQTT container configuration so let’s head on over to Home Assistant.
In Home Assistant, you simply need to add the MQTT integration. This can be found under Settings > Devices & Services > MQTT. Enter you localhost, port, and credentials (if you setup a username and password) and now you all good.
One of the most critical pages an organization, large or small, should have to influence efficient productivity is an Employee Directory. It acts a singular location to help employees understand who they should contact by authority and how to reach them. SharePoint and Teams don’t quite offer an out-of-the-box solution, so organizations often rely upon SharePoint Lists, Excel spreadsheets, or even PDF documents to visualize their employee directory. In this article, I’m going to walk you through how I created a very simple employee directory app in Microsoft Power Apps that can be accessed on the web, as an app embedded on any SharePoint site and Microsoft Teams. As a prerequisite, you will need a Microsoft Office 365 F1, E1, E3, and E5 licenses which is great because you likely have this powerful low code tool at your disposal already.
To get started, make your way to the Power Apps maker portal at http://make.powerapps.com and log into your Office 365 account with your typical credentials. Once you’ve made it to the main portal page, select Blank app.
Power apps give you the ability to make 3 different types of apps: Canvas apps, Model-Driven apps, and Portal apps. For our purposes, we’re going to choose a blank canvas app which is meant for building apps completely from scratch.
Next, you’ll choose the format and name the app. I typically build Tablet apps as I’m most likely to access it on a tablet or desktop computer. It is worth noting that Power Apps gives some options to scale the app to fit certain aspect ratios, but you’re still going to be working with Phone or Tablet formats.
Alright! We’ve made it to our workspace. The first thing we’ll need to do is connect a data source to pull in our employee data. Our data will be coming from the Office 365 Users data connection. As I’m sure you’ve guessed, this connector will pull in user profile information found in your organization’s Office 365 accounts.
Next, select the Tree View to view our main Screen and the elements it will contain. Power Apps shares some similarities to Adobe Photoshop in that screens and elements are layered on top of each other. You can bring forward or move backward screens and elements as necessary. Keep this in mind as we build our app. Select Insert either at the top or left side menu bar > choose Blank vertical gallery underneath the layout group.
Now that you’ve inserted the gallery element onto our Screen1, we’re going to change the layout to 3 columns. To do that, select Gallery from the Tree view and open up the editor on the right side of the screen. You can also find the layout menu at the top of the screen as well.
Select your Screen1 and insert a Text Input element found underneath the Input group. Place the top of the screen because this will serve as our search bar to locate employees. Be sure to label this Text Input to avoid any confusion later with formulas we’ll be using. For now, I’m going to label my Text Input to EmployeeTxt. Delete the Text input from the formula bar at the top, but leave the quotation marks.
With the layout updated, we can start with adding formulas to make our search for users. Select Gallery in the Tree view and paste in the following formula:
Filter(Office365Users.SearchUser({searchTerm:””,top:999}), EmployeeTxt.Text in DisplayName || EmployeeTxt.Text in Department || EmployeeTxt.Text in JobTitle || EmployeeTxt.Text in BusinessPhones || EmployeeTxt.Text in UserPrincipalName, AccountEnabled= true And !IsBlank(JobTitle) And !IsBlank(Department))
I’ll break down how this formula works. Firstly, the base code function, Office365Users.SearchUser({searchTerm:””}), is performing an API call via the Office 365 Users data connector we added earlier to search all users. This is why we removed the Text Input text earlier from the search bar. The next part, ,top:999, is designed to find and present the first 999 users in your organization. The next part must be paired with the filter function at the beginning of our query formula to find the results of Department, Job Title, Business Phone, and Email (User Principal Name). Stay with me because we’ll add these fields shortly. The last piece, AccountEnabled= true And !IsBlank(JobTitle) And !IsBlank(Department), may or may not apply to how your organization functions. It’s designed to hide recently terminated employees who are not enabled and service accounts in Office 365 that are missing a job titles and departments.
Next, we need to get some profile pictures loaded in. Select the Image element underneath Gallery in the Tree View and replace the CustomGallerySample with the following formula:
Office365Users.UserPhoto(ThisItem.Id)
You should see employee photos flowing in now. For a bit more flair, change the OnSelect property for the photo to launch Microsoft Delve, but adding this formula:
Delve is a useful service that allows you to manage some of your Office 365 information as well as a few other interesting details such as an org chart and recently accessed documents.
Resize, reposition, and change the shape of your profile pictures either on the right side menu under advanced or in the upper right corner next to the formula (fx) bar.
Let’s add in the employee information we’re missing. Select the Gallery in the Tree view and then choose the pen icon to edit the Gallery. Insert 3 Text Labels underneath the Display group.
Underneath Properties > Data Source, Edit the Fields one by one. The Office 365 Users connector will give you options in the Data panel to choose. I labeled the text labels to match the data populated within the fields, since this will match our lengthy formula in the Gallery.
If you wish to add some visibility to business phone numbers, you can do so by adding the following code to the text property of the Text Label:
First(ThisItem.BusinessPhones).Value
If you’re curious why we used the First function here, it’s because Business Phones are listed in an array data type rather than a String like we saw with the other values. This means that you will need a function to choose which phone number to display, and Business Phones happens to be first.
Let’s add a bit of style and depth to the app by adding some shapes underneath the text and profile pictures. Buttons offer radius controls to round out the corners, so we’ll add those to the Gallery and send them to the bottom of our list, so they sit behind our picture and text.
I’ve added some icons here because an Employee Directory would not be complete without functional icons. We do this by using Deep Linking code to give the icons the ability to launch Teams calls, Teams chat, and Outlook. First, we’ll want Power Apps to determine how the user is accessing our app in order to launch a Teams call or chat from the appropriate place. We’ll do this by using a bit of code Microsoft provides to us here.
Take the above code and select the App in the Tree view. Now change the App property in the drop-down menu located in the upper left corner to OnStart. The OnStart menu tells Power Apps to perform specific functions that you code when the app is launched each time.
Now we can code our call and chat icons. Select the icon, change the property for the icons to OnSelect and then enter the following:
Now we just need to tighten up the UI to make it look a bit cleaner to finish. Now that we’re finished building our app, we can publish the app and share it to make it available to everyone. In the upper right-hand side, choose the publish button.
Choose wither you want to share the app with individual employees, groups, or organization wide based on your organization’s setup.
The best part about Power Apps is the deep integration with other Microsoft products. Your new employee directory can now be used on the web through the Power Apps portal, on SharePoint via the Power Apps webpart, as an within Teams, and on iOS or Android tablets with the dedicated Power Apps application (not pictured).
Employee Directory from the web (Power Apps site)
Employee Directory in Teams
Employee Directory in Sharepoint
Power Apps offers some interesting features to quickly solve problems that would normally require a development team or purchasing services or apps from a vendor. If you’d like to try this yourself, check out my GitHub.
