Show Google Maps & YouTube videos after Cookies got accepted - javascript

I am using this plugin on my WordPress website: https://wordpress.org/plugins/cookie-notice/ and I am pretty satisfied with it because it's easy to use and lightweight.
With the latest GDPR rulings it is now needed to hide Google Maps and YouTube videos or replace them with a placeholder image as long as the visitor doesn't accept the cookie consent. Unfortunately the plugin doesn't have such a functionality.
Has anyone a sample code or an idea on how to embedd Google Maps and YouTube videos like that? All plugins that have this functionality cost around 99 $ a year, which is a bit too much for only one map and one YouTube video on my homepage...

Im not sure how farmiliar you are with Jquery but you could do something like this.
var cookiesAccepted = false;
Add 'media-blocks' class to all media you want to hide.
Set jquery to watch Cookies bar for accept click. When its clicked add a class that shows all your embedded media that you wanted to hide, eg:
$('#cookie-btn').on('click',function(){
var cookiesAccepted = true;
$('.media-blocks').addClass('show');
})
Just a guideline of how I'd do it.

Related

How to get debug video data playbackQuality from youtube?

Each youtube video has the ability to get debug data by right-clicking and selecting the desired item in the "Copy data for debugging" menu
The value of the debug_playbackQuality field is important to me
How can I get this data using youtube api or some other way? Or how to get the debug_playbackQuality value right away?
Heard about the player.getPlaybackQuality (): String function but it looks like it works with js, I need php
When working with the youtube api, I need to get the value of the debug_playbackQuality parameter for each video (similar to privacyStatus and embeddable) and then, based on the data, make a decision about further work with the video. I don't know how to check the value of debug_playbackQuality.
Help me figure it out, please.
p.s.
Try to run this video https://www.youtube.com/embed/1fO1HmgBHaE
Oops!
These videos are check for privacyStatus and embeddable!
privacyStatus = public, embeddable = true
Because of this, videos are embedded in the site, but do not work on it.
I found the difference - solution!
These videos have a status equal to "debug_playbackQuality": "unknown"!
The only option not to add them to the site is to check the debug_playbackQuality by unknown status!

Adding an attribute to html <video> tag using Javascript or Jquery. - WordPress Case

I have a WordPress installation and I share some links like the following to students watching courses - presentations online.
https://emgncv.net/wp-content/uploads/2020/10/108_I_Interpretation_Case_Study.mp4
The big issue that I am facing here is that I want to find a piece of code (probably Javascript or Jquery) to add "On document ready" so when students load the presentations on their browsers not being able to download the video from the 3-dots menu on the right bottom corner of the media player. Please, view the screenshot attached.
For the records, I have noticed this only on Google Chrome and Microsoft Edge. Mozilla does not offer such a download option.
What I have already tried is the following:
$('video').attr('controlsList', 'nodownload');
FYI, I have placed this code in a section where my WordPress theme provider lets me add some custom JS code. The section works pretty fine. I have already implemented others functions and everything works properly.
Do you have any ideas on what I will need to look at to achieve the following by default when my students load their courses on browsers?
Thank you so much in advance,
George.

How to change the vimeo deafult skin

I need to know a way to change the vimeo player skin. I had done a bit of Google research and i came to know that it is not possible to change the vimeo skin as they do not allow it, the only thing we can do is that we can customize their controls.
Actually i have some videos from YouTube,Vimeo and Dailymotion embedded in my website, i need to have a common player for all those videos.
I know how to change the default skin in YouTube (through Video.js) but not sure if i can do the same for vimeo and dailymotion as well.
Any help will be appreciated.
Thanks
There is no way to customize the look of the player outside the embed settings provided on the video's settings page.
PRO members can get urls for their video files that they can use in whatever player they want.

youtube thumbnail using paused videos

I'm trying to make a web-app in which people can remix youtube videos...
I looked at the youtube api, and it doesn't seem to support thumbnail at a specific location.
So, I'm trying to create multiple chromeless youtube videos, start them at specific positions and stop them almost immediately to make them seem like "thumbnails".
However, the videos all show up black when I try to do so.
Here's the link to the source code: http://pastebin.com/6Bpr1Dsz
Note that when I comment out the pauseVideo part, the videos play fine.
ps: I tried to make this work on jsfiddle, but it wouldn't work.
Thanks :)

OKVideo: Controlling Video Playback with Links

Plugin Reference: http://okfoc.us/okvideo/ | https://github.com/okfocus/okvideo
Hey Guys,
I've been trying to get my links to control which video plays with the OKVideo plugin but for some reason it doesn't work. I've tried a myriad of different method with no success.
To activate the plugin, you use:
$(function(){
$.okvideo({
source: 'BHE8Yre3Ex8',
})
});
I've added some links that store the YouTube video ID as an attribute. When the user clicks the link, the video should stop playing the current video and begin playing the next selected one.
Also, I'm not trying to have the video play automatically (on page load)–only on a video selection. I've looked into the code but the options don't seem to work.
I've stripped my code and placed the core of it into jsfiddle, here: http://jsfiddle.net/mikemiketm09/rd4fL/
FYI: It did say you can use YouTube API with the plugin.
Your help would be greatly appreciated.

Categories

Resources