FAQ

In this section you will find information on common questions connected with using the player

Getting Started

Quickstart Guide

Registration

To register, use the «Login» button. Enter your email and password or log in using one of the social networks.

Player

In «Players», you can configure the default player, or create a new one. To edit a player, click on the ‘pencil’ icon.

Adding Videos

To add a new video, go to «Video» and then click «add». Enter the direct file link address, or a link from one of the supported services (such as Youtube). Name the newly uploaded video. If necessary, fill in the additional fields and click «Finish». To obtain the final code of the player move the cursor to the added video and click on the central icon. In the pop-up window, copy the code and paste it into your player on your website.

Playlist

To create a new playlist, go to the appropriate section. At the top of the page, enter the name of the playlist and select a player to use, then click Finish. To add to a playlist, click the central icon and then click "Add". To obtain the code of the playlist, move the cursor to the folder with the added videos and press the center button. Copy the code in the pop-up window and paste it into the player on your website.

Inserting your player onto your website

On your website you can use the code of a player you created on Spruto.com. In edit mode, paste the code of the player into your page’s html code and choose the particular location where you want the player to appear.

Video is not working

  • Check if the link to the video is entered correctly.
  • Check the address of the video to to be played 'http://video.domain.com/video.mp4' (parameter set_video1_url) and make sure that the link to the video is working.
  • Make sure that the player doesn’t have an error code

    Embed-code example:

    <embed src='http://s3.spruto.org/embed/player.swf' type='application/x-shockwave-flash' allowfullscreen='true' allowScriptAccess='always' width='640' height='360' flashvars='set_video1_url=http%3A%2F%2Fvideo.domain.com%2Fvideo.mp4&set_title_text=Example%20video%20title&set_posterUrl=http%3A%2F%2Fposter.domain.com%2Fposter.jpg'/>

    Embed-code example:

    You need to connect the script to insert a player on this page http://s3.spruto.org/embed/player.js by adding the following tag:

    <script type='text/javascript' src='http://s3.spruto.org/embed/player.js'></script>

    The player itself is placed using the following code:

    <script class='splayer'> var params = { 'Language': 'en', 'VideoURL': 'http://video.domain.com/video.mp4', 'Width': 640, 'Height': 360, 'ColorScheme': 'light', 'Autoplay': true }; player.embed(params); </script>
  • Ensure in the player’s code that the path to the file is written correctly: http://s3.spruto.org/embed/player.js

Video not working on mobile devices

If the Spruto player logo appears on mobile devices, but the video does not work, make sure that your site is using the JS-code player.

JS-code example:

<script type='text/javascript' src='http://s3.spruto.org/embed/player.js'></script> <script class='splayer'> var params = { 'playlist': [{ 'video': [{ 'url': 'http://p.spruto2.pulter.netdna-cdn.com/vod/spruto2.pulter/promo.mp4' }], 'duration': 0, 'posterUrl': 'http://s3.spruto.org/images/Sps_02_spruto_player_screen_1024.jpg' }], 'uiLanguage': 'ru', 'width': '640', 'height': '360' }; player.embed(params); </script>

Full video file isn’t loading

The video’s metadata is not located at the beginning and end of the file (as required for online playback). To transfer the metadata to the beginning of the file, use the MP4Box tool or qt-faststart for ffmpeg to relocate the placement of the metadata.

Video Hosting

  • Using standard, private website hosting for storing and serving your videos. Using your own hosting allows you to upload and serve your videos in thier original quality (no upload limits). Your videos won’t have third-party logos (such as Youtube’s logo) and will be advertising free. Using your own hosting provides everything you need to show the video but the main issue is playback speed as most website hosting accounts are designed for the transfer of small amounts of data and video will stream slowly and buffer.
  • Video delivery using a CDN (Content Delivery Network). Professional video hosting via a CDN uses multiple servers in multiple locations to distribute your content and calculates the shortest path from the user to the nearest server. This reduces ‘latency’ and each server has a large channel allowing it to put through your video to the end viewer quickly. Payment for CDN’s are usually based on the amount of video that you stream. The more data you stream (video views times video size), the more expensive using a CDN becomes. Using a CDN is a must for bigger sites that stream large amounts of video (such as video portals).

Using third-party video hosting (Vimplevideo.com, YouTube.com, Myvi.ru)

We recommend using Vimplevideo.com video hosting to store and server your videos.

Spruto automatically processes and serves videos via links from Vimplevideo.com, YouTube.com and Myvi.ru. To create a player, just insert a link to a video from one of the supported services.

Features

Skins

You can choose from three types of players. Each of them has a unique design. Note that when you use the "Classic" skin, there is no hiding of the player buttons.

Preview

The ‘preview’ is the picture that shows before and after video playback. It is a thumbnail that represents the content of the video.

How to create a video screensaver before a video clip?

To add a video in your video screensaver that will be displayed before the video clip, create a playlist that contains 2 videos.

First video – your screensaver

Second video – your clip

When creating your playlist, ensure that you add the videos in the correct order.

Preview smoothing

If your video preview image does not match the size of the player container, it will be automatically reduced to an appropriate size.

In this case, if the player file and image file are on different domains, the security policy of Adobe Flash will not allow direct access to the file image, and therefore, the image will be reduced without smoothing. Smoothing (also known as anti-aliasing) is a technique used to add greater realism to a digital image by smoothing jagged edges on curved lines and diagonals to make the image look nicer.

Example of the image without smoothing:

Example of the image without smoothing

The only way for the flash-player to perform smoothing on preview images, is to place the file titled crossdomain.xml in the root directory of the site (detailed specification for this file can be found on the official website of Adobe).

Example image with smoothing:

Example image with smoothing

Player design

Once you have decided which of the 3 player designs to use, you can customize its color scheme. To adjust the color, choose from the color palette or enter the desired color’s number.

Adjusting the player’s size.

Interface

In the interface setting you can select which player buttons need to be displayed. In this section, you can select the language for the player.

Management

Adjust the player display before and after playback. When creating a playlist, you can choose what will be displayed in the player: a playlist or a preview.

HTML5 + FLASH

Spruto generates a player in two formats:

  1. Flash- the code loads the Flash-player version. Videos will not play on mobile devices lacking support for Flash (such as the Apple iOS system).

  2. JS - universal code that allows the system to identify the device that is loading the player and choose the correct player type for playback (i.e. flash for desktop playback and HTML-5 for mobile devices).

Playlists

  • To create a playlist via Spruto.com, go to the “Playlists” section and create or enter the necessary video folder. Next, get the code, by clicking the the created video folder.
  • To manually adjust the playlist, use the following parameters:

    In your JS player code:

    1. playlist [{...},{...}, ...] - a list of videos that should play in the player, including additional parameters to display them in your player (order, etc).

    Via an embed player:

    The playlist is set using the following parameters:

    • set_pl{playlist_index}_video{video_index}_url - url video element playlist.
      • {video_index} - the index of the associated playlist. Numbering starts at 1.

How to install the Spruto player on your site?

There are 2 ways to install the Spruto player:

With the help of spruto.com

  • Use the button "Login" to register.
  • Enter your email and password or login using one of the social networks.
  • In "Players", you can configure the default player, or create a new one. To edit a player, click on the icon looking like a pencil.
  • To add a new video, go to "Video" and then click "add". Enter the direct file link address, or a link to one of the supported services. Add the name of the new video.
  • If needed, fill in the additional fields and click "Finish." To obtain the final code of the player move the cursor to the added video and click on the central icon. In the pop-up window, copy the code and paste it into your player on your site or in edit mode, paste the code of the player into the desired location on your page.

If you want to download and install the player on your site:

  • Download the player from Spruto.com
  • Upload the player files to your site. Example: http://mysite.com/player.js
  • Customize the player using the documentation

    JS-code example:

    You need to add the script http://s3.spruto.org/embed/player.js in order to insert a player on the page by adding:

    <script type='text/javascript' src='http://s3.spruto.org/embed/player.js'></script>

    The player is posted with the following code:

    <script class='splayer'> var params = { 'Language': 'en', 'VideoURL': 'http://video.domain.com/video.mp4', 'Width': 640, 'Height': 360, 'ColorScheme': 'light', 'Autoplay': true }; player.embed(params); </script>

    A player placed with this code will display in English. The parameter 'ColorScheme: light' is set to use the light instead of dark color scheme (used by default). The video will start playing as soon as the page is loaded ('Autoplay': true)

SPRUTO - FAQs