1. Integration

Integrating Anvato Analytics with an existing instance of the Flowplayer is simple: If your player is a Flowplayer 3.1 or above, then it will automatically load Plugins from your server on simple settings in your HTML embed code. All you need to do is set your 'plugins' flashvar to include 'anvatoanalytics'.

Here are examples of how to use the Anvato Video Analytics plugin with your Flow player. Because the plugin sends data silently to your Anvato_analytics account, you won't notice anything different about your player once it's installed. For more information about configuring the plugin and retrieving results from Anvato Analytics, read the Quick Start Guide or download the full documentation. Note that flowplayer does not have title property in default configuration, however you can pass title information using custom property in the flow javascript embed code.

Flowplayer Javascript Code:

				

				
				<script>			
				<div id="player" style="width:480px;height:270px"></div> 
				flowplayer("player", "flowplayer.swf", {
				
				
 
plugins: {
            anvatoanalytics: {
                    url: 'http://plugins.anvato.com/anvatoanalytics.flow.plugin.3.X.swf',
            config:
            {
                    tracker:'xxxxxxxx',
            }
          }
 },
				
				

				
				   	playlist: [ 
				    { 
				        url: 'http://r2.anvato.com/popeye_the_sailor_ancient_fantasy_512kb.mp4', 
				        autoPlay: true,  
				        title: 'Popeye The Sailor Ancient Fantasy', 
				    } 
				    ]
				});
				</script>
				
				
				

2. Test the Integration

Set the Flashvar property debug to true ["debug=true"] in your player generation script. The download pacakage has sample html (player.html) to show how to test the intgeration.

				

				
					flowplayer("player", "flowplayer.swf", { 
						   plugins: {
						        anvato_analytics: {
						            url: 'plugins/anvatoanalytics.swf',
						        config:
						        {
						              tracker:'xxxxxxxx',
				
		debug:'true'
				
						        }
						      }
						 },
						 playlist: [ 
				   		 { 
				        	url: 'http://r2.anvato.com/popeye_the_sailor_ancient_fantasy_512kb.mp4', 
				        	autoPlay: true,  
				        	title: 'Popeye The Sailor Ancient Fantasy', 
				    	}]
					});
				
				
				

Once the debug property is set, the integrated analytics module will pass activity logs to the JavaScript function displayAnalyticsLogs(string) for reporting. Add following javascript code into your test html page

				

				
					<script type="text/javascript">
						var logs ="";
						var once = '1';
						function displayAnalyticsLogs(a) 
							logs = logs + a + '
';
							document.getElementById('analyticslogs').innerHTML = logs;
					</script>
					<div id="analyticslogs"> </div>
				
				
				

View your HTML page (clear your cache if necessary).

Upon loading the video you should see an initialization message: "Anvato Analytics 1.5.xxxx is initialized. Tracking Key=XXXXXXXX (your tracking key here)". If you see this message then your player has successfully integrated the Analytics module.

For each video, you should see three video/player event message. "Player Event: Loaded" when the plugin is ready, "Video Event: Started" when the video starts playing and "Video Event: Metadata" when plugin received the metadata from video. These three messages indicates that the anlaytics plugin is working.

3. Verify Results

Play a video using your player, then log into your Anvato Analytics account to view your reports. Please note that it can take up to 30 minutes for statistics to appear on your account.

4. You're done! Grab a cocktail.

1. Integration

Anvato video analytics servers are monitoring the sites where the your player and plugin is loaded for increase security and integrity of video analytics data. Embedding the analytics plugin code and tracker ID will increase the security of your player. Embedding and compiling is a 2 step process.

Download Anvato Analytics plugin: Anvato Analytics Plugin

Modify Launcher.as (org.flowplayer.view.Launcher.as) by adding the below codeblock. Be sure to replace XXXXXX with the Tracker ID from your Analytics account.

				

				
					
				import flash.display.Loader;
			        import flash.net.URLRequest;
			   
			      
			        private var swfLoader:Loader = new Loader();
			        public var analytics:Object = null;
			   
			        protected function loadAnvatoAnalytics():void{
			            swfLoader.contentLoaderInfo.addEventListener(Event.COMPLETE,anvatoAnalyticsLoaded);
			            var analytic_plugin:String = "http://plugins.anvato.com/anvatoanalytics.swf";
			            if (this.root.loaderInfo.parameters['anvatoanalyticsplugin'])
			                analytic_plugin = String(this.root.loaderInfo.parameters['anvatoanalyticsplugin']);
			            var ur:URLRequest = new URLRequest(analytic_plugin);
			            swfLoader.load(ur);
			        }
			        private function anvatoAnalyticsLoaded(e:Event):void{
			          
			            try{
			                analytics = e.currentTarget.content;
			                if (analytics){
			                    var fwContainer:Object = new Object();
			
			                    fwContainer.player= _flowplayer;
			                    fwContainer.providers = _providers;
			                    fwContainer.key = 'xxxxxxxx';
			                    fwContainer.type ='flow'; 
			                    fwContainer.name ='flow-pc'; 
			                    fwContainer.version = VersionInfo.versionInfo();
			                    fwContainer.url =  this.root.loaderInfo.url;

			                    analytics.debug = root.loaderInfo.parameters["debug"]== "true";
			                    analytics.initialize(fwContainer,null);
			                }
			            }
			            catch(err:Error){
			               
			            };
			        }
				
				
				

Call loadAnvatoAnalytics() function inside initPhase4() function to load and initialize the Analytics Module.

				

				
					private function initPhase4(event:Event = null):void {
		            log.info("initPhase4, all plugins initialized");
		
		            loadAnvatoAnalytics();
		           
		            log.debug("Adding visible plugins to panel");
		            addPluginsToPanel(_pluginRegistry);
		           
		            log.debug("dispatching onLoad");
		            if (useExternalInterfade()) {
		                _flowplayer.dispatchEvent(PlayerEvent.load("player"));
		            }
		            arrangeScreen();
		            log.debug("starting configured streams");
		            startStreams();
		
		            stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);
		            addListeners();
		
		        }
				
				
				

Compile the Flowplayer.

2. Test the Integration

Set the Flashvar property debug to true ["debug=true"] in your player generation script. The download package includes an example (player.html) to show how to test the integration.

				

					
						$f("player", "flowplayer.swf?
						tracker=xxxxxxx&debug=true&anvatoanalyticsplugin=plugin/anvatoanalytics.swf", { 
							playlist: [ 
						    { 
						        url: 'http://public-clips.s3.amazonaws.com/woody_woodpecker_pantry_panic_512kb.mp4', 
						        autoPlay: true, 
						        title: 'Woody Woodpecker Pantry Panic'
						    } 
						]
						});
					
				
				

Once the debug property is set, the integrated analytics module will pass activity logs to the JavaScript function displayAnalyticsLogs(string) for reporting.Add fllowing javascript code into your test html page

				

				
					
					<script type="text/javascript">
						var logs ="";
						var once = '1';
						function displayAnalyticsLogs(a) 
							logs = logs + a + '
';
							document.getElementById('analyticslogs').innerHTML = logs;
					</script>
					<div id="analyticslogs"> </div>
				
				
				

View your HTML page (clear your cache if necessary).

Upon loading the video you should see an initialization message: "Anvato Analytics 1.3.xxxx is initialized. Tracking Key=XXXXXXXX (your tracking key here)". If you see this message then your player has successfully integrated the Analytics module.

For each video, you should see three video/player event message. "Player Event: Loaded" when the plugin is ready, "Video Event: Started" when the video starts playing and "Video Event: Metadata" when plugin received the metadata from video. These three messages indicates that the anlaytics plugin is working.

3. Verify Results

Play a video using your player, then log into your Anvato Analytics account to view your reports. Please note that it can take up to 30 minutes for statistics to appear on your account.

4. You're done! Grab a cocktail.