Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Índice

Nota
titleATENÇÃO

Esta página deverá se tornar filha de: Componentes de Negócio

Índice
outlinetruestylenone
exclude.*ndice
stylenone


Objetivo

...

Este guia é destinado aos desenvolvedores internos e externos do Fluig fluig que desejam utilizar o componente Compartilharcomponente Seleção de comunidades para recuperar a comunidade desejada e utilizá-la em seu componente ou widget. O objetivo é apresentar o seu funcionamento e o detalhamento de todos os parâmetros de configuração.

...


Pré-requisitos

...

Conhecer os conceitos dos componentes de negócio do fluig, disponíveis na página Componentes de Negócio.


Seleção de comunidades

...

O componente CompartilharSeleção de comunidades tem como objetivo facilitar o processo a etapa de compartilhamento de conteúdo seleção de uma ou mais comunidades, encapsulando todas as configurações básicas necessárias para o compartilhamentoessa operação, restando para o desenvolvedor somente configurar o plugin e utilizar o callback para montar sua lógica de negócio.


Estrutura Básica

...

A seguir é apresentada a estrutura básica do componente:

Bloco de código
languagejs
themeEclipselanguagejs
titleEstrutura básica do componente
SOCIALBC.shareselectCommunity(targetconfig, configcallback);

 

Como pode-se notar na estrutura básica, o O componente recebe basicamente dois parâmetros, :

  • o primeiro, um objeto 

...

  • config com as configurações do componente;
  • e o segundo, uma função callback contendo o erro e/ou o sucesso da seleção.

...


O primeiro parâmetro espera um objeto ou uma stringcontendo dois atributos: multiselect, e required, sendo os dois opcionais.

Bloco de código
language
languagejs
themeEclipse
jstitleParâmetro config
var config - {
	multiselect: true, // Pode ser um objeto resultante de um seletor jquery:
var obj = $('#meu_seletor');
 
// Pode ser uma string de um seletor jquery:
var obj = '#meu_seletor';

 

O segundo parâmetro espera um objeto com os valores: showOnlyLink, sourceType, type, preview, link e paramId.

Bloco de código
themeEclipse
languagejs
titleParâmetro callback
{
    showOnlyLink: "exibe apenas o link ex.:true or false,"
    sourceType: "tipo ex.:SOCIABLE,"
    type: "tipo do conteúdo ex.:POST,"
    preview: "uma miniatura do conteúdo que será compartilhado,"
    link: "url para acessar o recurso,"
    paramId: "id social"
}

Utilização Básica

Bloco de código
themeEclipse
languagejs
titleminhawidget.js
SOCIALBC.share('#seletor', {
    showOnlyLink: false,
    sourceType: 'SOCIABLE',
    type: 'POST',
    preview: '<div>Miniatura</div>',
    link: 'http://servidor/portal/p/1/post/usuario/12',
    paramId: 12
});
opção que determina se é possível a seleção de uma ou mais comunidades do componente. - Valor default: true
	required: true //opção que determina se a seleção de comunidade é uma etapa obrigatório no fluxo. - Valor default: false
};


O segundo parâmetro espera uma função que recebe dois valores: error e data.

Bloco de código
languagejs
themeEclipse
titleParâmetro callback
function(error, data) {
	if(error) {
		//tratamento de erro...
	}
	
	//lógica do sucesso...
}

Utilização Básica

...

A utilização básica do componente é apresentada a seguir:

Bloco de código
languagejs
themeEclipse
titleminhawidget.js
var GlobalSearch = SuperWidget.extend({

	alias: null,
	
	bindings: {
		local: {
			'select-comunity': ['click_selectCommunity']
		}
	},
	
	init: function() {
		//init essential params
	},
	
	selectCommunity: function(el, ev) {
		var that = this;

		SOCIALBC.selectCommunity({
			multiselect : false,
			required : true
		}, function(data) {
			that.someFunc(data);
		});
	},

	someFunc: function(data) {
		//Qualquer coisa com o retorno de sucesso...
	}
});

...


No application.info de seu widget, adicione o componente como dependência:

Bloco de código

...

code
language
bash
themeEclipselanguagebash
titleapplication.info
application.resource.component.21=social/socialshareselectcommunity


Tela exibida ao chamar o componente

...

Image Added

Image Removed

Tela exibida ao selecionar a opção compartilhar:

Image Removed

Mensagem exibida ao selecionar a opção copiar link:

Image Removed

Tela exibida ao selecionar a opção compartilhar sem possuir flash no navegador:

Image Removed