Skip to content

Instantly share code, notes, and snippets.

@bmease

bmease/Readme.md

Last active February 15, 2017 18:03
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save bmease/6706542 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save bmease/6706542 to your computer and use it in GitHub Desktop.
Download ZIP
A dashing widget that displays tickets for Freshdesk.com
Raw
Readme.md

Description

A dashing widget that displays tickets for Freshdesk.com

Preview

Usage

Add the widget HTML to your dashboard

    <li data-row="1" data-col="1" data-sizex="2" data-sizey="2">               
      <div data-id="freshdesk" data-view="Freshdesk" data-title="Freshdesk Tickets"></div>
    </li>

  1. Create a directory called freshdesk under widgets and copy freshdesk.coffeescript, freshdesk.html, freshdesk.scss into the directory.

  2. Modify the FRESHDESK_URL and FRESHDESK_USERNAME in the freshdesk.rb file.

  3. Copy freshdesk.rb into your jobs folder.

Raw
freshdesk.coffeescript
clamp = (value) ->
return Math.max(0, Math.min(Math.floor(value), 255))
gradient = (value) ->
if value > 1 then value = 1
start = [255, 255, 255]
end = [255, 0, 0]
finalColor = []
for startChannel, i in start
finalColor.push(startChannel * (1-value) + end[i])
return (clamp(x) for x in finalColor)
class Dashing.Freshdesk extends Dashing.Widget
ready: ->
onData: (data) =>
Batman.mixin Batman.Filters,
prettyTime: (dateStr) ->
now = new Date()
date = new Date(dateStr)
elapsed = now.getTime() - date.getTime()
# Percent passed 1 day
value = elapsed / (24 * 60 * 60 * 1000)
color = gradient(value)
days = Math.floor(elapsed / 24 / 60 / 60 / 1000)
hours = Math.floor(elapsed / 60 / 60 / 1000)
minutes = Math.floor(elapsed / 60 / 1000)
seconds = Math.floor(elapsed / 1000)
if days >= 1
plural = if days is 1 then '' else 's'
return "<span style='color: rgb(#{color});'>#{days} day#{plural} ago</span>"
if hours >= 1
plural = if hours is 1 then '' else 's'
return "<span style='color: rgb(#{color});'>#{hours} hour#{plural} ago</span>"
if minutes >= 1
plural = if minutes is 1 then '' else 's'
return "<span style='color: rgb(#{color});'>#{minutes} minute#{plural} ago</span>"
if seconds >= 0
return "Now"
return dateStr
firstName: (name) ->
name.split(' ')[0]
Raw
freshdesk.html
<h1 class="title">Unassigned Tickets</h1>
<ol>
<li data-foreach-item="items" data-showif="item.unclaimed">
<span class="subject" data-bind="item.subject | truncate 32"></span>
<span class="time" data-bind="item.created_at | prettyTime | raw"></span>
</li>
</ol>
<h1 class="title">Agents</h1>
<table>
<tr>
<th class="name" data-foreach-agent="agents">
<span data-bind="agent.name | firstName"></span>
</th>
</tr>
<tr>
<td class="count" data-foreach-agent="agents">
<span data-bind="agent.count"></span>
<span data-bind-id="agent.name"></span>
</td>
</tr>
</table>
<p class="more-info" data-bind="moreinfo"></p>
<p class="updated-at" data-bind="updatedAtMessage"></p>
Raw
freshdesk.rb
# Enter your freshdesk url and api key.
FRESHDESK_URL = 'example.freshdesk.com'
FRESHDESK_VIEW_URL = '/helpdesk/tickets.json?filter_name=new_my_open'
FRESHDESK_USERNAME = 'SECRET_API_KEY'
# Password is blank
FRESHDESK_PASSWORD = ''
FRESHDESK_IGNORE_USERS = ['No Agent', ]
SCHEDULER.every '60s' do
http = Net::HTTP.new(FRESHDESK_URL, 443)
http.use_ssl = true
http.verify_mode = OpenSSL::SSL::VERIFY_PEER
http.start() {|http|
req = Net::HTTP::Get.new(FRESHDESK_VIEW_URL)
req.basic_auth FRESHDESK_USERNAME, FRESHDESK_PASSWORD
response = http.request(req)
json = JSON.parse(response.body)
items = []
agents = {}
for ticket in json
unclaimed = if ticket['responder_id'] then false else true end
obj = { subject: ticket['subject'], created_at: ticket['created_at'], unclaimed: unclaimed }
items << obj
agent = agents[ticket['responder_name']]
if agent
agent['count'] = agent['count'] + 1
else
agents[ticket['responder_name']] = {}
agents[ticket['responder_name']]['name'] = ticket['responder_name']
agents[ticket['responder_name']]['count'] = 1
end
end
agents_list = []
agents.each do |key, value|
obj = { name: value['name'], count: value['count'] }
# Show only agents that exist
if !FRESHDESK_IGNORE_USERS.include?(value['name'])
agents_list << obj
end
end
send_event('freshdesk', { items: items, agents: agents_list })
}
end
Raw
freshdesk.scss
$background-color: #16a085;
$background-color-name: #067660;
$background-color-count: #4d4b4b;
.widget-freshdesk {
background-color: $background-color;
color: #ddd;
ol {
list-style-type: none;
font-size: 1.5em;
font-weight: bold;
}
.title {
font-size: 2em;
font-weight: bold;
color: #fff;
}
table {
border-collapse: separate;
border-spacing: 6px;
border-color: white;
}
.name {
background-color: $background-color-name;
font-size: 1.5em;
font-weight: bold;
}
.count {
background-color: $background-color-count;
font-size: 1.5em;
font-weight: 900;
}
}
@justinreeves00
Copy link

justinreeves00 commented Feb 15, 2017

I can not get this to display information. i think Freshdesk changed their API is there any way you could check and see if that has affected this widget?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment