README.md

##Preview

Description

Simple Dashing widget (and associated job) to display recent StockTwits data for a specific ticker symbol using the StockTwits API.

##Dependencies

None

##Usage To use this widget, copy comments.html, comments.coffee, and comments.scss into the /widgets/comments directory. Put the stocktwits.rb file in your /jobs folder.

To include the widget in a dashboard, add the following snippet to the dashboard layout file:

<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
  <div data-id="stocktwits_mentions" data-view="Comments" data-title="Recent StockTwits"></div>
</li>

##Settings

You'll need to select the StockTwits ticker symbol you wish to use. You can set it by editing the StockTwits API url in stocktwits.rb

StockTwits are fetched every 10 minutes, but you can change that by editing the job schedule.

comments.coffee

class Dashing.Comments extends Dashing.Widget

  @accessor 'quote', ->
    "“#{@get('current_comment')?.body}”"

  ready: ->
    @currentIndex = 0
    @commentElem = $(@node).find('.comment-container')
    @nextComment()
    @startCarousel()

  onData: (data) ->
    @currentIndex = 0

  startCarousel: ->
    setInterval(@nextComment, 8000)

  nextComment: =>
    comments = @get('comments')
    if comments
      @commentElem.fadeOut =>
        @currentIndex = (@currentIndex + 1) % comments.length
        @set 'current_comment', comments[@currentIndex]
        @commentElem.fadeIn()

comments.html

<h1 class="title" data-bind="title"></h1>
<div class="comment-container">
  <h3><img data-bind-src='current_comment.avatar'/><span data-bind='current_comment.name' class="name"></span></h3>
  <p class="comment" data-bind='quote'></p>
</div>

<p class="more-info" data-bind="moreinfo"></p>

comments.scss

// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$background-color:  #eb9c3c;

$title-color:       rgba(255, 255, 255, 0.7);
$moreinfo-color:    rgba(255, 255, 255, 0.7);

// ----------------------------------------------------------------------------
// Widget-comment styles
// ----------------------------------------------------------------------------
.widget-comments {

  background-color: $background-color;

  .title {
    color: $title-color;
    margin-bottom: 15px;
  }

  .name {
    padding-left: 5px;
  }

  .comment-container {
    display: none;
  }

  .more-info {
    color: $moreinfo-color;
  }

}

stocktwits.rb

SCHEDULER.every '10m', :first_in => 0 do |job|
  begin
    require 'cgi'
    twits = JSON.parse((URI.parse("https://api.stocktwits.com/api/2/streams/symbol/AAPL.json").read))
    if twits
      twits = twits.each_with_index.map do |item, index|
        { name: twits["messages"][index]["user"]["username"], body: CGI.unescapeHTML(twits["messages"][index]["body"]) }
      end
    end
    send_event('stocktwits_mentions', comments: twits)
  rescue
  end
end