2017-05-24 6 views
0

이것은 내 코드입니다. JWplayer에 사용자 정의 오류 메시지를 표시하고 싶습니다. 현재 이미지를 표시하고 있습니다. JWplayer의 상황에 따라 사용자 정의 오류 메시지를 어떻게 얻을 수 있습니까? 다른 매개 변수에 대한 오류 메시지를 표시하려고합니다.오류 메시지에 대한 사용자 지정 메시지를 jwplayer에 추가 할 수 없습니다.

var videoNode = document.getElementById("videoUrlPath").value; 
    var player = jwplayer('play'); 
    var playerCall = true; 
    var seeking = false; 
    var currentPosition = 0; 
    var jw_selector = "#play"; 
    player.setup({ 
     file: videoNode, 
     width: "100%", 
     aspectratio: "16:9", 
     autostart: true, 
     /*advertising: { 
      client: 'vast', 
      schedule: { 
       adbreak1: { 
        offset: "pre", 
        tag: '/static/assets/vast.xml', 
        'skipoffset': '5' 
         } 
        } 
        }, 
     "sharing": { 
      "sites": ['facebook', 'twitter', 'email'], 
      link: '' 
     },*/ 
     skin: { 
      name: 'myskin', 
      url: 'assets/theme/js/jwplayer-7.8.6/skins/tfcskin.css' 
     }, 
    }); 
    player.play(); 
    player.onSetupError(function (error) { 
     player.setup({ 
      file: "http://content.jwplatform.com/videos/7RtXk3vl-52qL9xLP.mp4", 
      width: "100%", 
      aspectratio: "16:9", 
      image: "assets/theme/images/error-video.jpg" 
     }); 
     player.play(); 
    }); 
    player.onTime(function (callback) { 
     currentPosition = callback.position; 
     if (this.getPosition() === this.getDuration() && playerCall) { 
      playerCall = false; 
      document.getElementById("viewcountincrease").click(); 
     } 
    }) 
    player.onPlay(function (event) { 
     playerCall = true; 
    }) 
    player.onSeek(function() { 
     if (!seeking) { 
      seeking = true; 
      var _currentPosition = currentPosition; 
      /* WITH A SMALL DELAY SCROLL BACK */ 
      window.setTimeout(function() { 
       var elem = document.querySelector(jw_selector); 
       jwplayer(elem).seek(_currentPosition); 
      }, 100); 
     } else seeking = false; 
    }); 

답변

0

맞춤 텍스트 오류 메시지가 표시되면 재생기 주변에서 랩 div를 사용할 수 있습니다. https://support.jwplayer.com/customer/portal/articles/1403682-common-error-messages

이것은 codepen 예는 다음과 같습니다 : http://codepen.io/fdambrosio/pen/vmbPEK

HTML :

<div id="wrapvideo"> 
    <div id='player'></div> 
</div> 

CSS :

의 OnError 및 onSetupError 이벤트가 오류 메시지를 반환합니다, 당신은이 페이지에서 오류 메시지 목록을 찾을 수 있습니다
#wrapvideo { 
    width: 544px; 
    height: 306px; 
    display: inline-block; 
    color: white; 
    background-color: black; 
} 
#wrapvideo p { 
    text-align: center; 
} 

JS :

var playerInstance = jwplayer("player"); 
playerInstance.setup({ 
    file:'videoNode', 
    width: 544, 
    height: 306, 
}); 

playerInstance.on('error', function(evt){ 
    var element = document.getElementById("wrapvideo"); 
    if (evt.message === "Error loading player: No playable sources found") 
     { element.innerHTML = "<p>Your message</p>"; } 
    else { element.innerHTML = "<p>Another message</p>"; } 
}); 

playerInstance.on('setupError', function(evt){ 
    var element = document.getElementById("wrapvideo"); 
    if (evt.message === "No suitable players found and fallback disabled") 
     { element.innerHTML = "<p>Your message on setup error</p>"; } 
    else { element.innerHTML = "<p>Another message on setup error</p>"; } 
}); 

각 오류 메시지마다 이미지 및 비디오를 사용하여 동일한 작업을 수행 할 수 있습니다.