https://github.com/appsembler/xblock-video
Universal Video XBlock with pluggable backend for many video hosting providers
https://github.com/appsembler/xblock-video
appsembler brightcove edx open-edx video wistia xblock
Last synced: 2 months ago
JSON representation
Universal Video XBlock with pluggable backend for many video hosting providers
- Host: GitHub
- URL: https://github.com/appsembler/xblock-video
- Owner: appsembler
- License: gpl-3.0
- Created: 2016-10-28T18:10:31.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2024-02-07T19:37:09.000Z (over 2 years ago)
- Last Synced: 2024-04-14T11:48:58.738Z (about 2 years ago)
- Topics: appsembler, brightcove, edx, open-edx, video, wistia, xblock
- Language: Python
- Size: 2.86 MB
- Stars: 18
- Watchers: 11
- Forks: 50
- Open Issues: 16
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# xblock-video
[](https://circleci.com/gh/raccoongang/xblock-video/tree/dev)
[](https://codecov.io/gh/raccoongang/xblock-video)
[](https://github.com/raccoongang/xblock-video/releases)
The Video XBlock is for embedding videos hosted on different video platforms
into your Open edX courses.
Supported video platforms:
- Brightcove
- Html5
- Vimeo
- Wistia
- Youtube
The idea of crowd-funded universal video-xblock was proposed by @natea
(Appsembler) at the Open edX Conference 2016 at Stanford. It was well-received
and several companies offered to sponsor the initial development.
Appsembler initially contracted with Raccoon Gang to build the [wistia-xblock]
as a prototype ([see the Github repo]), and later created a new Video XBlock
featuring universal pluggable interface with several video hosting providers
support:
[wistia-xblock]: https://appsembler.com/blog/why-open-edx-needs-an-alternative-video-xblock/
[see the Github repo]: https://github.com/appsembler/xblock-wistia
Appsembler and Raccoon Gang will be co-presenting [a talk about the
video-xblock] at the Open edX Con 2017 in Madrid.
[a talk about the video-xblock]: https://openedx2017.sched.com/event/9zf6/lightning-talks
We welcome folks from the Open edX community to contribute additional video
backends as well as report and fix issues.
Thanks to [InterSystems] and [Open University] for sponsoring the initial
version of the Video XBlock!
[InterSystems]: https://www.intersystems.com
[Open University]: https://www.open.ac.uk
## Installation
```shell
sudo -sHu edxapp
source ~/edxapp_env
# Install VideoXBlock using pip
pip install --process-dependency-links -e "git+https://github.com/appsembler/xblock-video.git@dev#egg=video_xblock"
```
## Enabling in Studio
You can enable the Video xblock in studio through the advanced
settings:
1. From the main page of a specific course, click on *Settings*,
*Advanced Settings* in the top menu.
1. Check for the *Advanced Module List* policy key, and add
`"video_xblock"` in the policy value list.

1. Click on the *Save changes* button.
## Usage
To embed a video simply copy & paste its URL into a `Video URL` field.
Sample supported video URLs:
- Brightcove: https://studio.brightcove.com/products/videocloud/media/videos/12345678 or https://studio.brightcove.com/products/videos/12345678
- HTML5: https://example.com/video.mpeg|mp4|ogg|webm
- Vimeo: https://vimeo.com/abcd1234
- Wistia: https://raccoongang.wistia.com/medias/xmpqebzsya
- Youtube: https://www.youtube.com/watch?v=3_yD_cEKoCk and others.
### Brightcove
To successfully use videos hosted on Brightcove Videocloud service one must
provide valid Brightcove `account_id` associated with the video. To find out
your `account_id` go to [Videocloud studio] -> _Admin_ -> _Account Information_.
[Videocloud studio]: https://studio.brightcove.com/products/videocloud/home
#### Connect to Brightcove Platform
1. Grab your [BC_TOKEN] from Brightcove Videocloud:
1. Login to [Videocloud Studio] as you normally do.
2. With any page in Studio open, open the developer tools for the browser,
go to the Console, and paste in the following code:
```js
var cookiesArray = document.cookie.split(";"), cookiesObj = {}, i, tmpArray = [];
for (i = 0; i < cookiesArray.length; i++) {
tmpArray = cookiesArray[i].split("=");
if (tmpArray[0].indexOf('BC_TOKEN') > -1) {
cookiesObj.BC_TOKEN = tmpArray[1];
}
}
window.prompt("BC_TOKEN:", cookiesObj.BC_TOKEN);
```
and press ``.
3. You should see a prompt appear that contains your BC_TOKEN.

2. Open Video XBlock settings, Advanced tab. Scroll down to `Video API Token` section.
3. Put `BC_TOKEN` taken from Brightcvove into `Client Token` field.
4. Click on `Connect to video platform` button.
[Videocloud Studio]: https://studio.brightcove.com/products/videocloud/home
[BC_TOKEN]: https://docs.brightcove.com/en/video-cloud/media-management/guides/authentication.html
#### Enable content encryption and/or autoquality
Given you've connected XBlock to Brightcove platform and have a Video XBlock with a video from Brightcove. You can enablevideo content encryption and/or auto-quality.
To do so:
1. Go to Advanced settings tab.
1. Scroll down to `Brightcove content protection` section.
1. Select `Autoquality` or `Autoquality & Encryption`.
1. Click `Re-transcode this video` button.
Re-transcode is performed by Brightcove's Videocloud and takes few minutes. After it's done `Brightcove Video tech info` section will be updated.
### Wistia
#### How to disable captions auto uploading in Wistia plugin
1. Open your Project in Wistia Platform.
1. Open video which you want to use with Video XBlock.
1. Click the `Video Actions` drop-down menu -> Select the `Customize` menu item.
1. On the left side of the screen find the `Captions` menu item.
1. Turn the trigger to `Off` to disable native captions display in the
Video XBlock.

### Set default values in config files
Now it is possible to indicate prepopulated values for any xblock field
per site installation (see note below).
Sample default settings in `/edx/app/edxapp/cms.env.json`:
```json
"XBLOCK_SETTINGS": {
"video_xblock": {
"threeplaymedia_apikey": "987654321",
"account_id": "1234567890"
}
}
```
Note: here above each provided key corresponds to SITE_NAME environment variable value.
### Allowed Handouts file types
+ __images:__ .gif, .ico, .jpg, .jpeg, .png, .tif, .tiff, .bmp, .svg,
+ __documents:__ .pdf, .txt, .rtf, .csv,
+ __MSOffice:__ .doc, .docx, .xls, .xlsx, .ppt, .pptx, .pub,
+ __openOffice:__ .odt, .ods, .odp,
+ __archives:__ .zip, .7z, .gzip, .tar,
+ __other:__ .html, .xml, .js, .sjson,
+ __transcripts:__ .srt, .vtt
## Development
Prereqs: [NodeJS >= 4.0](https://docs.npmjs.com/getting-started/installing-node#updating-npm)
Install development tools and dependencies:
```shell
> make tools deps-test
```
Run quality checks:
```shell
> make quality
```
Run tests:
```shell
> make test
```
VideoXBlock is bundled with a set of XBlock-SDK Workbench scenarios.
See [workbench docs](/video_xblock/workbench/README.md) for details.
## License
The code in this repository is licensed under the GPL v3 licence unless
otherwise noted.
Please see `LICENSE` file for details.