• Stars
    star
    143
  • Rank 257,007 (Top 6 %)
  • Language
    Ruby
  • License
    MIT License
  • Created almost 16 years ago
  • Updated over 8 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

An easy way to include external video services in a rails app.

Acts as unvlogable Build Status Coverage Status

What the hell is this!

This is the plugin that we use in unvlog.com to manage the supported video services. It is an easy way to obtain a few basics about a video only through its url.

A quick example:

To include this video in this post we need to know its title, the correct way to embed it and its thumbnail url. With this plugin we have an easy access to this data:

    @aha = UnvlogIt.new("http://www.youtube.com/watch?v=GPQnbtldFyo")
    @aha.title => "paradon del portero"
    @aha.thumbnail => "http://i4.ytimg.com/vi/GPQnbtldFyo/default.jpg"
    @aha.embed_url => "http://www.youtube.com/v/GPQnbtldFyo"
    @aha.embed_html(width, height) => "<object [...]</object>"
    # all together :)
    @aha.video_details(width, height) => {
                                            :title => ...,
                                            :thumbnail => ...,
                                            :embed_url => ...,
                                            :embed_html => ...,
                                          }

With this plugin we have an unique way to manage multiple services :)

Install it!

  1. Install it as a gem:

     gem "acts_as_unvlogable"
    
  2. Optionally you can create the config/unvlogable.yml to store keys for the different services. You have in the plugin a sample file.

2.1. 'yt' gem will need an API key from google in order to get the youtube video information properly, without dealing with API limits. They explain it better than me here

Use it!

The idea is make it as simple as possible. For a given video URL as http://vimeo.com/1785993:

    videotron = UnvlogIt.new("http://vimeo.com/1785993")

Then we have methods to know the 'basics' for use this video on your application.

  • title: A method to know the title of the video on the service.

      videotron.title
      => "Beached"
    
  • service: A method to know the name of the video provider service.

    videotron.service
    => "Vimeo"
    
  • thumbnail: An image representation of the video. Each service has a different size, but... it works :)

      videotron.thumbnail
      => "http://bc1.vimeo.com/vimeo/thumbs/143104745_640.jpg"
    
  • embed_url: The url (with flashvars) of the video player.

      videotron.embed_url
      => "http://vimeo.com/moogaloop.swf?clip_id=1785993 [...] &show_portrait=1"
    
  • embed_html(width, height): Uses the embed_url to build an oembed string. The default width x height is 425 x 344, but we can specify a different one.

      videotron.embed_html(400, 300)
      => "<object width='400' height='300'><param name='mo [...] 300'></embed></object>"
    
  • flv: DEPRECATED

  • video_details(width, height): All together :), returns all the previous elements in a hash. Width and height can be specified to build the embed_html.

      videotron.video_details
      => "{ [...] }"
    

Supported services

At this moment we support the following video services:

And... what else?

If you find a bug or want to suggest a new video service, please tell it to us in a ticket.

Thanks!!

More Repositories

1

sketch-designdoc

Exports a simple website using a bunch of conventions and a Sketch document as the structure
Objective-C
220
star
2

sketch-truncate-textlines

Cut the number of lines of a textbox, adding an ellipsis if needed. It works using words or characters.
JavaScript
72
star
3

mamuso.dev

Why does it hurt so much to hit your funny bone?
TypeScript
38
star
4

jquery.prettyfile

For a nicer input file
JavaScript
26
star
5

figma-orgchart

Create an org chart in Figma from a JSON/YAML
TypeScript
19
star
6

yammer-sketch-tools

Sketch plugins and commands we use at Yammer
JavaScript
14
star
7

figma-designdoc-archive

Exports a simple website using a bunch of conventions and a Figma document as the structure
SCSS
14
star
8

reticulatorjs

Create a grid while you're developing your markup
JavaScript
13
star
9

weekly-update-action

An action for creating a weekly GitHub discussion. It has the option of posting in advance and sending a reply to the post later in the week as a reminder.
TypeScript
9
star
10

jquery.filterprojects

jquery plugin to build a portfolio page
JavaScript
9
star
11

breakfastDashboard

The bus is coming!
JavaScript
7
star
12

discussion-to-markdown-action

An action for transforming a GitHub Discussion into a markdown output.
TypeScript
7
star
13

papercups

Home of http://papercups.mamuso.net
TypeScript
5
star
14

bluelabel-jsdoc

Template for JsDoc 2
JavaScript
5
star
15

party-poopers

A Birdy Wirdy card game
JavaScript
4
star
16

bitbar

JavaScript
4
star
17

close-figma-tab

Close Figma tabs in chrome if you have "Open in Desktop App" active
JavaScript
3
star
18

fluxcapacitor

TypeScript
3
star
19

jekyll-design-projects

A jekyll theme to present design projects
CSS
3
star
20

maquetas-andar-por-casa

nanoc del curso html de andar por casa :)
Ruby
2
star
21

mamuso.net

Yours truly
HTML
2
star
22

iwanna-widget

ActionScript
2
star
23

dummy-test-app

App for testing and connecting purposes
JavaScript
2
star
24

nextjs-simple-darkmode

A simple way to implement light/dark mode in Next.js
JavaScript
2
star
25

cookbook

2
star
26

sketch-designsite

Objective-C
2
star
27

detalles-js

Ruby
1
star
28

photos.mamuso.net

https://photos.mamuso.net
TypeScript
1
star
29

dco-exercise

1
star
30

mamuso

Hey, whatcha doin?
JavaScript
1
star
31

OhMyToeCatalog

Script to build the ohmytoe catalog
Ruby
1
star
32

sketch-cat-ipsum

If you love catipsum.com & sketch as much as I do, then I don't know how could you live without this plugin
1
star
33

straycharacters.mamuso.net

JavaScript
1
star
34

reticulatorjs-site

website for reticulator, with sinatra
JavaScript
1
star
35

assets

Assets I use for different projects
1
star
36

ogtojsonservice

JavaScript
1
star
37

mamuso.dev.content

Content repo for mamuso.dev
1
star
38

publish-action-test

1
star
39

dotfiles

Shell
1
star
40

unvlogable

A simple interface that provides a standardized oembed output for video services.
JavaScript
1
star
41

AndroidDPIPopup

DPI pop up window for daily usage, based on http://coh.io/adpi/
JavaScript
1
star
42

unvlog-api

JavaScript
1
star
43

unvlog-client

JavaScript
1
star
44

alex-turns-three

CSS
1
star
45

demo.mamuso.net

nanoc con el site demo.mamuso.net y su correspondiente deploy
JavaScript
1
star
46

board-populator-action

An action to compose and populate GitHub org boards (memex) with draft issues.
TypeScript
1
star