开源 FlexPaper 制作的PDF,FLV等文件的播放器
发布时间:2020-12-15 03:54:59 所属栏目:百科 来源:网络整理
导读:主要是利用网络上开源项目 FlexPaper 制作播放PDF,SWF,FLV等格式的文件,网络有很多,简要记录一下,如下为播放器有关以供参考: FlexPaper相关JS文件:(官网: http://flexpaper.devaldi.com/?) script src="projectName/flexpaper/flexpaper_flash.js" type
主要是利用网络上开源项目 FlexPaper 制作播放PDF,SWF,FLV等格式的文件,网络有很多,简要记录一下,如下为播放器有关以供参考: FlexPaper相关JS文件:(官网: http://flexpaper.devaldi.com/?) <script src="projectName/flexpaper/flexpaper_flash.js" type="text/javascript"></script><script src=“projectName/videoPlayer/swfobject.js" type="text/javascript"></script> 部分HTML代码: <script type="text/javascript"> $(document).ready(function(){ //编写代码 var ld_flashshow = "width:584px;height:350px;margin:0px 0px 0px 0px;"; var ld_flashhide = "width:0px;height:0px;margin:0px 0px 0px 0px;"; function showVideoPlay(){ $("#videoPaper").html(''); var pageHost = (document.location.protocol == 'https:') ? 'https://' : 'http://'; var videohtml = ""; videohtml += "<div id='flashContent'>" + "<p>To view this page ensure that Adobe Flash Player version 10.3.0 or greater is installed.</p>" + "<a href='http://www.adobe.com/go/getflashplayer'><img src='" + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>"+ "</div>" + "<noscript><a href='http://www.adobe.com/go/getflashplayer/' style='color:black'><img src='images/ERROR_getFlashPlayer.gif' width='584' height='390' /></a><noscript>"; $("#videoPaper").html(videohtml); } function playSwf(swfFile,input){ $("#picPaper").attr("style","display:none"); $("#videoPaper").attr("style","display:none"); $("#flexPaper").attr("style",ld_flashshow); showTDstyle(input);//选中样式 //$FlexPaper().loadSwf(swfFile); showFlexPaperViewer(swfFile); } function playVideo(videoFile,input) { showVideoPlay(); showTDstyle(input);//选中样式 $("#picPaper").attr("style",ld_flashhide); $("#videoPaper").attr("style","display:block"); var url = "@Request.Url.AbsoluteUri"; url = url.substring(0,url.indexOf("/",8)); initialise(url + videoFile); } var queryParameters = new Array(); var flashVars = ""; var tag = ""; var url = ""; function initialise(filepath) { function getUrlParam( name ) { name = name.replace(/[[]/,"[").replace(/[]]/,"]"); var regexS = "[?&]"+name+"=([^&#]*)"; var regex = new RegExp( regexS ); var results = regex.exec( window.location.href ); if( results == null ) return ""; else return unescape( results[1] ); } queryParameters['source'] = getUrlParam("/Video/sample.flv"); queryParameters['type'] = getUrlParam('type'); queryParameters['idx'] = getUrlParam('idx'); queryParameters['source'] = filepath; if( queryParameters['type'] == "" ) queryParameters['type'] = "recorded"; if( queryParameters['idx'] == "" ) queryParameters['idx'] = "2"; flashVars += "&src="; flashVars += queryParameters['source']; flashVars += "&autoHideControlBar="; flashVars += unescape("true"); flashVars += "&streamType="; flashVars += queryParameters['type']; flashVars += "&autoPlay="; flashVars += unescape("true"); flashVars += "&verbose="; flashVars += "true"; var soFlashVars = { src: queryParameters['source'],streamType: queryParameters['type'],autoPlay: "true",controlBarAutoHide: "true",controlBarPosition: "bottom" }; tag = "<object width='584' height='390' id='SampleMediaPlayback' name='SampleMediaPlayback' type='application/x-shockwave-flash' classid='clsid:d27cdb6e-ae6d-11cf-96b8-444553540000' ><param name='movie' value='swfs/SampleMediaPlayback.swf' /> <param name='quality' value='high' /> <param name='bgcolor' value='#000000' /> <param name='allowfullscreen' value='true' /> <param name='flashvars' value= '" + flashVars+"'/><embed src='@Url.Content("~/projectName/Scripts/videoPlayer/swfs/SampleMediaPlayback.swf")' width='584' height='390' id='SampleMediaPlayback' quality='high' bgcolor='#000000' name='SampleMediaPlayback' allowfullscreen='true' pluginspage='http://www.adobe.com/go/getflashplayer' flashvars='"+ flashVars +"' type='application/x-shockwave-flash'> </embed></object>"; <!-- For version detection,set to min. required Flash Player version,or 0 (or 0.0.0),for no version detection. --> var swfVersionStr = "10.3.0"; <!-- To use express install,set to playerProductInstall.swf,otherwise the empty string. --> var xiSwfUrlStr = "@Url.Content("~/projectName/Scripts/videoPlayer/swfs/playerProductInstall.swf")"; var params = {}; params.quality = "high"; params.bgcolor = "#000000"; params.allowscriptaccess = "sameDomain"; params.allowfullscreen = "true"; params.base="."; var attributes = {}; attributes.id = "SampleMediaPlayback"; attributes.name = "SampleMediaPlayback"; attributes.align = "middle"; swfobject.embedSWF("@Url.Content("~/projectName/Scripts/videoPlayer/SampleMediaPlayback.swf")","flashContent","584","390",swfVersionStr,xiSwfUrlStr,soFlashVars,params,attributes); <!-- JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. --> swfobject.createCSS("#flashContent","display:block;text-align:left;"); } function showTDstyle(input){ $(input).attr("style","cursor:pointer;background-color:#8B814C"); var tdid = $("#selectTD").val(); if(tdid == null || tdid == ''){ $("#selectTD").attr("value",input.id); return; } var target = "#"+ tdid+ ""; $(target).attr("style","cursor:pointer;background-color:#222222"); $("#selectTD").attr("value",input.id); } </script> <div style="margin-top:10px"> <table width="884" cellspacing="0" cellpadding="0" bgcolor="#242424" style="border:2px solid #181818"> <tr> <td width="586px" height="390px" bgcolor="#222222" valign="top" align="center" style="margin:1px 1px 1px 1px;"> <div id="picPaper" style="width:584px;height:390px;display:block"> @{ if (!string.IsNullOrEmpty(course.PictureFilePath)) { <img src='/Images/Cover/@course.PictureFilePath' width='584px' height='390px' /> } else { <img src='/Images/item_cource_df.png' width='584px' height='390px' /> } } </div> <div id="flexPaper" style="width:0px;height:0px;margin:0px 0px 0px 0px;"> <a id="viewerPlaceHolder" style="width:584px;height:350px;"></a> <script type="text/javascript"> function showFlexPaperViewer(path) { var fp = new FlexPaperViewer('@Url.Content("~/projectName/Scripts/flexpaper/FlexPaperViewer")','viewerPlaceHolder',{ config: { SwfFile: escape(path),Scale: 0.6,ZoomTransition: 'eaSEOut',ZoomTime: 0.5,ZoomInterval: 0.2,FitPageOnLoad: true,FitWidthOnLoad: true,FullScreenAsMaxWindow: true,ProgressiveLoading: true,MinZoomSize: 0.2,MaxZoomSize: 5,SearchMatchAll: false,InitViewMode: 'Portrait',ViewModeToolsVisible: false,ZoomToolsVisible: true,NavToolsVisible: true,CursorToolsVisible: false,SearchToolsVisible: false,localeChain: 'zh_CN' } }); } </script> </div> <div id='videoPaper' style='display:none'> </div> </td> <td width="20px" height="390px" valign="top" bgcolor="#181818"/> <td width="277px" height="390px" valign="top" align="left" bgcolor="#181818"> <span style="height:36px;width:277px;text-align:center;display:block;line-height:38px;" class="doc100">文件系列列表</span> <hr align="left" size="1" width="255px" style="color:#5a5a5a;margin:0 0 0 4px;"/> <div style="overflow-y:scroll; height:350px;"> <table id="ss" width="100%" style="border:1px solid #181818"><input id="selectTD" type=hidden value=""> @foreach (var video in videoList) { <tr> <td align="left" id="td_@video.Refid" vertical-align="middle" bgcolor="#222222" height="46px" onclick="playVideo('/File/Video/@video.playFilePath',this)" style="cursor:pointer"> ??<img src="@Url.Content("~/Images/play.png")" alt="视频" valign="middle"/>? @if (!string.IsNullOrEmpty(video.aliasName)) { <font class="doc101">文件名称 : ?@video.aliasName?</font> } else { <font class="doc101">文件名称 : ?@video.videoName?</font> } <br /> </td> </tr> } @foreach (var ware in wareList) { <tr> <td align="left" id="td_@ware.Refid" vertical-align="middle" height="46px" bgcolor="#222222" onclick="playSwf('/File/Ware/@ware.playFilePath',this)" style="cursor:pointer"> <font class="doc101"> ??文件名称 : @ware.cName???</font> <br/> </td> </tr> } </table> </div> </td> </tr> </table> (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |