i am trying to use Plyr.io library Js , but dont initialize , follow code below :
Code: Select all
Procedure AppendHead(content.s)
Debug "head"
!$("head").append(v_content);
EndProcedure
Procedure AppendBody(content.s)
!$("body").append(v_content);
EndProcedure
Procedure AppendContent(component.i,content.s, Position = #PB_Ignore)
GID = GadgetID(component)
If Position <> #PB_Ignore
! $(".card:eq(" + v_position + ")").prepend(v_content);
Else
! $(v_gid.div).append(v_content);
EndIf
EndProcedure
;Procedure AppendBody(content.s)
; !$("body").append(v_content);
;EndProcedure
Procedure Main(URL$, Success)
Debug "Script URL: " + URL$
Debug "Loading status: " + Success
; AppendBody("<div>" +
; " <nav>" +
; " <div class='nav nav-tabs' id='nav-tab' role='tablist'>" +
; " <a class='nav-item nav-link active show' id='nav-home-tab' data-toggle='tab' href='#nav-home' role='tab' aria-controls='nav-home' aria-selected='true'>Home</a>" +
; " <a class='nav-item nav-link' id='nav-profile-tab' data-toggle='tab' href='#nav-profile' role='tab' aria-controls='nav-profile' aria-selected='false'>Profile</a>" +
; " <a class='nav-item nav-link' id='nav-contact-tab' data-toggle='tab' href='#nav-contact' role='tab' aria-controls='nav-contact' aria-selected='false'>Contact</a>" +
; " </div> " +
; " </nav>" +
; " <div class='tab-content' id='nav-tabContent'>" +
; " <div class='tab-pane fade active show' id='nav-home' role='tabpanel' aria-labelledby='nav-home-tab'>" +
; " <p>Home</p>" +
; " </div>" +
; " <div class='tab-pane fade' id='nav-profile' role='tabpanel' aria-labelledby='nav-profile-tab'>" +
; " <p>Profile</p>" +
; " </div>" +
; " <div class='tab-pane fade' id='nav-contact' role='tabpanel' aria-labelledby='nav-contact-tab'>" +
; " <p>Contact</p>" +
; " </div> " +
; " </div>" +
; "</div>")
AppendBody("<div id='player' data-plyr-provider='youtube' data-plyr-embed-id='bTqVqk7FSmY'></div>")
!const player = new Plyr('#player', {});
!window.player = player;
EndProcedure
Procedure Init()
LoadScript("https://cdn.plyr.io/3.6.3/plyr.js", @Main())
EndProcedure
! $("<link rel='stylesheet' type='text/css'>").attr("href", "https://cdn.plyr.io/3.6.3/plyr.css").appendTo("head");
! $("<link rel='stylesheet' type='text/css'>").attr("href", "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css").appendTo("head");
! require(["https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"], function() {
Init()
! });