video.js 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256
  1. import '../css/bootstrap.less';
  2. import 'css/newMenu/public.css';
  3. import 'css/newMenu/header.css'
  4. import 'css/search.css';
  5. import '../css/video.css';
  6. import './public.js';
  7. $(function () {
  8. var pageSize = 10,
  9. thePageNo = 1,
  10. nutt = 0,
  11. videoHtml = '',
  12. name='',
  13. thePageLength = 1,
  14. noLength = `<div class="noLength"></div>`;
  15. init();
  16. //获取参数
  17. function getRequest() {
  18. var url = window.location.search; //获取url中"?"符后的字串
  19. var theRequest = new Object();
  20. if (url.indexOf("?") != -1) {
  21. var str = url.substr(1),
  22. strs = str.split("&");
  23. for (var i = 0; i < strs.length; i++) {
  24. theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
  25. }
  26. }
  27. return theRequest;
  28. };
  29. function init() {
  30. if(getRequest().name){
  31. name=unescape(getRequest().name);
  32. $('.demandSearch').val(name)
  33. };
  34. pages();
  35. inpFun();
  36. loadDate();
  37. search();
  38. };
  39. //当前页面搜
  40. function search() {
  41. $('.searchBtn').click(function () {
  42. let val = $('.demandSearch').val();
  43. name = val;
  44. thePageNo = 1;
  45. loadDate();
  46. })
  47. };
  48. function loadDate(pageNo) {
  49. $('footer #bottom').show();
  50. $.ajax({
  51. method: "get",
  52. dataType: "json",
  53. url: globalConfig.context + "/portal/getVideoList", ///
  54. data: {
  55. pageNo: pageNo || 1,
  56. pageSize: 10,
  57. name: name,
  58. status: 1,
  59. transcoding:2
  60. },
  61. success: function (data) {
  62. if (data.error && data.error.length) {
  63. msg(data.error[0].message);
  64. } else if (data.data.list.length) {
  65. var contHtml = "";
  66. contHtml += '<ul>'
  67. var dataList = data.data.list;
  68. if (dataList.length) {
  69. dataList.map(item => {
  70. contHtml += `<li>
  71. <div>
  72. <img src="${globalConfig.avatarHost}/upload${item.coverUrl}" alt="">
  73. <div class="videoImg">
  74. <span></span>
  75. </div>
  76. <input type="hidden" value="${item.url||''}">
  77. <input type="hidden" class='videoId' value="${item.id||''}">
  78. </div>
  79. <div class="txt">
  80. <h3>${item.name}</h3>
  81. <p>${item.summary}</p>
  82. </div>
  83. </li>`
  84. })
  85. }
  86. contHtml += '</ul>';
  87. $(".contImg").html(contHtml);
  88. } else {
  89. $(".contImg").html(noLength);
  90. return false;
  91. }
  92. //分页部分的处理
  93. $('.pagination_box').css('display', 'block');
  94. $('.inp').css('display', 'block');
  95. if (data.data.list.length === 0) {
  96. $('.achievementHot .hotList').html("<div class='list_none'></div>");
  97. $('.pagination_box').css('display', 'none')
  98. $('.inp').css('display', 'none');
  99. };
  100. thePageLength = data.data.totalCount ? Math.ceil(data.data.totalCount / pageSize) : 1;
  101. $('.totalCount').html(`共${data.data.totalCount}条数据 ${thePageLength}页`)
  102. var pageArr = [],
  103. firstNo = 1,
  104. endNo = 5;
  105. if (thePageNo > 3) {
  106. firstNo = thePageNo - 2;
  107. endNo = Math.min((Number(thePageNo) + 2), thePageLength);
  108. } else {
  109. endNo = Math.min(thePageLength, 5);
  110. };
  111. for (let i = firstNo; i <= endNo; i++) {
  112. if (i == thePageNo) {
  113. pageArr.push(
  114. '<li class="pageNumber active"><a href="#" value=' + i + ' >' + i + '</a></li>'
  115. );
  116. } else {
  117. pageArr.push(
  118. '<li class="pageNumber"><a href="#" value=' + i + ' >' + i + '</a></li>'
  119. );
  120. }
  121. };
  122. $('.pageNumber').remove();
  123. $('.pagePre').after(pageArr.join(''));
  124. jumpFun();
  125. }
  126. });
  127. }
  128. //标题点击事件
  129. function jumpFun() {
  130. videoHtml = '';
  131. $(".contImg ul li").on("click", function () {
  132. let loginTxt = $('.head_login')[0];
  133. if (loginTxt && ($(loginTxt).text()) == '登录') {
  134. $('.head_login').click();
  135. window.location.hash = 'jump';
  136. return false;
  137. }
  138. nutt = $(this).index();
  139. let urls = $(this).find('.videoId').val();
  140. window.location.href=globalConfig.context+'/protal/videoDetail?id='+urls;
  141. //let urls = $(this).find('input').val();
  142. // videoHtml = `<source src="http://118.190.205.7:8000${urls}" type="video/mp4">`;
  143. // $('.videoPlay').show(100);
  144. // $('.videoPlay').addClass('active');
  145. // $('#videoAt').html(videoHtml);
  146. // let videoNew = document.getElementById('videoAt');
  147. // videoNew.load();
  148. })
  149. }
  150. videoCz();
  151. //视频操作
  152. function videoCz() {
  153. //关闭按钮
  154. $('.videoTopM .glyphicon-remove').click(function () {
  155. let video = document.getElementById('videoAt');
  156. $('.videoPlay').hide(100);
  157. $('.videoPlay').removeClass('active');
  158. video.pause();
  159. nutt=0;
  160. });
  161. //点击上一个,下一个
  162. $('.videoPre').click(function () {
  163. nutt-=1;
  164. if (nutt < 0) {
  165. msg('已经到第一个了.');
  166. nutt = 0;
  167. return false;
  168. };
  169. let video = document.getElementById('videoAt');
  170. video.pause();
  171. let urlT = $('.contImg ul li').eq(nutt).find('input').val();
  172. videoHtml = `<source src="http://118.190.205.7:8000${urlT}" type="video/mp4">`;
  173. $('#videoAt').html(videoHtml);
  174. let videoNew = document.getElementById('videoAt');
  175. videoNew.load();
  176. });
  177. $('.videoNext').click(function () {
  178. nutt+=1;
  179. if (nutt > $('.contImg ul li').length - 1) {
  180. nutt = $('.contImg ul li').length - 1;
  181. msg('已经到最后一个了.');
  182. return false;
  183. }
  184. let video = document.getElementById('videoAt');
  185. video.pause();
  186. let urlT = $('.contImg ul li').eq(nutt).find('input').val();
  187. videoHtml = `<source src="http://118.190.205.7:8000${urlT}" type="video/mp4">`;
  188. $('#videoAt').html(videoHtml);
  189. let videoNew = document.getElementById('videoAt');
  190. videoNew.load();
  191. })
  192. }
  193. //f分页
  194. function pages() {
  195. $('.pagination').on('click', 'li', function (e) {
  196. e.preventDefault();
  197. if (this.className === 'pagePre') {
  198. if (thePageNo > 1) {
  199. thePageNo = 1;
  200. loadDate(thePageNo);
  201. }
  202. } else if (this.className === 'pageNext') {
  203. if (thePageNo < thePageLength) {
  204. thePageNo = thePageLength;
  205. loadDate(thePageNo);
  206. }
  207. } else {
  208. var nextPageNo = $(this).children()[0].text;
  209. if (thePageNo != nextPageNo) {
  210. $(this).siblings("li").removeClass("active");
  211. $(this).addClass("active");
  212. thePageNo = nextPageNo;
  213. loadDate(thePageNo);
  214. };
  215. };
  216. });
  217. }
  218. //输入跳转
  219. function inpFun() {
  220. $('.inp .btn').on('click', function () {
  221. let val = $(this).siblings().val();
  222. if (!isNaN(val) && val <= thePageLength && val > 0) {
  223. thePageNo = val;
  224. loadDate(thePageNo);
  225. } else {
  226. msg('请输入正确页码')
  227. }
  228. })
  229. }
  230. /* 提示 */
  231. //提示框渐隐函数
  232. function msg(txt) {
  233. if ($('.smg').hasClass('active')) {
  234. return;
  235. }
  236. $('.smg').addClass('active');
  237. var lit = $('#msg').val(txt);
  238. setTimeout(function () {
  239. $('.smg').removeClass('active');
  240. $('#msg').val('');
  241. }, 2000)
  242. }
  243. //防止下载
  244. $('#videoAt').hover(function(){
  245. document.oncontextmenu=function(e){
  246. return false
  247. }
  248. },function(){
  249. document.oncontextmenu=function(e){
  250. }
  251. })
  252. })