PHPackages                             buttflattery/yii2-videowall - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. buttflattery/yii2-videowall

ActiveYii2-extension[Utility & Helpers](/categories/utility)

buttflattery/yii2-videowall
===========================

A Yii2 plugin to display a video wall for videoJS player, and create different layouts for video wall like carousel, thumbnails and playlists.

1.0.0(7y ago)4844↓100%1PHPPHP >=5.4.0

Since Oct 2Pushed 7y ago1 watchersCompare

[ Source](https://github.com/buttflattery/yii2-videowall)[ Packagist](https://packagist.org/packages/buttflattery/yii2-videowall)[ RSS](/packages/buttflattery-yii2-videowall/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (1)Dependencies (2)Versions (3)Used By (0)

Yii2-VideoWall(v1.0)
====================

[](#yii2-videowallv10)

### What is this repository for?

[](#what-is-this-repository-for)

A Yii2 plugin based on [idows-videojs-videowall](https://github.com/buttflattery/idows-videojs-videowall) that creates a Video Wall for VIDEOJS video player using three different modes.

- Carousel (Default)
- Thumbnail
- Playlist

[![delete-single-files](https://camo.githubusercontent.com/dc5f5afedc0f543e758ef6a8a0b1ced71ba24b80b8c6624077f419c38c817b25/68747470733a2f2f79696932706c7567696e732e69646f7773746563682e636f6d2f7468656d652f6173736574732f696d672f766964656f2d77616c6c2e6a7067)](https://camo.githubusercontent.com/dc5f5afedc0f543e758ef6a8a0b1ced71ba24b80b8c6624077f419c38c817b25/68747470733a2f2f79696932706c7567696e732e69646f7773746563682e636f6d2f7468656d652f6173736574732f696d672f766964656f2d77616c6c2e6a7067)

For details on the javascript plugin you can visit the link

### External Libraries Used

[](#external-libraries-used)

- [Idows VideoJS-VideoWall](https://github.com/buttflattery/idows-videojs-videowall).
- [VideoJs](http://videojs.com/) Library
- [MustacheJS](https://github.com/janl/mustache.js/) for Templating
- [jQuery v2.2.4](https://jquery.com/download/)
- Fontawesome
- [kartik-v/yii2-widget-select2](https://github.com/kartik-v/yii2-widget-select2)
- [Bootstrap v3.3.7](https://getbootstrap.com/docs/3.3/)

### DEMOS

[](#demos)

- [Carousel](http://yii2plugins.idowstech.com/videowall/carousel)
- [Thumbnail](http://yii2plugins.idowstech.com/videowall/thumbnail)
- [Playlist](http://yii2plugins.idowstech.com/videowall/playlist)

### How do I get set up?

[](#how-do-i-get-set-up)

use composer to install the extension

```
php composer.phar require  buttflattery/yii2-videowall "@dev"

```

or add into the `composer.json` file under `require` section

```
"buttflattery/yii2-videowall":"@dev"

```

### Demos

[](#demos-1)

- [Carousel Mode](http://yii2plugins.idowstech.com/videowall/carousel).
- [Thumbnail Mode](http://yii2plugins.idowstech.com/videowall/thumbnail).
- [Playlist Mode](http://yii2plugins.idowstech.com/videowall/thumbnail).

### Available Options

[](#available-options)

- `videoTagOptions (array)`: Attributes for the the default video tag used by videoJs to initialize the player. You can pass the following options for the video tag.

    - `class` : Html class for the the video tag.
    - `width` : Width for the video tag.
    - `height` : Height for the video tag.
    - `setupOptions` : The setup options for the video tag used inside the `data-setup` attribute, below are few of the options commonly used by the videoJS player.
        - `controls` : Default value `true`.
        - `autoplay` : Default value `true`.
        - `preload` : Default value `auto`.
    - `poster (path)` : Path for the default poster for the video tag, use path relative to the web directory.
- `wallType (string)` :

    - `Videowall::TYPE_CAROUSEL` (carousel)
    - `Videowall::TYPE_THUMBNAIL` (thumbnail)
    - `Videowall::TYPE_PLAYLIST` (playlist)
- `slideShowDelay (milliseconds)` : integer, default value 2000 ms.
- `videoWallContainer (string)`: container class name for the video wall, default class `video-wall-container`.
- `containerId (string)` : container id for the video wall slides, default id prefix `video-wall-slides`.
- `containerClass (string)` : container class name for the video wall slides, default class `slides-container`.
- `helpImproveVideoJs (boolean)` : `true` or `false` used by the videoJS player.
- `thumbPageSize (int)` : page size for the thumbnails mode, default value `15`.
- `playlistPageSize (int)` : page size for the playlist model, default value `8`.
- `loadBootstrapAssets (boolean)` : select if plugin should load the bootstrap assets or use the globally registered yii bootstrap assets, by default this option is `false` and Yii2 default assets bundle is used.
- `bootstrapCssSource (url)` : url to the bootstrap css file for the plugin to load, this option is effective when you have `"loadBootstrapAssets"=>true`.
- `bootstrapJsSource (url)` : url to the boootstrap js file for the plugin to load, this option is effective when you have `"loadBootstrapAssets"=>true`.
- `select2Defaults (array)` : default options used for rendring the kartik-v\\yii2-select2 plugin, you override them and add you own too look into documentation for the options

    - `allowClear`: default value `true`.
    - `theme` : default value `default`.
    - `width` : default value `100%`.
    - `placeholder` : default value `Search Videos`.
    - `minimumInputlength` : default value `2`.
    - `dropdownCssClass` : default value `bigdrop`.
- `openOnStart (boolean)` : Select if the video wall is open when player is initialized, default value is `true`.
- `callback (function)`: a callback function called by the plugin after initialized.
- `clientEvents (array)` : an array of client events supported by the plugin, you can see the plugin [documentation](https://github.com/buttflattery/idows-videojs-videowall) for the supported events, you can use them like below

```
"pluginEvents"=>[
    'onBeforeNext' => 'function(event,dataObj){console.log(event);}',
]

```

### Usage 1 Carousel Mode

[](#usage-1-carousel-mode)

```