How do I detect when embedded Youtube video is playing? - nativescript

UPDATE (July 2020): I was able to get a mostly working version of this. See my answer to the related question here.
In my angular Nativescript iOS app, I have a webview set up to play youtube videos. Following a method similar to this question here, I can get the youtube video to load and play automatically, using the Youtube Iframe API. But how do I detect when the video actually starts playing (after it is loaded)?
The Iframe API has events for this purpose, like "onStateChange". But, because my youtube code is "stuck" inside the webview, I am currently not able to read when events are fired from that webview.
In Nativescript, there is a nativescript-webview-interface plugin for this purpose, but I can't get it to work. I have put my code below. If that is the way to go, what is the correct code to get it working?
(I don't want to use the nativescript-youtube plugin because that brings in youtube's quotas, which are regularly shrinking. )
Code I Have Tried:
To get the youtube player to activate, I have put all of the relevant youtube code inside the webview. That works to play the video, but not yet to get the event of when the player starts playing. To do what I want to do, I need to have some way of inserting that code into my app WITHOUT trapping it in the webview. Or, have some way of communicating inside the webview.
To try to communicate with the webview, I have tried the nativescript-webview-plugin:
$ tns plugin add nativescript-webview-interface
html:
<web-view src="{{youtubeCode}}" #webView ></web-view>
ts:
import {WebView, LoadEventData} from "tns-core-modules/ui/web-view";
let webViewInterfaceModule = require('nativescript-webview-interface');
...
export class ...{
#ViewChild('webView') webView: ElementRef;
public youtubeCode = [code that youtube provides in its IFrame API]
ngOnInit(): void {
this.setupWebViewInterface();
}
setupWebViewInterface() {
let webView: WebView = this.webView.nativeElement;
this.oWebViewInterface = new webViewInterfaceModule.WebViewInterface(webView, '~/www/index.html');
this.youtubeListen()
}..
youtubeListen(){
this.oWebViewInterface.on('onStateChange', (eventData)=>{ //'onStateChange' is the event provided in the Youtube Iframe API
console.log('event data = ' + eventData) //***this is the key part I want to work.
});
}
RESULT: ERROR TypeError: undefined is not an object (evaluating 'this.webView.ios.constructor')
This is a problem in the plugin's index.ios.js file. If I comment out the offending line, then the errors go away, but then nothing happens
..

Related

Catch windows.external.notify posted message from UIWebview in UIViewController Xamarin-iOS

I have a scenario where I'm trying to login from UIWebview and if authenticated successfully then I'm getting a string token using script snippet window.external.notify I'm able to get token in windows phone using myWebView.ScriptNotify+=WinNotify; and in android using myWebView.AddJavascriptInterface(new ExternalInterface(),"");
but the problem is that I'm not able to detect any code snippet in iOS webview to read this notify script.
I've tried This where I've used IWKScriptMessageHandler but didn't work.
Can you guys please help me to get it done in iOS?
I've done something like this a some while ago for Azure Access Control Services. The code can be found here: https://github.com/Cheesebaron/Cheesebaron.MvxPlugins/blob/0e8b7765fe375d1d4998552074d664e6cf5397a3/AzureAccessControl/AzureAccessControl.Touch/Views/AccessControlWebAuthController.cs
Basically what this does is injecting a Notify script into the page, when that script is invoked, it navigates to a specific URL that I know and from that I can grab the payload.
private const string ScriptNotify = #"
<script type=""text/javascript"">
window.external = {
'Notify': function(s) {
document.location = 'acs://settoken?token=' + s;
},
'notify': function(s) {
document.location = 'acs://settoken?token=' + s;
}
};
</script>";
So the code above navigates to acs://settoken?token= when the notify script is invoked. You can detect this in UIWebView.ShouldStartLoad by checking the url scheme. If it matches the one in the notify script you are done.
To inject the script, I implement NSUrlConnectionDelegate and in the FinishedLoading override I inject it as part of the data and make the UIWebView load that content instead.

IE8 issues with Yammer embed and API

Facing multiple issues with IE 8 (detailed version 8.0.7601.17514). Please note everything works fine in other browsers.
Yammer embed my feed control is not working. Sometimes it shows result and sometimes not.
REST API call not working and giving error as below. However I used new js sdk and new yam.platform.request.
Error is : yam.request is null or not an object. source : platform_js_sdk.js
Thanks in advance for your help!
I found out that the div that you embed yammer feed has to be above the yammer request script
eg.
<div id="embedded-feed" style="height:400px;width:500px;"></div>
<script>
yam.connect.embedFeed(
{ container: '#embedded-feed',
network: 'fourleaf.com' // network permalink (see below)
});
</script>
Otherwise, IE will not be able to find the div to show the feed (but chrome works fine..)

How to listen to Flash video loading -- firefox-adds-on sdk?

I am writing adds-on to catch the url of youtube video, in the following Hierarchy :
// require tab.module.
// listen onTab.ready.
// Get the tab.url.
// If the url domain is youtube.
// Javascript request to get the direct .flv link.
// download the link.
But I figured out that other sites can embedd youtube videos.
I will really grateful to anyone give me hint about getting that embedded videos or the event which can catch them.

Drupal statisitcs track file clicks

I have a Drupal website that has many smaple audio files on many pages. Some users come, listen to a sample, or listen to all of them and then leave.
But Google analytics does not track these clicks, even though in the option enabled:
Track downloads (clicks on file links) for the following extensions
7z|aac|arc|arj|asf|asx|avi|bin|csv|doc|exe|flv|gif|gz|gzip|hqx|jar|jpe?g|js|mp(2|3|4|e?g)|mov(ie)?|msi|msp|pdf|phps|png|ppt|qtm?|ra(m|r)?|sea|sit|tar|tgz|torrent|txt|wav|wma|wmv|wpd|xls|xml|z|zip
Which includes the mp3 files that I'm playing.
Then on Google Analytics in the Events section I can bearly see 3 mp3 downloads, and when I check my Apache log file, I have tens of clicks on mp3 files every day.
I'm using the soundmanager2 player that works as a link and with the help of Javascrip, Flash and CSS plays the mp3 files.
http://www.schillmania.com/projects/soundmanager2/
How could I track these clicks on the soundmanager player? If needed I can install another statistics module than google analytics...
Many thanks
Depending the display mode you use and the type of player, the tracking to integrate is different.
Display Media
Here no custom tracking needs to be added. The Google Analytics Drupal module with Track download links enabled does the job.
SoundManager player
If you use any of the available players, you need to add a custom javascript code and add a callback on the play event which is triggered on the first play of the SoundManager player(s).
The javascript looks as follows:
// Add callback on play event
threeSixtyPlayer.events.play = function() {
var url = this.url, // retrieve URL for active played MP3
file = url.substring(url.lastIndexOf('/')); // only keep filename of MP3
// Push an event to GA
_gaq.push(['_trackEvent', 'mp3', 'play', file.substring(1)]);
}
The event that is pushed to Google Analytics looks like this:
[mp3,play,Maid with the Flaxen Hair.mp3?uuid=525c67793bcd5]
Depending the used player, you should update and use to correct available instance.
SoundManager2 Page Player
pagePlayer.events.play = function() { ...
SoundManager2 UI 360
threeSixtyPlayer.events.play = function() { ...
SoundManager2 Inline player
inlinePlayer.events.play = function() { ...
SoundManager2 MP3 Basic player
basicMP3Player.events.play = function() { ...

Windows Phone leave background music playing

My Windows Phone app was rejected because when I play a sound in the browser in my app it stops existing background music from playing (rejection issue 6.5.1).
How do I update my application to not stop background music?
My JavaScript is something like this:
var mySound = new Audio(soundpath);
Sound.play(mySound);
I could not find anything in Microsoft.Xna.Framework.Media that handles how the app handles browser sound, but maybe I missed something?
What you are looking for is from the xna soundeffect
Here is what I use and it works for me great for all my sound effects.
(You cannot use music with a 'soundeffect' object, as it will not pass the windows store qualifications. You have to use the MediaElement for music)
I can’t remember which you need but I have all these includes
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Audio;
using Microsoft.Xna.Framework.Media;
and this function
private static void LoadSoundEffect(string fileName, SoundEffectInstance mySound)
{
var stream = TitleContainer.OpenStream("Sounds/" + fileName);
var effect = SoundEffect.FromStream(stream);
FrameworkDispatcher.Update();
mySound = effect.CreateInstance();
}
If you use a SoundEffectInstance, you can start,pause,stop the soundeffect etc. without all the problems.
SoundEffect works as well, but I prefer the SoundEffectInstance.
Edit: If you use soundeffect, it will not effect the music being played.
I'm assuming that you are building a native Windows Phone app (.XAP) and then using a browser control to display your app content. If that is the case, you have checks that you will need to perform when the app is first opened. Below is a description of how to resolve that issue.
You will need to add this piece of code to your app (I suggest you check this every time your app loads/opens). Add a reference with the using statement as well for the Media.
if (Microsoft.Xna.Framework.Media.MediaPlayer.State == MediaState.Playing)
{
MessageBoxResult Choice;
Choice = MessageBox.Show("Media is currently playing, do you want to stop it?", "Stop Player", MessageBoxButton.OKCancel);
if (Choice == MessageBoxResult.OK)
mediaElement1.Play();
}
If the user allows or disallows the media to be played you must put checks in your JavaScript for this. You will fail certification again if the user says "Cancel" and you play music anyway.
There is more information on the topic here.

Resources