Download mediaelement plugins - mediaelement plugins download de código fonte

mediaelement plugins

Código fonte FLASH

5.0.0

Baixar

Plugins mediaElement.js

Este repositório contém plugins construídos para medialementjs.

Autor (s): John Dyer https://j.hn/ e Rafael Miranda https://github.com/rafa8626
Site: https://www.mediaelementjs.com
Licença: MIT
Colaboradores: Todos os colaboradores

Índice

Instalação
Diretrizes para contribuir
- Node.js
- Convenções gerais
- Modelo para criar um recurso
- Modelo para traduções
- Uma palavra no ES6 para recursos
Plugins disponíveis

* Mudanças importantes na versão `2.3.0`

Como parte das melhorias contínuas do jogador, decidimos reduzir completamente o suporte para o IE9 e o IE10, já que a participação de mercado desses navegadores é de 0,4%, de acordo com https://caniuse.com/usage-table.

Essa mudança é para os repositórios de plug -ins de MediaElement e MediaElement Plugins .

Instalação

Faça o download do pacote de https://github.com/mediaelement/mediaelement-plugins e faça referência a todos os plugins necessários da pasta dist e adicione qualquer configuração relacionada ao plug-in.

Ou você pode usar um CDN; Verifique https://cdnjs.com/libraries/mediaelement-plugins.

Por exemplo, se você deseja instalar o plug -in Speed , faça o seguinte:

 < script src =" /path/to/mediaelement-and-player.min.js " > </ script >
<!-- Include any languages from `build/lang` folder -->
< script src =" /path/to/dist/speed/speed.min.js " > </ script >
<!-- Translation file for plugin (includes ALL languages available on player)-->
< script src =" /path/to/dist/speed/speed-i18n.js " > </ script >
< script >
    var player = new MediaElementPlayer ( 'playerId' , {
        defaultSpeed : 0.75 ,
        // other configuration elements
    } ) ;
</ script >

Alguns deles conterão estilos CSS, então coloque -os após a folha de estilo do jogador principal:

 < link rel =" stylesheet " href =" /path/to/mediaelementplayer.min.css " >
< link rel =" stylesheet " href =" /path/to/dist/speed/speed.min.css " >

Diretrizes para contribuir

Node.js

Faça o download em https://nodejs.org/ e siga as etapas para instalá -lo ou instalar node.js com npm .

Depois de instalado, no prompt de comando, digite npm install , que baixará todas as ferramentas necessárias.

Convenções gerais

O tamanho da guia é 8 para o recuo.
Sempre faça alterações nos arquivos no diretório /src/ e nunca no diretório /dist/ . Isso ocorre com o único objetivo de facilitar a operação de fusão (e ainda mais, a compilação) e ajudar as pessoas a ver as mudanças mais facilmente.
Use Convenções JSDOC para documentar o código. Isso facilita as contribuições de outros desenvolvedores e garante mais qualidade no produto.
Antes de pressionar quaisquer alterações, execute npm run eslint para garantir a qualidade do código.
O arquivo para o recurso deve ser colocado dentro de uma pasta que corresponda ao nome, bem como a qualquer elemento SVG/CSS necessário (ou seja, loop/loop.js ).
Atualize package.json com um comando na configuração script para garantir que ele seja agrupado e compilado corretamente. Para mais referência, revise o arquivo.
Certifique-se de criar um arquivo docs/FEATURE_NAME.md descrevendo seu objetivo, API etc. e adicione o nome com um link ao seu documento no arquivo README para manter a documentação atualizada.
Não reinvente a roda : use os utilitários que MediaElement prevê para manipulação de dom/ajax/etc. Verifique este link para obter mais detalhes.
Você também pode incluir o CSS dentro da pasta de recursos, corresponder ao nome do arquivo JS do recurso e adicionar estilos CSS para "Legacy" e Convenção de Nomeação do LEBE.
Se estiver usando um ícone, seu tamanho deve ser de 20x20px , por isso corresponde a todas as restos das dimensões dos ícones.

. mejs__ [ feature_name ] , . mejs- [ feature_name ] {
    // all your styles
}

Modelo para criar um recurso

 'use strict' ;

/**
 * [Name of feature]
 *
 * [Description]
 */

// If plugin needs translations, put here English one in this format:
// mejs.i18n.en["mejs.id1"] = "String 1";
// mejs.i18n.en["mejs.id2"] = "String 2";

// Feature configuration
Object . assign ( mejs . MepDefaults , {
    // Any variable that can be configured by the end user belongs here.
    // Make sure is unique by checking API and Configuration file.
    // Add comments about the nature of each of these variables.
} ) ;


Object . assign ( MediaElementPlayer . prototype , {

    // Public variables (also documented according to JSDoc specifications)

    /**
     * Feature constructor.
     *
     * Always has to be prefixed with `build` and the name that will be used in MepDefaults.features list
     * @param {MediaElementPlayer} player
     * @param {HTMLElement} controls
     * @param {HTMLElement} layers
     * @param {HTMLElement} media
     */
    build [ feature_name ] ( player , controls , layers , media ) {
        // This allows us to access options and other useful elements already set.
        // Adding variables to the object is a good idea if you plan to reuse
        // those variables in further operations.
        const t = this ;

        // All code required inside here to keep it private;
        // otherwise, you can create more methods or add variables
        // outside of this scope
    } ,

    // Optionally, each feature can be destroyed setting a `clean` method

    /**
     * Feature destructor.
     *
     * Always has to be prefixed with `clean` and the name that was used in MepDefaults.features list
     * @param {MediaElementPlayer} player
     * @param {HTMLElement} controls
     * @param {HTMLElement} layers
     * @param {HTMLElement} media
     */
    clean [ feature_name ] ( player , controls , layers , media ) { }

    // Other optional public methods (all documented according to JSDoc specifications)
} ) ;

Modelo para traduções

Se as strings traduzíveis fizerem parte do plug-in, você precisará criar um arquivo [feature_name]-i18n.js com este formato:

 'use strict' ;

if ( mejs . i18n . ca !== undefined ) {
        mejs . i18n . ca [ "mejs.id1" ] = "" ;
}
if ( mejs . i18n . cs !== undefined ) {
        mejs . i18n . cs [ "mejs.id1" ] = "" ;
}
// And the rest of the languages

NOTA : Quanto mais idiomas forem integrados no MediaElementPlayer , maior esse modelo.

Além disso, se você estiver adicionando um novo idioma ao MediaElementPlayer , precisará adicioná -lo a todos os arquivos i18n existentes da mesma maneira descritos no modelo acima.

Uma palavra no `ES6` para recursos

Todos os recursos são escritos usando as especificações Ecmascript 2015 .

Consulte src/ Diretório e verifique como os arquivos foram gravados para garantir a compatibilidade.

NOTA : O loop for...of poderia ter sido usado, mas para agrupar e reduzir o tamanho dos arquivos agrupados, é altamente recomendável evitar seu uso.