π Zendesk backlog status light with Philips Hue
Hi there,
Since I got appointed as Community Moderator in January, I realized that I do not have one single article in the Zendesk Community. I usually prefer to answer stuff than asking questions here :)
However, I think for almost 2 years now we have a pretty unique setup in our office in Vienna, which I want to finally show some other Zendesk nerds here.
This will be quite a long topic, so I will update it on a weekly basis until we get the final result.
Finished Project
Based on the current support ticket backlog in our Zendesk account, my desk is colorized with a LED light strip.
π΄ π π΅ π’
All in real-time, you just need some Triggers, a bit of coding experience, and Philips Hue Bridge + LED bulb/strip.
π‘ Over the course of the next few weeks, I will show you how π‘ (2020-09-01)
- Added Script and Zendesk How-to (2020-09-16)
How to get there
What do you need?
-
Philips Hue
- Android / iOS App
- Bridge
- Any Lamp/Strip which supports color
-
Google Account
- IFTTT Account
How to setup Zendesk
For this we need an existing or new custom view, a trigger, and an extension.
View
Simply use an existing view of your backlog, or create a new one with your own definition how the light should react.
Then note down its ID, we will need this soon.
Trigger
Extension
How to setup the server
1) Go to script.google.com
2) New Project
3) Paste this code
/* The script should work on its own,
/* simply edit the variables below to your own stuff */
/* ################################################# */
// fetch new key here by clicking on (Documentation)
// https://ifttt.com/maker_webhooks
var ifttt_key = "ACCESS_KEY";
// insert your zendesk view ID
var backlog_view = "VIEW_ID";
// insert your zendesk subdomain
var zendesk_subdomain = "SUBDOMAIN"
// insert your zendesk API key - BASE 64 encoded
var zendesk_apikey_base64 = "API_KEY_BASE_64"
// insert the thresholds for your colors.
var threshold_green = 1;
var green = "green";
var threshold_blue = 2;
var blue = "blue";
var threshold_yellow = 3;
var yellow = "yellow";
var threshold_orange = 4;
var orange = "orange";
var red = "red";
var error = "error";
//insert the busy hours of your office
var begin_workday = 8;
var end_workday = 16;
/* ################################################### */
//βββββββββββββββββββββββββββββββββββββββββββββββββ
/* ##### API ##### */
/* https://developers.google.com/apps-script/guides/web */
function doGet(e) {
setLightStrip();
return HtmlService.createHtmlOutput('<b>GET</b> <br> Webhook received <br>'); //required for whole script to work
}
function setLightStrip(){
var count;
var color;
count = getViewCount(backlog_view);
if(count < threshold_green){
color = green;
}else if(count < threshold_blue){
color = blue;
}else if(count < threshold_yellow){
color = yellow;
}else if(count < threshold_orange){
color = orange;
}else if(count >= threshold_orange){
color = red;
}else{
color = error;
}
setLight(color);
return;
}
function setLight(color){
if(busyHours()){
ifttt(color);
Logger.log(color);
}else{
Logger.log("Office not busy.")
}
}
//βββββββββββββββββββββββββββββββββββββββββββββββββ
//IFTTT
function ifttt(target){
options = {
'method' : 'post',
};
UrlFetchApp.fetch("https://maker.ifttt.com/trigger/" + target + "/with/key/" + ifttt_key);
}
//Zendesk
function getViewCount(id){
// GET Zendesks view count
var headers = {
"Accept":"application/json",
"Content-Type": "application/json",
"Authorization":"Basic " + zendesk_apikey_base64
};
var options = {
'method' : 'get',
"headers": headers,
'contentType': 'application/json',
// Convert the JavaScript object to a JSON string.
//'payload' : JSON.stringify(data)
};
var response = UrlFetchApp.fetch("https://" + zendesk_subdomain + ".zendesk.com/api/v2/views/" + id + "/count.json", options);
var data = JSON.parse(response.getContentText());
Logger.log(data.view_count.value);
return data.view_count.value;
}
//Helper functions
function busyHours(){
var now = new Date();
if(now.getDay() >= 1 && now.getDay() <= 5 && now.getHours() >= begin_workday && now.getHours() <= end_workday){
return true;
}else{
return false;
}
}
4) Publish => Deploy => Web App
5) If prompted, allow access to your Google Account.
How to setup IFTTT
TBD
How to setup Philips
1) Create a new room with the Hue app and add the lights you want to control
2) Set up those 5 colors from the code.
3) It should look somehow like that
How to stitch everything together
There's not really a good order to do all that stuff, since there are some requirements within each other. e.g. Zendesk Extension needs URL of Server.
However, I think this is the best one:
- Set up Philips Hue
- Create IFTTT recipes
- Set up Zendesk
- View
- Trigger - Set up Server
- Set up Zendesk again
- Extension - Finish Server and deploy
-
Can't wait to see how you implemented this COOL idea!
-
wow! now I need one exactly like yours!
-
Amazing, love it !
Please sign in to leave a comment.
3 Comments