-
-
Save fsantini/c3c45eeb877e3b524314741587a26364 to your computer and use it in GitHub Desktop.
| // ==UserScript== | |
| // @name ISMRM-Pathable | |
| // @namespace http://tampermonkey.net/ | |
| // @version 0.1 | |
| // @description Script to optimize the ismrm21/pathable | |
| // @author Francesco Santini | |
| // @match https://ismrm-smrt21.us3.pathable.com/* | |
| // @match *://cdn.filestackcontent.com/* | |
| // @icon https://www.google.com/s2/favicons?domain=pathable.com | |
| // @require http://code.jquery.com/jquery-3.4.1.min.js | |
| // @grant GM_log | |
| // @run-at document-end | |
| // ==/UserScript== | |
| // This script optimizes the following: | |
| // 1) Smaller top banner | |
| // 2) Disables the "Game" popups | |
| // 3) Allows fullscreen in posters | |
| // 4) Enables browser video controls | |
| // 5) Add link to poster PDF | |
| // use the following list to enable/disable features | |
| // | |
| // Credits: NeutralKaon - https://gist.github.com/NeutralKaon/74348d3534839809f7104da31fe28be0 | |
| var features = { | |
| 'small_top_banner': true, | |
| 'disable_game': true, | |
| 'poster_fullscreen': true, | |
| 'poster_pdf': true, | |
| 'video_controls': true, | |
| } | |
| function addGlobalStyle(css) { | |
| var head, style; | |
| head = document.getElementsByTagName('head')[0]; | |
| if (!head) { return; } | |
| style = document.createElement('style'); | |
| style.type = 'text/css'; | |
| style.innerHTML = css; | |
| head.appendChild(style); | |
| } | |
| if (features.small_top_banner) | |
| addGlobalStyle(".widget-image { height: 0 !important; transform: scale(0.4); }"); // reduce header size | |
| if (features.disable_game) | |
| addGlobalStyle(".ant-notification { visibility: hidden !important; }"); // suppress game notifications | |
| function action() { | |
| // replace video controls | |
| if (features.video_controls) | |
| $('video').each( function() { | |
| if ($(this).attr("controlslist") == "nodownload") | |
| { | |
| console.log("Replacing video controls"); | |
| $(this).attr("controls", true); | |
| $(this).attr("controlslist", ""); | |
| } | |
| //document.body.innerHTML= document.body.innerHTML.replace(/controls=\"\" controlslist=\"nodownload\"/g,"controls=\"true\" "); | |
| }); | |
| if (features.poster_fullscreen) | |
| { | |
| if ($('iframe').length) { | |
| $('iframe').each( | |
| function() { | |
| var src = $(this).attr("src"); | |
| if (src.includes('filestackcontent.com')) | |
| { | |
| if ($("div[data-m='meetingTitle']").find("a").length == 0) | |
| { | |
| $("div[data-m='meetingTitle']").append('<a href="https:' + src + '" target="_blank">View Fullscreen</a>'); | |
| } | |
| } | |
| } | |
| ); | |
| } | |
| } | |
| } | |
| setInterval(action, 1000); | |
| if (features.poster_pdf) | |
| { | |
| $('filestack-slide-viewer').each( function() { | |
| console.log('Filestack viewer found ' + $(this).attr('url')); | |
| $('body').prepend('<div style="width: 100%; height: 30px; text-align:center"><a href="' + $(this).attr('url') + '" target="_blank">View PDF</a></div>'); | |
| }); | |
| } |
Ah nice! I'll integrate your approach! What is your script supposed to do? I don't see any difference in the normal prerecorded presentations.
Ah nice! I'll integrate your approach! What is your script supposed to do? I don't see any difference in the normal prerecorded presentations.
It's supposed to enable the right-click menu on the video, featuring (browser dependent, but in FF) nice options such as 'playback speed' and 'save video as' -- both of which are otherwise hidden. You can see it in the source -- <video src= ... controls="" controlslist="nodownload" /> should become <video src= ... controls="true" />.
I have had great difficulty getting the 'trigger' to fire on time and hence the rather overly complicated 'see if the page has stayed still' code. I think your "try to do this periodically" approach is better!
Yeah I just tried implementing your mutation observer but it's not very stable.
I added your video control code though. It doesn't seem to work in my firefox, but in Chrome, it does.
Yeah I just tried implementing your mutation observer but it's not very stable.
I added your video control code though. It doesn't seem to work in my firefox, but in Chrome, it does.
Yes, it's not stable. If their website loads in a reasonable length of time, it works fine -- but as the day has gone on it sometimes takes >60s to actually 'finish' loading and if the page state is stable for whatever threshold you set, then it fires early. Annoying. How bad is it for you?
Interesting that the method doesn't seem to work in your version of FF -- when you're on the video viewing page, what happens if you just put that line (document.body.innerHTML ...) into the console? I find it quite helpful, but I did find out that the usual ($('video')...) methods didn't work as they would on a static site so well, even though it really...should. Pathable gives me the impression of being rather overengineered, and actually watching the videos is oddly difficult...
I'm going to migrate to your version -- it's much better. Thanks!
That global replace expression is a bit scary, and cannot be called periodically. If you find that the jQuery approach works too, and maybe you find a way of improving it, let me know!
Great script. One thing I've done (c.f. https://gist.github.com/NeutralKaon/74348d3534839809f7104da31fe28be0) is try to see when exactly the page is 'ready' rather than just checking it every 500 ms -- but to be honest for me pathable is so unbearably slow / awful that I'm not sure it's actually any faster than triggering it every so often.
I don't know if you find it as irritating as I do, but the
controls=""part of their<video />tag is really annoying. Hence, the following line rewrites it, permitting browser-based controls over the video:document.body.innerHTML= document.body.innerHTML.replace(/controls=\"\" controlslist=\"nodownload\"/g,"controls=\"true\" ");