Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision

Target

Select target project
  • moodleOpenCastDownloads/ff-ext
  • larsf/firefox-extension-for-opencast-download
  • lukasj/ff-ext
3 results
Select Git revision
Show changes
Commits on Source (7)
Hide whitespace changes
Inline Side-by-side
README.md
View file @ 7a097581
About This Software
-------------------
===================
**WARNING:** This extension is neither …
- packaged
- ~~packaged~~ (should be by now)
- thouroughly testes
- approved or endorsed by RWTH or FSMPI
- well supported
......@@ -13,17 +13,17 @@ About This Software
Further development is necessary and will take place when I find some more free time …
### does it have a name?
## does it have a name?
Not really … at least nothing that I'd consider final.
Nevertheless, in the code it is called _Open Excellence Media_ or for short **OEM**.
### what is it good for?
## what is it good for?
Most videos (eg. lecture recordings) embedded in RWTH Aachen University's moodle are hosted on an OpenCast.
Most videos (eg. lecture recordings) embedded in RWTH Aachen University's moodle are hosted on an OpenCast instance.
These videos are usually embedded using an iframe, which makes it (intentionally) hard to download them for offline use.
This extension want's to help by liberating lecture recordings and other videos provided in this rather restrictive manner.
......@@ -31,29 +31,64 @@ This extension want's to help by liberating lecture recordings and other videos
How?
By placing a bow with direct links to the videos above them.
### reasons for downloading vidoes
## reasons for downloading vidoes
- a bad internet connection (streaming feels like 90% buffering and 10% watching)
- learning on the train, at the beach, in the park, … you get it
- personal archive to re-watch lecture contents in a few semesters (relevant for exams, personal interest, …)
- …
### where to get it?
## how to use it
This is, how it should (approximately) look:
![Partial screenshot of a (dummy) course page showing the download link inserted by this add-on.
Text: "Download video: Lecture Fundamentals of applied theoretical sciences"
Below are the links: "640x360 (mp4)", "1280x720 (mp4)", and "1920x1080 (mp4)".](https://git.fsmpi.rwth-aachen.de/moodleOpenCastDownloads/ff-ext/-/raw/_static-resources/images/screenshot-buttons.png)
- The text "Download video: $nameOfVideo" should appear below each embedded video.
- It should be possible to simply click on it, which should reveal a set of links.
- These should be direct links to video files (with the displayed resolution).
- Hover (on desktop, probably long-press on mobile? didn't try that) a link to see more details.
## where to get it?
Sadly, this extension was not accepted into Mozilla's offizial addon gallery, because the target audience is too limited.
Nevertheless it is possible to get extensions signed by Mozilla and self-distribute them.
(With a bit of luck even automated updates should work just fine.)
You should (hopefully) be able to get the latest version from <https://dev.sudo42.de/public/ff-addons/openexcellencemedia-latest.xpi>.
The [releases page of this project](https://git.fsmpi.rwth-aachen.de/moodleOpenCastDownloads/ff-ext/-/releases) should contain them as well.
### downloads, with caveats _\*sigh\*_
tl;dr: Use the source, or [visit the download/install site](https://dev.sudo42.de/public/ff-addons/oem.html).\
Read below for slightly more in-depth information.
#### external site
~~You should (hopefully) be able to directly download the latest version from:\
<https://dev.sudo42.de/public/ff-addons/openexcellencemedia-latest.xpi>\
**Caveat:**
Simply clicking the link is unlikely to work.
Firefox seems to block installations of extensions, if a link does not point to the same domain.\
I'm sorry … please just copy it and open the page yourself.~~
**Update (and potential solution for the caveat described above):**\
Here is a simple page with the sole purpose of being on the same domain as the extension file it links to:\
<https://dev.sudo42.de/public/ff-addons/oem.html>\
(This should kinda work around the problem mentioned above.
Slightly more information is provided over there.)
#### from here
The [releases page of this project](https://git.fsmpi.rwth-aachen.de/moodleOpenCastDownloads/ff-ext/-/releases) should contain them as well.\
**Caveat:**
This one has caveats as well: GitLab will usually deliver the files in a way, that they are downloaded instead of prompting for installtion.\
You should nevertheless be able to install the downloaded file from Firefox's addon page.
### grab the source
And, of course, you can build this extension from source on your own.
Or modify it to work as user script.
This project is licensed unser EUPL, so feel free to use, read, adapt, or share the code.
### 2do
## 2do
- [X] going to bed
- [ ] styling (I love CSS, not joking here!)
- [ ] adding links in video-only tabs, too
- [ ] packaging
- [ ] good name + icon
- [ ] styling (I love CSS, not joking here! **Update:** A little bit of css is present. Should work for now.)
- [X] adding links in video-only tabs, too
- [X] packaging
- [X] good name + icon (kinda done … _"good"_ is highly subjective, but I will give it a pass)
- [ ] further investigation into the OpenCast API (looks like one might be able to have some fun with it)
- [ ] …
free.css
View file @ 7a097581
._ext-openExcellenceMedia_container .videoLinkList {
._ext-openExcellenceMedia_container,
.openExcellenceMediaPlugin {
--c-rwth-violett: rgb(97,33,88);
--c-link-bg: var(--c-rwth-violett);
--c-link-fg: #fff;
}
._ext-openExcellenceMedia_container .videoLinkList {
.openExcellenceMediaPlugin.oemPopOut {
position: fixed;
top: 3.4em;
left: 2.1em;
right: 2.1em;
bottom: unset;
z-index: 42021;
text-align: center;
font-size: 1.1em;
}
._ext-openExcellenceMedia_container .videoLinkList,
.openExcellenceMediaPlugin .videoLinkList {
list-style-type: none;
padding: 0;
display: flex;
flex-direction: row;
}
.openExcellenceMediaPlugin .videoLinkList {
/* flex-direction: column;
width: max-content;
align-items: stretch;
margin: .5em .25em; */
margin: .5em auto;
width: max-content;
max-width: 100%;
padding: .5em .25em;
background: rgba(242, 242, 242, .7);
opacity: .7;
box-shadow: 0 0 1em 0 rgba(0,0,0,.7);
}
.openExcellenceMediaPlugin .videoLinkList:hover,
.openExcellenceMediaPlugin .videoLinkList:focus-within {
opacity: 1;
}
._ext-openExcellenceMedia_container .videoLinkList .videoLink {
._ext-openExcellenceMedia_container .videoLinkList .videoLink,
.openExcellenceMediaPlugin .videoLinkList .videoLink {
display: inline-block;
padding: .5em 1em;
background: var(--c-link-bg);
......@@ -19,3 +49,7 @@
margin: .25em .5em;
border-radius: .2em;
}
/* .openExcellenceMediaPlugin .videoLinkList .videoLink {
display: block;
text-align: center;
} */
free.js
View file @ 7a097581
......@@ -19,8 +19,8 @@ if (window.location.host === 'engage.streaming.rwth-aachen.de') {
videoTracks.forEach(t=>console.debug(t.id, t.mimetype, t.video.resolution, t.url))
if (inFrame) {
window.parent.postMessage({videoTracks, meta}, '*')
} else {
// TODO: add download links to video
} /*/ else /* */ {
addLinksToVideoPlayer(videoTracks, meta)
}
})
} else if (window.location.host === 'moodle.rwth-aachen.de') {
......@@ -76,15 +76,8 @@ const FMT = (()=>{
}
})()
function genLinkContainer(tracks, meta) {
function genLinkList(tracks, meta) {
let videoTitle = meta['search-results'].result.dcTitle || '?'
let details = document.createElement('details')
details.id = genVideoContainerId(meta)
details.classList.add('_ext-openExcellenceMedia_container')
let summary = document.createElement('summary')
summary.innerText = `Download video: ${videoTitle}`
details.appendChild(summary)
let videoLinkList = document.createElement('ul')
videoLinkList.classList.add('videoLinkList')
tracks.forEach(track => {
......@@ -102,7 +95,112 @@ Audio: ${mAud.channels}ch@${FMT.hz(mAud.samplingrate)} (${FMT.bps(mAud.bitrate)}
li.appendChild(a)
videoLinkList.appendChild(li)
})
details.appendChild(videoLinkList)
return videoLinkList
}
function genLinkContainer(tracks, meta) {
let videoTitle = meta['search-results'].result.dcTitle || '?'
let details = document.createElement('details')
details.id = genVideoContainerId(meta)
details.classList.add('_ext-openExcellenceMedia_container')
let summary = document.createElement('summary')
summary.innerText = `Download video: ${videoTitle}`
details.appendChild(summary)
details.appendChild(genLinkList(tracks, meta))
return details
}
const _PLAYER_CONTROL_BUTTON_ID = '_ext_openExcellence_btn-ctrl-bar'
function genPlayerControlsButton() {
let container = document.createElement('div');
['buttonPlugin', 'right', 'openExcellenceMediaPlugin'].forEach(c=>container.classList.add(c))
container.id = _PLAYER_CONTROL_BUTTON_ID
container.setAttribute('title', 'Show downloadable video links');
let icon = document.createElement('i');
['button-icon', 'icon-download'].forEach(c=>icon.classList.add(c))
container.appendChild(icon)
return container
}
const _PLAYER_CONTROL_POPOUT_ID = '_ext_openExcellence_ctr-bar-pop-out'
function genPlayerControlsPopOut(tracks, meta) {
let container = document.createElement('div');
['openExcellenceMediaPlugin', 'oemPopOut'].forEach(c=>container.classList.add(c))
container.id = _PLAYER_CONTROL_POPOUT_ID
container.appendChild(genLinkList(tracks, meta))
return container
}
function addLinksToVideoPlayer(videoTracks, meta) {
// removing old elements, if they are still here ...
document.querySelectorAll(`#${_PLAYER_CONTROL_BUTTON_ID}, #${_PLAYER_CONTROL_POPOUT_ID}`)
.forEach(n => n.remove())
console.debug('adding links to page ...', document.readyState)
let toolbarBtn = genPlayerControlsButton()
let toolbarPopOut = genPlayerControlsPopOut(videoTracks, meta)
document.body.appendChild(toolbarPopOut)
console.debug(toolbarPopOut)
let timeoutFn = ()=>{
// waiting for things like the toolbar to be ready
if (!document.querySelector('.playbackControls')) {
setTimeout(timeoutFn, 250)
return
}
console.debug('page seems to be ready ... adding things ...')
/*
// web extensions can not trivially access properties in the window object of the page context
// just using paella's API and adding a regular plugin for this would have been nice
console.debug(window, window.paella)
window.paella.addPlugin(()=>{
return class OpenExcellenceMedia extends paella.ButtonPlugin {
getIndex() { return 42021; }
getAlignment() { return 'right' }
getSubclass() { return "openExcellenceMedia-ctrl-btn" }
getIconClass() { return 'icon-download' }
getName() { return "_.OpenExcellenceMedia.ff-ext" }
getButtonType() { return paella.ButtonPlugin.type.popUpButton }
buildContent(domElement) {
let linkList = genLinkList(videoTracks, meta)
domElement.appendChild(linkList)
domElement.classList.add('OpenExcellenceMediaPlugin')
}
}
})
*/
let open = false
let buttonBarContainer = document.querySelector('.playbackBarPlugins')
let popOutContainer = document.querySelector('.popUpPluginContainer')
buttonBarContainer.appendChild(toolbarBtn)
popOutContainer.appendChild(toolbarPopOut)
let _setOpen = (newState = null) => {
if (newState === undefined || newState === null) newState = !open
open = newState
let style = toolbarPopOut.style
if (open) {
style.display = null
toolbarBtn.classList.add('selected')
} else {
style.display = 'none'
toolbarBtn.classList.remove('selected')
}
}
_setOpen(false)
toolbarBtn.addEventListener('click', e=>{
_setOpen()
})
}
console.debug('wating for player interface to get ready ...')
timeoutFn()
}
manifest.json
View file @ 7a097581
{
"manifest_version": 2,
"name": "OpenExcellenceMedia",
"version": "0.0.2",
"version": "0.0.3",
"description": "Adds download links to videos on RWTH moodle which are served using an OpenCast iframe.",
"homepage_url": "https://git.fsmpi.rwth-aachen.de/moodleOpenCastDownloads/ff-ext",
"icons": {
......