Skip to content

Instantly share code, notes, and snippets.

@jeanfrancis

jeanfrancis/Readme.md

Forked from bmease/Readme.md
Created October 8, 2013 11:51
Show Gist options

  • Select an option

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

Select an option

Learn more about clone URLs
Save jeanfrancis/6883522 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Readme.md

Description

A dashing widget that displays tickets for Freshdesk.com

  • Displays unassigned tickets subject and time.
  • Displays Ticket counts assigned to Agents.
  • Time for each ticket changes color depending on age.

Preview

Freshdesk Dashing Widget

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. Copy freshdesk.rb into your jobs folder.

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

  4. Add freshdesk-background.png to the assets/images folder.

More Info

Freshdesk API Documentation

Raw
freshdesk.coffee
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=all_tickets'
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
if ticket['status'] != 5
unclaimed = if ticket['responder_id'] then false else true end
obj = { subject: ticket['subject'], created_at: ticket['created_at'], unclaimed: unclaimed }
items << obj
end
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: url('/assets/freshdesk-background.png') no-repeat;
background-color: $background-color;
background-position: center;
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;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment