## Usage

###Configuração
Para usar o funifier em produção, insira a seguinte linha na tag head de todas as paginas que deseja habilitar:


```html
 <script src="//client2.funifier.com/2.0.0/funifier.min.js" type="text/javascript"></script>
```


### Iniciação Async mode
Para iniciar o funifier de maneira assincrona, insira uma função antes do script do funifier:

```javascript
window.funifierAsyncInit = function(){
    Funifier.init({
        apiKey : 'SUA API KEY'
    });
};
```

Dessa maneira, assim que o funifier tiver sido processado, irá chamar a função 'funifierAsyncInit' caso exista.

### Iniciação Sync mode

Você pode inicializar também o funifier a qualquer momento após o carregamento do script do funifier chamando seu método de inicio:
```javascript
    Funifier.init({
        apiKey : 'SUA API KEY'
    });
```

#Documentação

##Componentes
O funifier tem algumas bibliotecas integradas, que pode ser usado em seus widgets/integrações, note no entanto, que as que tem o prefixo '_' são de uso do core do Funifier e por isso não tem garantia de estar presente numa versão futura.

Funifier contêm os seguintes componentes:

- [jquery](https://jquery.com/): `Funifier._$` 1.11.1
- [async](https://github.com/caolan/async): `Funifier._async`
- [lodash](https://lodash.com/): `Funifier._`
- [validator](https://github.com/chriso/validator.js): `Funifier._validator`
- [mustache](https://github.com/janl/mustache.js/): `Funifier._mustache`
- [headjs](http://headjs.com/): `Funifier.headjs`
- [magnificPopup](http://dimsemenov.com/plugins/magnific-popup/): `Funifier._$.magnificPopup`
- [qs](https://github.com/hapijs/qs): `Funifier._qs`

Para a documentação dos componentes acima, verifique no site do respectivo componente.

### Métodos
* [`init`](#init)
* [`listen`](#listen)
* [`unlisten`](#unlisten)
* [`api`](#api)
* [`track`](#track)
* [`auth`](#auth)
    * [`authenticate`](#authenticate)
    * [`isAuthenticate`](#isAuthenticate)
    * [`logout`](#logout)


---------------------------------------
### init(config, callback)

Utilizado para iniciar a api do funifier.
Recebe como parâmetro um objeto e um callback.

__config__
* `apiKey` : String - Apikey configurada no studio.
* `hideInline` : Boolean - Define a exibição do modo inline para admin. __default__ : false
* `showNotification`: Boolean - Exibir/ocultar as notificações. __default__ : true
* `disableCustomCss` : Boolean - Define se o funifier ira carregar o css dos widgets. __default__ : custom-{api_key}-v{version}.css.
* `disableCustomJs`: Boolean - Define se o funifier ira carregar o js com as funções de widgets. __default__ : custom-{api_key}-v{version}.js.
* `url`
    * `service` : String  - Url do service. __default__ : '//service2.funifier.com/2.0.0/'
    * `client` : String  - Url do client. __default__ : '//client2.funifier.com/2.0.0'
    * `studio` : String  - Url do studio. __default__ : '//studio2.funifier.com'
    * `css` : String  - Caminho de css para sobrescrever o padrão. __default__ : null
    * `js` : String  - Caminho do js para sobrescrever o padrão. __default__ : null

__callback__

Recebe uma função que é executada assim que o funifier terminou de inicializar os objetos para a apiKey informada, sendo, que ja carregou todas as dependencias, scripts e styles.

Parâmetros:
* `err` Recebe um erro caso tenha um

__Exemplo__

```js
Funifier.init({
    apiKey : 'SUA API KEY',
    hideInline: false,
    url : {
        css : 'http://www.meudominio.com/custom-css-replace.css'
    }
},function(err){
    if(err){
        console.log('Ocorreu um erro');
    }
});
```

---------------------------------------
### listen(name, callback)
Monitora um evento do funifier
* `name` : String - Nome do evento a ser monitorado
* `callback` : Function - Função a ser executada.

---------------------------------------
### unlisten(name)
Para remover eventos do funifier monitorados pelo listen.
* `name` : String - Nome do evento a excluir o listen.
* 
---------------------------------------
### api(endpoint,params,callback)
Método para comunicação com o service.

* `endpoint` : String - Metodo a ser requisitado no service.
* `params` : Object - Parâmetros a ser enviado para o service.
* `callback` : Function - retorno

__Exemplos__

```js
Funifier.api('get_leaderboard',
    {sort: 1, limit: 10, view: 0, group : 1},
    function(err,data){
        if(err==null){
            alert('Lista de leaderboards recebida')
            console.log(data);
        }else{
            alert('Ocorreu um erro :(')
        }
    }
);
```

```js
Funifier.api('get_widget_data',
    null,
    function(err,data){
        if(err==null){
            alert('Retorno recebido')
            console.log(data);
        }else{
            alert('Ocorreu um erro :(')
        }
    }
);
```

---------------------------------------
### api(endpoint,params,options,callback)
Método para comunicação com o service.

* `endpoint` : String - Metodo a ser requisitado no service.
* `params` : Object - Parâmetros a ser enviado para o service.
* `options` : Object - Parâmetros adicionais.
* `callback` : Function - retorno

__Exemplos__

```js
Funifier.api('get_leaderboard',
    {sort: 1, limit: 10, view: 0, group : 1},
    {type:'GET',contentType:'application/json'},
    function(err,data){
        if(err==null){
            alert('Lista de leaderboards recebida')
            console.log(data);
        }else{
            alert('Ocorreu um erro :(')
        }
    }
);
```


---------------------------------------
### track(options,callback)
Traqueia uma ação

__options__
* `action` : String - Id ou nome da action.
* `attributes` : Array - lista de atributos, opicional.

__callback__

Função executada apos o track.
* `err` - Recebe um erro ou nulo.
* `data` - Response do servidor.

__Exemplo__

```js
Funifier.track({
    action: 'visitarPagina'
},function(err,data){
    if(err==null){
        alert('Action traqueada')
    }
});
```

---------------------------------------
### auth
####authenticate(options,callback)
Função usada para autenticar jogadores.

__options__
* `auth_mode` : String - Tipo de autenticação, valores disponiveis.
    *   facebook
    *   google
    *   IMPLICIT
    *   PASSWORD
* `player` : String - Id do jogador, requerido para auth_mode 'IMPLICIT' e 'PASSWORD'. (String)
* `password` : String - Senha do jogador, requerido para auth_mode 'PASSWORD'
* `modal` : Boolean - Define se a autenticação via google ou facebook sera feita atraves de um popup, (opcional usado apenas para auth_mode 'google' e 'facebook')

__callback__

Função que de retorno. (Não é executada caso o auth_mode for facebook ou google e modal for igual a false )
* `err` - Recebe um erro ou nulo.
* `data` - Response do servidor:
    
__Exemplo Facebook__

```js
Funifier.auth.authenticate({
    auth_mode: 'facebook',
    modal: true
},function(err,data){
    if(err==null){
        alert('Seja bem vindo')
    }
});
```

__Exemplo via Senha__

```js
Funifier.auth.authenticate({
    auth_mode: 'PASSWORD',
    player: 'jogador1',
    password: 'pass@123'
},function(err,data){
    if(err==null){
        alert('Seja bem vindo')
    }
});
```

####isAuthenticate(callback)

Verifica se o jogador está autenticado.

__callback__
  * `isAuthenticate` :Bollean  
  
__Exemplo__

```js
Funifier.auth.isAuthenticate(function(_isAuthenticate){
    if(isAuthenticate){
        alert('Seja bem vindo, você está autenticado');
    }else{
        alert('Desculpe, faça login, você não está autenticado');
    }
});
```

####logout(callback)

Efetua logout do jogador.

__callback__
  * `err`
  * `data`

__Exemplo__

```js
Funifier.auth.logout(function(err){
    if(err==null){
        alert('Jogador deslogado com sucesso');
    }else{
        alert('Ocorreu um erro');
    }
});
```
  
  

## Widget

A estrutura basica de um widget:
```javascript
var ct = '<div><a href="#">Hello World!</a></div>'
render(ct,function(config){
 var elemento = config.element;
 elemento.find('a').click(function(){
    alert('Você clicou no link');
 });
});
```

O método render recebe uma string ou um objeto jquery e um metodo de retorno onde pode-se incluir eventos.

Dentro do script você tem acesso a variável 'json' ,'theme_html', '$' e 'jQuery'.
O jquery disponível no widget é um jquery do objeto Funifier, caso queira acessar o jquery da pagina, use window.$ ou window.jQuery.

A variável json está disponivel em alguns tipos de widgets.


Você pode usar o mustache para renderizar seu html.

```javascript
Funifier.auth.isAuthenticate(function(isAuthenticate) {
    json.isAuthenticate = isAuthenticate;
    var str = Mustache.render(theme_html,json);
    render(str,function(config){
        var el = config.element;
        //your code
    });
});
```
Você pode requisitar um recurso no servidor antes de renderizar.

```javascript
Funifier.auth.isAuthenticate(function(isAuthenticate) {
    Funifier.api('get_widget_data', 
        {
            include_teams: true,
            include_levels: true,
            include_challenges: true,
            include_catalogs: true,
            include_leaderboards: true,
            include_friends: true,
            include_actions: true,
            include_points: true,
            include_game: true
        }, function(err,json){
        json.isAuthenticate = isAuthenticate;
        var str = Mustache.render(theme_html,json);
        render(str,function(config){
            var el = config.element;
            //your code
        });
    });
});
```

## Debug

Por padrão o Funifier Client não exibe qualquer informação de error/info no console sendo necessário habilitar.
Para habilitar todas as mensagens do funifier, abra o console javascript e digite:

```javascript
 Funifier.debug.enable('*');
```

Você pode habilitar o log para mensagens específicas:
```javascript
 Funifier.debug.enable('Funifier:social:*');
```
```javascript
 Funifier.debug.enable('Funifier:core:*');
```
Caso queira desabilitar as mensagens:
```javascript
Funifier.debug.disable();
```