• Stars
    star
    439
  • Rank 99,247 (Top 2 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 11 years ago
  • Updated almost 9 years ago

Reviews

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

Repository Details

Translate URLs into Rich Media

Olly.js (1.0)

A JavaScript library to convert URLs into embedable HTML.

Example

Live Demo

Usage

Instal with bower or download dist/olly.js

bower install Olly.js

After being included with a <script> tag, Olly exposes the olly object (weird, right?). This object has one important method olly.embed The .embed method takes, at a minimum, a URL from a supported service and a DOM element. The method then fills the provided element with the rich media from the provided URL. For example, a link to a Youtube video will fill the provided element with an embedded Youtube player for the video:

olly.embed("https://www.youtube.com/watch?v=x-8QAFqAAJ8", document.getElementById("youtube"));

This will fill #youtube with the following markup.

<embed width="420" height="345" src="http://www.youtube.com/v/x-8QAFqAAJ8" type="application/x-shockwave-flash">

These methods can both take an optional services argument which allows you to specify which types of URLs should be embedded. For example, if we only want Youtube videos to be embedded, we can do this:

olly.embed("https://www.youtube.com/watch?v=x-8QAFqAAJ8", document.getElementById("blog-post"), {youtube: olly.EMBED});

Contributing

If you're looking to add a service to Olly.js, please include the following changes in your pull:

  • The modified sources for Olly.js which integrate the service.
  • An example added to markup/examples.html.
  • A change to the README listing the new service under Supported Services.

Supported Services

Video

  • Youtube
  • Vimeo
  • Twitch.TV
  • Dotsub
  • Dailymotion
  • LiveLeak
  • Vine
  • TED

Audio

  • Soundcloud
  • Spotify

Images

  • Imgur
  • Gfycat

Social

  • Reddit Subreddits and Users
  • Twitter Tweets

Other

  • Github Repos
  • jsFiddle

Supported File Types

Video

  • MP4
  • WebM
  • OGV

Images

  • JPG
  • PNG
  • BMP
  • GIF

Audio

  • MP3
  • OGG

... and any other you want to implement, pull requests are appreciated!

More Repositories

1

-_-.js

Replaces `console.warn` with less-vague name
JavaScript
306
star
2

tf-jam

Tensor Jam: Shooting Hoops with Machine Learning
ShaderLab
265
star
3

FiltrES.js

A simple, safe, ElasticSearch Query compiler
JavaScript
249
star
4

python-firebasin

Websocket client for Firebase
Python
38
star
5

Shares.js

Get Share/Like/Upvote counts for any URL
JavaScript
29
star
6

firepit

Firebase CLI for Windows
JavaScript
26
star
7

SuperAdvancePets

C
16
star
8

game.work

A Framework Laptop powered retro Game Console!
14
star
9

apil.ist

The best list of APIs ever!
JavaScript
13
star
10

IsHTML

Create UI elements via HTML / TSX in Unity's Tiny.
TypeScript
11
star
11

YStockQuote

An updated version of cgoldberg's Yahoo Finance library for Python
Python
4
star
12

bitmoji

NodeJS Bitmoji Client
TypeScript
4
star
13

FirebaseGodot

A sample Firebase module for the Godot game engine
Java
4
star
14

jpg.cool

A website for sharing random images
Go
3
star
15

Pebblebase

A Pebble / Firebase Example Project
JavaScript
2
star
16

flutter.pics

Dart
2
star
17

DungeonCrawler

JavaScript
2
star
18

Instruct.js

Realtime Client-to-Client Function Sync
JavaScript
2
star
19

Github-Repo-Widget

A good looking repo widget to add to your website which doesn't depend on jQuery.
JavaScript
1
star
20

ts-bp

Typescript Boilerplate
TypeScript
1
star
21

flutter_swarm_study

A clone of Swarm's homescreen in Flutter
Dart
1
star
22

Gunner.js

Tackle RESTful data like no one's business
JavaScript
1
star
23

GBA_2008

A bunch of little demos for GBA from 2008
C
1
star
24

bash.chat

JavaScript
1
star
25

fir-summit-2018

HTML
1
star
26

firestorebyexample

Examples of Cloud firestore
HTML
1
star