Click here to Skip to main content
15,888,056 members
Please Sign up or sign in to vote.
4.00/5 (1 vote)
HI,


Is there any jquery for play local video in stylish popup. I have searched a lot in Google. But i didn't get any solution, I got many video popup but these videos are play from youtube or viemo . I need to video play from local folder. can you please Help me.

I have a code for playing videos from youtube and other. Here is the below code.



JavaScript
(function ($) {
	"use strict";

	//Shortcut for fancyBox object
	var F = $.fancybox,
		format = function( url, rez, params ) {
			params = params || '';

			if ( $.type( params ) === "object" ) {
				params = $.param(params, true);
			}

			$.each(rez, function(key, value) {
				url = url.replace( '$' + key, value || '' );
			});

			if (params.length) {
				url += ( url.indexOf('?') > 0 ? '&' : '?' ) + params;
			}

			return url;
		};

	//Add helper object
	F.helpers.media = {
		types : {
			youtube : {
                alert : "sucess",
				matcher : /(youtube\.com|youtu\.be)\/(watch\?v=|v\/|u\/|embed)?([\w-]{11}|\?listType=(.*)&list=(.*)).*/i,
				params  : {
					autoplay    : 1,
					autohide    : 1,
					fs          : 1,
					rel         : 0,
					hd          : 1,
					wmode       : 'opaque',
					enablejsapi : 1
				},
				type : 'iframe',
				url  : '//www.youtube.com/embed/$3'
			},
			vimeo : {
				matcher : /(?:vimeo(?:pro)?.com)\/(?:[^\d]+)?(\d+)(?:.*)/,
				params  : {
					autoplay      : 1,
					hd            : 1,
					show_title    : 1,
					show_byline   : 1,
					show_portrait : 0,
					color         : '',
					fullscreen    : 1
				},
				type : 'iframe',
				url  : '//player.vimeo.com/video/$1'
			},
			metacafe : {
				matcher : /metacafe.com\/(?:watch|fplayer)\/([\w\-]{1,10})/,
				params  : {
					autoPlay : 'yes'
				},
				type : 'swf',
				url  : function( rez, params, obj ) {
					obj.swf.flashVars = 'playerVars=' + $.param( params, true );

					return '//www.metacafe.com/fplayer/' + rez[1] + '/.swf';
				}
			},
			dailymotion : {
				matcher : /dailymotion.com\/video\/(.*)\/?(.*)/,
				params  : {
					additionalInfos : 0,
					autoStart : 1
				},
				type : 'swf',
				url  : '//www.dailymotion.com/swf/video/$1'
			}
		},

		beforeLoad : function(opts, obj) {
			var url   = obj.href || '',
				type  = false,
				what,
				item,
				rez,
				params;

			for (what in this.types) {
				item = this.types[ what ];
				rez  = url.match( item.matcher );

				if (rez) {
					type   = item.type;
					params = $.extend(true, {}, item.params, obj[ what ] || ($.isPlainObject(opts[ what ]) ? opts[ what ].params : null));

					url = $.type( item.url ) === "function" ? item.url.call( this, rez, params, obj ) : format( item.url, rez, params );

					break;
				}
			}

			if (type) {
				obj.href = url;
				obj.type = type;

				obj.autoHeight = false;
			}
		}
	};

}(jQuery));



And here is the below code in HTML Window.

HTML
<a class="fancybox-media" href="http://www.youtube.com/watch?v=opj24KnzrWods">Youtube</a>
		<a class="fancybox-media" href="http://vimeo.com/25634903">Vimeo</a>



This is all working fine. I need to play video from my server not from the youtube or Viemo etc.....

PLease help me..

Thanks

Dileep
Posted
Updated 5-Sep-12 2:27am
v2
Comments
Eduard Keilholz 5-Sep-12 7:49am    
What is a local folder? Is it on the end-user's machine, or on the server. I guess you mean on the server, but this is not local.
Ed Nutting 5-Sep-12 8:38am    
OP responded to your comment but started a new thread rather than replying. Please see below :)
Ed
dilzz 5-Sep-12 8:01am    
yes i mean in Server.... not in the client machine.
Ed Nutting 5-Sep-12 8:40am    
What's wrong with just embedding a video tag with the Src set to your video? Unless you are trying to support IE8 at which point I recommend you embed an HTML5 video tag by default but detect IE8 and then instead put a Flash player. Note: You will need to get your own Flash player to play your video file. A popular one is JWPlayer. Only use Flash in IE8 as Flash is being killed off and HTML5 is a much better solution - HTML5 will work on mobiles too.

Hope this helps,
Ed
Karthik. A 5-Sep-12 10:14am    
Perfect, You should have posted this as an answer!

1 solution

Hi there,

Please see my comment above for a good solution to this problem.

Thanks,
Ed
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900