Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.
Nota
titleATENÇÃO

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

 

Índice
outlinetrue
stylenone
exclude.*ndice

Objetivo

Este guia é destinado aos desenvolvedores internos e externos do Fluig que desejam utilizar o componente CompartilharAlterar imagem de usuário e comunidade. O objetivo é apresentar o seu funcionamento e o detalhamento de todos os parâmetros de configuração.

Componente

O componente CompartilharAlterar imagem de usuário e comunidade tem como objetivo facilitar o processo de compartilhamento atualização de imagens de conteúdo perfil encapsulando todas as configurações básicas necessárias para o compartilhamentoessa atualização, restando para o desenvolvedor somente configurar o plugin e utilizar o callback para montar sua lógica de negócio.

Estrutura Básica

Bloco de código
themeEclipse
languagejs
titleEstrutura básica do componente
SOCIALBCWCMBC.sharecropImage(targetconfig, configcallback);

 

Como pode-se notar na estrutura básica, o componente recebe basicamente dois parâmetros, o primeiro, um objeto target que pode ser um objeto ou uma string config com as configurações do componente e o segundo as configurações para o componenteuma função callback contendo o erro e/ou o sucesso da atualização.

 

O primeiro parâmetro espera um objeto ou uma stringcontendo três atributos: aliastitle e types, onde os três parâmetros são opcionais.

Bloco de código
themeEclipse
languagejs
titleParâmetro config
var config - {
	alias: 'bruno.quadrotti', //alias do usuário/comunidade que Podeserá seratualizada um- objetoValor resultantedefault: dealias umdo seletor jquery:
var obj = $('#meu_seletor');
 
// Pode ser uma string de um seletor jquery:
var obj = '#meu_seletor'usuário logado.
	title: 'Atualização de imagem de comunidade', //título do modal de troca de imagem. - Valor default: Editar foto
	types: 'gif|jpg|jpeg|tiff|png' //string contendo as extensões permitidas para atualização separado por pipeline "|". - Valor default: jpg|jpeg|png
};

 

O segundo parâmetro espera um objeto com os uma função que recebe dois valores: showOnlyLink, sourceType, type, preview, link e paramIderror e data.

Bloco de código
themeEclipse
languagejs
titleParâmetro callback
function(error, data) {
	if(error) {
		//tratamento   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"de erro...
	}
	
	//lógica do sucesso...
}

Utilização Básica

Bloco de código
themeEclipse
languagejs
titleminhawidget.js
SOCIALBC.share('#seletor', {var UserPreferences = SuperWidget.extend({

	alias: null,
    showOnlyLinktype: falsenull,
	
	bindings:    sourceType: 'SOCIABLE',
    type: 'POST',
    preview: '<div>Miniatura</div>',
    link: 'http://servidor/portal/p/1/post/usuario/12',
    paramId: 12{
		local: {
			'update-image': ['click_updateImage']
		}
	},
	
	init: function() {
		this.type = 'gif|jpg|jpeg|png';
	},
	
	updateImage: function(el, ev) {
		var that = this;
		WCMBC.cropImage({
			alias: this.alias,
			types: this.type
		}, function(err, data) {
			if(err) {
				return alert(err.responseText);
			}
			
			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
themeEclipse
languagebash
titleapplication.info
application.resource.component.21=socialwcm/socialsharecropimage

 

Tela exibida ao chamar o componente:

Image Removed

Tela exibida ao selecionar a opção compartilhar:

Image Removed

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

Image Removed

...

:

Image Modified