Vimeo video unmuted button on desktop - desktop

I have trouble when setting embed data for Vimeo on Squarespace.
I have set the iframe code with autoplay = 1 and muted=1 and it works fine on mobile. When I play the video on mobile, it will show the button tap to unmute the video.
However, on the desktop, the video only shows the button to play/pause and has no button to unmute it.
Is there anyone getting into this trouble and do you have any solution for it?
Thanks!

try this might be helpful for you
var iframe = document.querySelector('iframe');
var player = new Vimeo.Player(iframe);
player.on('play', function() {
console.log('video played');
});
<!DOCTYPE html>
<html>
<head>
<title>Iframe video Test</title>
</head>
<body>
<iframe id="vidz" src="https://player.vimeo.com/video/401649410?h=11d74aa27c&portrait=0" width="450" height="253" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen=""></iframe>
<script src="https://player.vimeo.com/api/player.js"></script>
</body>
</html>

Related

Execute Pepper webpage on computer

So I want to use the console of Mozilla in my computer to see what errors have the page that is normally executed by Pepper robot in his tablet, because console.log() is not displayed on Choregraphe log.
I have tried to call the robot qimessaging.js library from computer but it throws an error:
SyntaxError: The URI is malformed. qimessaging.js:12
The html is there:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Video</title>
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script type = "text/javascript" src="http://nao:nao#192.168.1.238/libs/qimessaging/1.0/qimessaging.js"></script>
<script type="text/javascript" src="js/video.js"></script>
</head>
<body>
<canvas width = "320px" height = "240px"></canvas>
<p id="log">log</p>
</body>
</html>
Is there a way to call the qimessaging.js without errors to test the web in my computer?
Instead of console.log() you can use alert().
Also you can connect with your PC browser with this link robot_ip/apps/your_app_name/index.html', but your index.html must be in sub folder named html.
You can also test from your computer if you import the script from the robot directly:
<script src="http://12.34.56.78/libs/qi/2/qi.js"></script>
Then when you open a session, add the robot url as a third argument of the QiSession:
QiSession( onSuccess, onError, "12.34.56.78:80" );
Then your browser will connect to your remote robot.

Playback rate doesn't change for Chromecast Ultra

I have been working on app, which has possiblity to cast video to chromecast devices. And we have such problem: we need to change playback rate and it works for Chromecast 2.0 (as needed), and doesn't work for Chromecast Ultra (playback rate as default).
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="bohdan_player.js"></script>
</head>
<body>
<audio id="audioPlayer" src="https://www2.iis.fraunhofer.de/AAC/ChID-BLITS-EBU-Narration.mp4" autoplay controls></audio>
<script>
document.getElementById("audioPlayer").playbackRate = 1.5;
</script>
</body>
</html>

Making clock in javascript but Raphael not defined

I am making a clock in javascript. The code below is just the start. It should produce an orange rectangle only.
I am using the raphael library for the vector graphics.
However, when i try and view this in a web browser, in the inspect element i get a message saying that raphael is undefined.
I have stored my clock.html and clock.js file in a folder that contains only raphael-min.js
I have the html code as follows
<!DOCTYPE HTML>
<html>
<head>
<script src="Clock.js" type="text/javascript"> </script>
<script src=“raphael-min.js" type="text/javascript"> </script>
</head>
<body>
</body>
</html>
and the java code as follows
window .onload= function (){
var paper = new Raphael( 0, 0, 400, 400);
var backGround = paper.rect(0, 0, 400, 400);
backGround.attr({ fill: "orange"});
/* Comment - Add your code here*/
};`
If someone could please tell me what I am doing wrong, that would be fantastic. In plain english please. I started learning html and javascript last week.
Many thanks
Always add the scripts your code uses before you add your code.
Like this:
<!DOCTYPE HTML>
<html>
<head>
<script src=“raphael-min.js"></script>
<script src="Clock.js"></script>
</head>
<body>
</body>
</html>
In the question, Clock.js appears first. That's probably why you are getting the Raphael undefined error.
I removed type="text/javascript". You'll find that in older JS books and tutorials but it is unnecessary.

Google Adsense ad not showing up in Jquery Mobile served by django

I'm trying to get a Google AdSense ad to display on my mobile website. I am using Django to serve my web pages and I'm using JQuery Mobile to display and format the content. I've followed these blog instructions on a static html page and the ad shows up fine. When I use the exact same code in my base template, the mobile ad does not show. When I compare the HTML source code they look exactly the same and all the links work exactly the same. Is there something Django injects into the header that would keep the ad from displaying? The HTML source is as follows:
<html>
<head>
<title>Test AdSense</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css"/>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-XXXXXXXXXXXXXXXXXX";
/* LTC MobileHeader */
google_ad_slot = "XXXXXXXXXXXX";
google_ad_width = 320;
google_ad_height = 50;
//-->
</script>
</head>
<body>
<div id="Div1" data-role="page" data-ajax="false">
<header data-role="header" data-position="fixed">
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
<h1>Index Page</h1>
</header>
<section data-role="content">
to Page 2
</section>
<footer data-role="footer" data-position="fixed"></footer>
</div>
</body>
</html>
I decided to upload the code to my staging system system which runs on Ubuntu and the ads show up fine. There is something going on with my development environment which runs on windows that is blocking the call to Google.

get email when someone hits facebook likebutton on website

is it possible for me to receive an email when someone hits a likebutton on my website?
I have been looking into this and I can only assume it has to be possible with the edge.create option but for the life of me, I have no idea how to set this up to trigger an email being sent.
any ideas??
You need to subscribe to the click event of the like button.
You can do this via the FB.Event.subscribe function.
Here is some code for a working sample:
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({status:true,cookie:true,xfbml:true});
FB.Event.subscribe('edge.create', function(href, widget)
{
//insert your code to send email here
alert('someone just clicked the like button');
});
</script>
</head>
<body>
<div id="fb-root"></div>
<fb:like href="http://www.example.com/" show_faces="false" width="450" font="verdana"></fb:like>
</body>
Hope this helps.