{"id":19319702,"url":"https://github.com/hyperoslo/embeddable","last_synced_at":"2025-04-22T17:32:05.839Z","repository":{"id":15306860,"uuid":"18036722","full_name":"hyperoslo/embeddable","owner":"hyperoslo","description":"Embeddable makes it easier to embed videos","archived":false,"fork":false,"pushed_at":"2015-11-20T07:57:41.000Z","size":57,"stargazers_count":6,"open_issues_count":0,"forks_count":8,"subscribers_count":12,"default_branch":"master","last_synced_at":"2025-04-02T02:22:34.760Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/hyperoslo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"MIT-LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-03-23T15:47:11.000Z","updated_at":"2023-05-24T13:35:05.000Z","dependencies_parsed_at":"2022-09-09T02:23:01.058Z","dependency_job_id":null,"html_url":"https://github.com/hyperoslo/embeddable","commit_stats":null,"previous_names":[],"tags_count":6,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyperoslo%2Fembeddable","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyperoslo%2Fembeddable/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyperoslo%2Fembeddable/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/hyperoslo%2Fembeddable/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/hyperoslo","download_url":"https://codeload.github.com/hyperoslo/embeddable/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":249981763,"owners_count":21355564,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-10T01:24:53.722Z","updated_at":"2025-04-22T17:32:05.437Z","avatar_url":"https://github.com/hyperoslo.png","language":"Ruby","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Embeddable\n\n[![Gem Version](https://img.shields.io/gem/v/embeddable.svg?style=flat)](https://rubygems.org/gems/embeddable)\n[![Build Status](https://img.shields.io/travis/hyperoslo/embeddable.svg?style=flat)](https://travis-ci.org/hyperoslo/embeddable)\n[![Dependency Status](https://img.shields.io/gemnasium/hyperoslo/embeddable.svg?style=flat)](https://gemnasium.com/hyperoslo/embeddable)\n[![Code Climate](https://img.shields.io/codeclimate/github/hyperoslo/embeddable.svg?style=flat)](https://codeclimate.com/github/hyperoslo/embeddable)\n[![Coverage Status](https://img.shields.io/coveralls/hyperoslo/embeddable.svg?style=flat)](https://coveralls.io/r/hyperoslo/embeddable)\n\nEmbeddable makes it easier to embed videos.\n\n## Installation\n\nAdd this line to your application's Gemfile:\n\n    gem 'embeddable'\n\nAnd then execute:\n\n    $ bundle\n\nOr install it yourself as:\n\n    $ gem install embeddable\n\n## Usage\n\n```ruby\n# app/models/post.rb\nclass Post \u003c ActiveRecord::Base\n  include Embeddable\n\n  embeddable :video, from: :video_url\nend\n\n# ...\npost = Post.new video_url: 'http://www.youtube.com/watch?v=bEvNRmPzq9s'\n\npost.video_on_youtube? # =\u003e true\npost.video_id          # =\u003e 'bEvNRmPzq9s'\n```\n\n### Views\nYou can use a simple view helper to render the respective video players. `embed_video(embeddable, width, height)`\n\n```erb\n\u003cdiv class=\"video-wrapper\"\u003e\n  \u003c%= embed_video(embeddable, '100%', '100%') %\u003e\n\u003c/div\u003e\n```\n\n#### Multiple embeddables in one model\nIf you have multiple columns using embeddable in one model, you will need to specify which one you want to embed unless it's the first one specified in the model. Add an extra parameter to the view helper: `embed_video(embeddable, width, height, name: :your_embeddable_name)`.\n\nIf you have this in your model:\n```ruby\nembeddable :video, from: :video_url\nembeddable :another_video, from: :another_url\n```\n\nAnd you want to embed `:another_video` - you will use the helper like this:\n```erb\n\u003c%= embed_video(embeddable, '100%', '100%', name: :another_video) %\u003e\n```\n\n#### Overriding\nThe view helper uses partials to render the embed snippets for all of the video players. You can override them by creating a partial here: `app/views/embeddable/`. The file should be named after the player. See example below.\n\n```erb\n\u003c!-- app/views/embeddable/partials/_youtube.html.erb --\u003e\n\u003ciframe width=\"\u003c%= width %\u003e\" height=\"\u003c%= height %\u003e\" src=\"//www.youtube.com/embed/\u003c%= id %\u003e\" frameborder=\"0\" allowfullscreen webkitallowfullscreen mozillowfullscreen\u003e\u003c/iframe\u003e\n```\n\n#### Brightcove\nIf you want to support brightcove, you'll need to add\nyour own brightcove player by overriding the brightcove partial.\n\n1. Create a partial in your project here: `app/views/embeddable/partials/_brightcove.html.erb`\n2. Add your brightcove player code(see example below)\n3. Remember to add the following parameters(included in the example below): `id`, `width`, `height`\n\n```html\n\u003cdiv class=\"BCLcontainingBlock\"\u003e\n  \u003cdiv class=\"BCLvideoWrapper\"\u003e\n    \u003cdiv style=\"display:none\"\u003e\u003c/div\u003e\n    \u003cscript type=\"text/javascript\" src=\"https://sadmin.brightcove.com/js/BrightcoveExperiences.js\"\u003e\u003c/script\u003e\n\n    \u003cobject id=\"brightcove-\u003c%= id %\u003e\" class=\"BrightcoveExperience\"\u003e\n    \u003cparam name=\"secureConnections\" value=\"true\" /\u003e\n    \u003cparam name=\"bgcolor\" value=\"#FFFFFF\" /\u003e\n    \u003cparam name=\"width\" value=\"\u003c%= width %\u003e\" /\u003e\n    \u003cparam name=\"height\" value=\"\u003c%= height %\u003e\" /\u003e\n    \u003cparam name=\"playerID\" value=\"Your player id\" /\u003e\n    \u003cparam name=\"playerKey\" value=\"Your player key\" /\u003e\n    \u003cparam name=\"isVid\" value=\"true\" /\u003e\n    \u003cparam name=\"isUI\" value=\"true\" /\u003e\n    \u003cparam name=\"dynamicStreaming\" value=\"true\" /\u003e\n    \u003cparam name=\"wmode\" value=\"transparent\" /\u003e\n\n    \u003cparam name=\"@videoPlayer\" value=\"\u003c%= id %\u003e\" /\u003e\n\n    \u003cparam name=\"includeAPI\" value=\"true\" /\u003e\n    \u003cparam name=\"templateReadyHandler\" value=\"onTemplateReady\" /\u003e\n    \u003c/object\u003e\n\n    \u003cscript type=\"text/javascript\"\u003ebrightcove.createExperiences();\u003c/script\u003e\n\n  \u003c/div\u003e\n\u003c/div\u003e\n```\n\nIf you used this example, you must remember to add your own `playerId` and `playerKey`\n\n## Contributing\n\n1. Fork it\n2. Create your feature branch (`git checkout -b my-new-feature`)\n3. Commit your changes (`git commit -am 'Add some feature'`)\n4. Push to the branch (`git push origin my-new-feature`)\n5. Create new Pull Request\n\n## Credits\n\nHyper made this. We're a digital communications agency with a passion for good code,\nand if you're using this library we probably want to hire you.\n\n\n## License\n\nEmbeddable is available under the MIT license. See the LICENSE file for more info.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhyperoslo%2Fembeddable","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhyperoslo%2Fembeddable","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhyperoslo%2Fembeddable/lists"}