Random Reddit

README.md

Demo

Here's a live demo http://dogdash.herokuapp.com/

Code example: https://github.com/bennycwong/dogdash

Description

Dashing widget to display a random gif from reddit

The display of the widget is heavily based on the Image widget, however it does not prepend the src with 'assets' which allows for external images.

Settings

You can set a placeholder image in the event that reddit is down, or otherwise unresponse. This is set at the top of random_aww.rb as follows:

placeholder = '/assets/nyantocat.gif'

This can be an image in /assets/images, or a full path to a remotely hosted image.

Selecting Which Subreddit to look through, add it to this list:

subreddits = {
  'nonononoyes' => '/r/nonononoyes/hot.json?limit=100',
  'abj' => '/r/animalsbeingjerks/hot.json?limit=100'
}

Usage

To use this widget, copy reddit.html, reddit.coffee, and reddit.scss into the /widgets/reddit directory. Put the reddit.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="2" data-sizey="1">
  <div data-id="abj" data-view="RandomReddit"></div>
</li>

Preview

random_reddit.coffee

class Dashing.RandomReddit extends Dashing.Widget

  ready: ->
    # This is fired when the widget is done being rendered

  onData: (data) ->
    # Handle incoming data
    # You can access the html node of this widget with `@node`
    # Example: $(@node).fadeOut().fadeIn() will make the node flash each time data comes in.

random_reddit.html

<div style="" class="image_container" data-bind-style="image"></div>

random_reddit.rb

require 'net/http'
require 'json'

placeholder = '/assets/nyantocat.gif'
subreddits = {
  'nonononoyes' => '/r/nonononoyes/hot.json?limit=100',
  'abj' => '/r/animalsbeingjerks/hot.json?limit=100'

}

SCHEDULER.every '20s', first_in: 0 do |job|
  subreddits.each do |widget_event_id, subreddit|
    http = Net::HTTP.new('www.reddit.com')
    response = http.request(Net::HTTP::Get.new(subreddit))
    json = JSON.parse(response.body)

    if json['data']['children'].count <= 0
      send_event('aww', image: placeholder)
    else
      urls = json['data']['children'].map{|child| child['data']['url'] }

      # Ensure we're linking directly to an image, not a gallery etc.
      valid_urls = urls.select{|url| url.downcase.end_with?('png', 'gif', 'jpg', 'jpeg')}
      send_event(widget_event_id, image: "background-image:url(#{valid_urls.sample(1).first})")
    end
  end
end

random_reddit.scss

// ----------------------------------------------------------------------------
// Sass declarations
// ----------------------------------------------------------------------------
$background-color:  #2d2e29;

// ----------------------------------------------------------------------------
// Widget-image styles
// ----------------------------------------------------------------------------
.widget-random-reddit{

  background-color: $background-color;
 
  .image_container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
  }

}