github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/themes/wind/templates/videojs.html (about) 1 {% extends "base.html" %} 2 3 {% block css %} 4 <!--[if IE 7]> 5 <link rel="stylesheet" type="text/css" href="/css/ie7.css" /> 6 <![endif]--> 7 <link rel="stylesheet" type="text/css" href="/css/lib.css"> 8 <link rel="stylesheet" type="text/css" href="/font/css/font-awesome.min.css" /> 9 <link rel="stylesheet" type="text/css" href="/css/app.css"> 10 {% endblock css %} 11 12 {% block js %} 13 <script type="text/javascript" src="/js/lib.js"></script> 14 <script type="text/javascript" src="/js/app.js"></script> 15 <script> 16 function jsDateDiff(publishTime){ 17 var d_minutes,d_hours,d_days; 18 var timeNow = parseInt(new Date().getTime()/1000); 19 var d; 20 d = timeNow - publishTime; 21 d_days = parseInt(d/86400); 22 d_hours = parseInt(d/3600); 23 d_minutes = parseInt(d/60); 24 25 if(d_days>0 && d_days<4){ 26 return d_days+" 天前"; 27 }else if(d_days<=0 && d_hours>0){ 28 return d_hours+" 小时前"; 29 }else if(d_hours<=0 && d_minutes>0){ 30 return d_minutes+" 分钟前"; 31 }else{ 32 var s = new Date(publishTime*1000); 33 // s.getFullYear()+"年"; 34 return (s.getMonth()+1)+" 月"+s.getDate()+" 日"; 35 } 36 } 37 38 function getUnixTime(dateStr) 39 { 40 var newstr = dateStr.replace(/-/g,'/'); 41 var date = new Date(newstr); 42 var time_str = date.getTime().toString(); 43 return time_str.substr(0, 10); 44 } 45 </script> 46 {% endblock js %} 47 48 {% block danmaku %} 49 <link href="/libs/video-js-5.9.0/video-js.css" rel="stylesheet"> 50 <script src="/libs/video-js-5.9.0/ie8/videojs-ie8.min.js"></script> 51 <script src="/libs/video-js-5.9.0/video.js"></script> 52 53 <script src="/libs/CommentCoreLibrary/CommentCoreLibrary.js"></script> 54 <script src="/libs/CommentCoreLibrary/parsers/BilibiliFormat.js"></script> 55 56 <link rel="stylesheet" type="text/css" href="/libs/video-js/danmaku4vjs/danmaku4vjs.css"> 57 <script src="/libs/video-js/danmaku4vjs/danmaku4vjs.js"></script> 58 59 <script type="text/javascript"> 60 videojs.options.flash.swf = "/libs/video-js-5.9.0/video-js.swf"; //"/libs/video-js/video-js.swf"; 61 window.addEventListener("load",function(){ 62 window.thevideojs = videojs("video"); 63 thevideojs.ABP(); 64 thevideojs.danmu.load("1.xml"); 65 }); 66 </script> 67 {% endblock danmaku %} 68 69 {% block content %} 70 <div id="content" class="col-md-12"> 71 <div class="box"> 72 <div class="cell first breadcrumb last"> 73 <a href="/">优姬</a> <i class="fa fa-caret-right"></i> 74 <a class="tag" href="/node/10/">视频</a> 75 76 </div> 77 78 <div class="post-show"> 79 <div class="cell first"> 80 81 <div class="avatar pull-right"> 82 <a href="/user/amoydavid/" title="amoydavid"> 83 84 <img class="large" src="http://yougam.qiniudn.com/2014-9-7-002238D2A8DCEC46B45144.jpg?imageView/2/w/100/h/100/q/100"></a> 85 </div> 86 87 <h1 class="post-title">弹幕播放器研究中...</h1> 88 89 <div class="post-meta"> 90 91 <span class="post-span votes"> 92 <a href="javascript:void(0);" onclick="javascript:$.get('/touch/like/topic/571/?ver='+(new Date()).valueOf(), {Action:'get'}, function (data, textStatus){this;$('#score-571').html(data);});" class="vote"> <i class="fa fa-chevron-up"></i> 93 </a> 94 95 <a href="javascript:" onclick="javascript:$.get('/touch/hate/topic/571/?ver='+(new Date()).valueOf(), {Action:'get'}, function (data, textStatus){this;$('#score-571').html(data);});" class="vote"> 96 <i class="fa fa-chevron-down"></i> 97 </a> 98 <span class="badge" id="score-571">3</span> 99 分 • 100 </span> 101 102 <a href="/user/insion/">insion</a> 103 • 104 <a class="tag" href="/node/10/">分享创造</a> 105 • 106 <span class="last-reply"> 107 最后回复来自 108 <a href="/user/532430036/">532430036</a> 109 • 110 </span> 111 112 <span class="time"> 113 <script>document.write(jsDateDiff(getUnixTime("2014-09-25 18:30:36")));document.close();</script> 114 9 小时前 • 115 </span> 116 117 <span class="topic-views">20 次点击</span> 118 <script type="text/javascript"> 119 $.get("/touch/view/topic/571/?ver="+(new Date()).valueOf(), function(data){ 120 $(".topic-views").html(data+" 次点击"); 121 }); 122 </script> 123 124 </div> 125 </div> 126 127 <div class="cell last" style="border-bottom-left-radius:0px;border-bottom-right-radius:0px;"> 128 <div class="post-content"> 129 <video align="center" id="video" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" width="auto" height="380" poster="/business/codingnet-500x120-2014-7-30to2015-1-30.jpg"> 130 <!--source src="http://218.26.231.133/69729DE0F9439773207F24A97/030002010053FC144ABEBB194164E21BE586DB-11F9-C77D-4F70-01F64C4F8289.flv" type="video/x-flv"/--> 131 <object id="flash_fallback_1" class="vjs-flash-fallback" width="720" height="360" type="application/x-shockwave-flash" data="http://player.youku.com/player.php/sid/XMTM4MzIwNDEwNA==/v.swf"><param name="allowfullscreen" value="true" /></object> 132 </video> 133 134 <button type="button" data-action="prev">Previous</button> 135 <button type="button" data-action="next">Next</button> 136 <script> 137 var videos = [ 138 {{VideoTags("[video]http://v.youku.com/v_show/id_XODI3OTg2NTI4.html[/video]")|safe}} 139 ]; 140 var player = videojs('video'); 141 player.playList(videos, { 142 getVideoSource: function(vid, cb) { 143 cb(vid.src, vid.poster); 144 } 145 }); 146 $('[data-action=prev]').on('click', function(e) { 147 player.prev(); 148 }); 149 $('[data-action=next]').on('click', function(e) { 150 player.next(); 151 }); 152 </script> 153 </div> 154 <span class="clearfix"></span> 155 </div> 156 157 <div class="holdbar"> 158 <div class="pull-left"> 159 <a class="btn btn-mini" href="javascript:" onclick="javascript:$.get('/touch/favorite/topic/571/?ver='+(new Date()).valueOf(), {Action:'get'}, function (data, textStatus){this;$('#favorite-571').html(' • '+data+' 人收藏');});" style="margin-right:1em;">收藏话题</a> 160 161 </div> 162 <div class="pull-right" style="line-height:26px; text-shadow: 0px 1px 0px #fff;"> 163 <span class="topic-views">20 次点击</span> 164 <script type="text/javascript"> 165 $.get("/touch/view/topic/571/?ver="+(new Date()).valueOf(), function(data){ 166 $(".topic-views").html(data+" 次点击"); 167 }); 168 </script> 169 <span> 170 <span id="favorite-571"></span> 171 </span> 172 </div> 173 <div style="clear: both;"></div> 174 </div> 175 176 </div> 177 178 </div> 179 180 <div class="box post-comments" data-user="ifik"> 181 <div class="cell first breadcrumb"> 182 总共 2 回复 183 <span class="time" style="margin-left:.5em;padding-left:.5em;border-left:1px solid #ccc;"> 184 直到 185 <script>document.write(jsDateDiff(getUnixTime("2014-09-25 18:53:58")));document.close();</script> 186 9 小时前 187 </span> 188 189 </div> 190 191 <div id="reply622" class="cell comment" data-user="ADA" data-user-nick="ADA" data-floor="622"> 192 193 <div class="avatar"> 194 <a href="/user/ADA/"> 195 196 <img src="http://yougam.qiniudn.com/2014-9-18-1844441AF306D44C824646.jpg?imageView/2/w/100/h/100/q/100"></a> 197 </div> 198 <div class="content"> 199 <div class="meta"> 200 <a href="/user/ADA/">ADA</a> 201 202 <span class="time"> 203 <script>document.write(jsDateDiff(getUnixTime("2014-09-25 18:34:35")));document.close();</script> 204 9 小时前 205 </span> 206 207 <span class="pull-right"> 208 <a rel="comment-reply" href="javascript:" style="text-decoration:none;"> 209 <img src="/img/reply.png" width="20px" height="16px" alt="回复"></a> 210 <a href="#reply622" class="badge" style="width:24px;height:16px;">1</a> 211 </span> 212 </div> 213 <div class="markdown"> 214 215 <p>这样会不会很慢，貌似那个才1m带宽，跳转也不给力吧。。而且，不怕查么？</p> 216 217 </div> 218 </div> 219 <span class="clearfix"></span> 220 </div> 221 222 <div id="reply626" class="cell last comment" data-user="532430036" data-user-nick="532430036" data-floor="626"> 223 224 <div class="avatar"> 225 <a href="/user/532430036/"> 226 227 <img src="http://yougam.qiniudn.com/2014-9-6-0340376B3BAAE70986B330.jpg?imageView/2/w/100/h/100/q/100"></a> 228 </div> 229 <div class="content"> 230 <div class="meta"> 231 <a href="/user/532430036/">532430036</a> 232 233 <span class="time"> 234 <script>document.write(jsDateDiff(getUnixTime("2014-09-25 18:53:58")));document.close();</script> 235 9 小时前 236 </span> 237 238 <span class="pull-right"> 239 <a rel="comment-reply" href="javascript:" style="text-decoration:none;"> 240 <img src="/img/reply.png" width="20px" height="16px" alt="回复"></a> 241 <a href="#reply626" class="badge" style="width:24px;height:16px;">2</a> 242 </span> 243 </div> 244 <div class="markdown"> 245 246 <p>我关心的是备案是不是蛋疼的要等寄送布幕，要不要又另外掏钱等等烦人的事。</p> 247 248 </div> 249 </div> 250 <span class="clearfix"></span> 251 </div> 252 253 </div> 254 255 <div class="box"> 256 <div class="cell first last"> 257 258 <form id="post-reply" method="POST" action="/subject/571/comment/"> 259 <div id="md-editor" class="markdown-editor" data-savekey="post/comment"> 260 261 <div class="form-group"> 262 <div class="btn-toolbar md-toolbar" role="toolbar"> 263 264 <div class="btn-group"> 265 <button type="button" class="btn btn-default md-btn" data-meta="image" data-placement="bottom" id="pickfiles" data-original-title="" title="" style="z-index: 1;"> 266 <i class="icon-picture"></i> 267 </button> 268 </div> 269 <div class="btn-group"> 270 <button type="button" class="btn btn-default md-btn disabled" data-meta="undo"> 271 <div class="icon-rotate-left"></div> 272 </button> 273 <button type="button" class="btn btn-default md-btn disabled" data-meta="redo"> 274 <i class="icon-rotate-right"></i> 275 </button> 276 </div> 277 </div> 278 <div class="md-textarea"> 279 <div class="textcomplete-wrapper" style="position: relative; display: block;"> 280 <ul class="dropdown-menu" style="position: absolute; top: 0px; left: 0px; z-index: 100; display: none;"></ul> 281 <div class="textcomplete-wrapper" style="position: relative; display: block;"> 282 <ul class="dropdown-menu" style="position: absolute; top: 0px; left: 0px; z-index: 100; display: none;"></ul> 283 <textarea id="CommentForm-Message" name="comment" rows="5" class="form-control" style="overflow: hidden; word-wrap: break-word; resize: none; height: 122px;"></textarea> 284 </div> 285 </div> 286 287 </div> 288 </div> 289 290 </div> 291 <div class="form-group"> 292 <button class="btn btn-primary"> 293 回复 294 <i class="icon-chevron-sign-right"></i> 295 </button> 296 <span class="pull-right">请尽量让自己的回复能够对别人有帮助</span> 297 <div id="uploadbox" class="control-group" style="display:none;"> 298 <style type="text/css"> 299 .filePrew { 300 display: block; 301 position: absolute; 302 top: 0; 303 left: 0; 304 width: 200px; 305 font-size: 100px; 306 /* 增大不同浏览器的可点击区域 */ 307 opacity: 0; 308 /* 实现的关键点 */ 309 } 310 .col-md-12{overflow:hidden;padding:0;} 311 .table{margin:0;} 312 .infoWrapper{display: none;} 313 </style> 314 <script> 315 function removem(mkey){ 316 str=document.getElementById("imgs").value; 317 var strs= new Array(); 318 strs=str.split(","); 319 imgs=""; 320 for (i=0;i<strs.length;i++){ 321 if (strs[i]!=mkey && strs[i]!=""){ 322 if (imgs!=""){ 323 imgs=strs[i]+","+imgs; 324 }else{ 325 imgs=strs[i]; 326 } 327 } 328 } 329 if (imgs==""){ 330 imgs=","; 331 } 332 333 document.getElementById("imgs").value =imgs; 334 335 var node =document.getElementById("n"+mkey); 336 node.parentNode.removeChild(node); 337 } 338 </script> 339 <div class="controls"> 340 <input type="hidden" id="imgs" name="images" value=""> 341 <input type="hidden" id="domain" value="http://yougam.qiniudn.com/"> 342 <input type="hidden" id="uptoken_url" value="/api/sign4qiniu/"> 343 <div id="container" style="margin-top: 1em; position: relative;"> 344 <div id="html5_192n667jl6qk1p0hs3g1qg61f7v3_container" class="moxie-shim moxie-shim-html5" style="position: absolute; top: 673px; left: 201px; width: 37px; height: 36px; overflow: hidden; z-index: 0;"> 345 <input id="html5_192n667jl6qk1p0hs3g1qg61f7v3" type="file" style="font-size: 999px; opacity: 0; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;" multiple="" accept=""></div> 346 </div> 347 <div class="span11" style="padding-top:1em;margin-left:0;clear:both;"> 348 <div id="success" style="display:none;"> 349 <div class="alert-success" style="padding:1em;">全部文件上传完毕..</div> 350 </div> 351 <div class="col-md-12"> 352 <table class="table table-striped table-hover text-left" style="margin-top:0;display:none;"> 353 <thead> 354 <tr> 355 <th class="col-md-4" style="padding-left:0;padding-right:0;padding-top:0.5em;padding-bottom:0.5em;">文件</th> 356 <th class="col-md-3" style="padding-left:0;padding-right:0;padding-top:0.5em;padding-bottom:0.5em;">尺寸</th> 357 <th class="col-md-5" style="padding-left:0;padding-right:0;padding-top:0.5em;padding-bottom:0.5em;">详情</th> 358 </tr> 359 </thead> 360 <tbody id="fsUploadProgress"></tbody> 361 </table> 362 </div> 363 </div> 364 365 </div> 366 </div> 367 <script type="text/javascript" src="/libs/plupload-2.1.2/js/plupload.full.min.js"></script> 368 <script type="text/javascript" src="/libs/plupload-2.1.2/js/i18n/zh_CN.js"></script> 369 <script type="text/javascript" src="/libs/qiniu-js-sdk-master/src/qiniu.js"></script> 370 <script type="text/javascript" src="/js/ui.js"></script> 371 <script type="text/javascript" src="/js/settings4qiniu.js"></script> 372 373 </div> 374 </form> 375 376 </div> 377 </div> 378 379 <script type="text/javascript"> 380 (function($){ 381 $.postPage(); 382 })(jQuery); 383 </script> 384 <span class="clearfix"></span> 385 </div> 386 {% endblock content %} 387 388 {% block sidebar %} 389 {% endblock sidebar %}