How add adsense to flowplayer? - javascript

I have next problem, flowplayer have next documentation:
<div id="image_text" class="flowplayer functional"></div>
<!-- install the player with ima AdSense configuration -->
<script>
flowplayer("#image_text", {
// configure the AdSense plugin for this player
ima: {
// must be set when testing your installation
adtest: true,
// make the Google robots crawl the current page
description_url: location.href,
// adverts configuration
ads: [{
// mandatory: schedule ad time
// here: 3 seconds into the video
time: 3,
// request an advert of type image or text type
ad_type: "image_text"
}]
},
splash: true,
ratio: 5/12,
rtmp: "rtmp://s3b78u0kbtx79q.cloudfront.net/cfx/st",
clip: {
sources: [
{ type: "video/webm",
src: "//stream.flowplayer.org/bauhaus.webm" },
{ type: "video/mp4",
src: "//stream.flowplayer.org/bauhaus.mp4" },
{ type: "video/flash", src: "mp4:bauhaus" }
]
}
});
</script>
We add empty block for adsense and some script for this block write? But where i need to write adcode? Please help me, how do I add Google ads to flowplayer, sorry for worst english.

Related

How to set the HTML video title that is shown in Chrome and Windows?

How can I set the name (label) of HTML5 <video> element that browsers (like Chrome) and Windows OS display?
Like the title that Windows shows for this youtube video (when changing speaker volume):
Currently for me the page title is shown (the title set in page head).
I tried adding a title="..." attribute to the video element but it had no effect. Also didn't find a solution on StackOverflow.
I'm not sure for the video. But in some browsers, mediaSession worked for me. Javascript...
if ('mediaSession' in navigator) {
navigator.mediaSession.metadata = new MediaMetadata({
title: 'name',
artist: '',
album: '',
artwork: [{ src: '...' }]
});
}
As the other answer stated, it can be done with JavaScript and Media Session API.
Check out this YouTube video.
if ("mediaSession" in navigator) {
navigator.mediaSession.metadata = new MediaMetadata({
title: "Unforgettable",
artist: "Nat King Cole",
album: "The Ultimate Collection (Remastered)",
artwork: [
{ src: "https://dummyimage.com/128x128", sizes: "128x128", type: "image/png" },
{ src: "https://dummyimage.com/512x512", sizes: "512x512", type: "image/png" }
]
});
}

How can I call Web APIs in React JSX?

I'm writing a music player with React and Electron and want to add metadata for the audio so as I can get MPRIS support. So I did some searching and found Media Session API is what I needed.
To test it, I copied the code from the exmaple code contained by the above link into a function in my project.
navigator.mediaSession.metadata = new MediaMetadata({
title: 'Unforgettable',
artist: 'Nat King Cole',
album: 'The Ultimate Collection (Remastered)',
artwork: [
{ src: 'https://dummyimage.com/96x96', sizes: '96x96', type: 'image/png' },
{ src: 'https://dummyimage.com/128x128', sizes: '128x128', type: 'image/png' },
{ src: 'https://dummyimage.com/192x192', sizes: '192x192', type: 'image/png' },
{ src: 'https://dummyimage.com/256x256', sizes: '256x256', type: 'image/png' },
{ src: 'https://dummyimage.com/384x384', sizes: '384x384', type: 'image/png' },
{ src: 'https://dummyimage.com/512x512', sizes: '512x512', type: 'image/png' },
]
});
I put it into a function that a component will call when the next song is played.However, I got errors like this:
Failed to compile.
./src/components/FM/Cover/index.jsx
Line 112: 'MediaMetadata' is not defined no-undef
Search for the keywords to learn more about each error.
Why?
You need to reference the window object.
window.MediaMetadata
^^^^^^
This is because babel/es-lint does not know MediaMetadata exists and will throw an error. Since Chrome injects this object as a global variable, it is accessible via the window object.
(re-posting what #AngelSalazar said in the comments of the OP for ease of use)

How to integrate mailchimp with nuxt js app?

I'd like to embed the following script into my component in nuxtjs app. But since nuxt has no solution for this. I'd like to ask the vue community to see if there was a better way of embedding external 3rd party js scripts?
Where should I be embedding this type of scipt? And what sort of external configurations do I need to add to enable this to work?
I tried adding directly into my template but it doesn't seem to be working.
<script type="text/javascript" src="//downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script><script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us17.list-manage.com","uuid":"XXXXXX","lid":"XXXXXX"}) })</script>
Thanks!
Open up your nuxt.config.js file, and search for the head object. You can add your third party scripts there like this:
// nuxt.config.js
module.exports = {
head: {
title: 'My title',
// etc.
script: [
{ src: "//downloads.mailchimp.com/js/signup-forms/popup/embed.js" },
// You can add multiple third-party scripts here
]
},
// Other stuff
}
Docs: How to use external resources?
I haven't tested it, but I think, since the other part is just javascript, you can add into your page you wan't to show it or a layout file (if you want to show it on multiple pages), like this:
// layout/default.vue
<template>
<!-- Your template -->
</template>
<script>
require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us17.list-manage.com","uuid":"XXXXXX","lid":"XXXXXX"}) });
export default {
// etc...
}
</script>
Although the require part might mess things up...
Let me know if this works!
Insert the MailChimp code inside the <head>
head() {
return {
script: [
{
type: "text/javascript", // mailchimp universal script
src:
"//downloads.mailchimp.com/js/signup-forms/popup/unique-methods/embed.js",
"data-dojo-config": "usePlainJson: true, isDebug: false"
},
{
type: "text/javascript", // mailchimp script for specific popup form
innerHTML: this.getMailchimp
}
],
__dangerouslyDisableSanitizers: ["script"]
};
},
computed: {
getMailchimp() {
if (process.client) {
return JSON.stringify(
window.dojoRequire(["mojo/signup-forms/Loader"], function(L) {
L.start({
baseUrl: "your base url",
uuid: "your uuid",
lid: "your lid",
uniqueMethods: true
});
})
);
}
}
}

yammer embed comment not displaying reply option on mobile

The yammer embed script to show the open graph comments about the page is not showing the reply to comment option in small screens. In desktop and tablets it shows. But in mobile it is not showing the 'write reply' text box. The embed script is as as below.
yam.connect.embedFeed({
feedType: "open-graph",
feedId: parseInt(appConfig.YammerFeedId, 10),
network: appConfig.YammerNetwork,
config: {
use_sso: true,
header: false,
footer: false,
showOpenGraphPreview: false,
defaultToCanonical: false,
promptText: appConfig.YammerCommentPromptText,
defaultGroupId: parseInt(appConfig.YammerDefaultGroup, 10),
hideNetworkName: false
},
objectProperties: {
url: location.href,
type: "page",
fetch: false,
"private": false,
ignore_canonical_url: true
},
container: "#yammer_comment"
});
Any idea how to fix this?
According to the documentation "only desktop browsers are supported with Yammer Embed at this time."

Aviary "forceCropPreset" not working

I have the underneath code, the editor loads and does not give errors.
It does however not enforce the cropping/resizing of the image.
I copied the config straight out of the examples,.. (except for the theme that is)
But it somehow does not work.
Can anyone help out?
aviaryObject = new Aviary.Feather({
apiKey: 'xxxx',
apiVersion: 3,
tools: 'all',
theme: 'light',
onSave: function(imageID, newURL) {
var img = document.getElementById(imageID);
img.src = newURL;
},
onError: function(errorObj) {
alert(errorObj.message);
}
});
aviaryObject.launch({
image: 'imgId',
url: [server-url],
forceCropPreset: ['Logo','150x150'],
forceCropMessage: 'Please crop your photo to this size',
});
Found the solution, as I'm using https I had to load a different script file.
So if you want to use aviary over a https connection, use:
https://dme0ih8comzn4.cloudfront.net/js/feather.js

Categories

Resources