Настройка плеера на сайте

Тема в разделе "Помощь", создана пользователем friwa, 13 фев 2019.

  1. TopicStarter Overlay
    friwa

    friwa
    Отправить ЛС

    Регистрация:
    13 фев 2019
    Сообщения:
    1
    Симпатии:
    0
    Баллы:
    1
    Доброго дня господа.
    Перейду к сути вопроса.
    У меня есть некий плеер с такой структурой папок:
    css
    fonts
    images
    js
    videos
    и файл index.html
    Содержимое фала index.html

    HTML:
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="description" content="Elite Video Player"/>
        <meta property="og:title" content="Elite Video Player by _zac_"/>
        <meta property="og:image" content="http://creativeinteractivemedia.com/player/imgFB/elite.png"/>
        <link rel="stylesheet" href="css/elite.css" type="text/css" media="screen"/>
        <link rel="stylesheet" href="css/elite-font-awesome.css" type="text/css">
        <link rel="stylesheet" href="css/jquery.mCustomScrollbar.css" type="text/css">
        <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
        <script src="js/froogaloop.js" type="text/javascript"></script>
        <script src="js/jquery.mCustomScrollbar.js" type="text/javascript"></script>
        <script src="js/THREEx.FullScreen.js"></script>
        <script src="js/videoPlayer.js" type="text/javascript"></script>
        <script src="js/Playlist.js" type="text/javascript"></script>
    
        <script type="text/javascript" charset="utf-8">
            $(document).ready(function($)
            {
                videoPlayer = $("#Elite_video_player").Video({   //ALL PLUGIN OPTIONS
                    googleAnalyticsTrackingCode: "UA-87467628-3",//track video events using Google Analytics (how may times video is played, downloaded, etc.)
                    instanceName:"player1",                      //name of the player instance
                    instanceTheme:"dark",                        //choose video player theme: "dark", "light"
                    autohideControls:5,                          //autohide HTML5 player controls
                    hideControlsOnMouseOut:"No",                 //hide HTML5 player controls on mouse out of the player: "Yes","No"
                    playerLayout: "fixedSize",                   //Select player layout: "fitToContainer" (responsive mode), "fixedSize" (fixed mode), "fitToBrowser" (fill the browser mode)
                    videoPlayerWidth:1006,                       //fixed total player width (only for playerLayout: "fixedSize")
                    videoPlayerHeight:420,                       //fixed total player height (only for playerLayout: "fixedSize")
                    videoRatio: 16/9,                            //set your video ratio (calculate video width/video height)
                    videoRatioStretch: false,                    //adjust video ratio for case when playlist is "opened" : true/false
                    iOSPlaysinline: true,                        //on iOS device: play videos inline (like on desktop) or in Fullscreen by default: true/false
                    floatPlayerOutsideViewport: false,           //show Sticky player if video player is not in viewport when scrolling through page
                    lightBox:false,                              //lightbox mode :true/false
                    lightBoxAutoplay: false,                     //autoplay video when lightbox opens: true/false
                    lightBoxThumbnail:"images/preview_images/poster.jpg", //lightbox thumbnail image
                    lightBoxThumbnailWidth: 400,                 //lightbox thumbnail image width
                    lightBoxThumbnailHeight: 220,                //lightbox thumbnail image height
                    lightBoxCloseOnOutsideClick: true,           //close lightbox when clicked outside of player area
                    playlist:"Right playlist",                   //choose playlist type: "Right playlist", "Bottom playlist", "Off"
                    playlistScrollType:"light",                  //choose scrollbar type: "light","minimal","light-2","light-3","light-thick","light-thin","inset","inset-2","inset-3","rounded","rounded-dots","3d","dark","minimal-dark","dark-2","dark-3","dark-thick","dark-thin","inset-dark","inset-2-dark","inset-3-dark","rounded-dark","rounded-dots-dark","3d-dark","3d-thick-dark"
                    playlistBehaviourOnPageload:"opened (default)",//choose playlist behaviour when webpage loads: "closed", "opened (default)" (not apply to Vimeo player)
                    autoplay:false,                              //autoplay when webpage loads: true/false
                    colorAccent:"#cc181e",                       //plugin colors accent (hexadecimal or RGB value - http://www.colorpicker.com/)
                    vimeoColor:"00adef",                         //set "hexadecimal value", default vimeo color is "00adef"
                    youtubeControls:"custom controls",             //choose youtube player controls: "custom controls", "default controls"
                    youtubeSkin:"dark",                          //default youtube controls theme: light, dark
                    youtubeColor:"red",                          //default youtube controls bar color: red, white
                    youtubeQuality:"default",                    //choose youtube quality: "small", "medium", "large", "hd720", "hd1080", "highres", "default"
                    youtubeShowRelatedVideos:"Yes",                 //choose to show youtube related videos when video finish: "Yes", "No" (onFinish:"Stop video" needs to be enabled)
                    videoPlayerShadow:"effect1",                 //choose player shadow:  "effect1" , "effect2", "effect3", "effect4", "effect5", "effect6", "off"
                    loadRandomVideoOnStart:"No",                 //choose to load random video when webpage loads: "Yes", "No"
                    shuffle:"No",                                 //choose to shuffle videos when playing one after another: "Yes", "No" (shuffle button enabled/disabled on start)
                    posterImg:"images/preview_images/poster.jpg",//player poster image 
                    posterImgOnVideoFinish:"images/preview_images/poster2.jpg",//player poster image on video finish (if enabled onFinish:"Stop video")
                    onFinish:"Play next video",                  //"Play next video","Restart video", "Stop video",
                    nowPlayingText:"Yes",                        //enable disable now playing title: "Yes","No"
                    preloadSelfHosted:"none",                    //choose preload buffer for self hosted mp4 videos (video type HTML5): "none", "auto"
                    rightClickMenu:true,                         //enable/disable right click over HTML5 player: true/false
                    hideVideoSource:false,                         //option to hide self hosted video sources (to prevent users from download/steal your videos): true/false
                    showAllControls:true,                         //enable/disable all HTML5 player controls: true/false
                    allowSkipAd:true,                            //enable/disable "Skip advertisement" option: true/false
                    infoShow:"Yes",                              //enable/disable info option: "Yes","No"
                    shareShow:"Yes",                             //enable/disable all share options: "Yes","No"
                    facebookShow:"Yes",                          //enable/disable facebook option individually: "Yes","No"
                    twitterShow:"Yes",                           //enable/disable twitter option individually: "Yes","No"
                    mailShow:"Yes",                              //enable/disable mail option individually: "Yes","No"
                    facebookShareName:"Elite video player",      //first parametar of facebook share in facebook feed dialog is title
                    facebookShareLink:"http://codecanyon.net/item/elite-video-player-wordpress-plugin/10496434",  //second parametar of facebook share in facebook feed dialog is link below title
                    facebookShareDescription:"Elite Video Player is stunning, modern, responsive, fully customisable high-end video player for WordPress that support advertising and the most popular video platforms like YouTube, Vimeo or self-hosting videos (mp4).", //third parametar of facebook share in facebook feed dialog is description below link
                    facebookSharePicture:"https://0.s3.envato.com/files/123866118/preview.jpg", //fourth parametar in facebook feed dialog is picture on left side
                    twitterText:"Elite video player",             //first parametar of twitter share in twitter feed dialog is text
                    twitterLink:"http://codecanyon.net/item/elite-video-player-wordpress-plugin/10496434", //second parametar of twitter share in twitter feed dialog is link
                    twitterHashtags:"wordpressvideoplayer",         //third parametar of twitter share in twitter feed dialog is hashtag
                    twitterVia:"Creative media",                 //fourth parametar of twitter share in twitter feed dialog is via (@)
                    googlePlus:"http://codecanyon.net/item/elite-video-player-wordpress-plugin/10496434", //share link over Google +
                    logoShow:"Yes",                              //"Yes","No"
                    logoClickable:"Yes",                         //"Yes","No"
                    logoPath:"images/logo/logo.png",             //path to logo image
                    logoGoToLink:"http://codecanyon.net/",       //redirect to page when logo clicked
                    logoPosition:"bottom-left",                  //choose logo position: "bottom-right","bottom-left"
                    embedShow:"Yes",                             //enable/disable embed option: "Yes","No"
                    embedCodeSrc:"www.yourwebsite.com/videoplayer/index.html", //path to your video player on server
                    embedCodeW:"746",                            //embed player code width
                    embedCodeH:"420",                            //embed player code height
                    embedShareLink:"www.yourwebsite.com/videoplayer/index.html", //direct link to your site (or any other URL) you want to be "shared"
                    showGlobalPrerollAds: false,                 //enable/disable 'global' ads and overwrite each individual ad in 'videos' :true/false
                    globalPrerollAds: "url1;url2;url3;url4;url5",//set 'pool' of url's that are separated by ; (global prerolls will play randomly)
                    globalPrerollAdsSkipTimer: 5,                //skip global advertisement seconds
                    globalPrerollAdsGotoLink: "http://codecanyon.net/",//global advertisement goto link
                    advertisementTitle:"Advertisement",          //translate "Advertisement" title to your language
                    skipAdvertisementText:"Skip advertisement",  //translate "Skip advertisement" button to your language
                    skipAdText:"You can skip this ad in",        //translate "You can skip this ad in" counter to your language
                    playBtnTooltipTxt:"Play",                    //translate "Play" to your language
                    pauseBtnTooltipTxt:"Pause",                  //translate "Pause" to your language
                    rewindBtnTooltipTxt:"Rewind",                //translate "Rewind" to your language
                    downloadVideoBtnTooltipTxt:"Download video", //translate "Download video" to your language
                    qualityBtnOpenedTooltipTxt:"Close settings", //translate "Close settings" to your language
                    qualityBtnClosedTooltipTxt:"Settings",       //translate "Settings" to your language
                    muteBtnTooltipTxt:"Mute",                    //translate "Mute" to your language
                    unmuteBtnTooltipTxt:"Unmute",                //translate "Unmute" to your language
                    fullscreenBtnTooltipTxt:"Fullscreen",        //translate "Fullscreen" to your language
                    exitFullscreenBtnTooltipTxt:"Exit fullscreen",//translate "Exit fullscreen" to your language
                    infoBtnTooltipTxt:"Show info",                 //translate "Show info" to your language
                    embedBtnTooltipTxt:"Embed",                  //translate "Embed" to your language
                    shareBtnTooltipTxt:"Share",                  //translate "Share" to your language
                    volumeTooltipTxt:"Volume",                   //translate "Volume" to your language
                    playlistBtnClosedTooltipTxt:"Show playlist", //translate "Show playlist" to your language
                    playlistBtnOpenedTooltipTxt:"Hide playlist", //translate "Exit fullscreen" to your language
                    facebookBtnTooltipTxt:"Share on Facebook",   //translate "Share on Facebook" to your language
                    twitterBtnTooltipTxt:"Share on Twitter",     //translate "Share on Twitter" to your language
                    googlePlusBtnTooltipTxt:"Share on Google+",  //translate "Share on Google+" to your language
                    lastBtnTooltipTxt:"Go to last video",        //translate "Go to last video" to your language
                    firstBtnTooltipTxt:"Go to first video",      //translate "Go to first video" to your language
                    nextBtnTooltipTxt:"Play next video",         //translate "Play next video" to your language
                    previousBtnTooltipTxt:"Play previous video", //translate "Play previous video" to your language
                    shuffleBtnOnTooltipTxt:"Shuffle on",         //translate "Shuffle on" to your language
                    shuffleBtnOffTooltipTxt:"Shuffle off",       //translate "Shuffle off" to your language
                    nowPlayingTooltipTxt:"NOW PLAYING",          //translate "NOW PLAYING" to your language
                    embedWindowTitle1:"SHARE THIS PLAYER:",      //translate "SHARE THIS PLAYER:" to your language
                    embedWindowTitle2:"EMBED THIS VIDEO IN YOUR SITE:",//translate "EMBED THIS VIDEO IN YOUR SITE:" to your language
                    embedWindowTitle3:"SHARE CURRENT VIDEO:",    //translate "SHARE CURRENT VIDEO:" to your language
                    copyTxt:"Copy",
                    copiedTxt:"Copied!",
                    youtubePlaylistID:"",                        //automatic youtube playlist ID (leave blank "" if you want to use manual playlist) LL4qbSRobYCjvwo4FCQFrJ4g
                    youtubeChannelID:"",                         //automatic youtube channel ID (leave blank "" if you want to use manual playlist) UCHqaLr9a9M7g9QN6xem9HcQ
                    
                    //manual playlist
                    videos:[
                        
                        {
                            videoType:"HTML5",
                            title:"Video title",
                            mp4:"http://creativeinteractivemedia.com/player/videos/Pieces.mp4",
                            enable_mp4_download:"no",
                            imageUrl:"images/preview_images/poster2.jpg",
                            imageTimer:4,
                            prerollAD:"yes",
                            prerollGotoLink:"http://codecanyon.net/",
                            preroll_mp4:"http://creativeinteractivemedia.com/player/videos/Short_Elegant_Logo_Reveal.mp4",
                            prerollSkipTimer:5,
                            midrollAD:"no",                                                                 
                            midrollAD_displayTime:"00:10",                                                   
                            midrollGotoLink:"http://codecanyon.net/",                                         
                            midroll_mp4:"http://creativeinteractivemedia.com/player/videos/Logo_Explode.mp4",
                            midrollSkipTimer:5,   
                            postrollAD:"no",                                                               
                            postrollGotoLink:"http://codecanyon.net/",                                       
                            postroll_mp4:"http://creativeinteractivemedia.com/player/videos/Logo_Light.mp4", 
                            postrollSkipTimer:5,popupImg:"images/preview_images/popup.jpg",                                     
                            popupAdShow:"no",                                                               
                            popupAdStartTime:"00:03",                                                         
                            popupAdEndTime:"00:07",                                                         
                            popupAdGoToLink:"http://codecanyon.net/",
                            description:"Video description goes here.",
                            thumbImg:"images/thumbnail_images/pic1.jpg",
                            info:"Video info goes here.<br>This text can be <i>HTML formatted</i>, <a href='http://codecanyon.net/user/_zac_' target='_blank'><font color='008BFF'>find out more</font></a>.<br>You can disable this info window in player options. <br><br>Lorem ipsum dolor sit amet, eu pri dolores theophrastus. Posidonium vituperatoribus cu mel, cum feugiat nostrum sapientem ne. Vis ea summo persius, unum velit erant in eos, pri ut suas iriure euripidis. Ad augue expetendis sea. Ne usu saperet appetere honestatis, ne qui nulla debitis sententiae."
                        }
                    ]
                });
            });
        </script>
    </head>
    
    <body>
        <!--example: fitToContainer-->
        <!-- <div id="container" style="position:absolute;width:1006px;height:420px;margin:5% auto;left:50%;margin-left:-503px;background:#000000">
          <div id="Elite_video_player"></div>
        </div> -->
    
        <!--example: fixedSize or fitToBrowser-->
        <div id="Elite_video_player"></div>
    </body>
    
    </html>
    И теперь сам вопрос: Как подружить с движком.