Page 1

Este documento foi esrito para um webdesigner, desenvolvedor, ou outra pessoa que está interessada em utilizar o Customer Portal para construir uma experiência de suporte no site de sua empresa.

Overview:

O Customer Portal do RightNow permite as organizações entregar experiências superiores através da web fornecendo um framework robusto e escalável e um set de ferramentas flexíveis para Designers, Desenvolvedores e Content Owners

Framework e Arquitetura

O Customer Portal utiliza tecnologia comum e baseadas em padrões de mercado dentro do seu framework. Estas tecnologias incluem:  PHP – Do lado do servidor linguagem de script  CodeIgniter – Do lado do servidor framework de aplicativo PHP  Yahoo User Interface (YUI) – Do lado do cliente biblioteca JavaScript


 Widgets – HTML, CSS, JavaScript e código PHP que é fornecido em um objeto utilizável  Páginas – HTML, CSS e XML para a construção do website  Templates – O Wrapper ou chrome do HTML e CSS em volta das páginas e widgets  WebDav – Extensão do protocolo HTTP que permite os usuários editar e gerenciar os arquivos do Customer Portal

Figura 1 - Customer Portal Framework

REFERÊNCIA DE IMPLEMENTAÇÃO

O Customer Portal vem com uma série de páginas para auto-atendimento, chamada de referência de implementação. Esta referência é uma série de templates, css, imagens e páginas construídas dos widgets padrão, e incorpora as melhores práticas para um auto-atendimento online. Isto foi identificada com entrevistas em primeira mão e testes de usabilidade.


Construíndo Sites com o Customer Portal Dentro do paradigma MVC (Model-View-Controller), os inputs do usuário, a modelagem do ambiente externo e o feedback visual para o usuário são explicitamente separados e manuseados por três tipos de objetos, cada um especializado para sua tarefa. A visualização gere a saída gráfica ou textual para a porção de bitmap exibidos que está atribuída a sua aplicação. O controlador interpreta os inputs de mouse e teclado do usuário, comandando o modelo ou a vista para mudar conforme cada caso. Finalmente o modelo gerencia o comportamento e os dados do domínio da aplicação, responde aos pedidos por informação sobre seu estado (gerealmente do ponto de vista), e responde a instruções para mudar de estado (geralmente a parte do controlador). O comportamento do MVC é então herdado, adicionado e modificado conforme necessário para proporcionar um sistema flexível e poderoso.

Figura 2 - Customer Portal Model-View-Controller Architecture


Widgets, Páginas, Templates e Recursos

Uma página construída com o Customer Portal pode conter ou utilizar o seguintes: Templates, Páginas, Widgets e Recursos. Abaixo descrevo um pouco de cada:  Templates – Um documento que costuma possuir HTML, CSS e RightNow XML para construção do wrapper (invólucro) ou aparência da página. Construindo templates permite encapsular várias páginas com a marca do mesmo site. Os templates são editados na development área do Customer Portal  Páginas – Um documento que contém HTML, CSS e RightNow XML para a construção de uma página navegável. As páginas são editadas na development área do Customer Portal.  Recursos – Arquivos que estão tipicamente incluídos dentro de Templates, Páginas ou Widgets. Recursos podem incluir CSS, JavaScript, imagens, vídeos e outras web media ricas. Recursos residem dentro da pasta Assets(recursos) e são compartilhados entre development e produção.


Taxonomia do site Dentro do Customer Portal o diagrama abaixo explica a convenção de nomes e a construção da página utilizando widgets, páginas e templates

Figura 3 - Taxonomia da Página

Customer portal – Componentes do lado do servidor O Customer Portal vem com 12 modelos que são utilizados para interagirem com o banco de dados do RightNow. Cada modelo é uma classe de PHP que estende o modelo de framework e expõe os métodos comum que seriam utilizados para aquela tabela ou funcionalidade particular. Modelos personalizados podem ser escritos dentro do


Customer Portal e permitem integração com sistemas terceiros do lado do servidor. Modelos padrão também podem ser utilizados dentro dos modelos personalizados para interagiram com o banco de dados do RightNow.

<?php class Sample_model extends Model { function __construct() { parent::__construct(); //This model would be loaded by using $this->load->model(‘custom/Sample_model’); } function sample_function($var1, $var2) { // This function would be executed by using $this->Sample_model->sample_function() // calling a third party system to retrieve data. This function could use cURL to connect to a service. $output = getNewData($var1, $var2); // $output will be returned to the controller of the widget or the controller that has called the model return $output; } } Modelo de Código 1 (Modelo do Customer Portal)

<?php if (!defined(‘BASEPATH’)) exit(‘No direct script access allowed’); class Sample extends Widget { function Sample() { parent::Widget(); // attributes would be defined here


} // Calling a custom model from the controller of a widget. This is done in the getData method. function getData($data) { $var1 = “Hello”; $var2 = “World”; $this->CI->load->model(‘custom/Sample_model); // Calling method within the model and storing the results in $data $data = $this->CI->Sample_model->sample_function($var1, $var2); // Sending the data back to the view of the controller return $data; Modelo de Código 2 (Invocando um modelo personalizado via widget)

Controllers (Controladores) Controladores no Customer Portal são simplesmente arquivos de classe que podem ser utilizados através de uma URL. Controladores são geralmente utilizados para enviar dados do cliente para o lado do servidor atráves de uma requisição AJAX. Esta requisição é feita de dentro do arquivo lojic.js de um widget. O Customer Portal do RN vem com controladores padrão e tem a possibilidade de adicionar controladores personalizados dentro do diretório /euf/developement/controllers. Abaixo temos um exemplo de um controlador padrão.

<?php class ajaxCustom extends ControllerBase { //This is the constructor for the custom controller. Do not modify anything within //this function. function __construct() { parent::__construct(); } /** * Sample function for ajaxCustom controller. This function can be called by


* sending a request to /ci/ajaxCustom/ajaxFunctionHandler. */ function ajaxFunctionHandler() { $postData = $this->input->post(‘post_data_name’); //Perform logic on post data here echo $returnedInformation;

Exemplo de código 3 (Customer Portal Controller)

Integração Hooks (Ganchos) Os ganchos permitem a interação da parte interna do framework do Customer Portal sem modificar os arquivos core. No Customer Portal, o principal uso dos ganchos é de executar códigos personalizados antes ou depois de um evento importante do sistema. Os ganchos podem ser utilizados para modificar dados, executar códigos personalizados e retornam mensagens de erro personalizadas. Events (JavaScript) Um modelo de evento foi construído dentro do Customer Portal do RN para permitir a inscrição e disparar eventos a partir de um arquivo logic.js dentro de um widget. Este modelo de eventos foi construído em cima do utilitário de ventos YUI. Por exemplo, dentro de uma página você pode ter um widget para subscrever um evento particular. Outro widget nesta mesma página pode disparar um evento quando uma determinada ação ocorrer. De widgets personalizados você também pode se inscrever para uma lista de eventos que são disparados dentro de widgets padrão. Abaixo enconcontram-se alguns dos eventos do Customer Portal padrão que podem ser subscrevidos.


Keyword evt_keywordChangedRequest evt_searchFiltersResponse Searching evt_beforeSearchRequest evt_searchInProgressRequest evt_reportResponse

Events (Javascript) – Exemplos

O exemplo a seguir mostra o evento evt_beforeSearchRequest sendo subscrevido para dentro do arquivo logic.js de um widget personalizado. Uma situação onde se inscrevendo para este evento seria usado como se as palavras-chave de uma busca na base de conhecimento quisessem ser capturadas e utilizadas para outra finalidade. Abaixo está um exemplo de subscrição de um evento de um arquivo de lógica widget.

RightNow.Widget.SampleWidget = function(data, instanceID){ this.data = data; this.instanceID = instanceID; this._eo = new RightNow.Event.EventObject(); this._contentName = “rn_” + this.instanceID + “_Content”; this._loadingName = “rn_” + this.instanceID + “_Loading”; if (RightNow.Event.isHistoryManagerFragment()) this._setLoading(true); RightNow.Event.subscribe(“evt_beforeSearchRequest”, this.updateSearches, this); RightNow.Event.subscribe(“evt_searchInProgressRequest”, this._searchInProgress, this); this._setFilter(); RightNow.Event.fire(“evt_setInitialFiltersRequest”, this._eo); };

Exemplo de código 4 (Events)


Quando este evento for disparado, a função updateSearches() dentro deste widget será executada. Abaixo está a função na qual os termos de busca são capturados e enviados para um controlador personalizado onde um processamento adicional pode ocorrer. Se for bem sucedido, a função searchSuccess() será executada.

updateSearches: function(type, args) { var keywords = args[0].filters.keyword.data; if (keywords) { var post = {}; post[“keywords”] = keywords; post[“version”] = this.data.attrs.version; post[“url”] = this.data.attrs.url; RightNow.Ajax.makeRequest(“/cc/ajaxCustomSearch/getSearch”, post, {successHandler: this.searchSuccess, scope: this}); } },

Exemplo de código 5 (Events)

Implementação Construindo templates, páginas e widgets personalizados no Customer Portal, tudo isso é feito dentro de uma sandbox de desenvolvimento. Dentro do Custom Portal Tag Gallery é possível definir um cookie para determinar se você quer ou não ver as página em desenvolvimento ou produção. Isso permite o desenvolvimento ou mudança para funcionalidades existentes no banco de dados existente, não afetando as páginas de produção. Quando todo o desenvolvimento for finalizado e testado, um utilitário de implementação localizado na conta de Adminstrador do RN pode ser utilizada para dar o go live. Durante a implementação os arquivos são verificado quanto a erros e a minimização é feita em arquivos CSS e JavaScript.

RightNow  

Rightnow documentação