Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Aug 6th, 2012  |  syntax: None  |  size: 4.72 KB  |  hits: 11  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. .NET MVC - Return video file for jPlayer
  2. public ActionResult Video(string id)
  3.     {
  4.         UserVideo videoEntity = AccountBasicEntity.GetUserVideoWithID(id);
  5.  
  6.         string videoPath = ConfigurationManager.AppSettings["VideoPath"] + videoEntity.VideoFileName;
  7.  
  8.  
  9.         return File(videoPath, "video/mp4");
  10.     }
  11.  
  12.     public ActionResult Thumb(string id)
  13.     {
  14.         UserVideo videoEntity = AccountBasicEntity.GetUserVideoWithID(id);
  15.  
  16.         string thumbPath = ConfigurationManager.AppSettings["ThumbsPath"] + videoEntity.PreviewImageFileName;
  17.  
  18.         return File(thumbPath, "image/jpg");
  19.     }
  20.        
  21. http://localhost/media/video/GTt-b2DcEG ( returns video file )
  22. http://localhost/media/thumb/GTt-b2DcEG ( returns image file )
  23.        
  24. <!DOCTYPE html>
  25. <html>
  26. <head>
  27. <meta charset=utf-8 />
  28.  
  29. <!-- Website Design By: www.happyworm.com -->
  30. <title>Demo : jPlayer as a video player</title>
  31. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  32. <link href="skin/pink.flag/jplayer.pink.flag.css" rel="stylesheet" type="text/css" />
  33. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
  34. <script type="text/javascript" src="js/jquery.jplayer.min.js"></script>
  35. <script type="text/javascript">
  36. //<![CDATA[
  37. $(document).ready(function(){
  38.  
  39.     $("#jquery_jplayer_1").jPlayer({
  40.         ready: function () {
  41.             $(this).jPlayer("setMedia", {
  42.                 m4v: "http://localhost/media/video/GTt-b2DcEG",
  43.                 poster: "http://localhost/media/thumb/GTt-b2DcEG"
  44.             });
  45.         },
  46.         swfPath: "js",
  47.         supplied: "webmv, ogv, m4v",
  48.         size: {
  49.             width: "640px",
  50.             height: "360px",
  51.             cssClass: "jp-video-360p"
  52.         }
  53.     });
  54.  
  55. });
  56. //]]>
  57. </script>
  58. </head>
  59. <body>
  60.         <div id="jp_container_1" class="jp-video jp-video-360p">
  61.             <div class="jp-type-single">
  62.                 <div id="jquery_jplayer_1" class="jp-jplayer"></div>
  63.                 <div class="jp-gui">
  64.                     <div class="jp-video-play">
  65.                         <a href="javascript:;" class="jp-video-play-icon" tabindex="1">play</a>
  66.                     </div>
  67.                     <div class="jp-interface">
  68.                         <div class="jp-progress">
  69.                             <div class="jp-seek-bar">
  70.                                 <div class="jp-play-bar"></div>
  71.                             </div>
  72.                         </div>
  73.                         <div class="jp-current-time"></div>
  74.                         <div class="jp-duration"></div>
  75.                         <div class="jp-title">
  76.                             <ul>
  77.                                 <li>Big Buck Bunny Trailer</li>
  78.                             </ul>
  79.                         </div>
  80.                         <div class="jp-controls-holder">
  81.                             <ul class="jp-controls">
  82.                                 <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
  83.                                 <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
  84.                                 <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
  85.                                 <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
  86.                                 <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
  87.                                 <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
  88.                             </ul>
  89.                             <div class="jp-volume-bar">
  90.                                 <div class="jp-volume-bar-value"></div>
  91.                             </div>
  92.  
  93.                             <ul class="jp-toggles">
  94.                                 <li><a href="javascript:;" class="jp-full-screen" tabindex="1" title="full screen">full screen</a></li>
  95.                                 <li><a href="javascript:;" class="jp-restore-screen" tabindex="1" title="restore screen">restore screen</a></li>
  96.                                 <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
  97.                                 <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
  98.                             </ul>
  99.                         </div>
  100.                     </div>
  101.                 </div>
  102.                 <div class="jp-no-solution">
  103.                     <span>Update Required</span>
  104.                     To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
  105.                 </div>
  106.             </div>
  107.         </div>
  108. </body>
  109.  
  110. </html>