Instalação
Método Docker
Como requisito, basta instalar o Docker e o docker-compose.
# Clone ou baixe o repositório oficial do SiGE
curl -LO https://github.com/comsolid/sige/archive/master.zip
# Descompacte-o
unzip master.zip
# Entre na pasta sige-master
cd sige-master
# Rode o docker-compose para subir a stack completa
docker-compose up
Neste momento, a stack já deve estar disponível para acesso via navegador.
Acesse o endereço http://localhost:8080
Use as seguintes credenciais para o usuário administrador padrão:
- E-mail: [email protected]
- Senha: 123456
Método Convencional
Programas necessários:
- PostgreSQL;
- Apache HTTP Server:
sudo apt-get install apache2
; - php5:
sudo apt-get install php5 php5-pgsql libapache2-mod-php5
;- extensão intl:
sudo apt-get install php5-intl
; - extensão GD:
sudo apt-get install php5-gd
;
- extensão intl:
- Zend Framework;
- git (opcional);
Configuração
Base de dados
Schema da Base de dados
A instalação da base de dados é feita pelo arquivo ddl-schema.sql
. Abra o arquivo
e defina alguns parâmetros:
Encoding do servidor
SET client_encoding = 'LATIN1';
ou
SET client_encoding = 'UTF8';
Permissão ao usuário do banco de dados
REVOKE ALL ON SCHEMA public FROM PUBLIC;
REVOKE ALL ON SCHEMA public FROM postgres;
GRANT ALL ON SCHEMA public TO postgres;
GRANT ALL ON SCHEMA public TO PUBLIC;
Modifique postgres
para seu usuário.
Note que o script possui START TRANSACTION;
e ROLLBACK;
. Faça um teste inicial
e execute o script para se certificar que tudo irá correr bem. Por fim substitua
o comando ROLLBACK;
por COMMIT;
e execute novamente o script.
Observação:
Para PostgreSQL 9.2 para trás comentar a linha 12:
SET lock_timeout = 0;
Para isso basta colocar --
no início, dessa forma:
--SET lock_timeout = 0;
Esse comando faz parte das versões 9.3 para frente, mas não prejudica o uso de versões mais antigas.
Dados iniciais do sistema
A inserção dos dados iniciais pode ser encontrada em ddl-dados-iniciais.sql
.
Modifique as tabelas estado, instituicao, municipio e sala
de acordo com sua necessidade.
obs.: para base de dados que usam codificação LATIN1
utilize o script ddl-dados-iniciais-latin1.sql
.
As outras tabelas já estão devidamente preparadas.
Teste a execução de script e remova START TRANSACTION;
e ROLLBACK;
.
Criando um novo encontro
O primeiro passo para criar um encontro, e adicionar um registro na tabela encontro
da seguinte forma:
INSERT INTO encontro(nome_encontro, apelido_encontro, data_inicio, data_fim,
periodo_submissao_inicio, periodo_submissao_fim)
VALUES ('I Encontro de Software Livre', 'I ESL', '2013-11-07', '2013-11-09',
'2013-05-01', '2013-11-06');
obs.: a coluna ativo
será removida em breve.
Depois verifique o id_encontro
gerado e crie dois registros na tabela mensagem_email
,
um para cada mensagem de tipo_mensagem_email
:
INSERT INTO mensagem_email(id_encontro, id_tipo_mensagem_email,
mensagem, assunto, link)
VALUES (1, 1, 'Nome: {nome}, E-mail: {email}, Senha: {senha},
<a href="{href_link}" target="_blank">Clique aqui</a>',
'I ESL - Cadastro Encontro',
'http://www.esl.org/login');
obs.: Note que a mensagem
traz elementos dentro de {}
. Eles são utilizados no PHP
para substiruir valores reais, tornando a mensagem dinâmica.
Vale lembrar que a mensagem pode ser escrita em HTML. Coloque apenas tags referentes ao body
.
Outro ponto importante é configurar o enconding ao inserir um encontro e suas mensagens.
Para isso adicione SET client_encoding = 'LATIN1';
no início do insert.
Da mesma forma crie a mensagem de recuperação de senha:
INSERT INTO mensagem_email(id_encontro, id_tipo_mensagem_email,
mensagem, assunto, link)
VALUES (1, 2, 'Nome: {nome}, E-mail: {email}, Senha: {senha},
<a href="{href_link}" target="_blank">Clique aqui</a>',
'I ESL - Recuperar Senha',
'http://www.esl.org/login');
Por ser um exemplo, as mensagens ficaram uma muito parecida com a outra. Você deve adaptar de acordo com seu encontro.
obs.: esse passo serve somente para o primeiro encontro. Os demais podem ser criados
a partir do SiGE em /adim/encontro/criar/
.
SiGE
Baixando SiGE do Github para desenvolvimento
Para realizar clone da última versão do SiGE:
$ git clone https://github.com/comsolid/sige.git
obs.: é necessário instalar o git. No Ubuntu podemos instalar através do comando:
$ sudo apt-get install git
obs.: instale a partir do repositório somente se você está interessado em contribuir, estudar o código ou apenas testando.
Baixando versão estável SiGE
Procure pela versão mais atual do SiGE em:
https://github.com/comsolid/sige/releases
Renomeie a pasta para sige
caso necessário.
Instalando Dependências
A versão utilizada pelo SiGE é latest.
A instalação é do Zend é feita através do Composer.
Configurando VirtualHost
Para simular um host no mundo real que utiliza Zend precisamos criar um VirtualHost no apache.
Com o Apache devidamente instalado, crie um arquivo em /etc/apache2/sites-enable/
chamado sige
. Nele copie o seguinte conteúdo, modificando conforme necessidade:
<VirtualHost *:80>
ServerName sige.local
DocumentRoot /var/www/sige/public
<Directory "/var/www/sige/public">
AllowOverride All
</Directory>
</VirtualHost>
Adicionaremos o ServerName
ao /etc/hosts
:
127.0.0.1 localhost
# adicione a linha abaixo
127.0.0.1 sige.local
Obs.: este trecho deve ser feito apenas em ambiente de desenvolvimento.
Habilite o mod rewrite
do apache: $ sudo a2enmod rewrite
.
Reinicie o Apache: $ sudo service apache2 restart
.
Instalar o Zend no SiGE
A instalação é bem simples, apenas crie um link simbólico dentro do diretório do
projeto (daqui para frente chamadado de ${SiGE}
) em ${SIGE}/library
:
$ sudo su
# cd /var/www/sige/library
# ln -s /usr/local/lib/zend/library/Zend
Observação:
Caso você não tenha permissão para instalar bibliotecas no sistema, por exemplo se você contratou um
serviço externo, você pode copiar o Zend diretamente na pasta library
do SiGE. Faça:
$ cp -R /caminho/para/ZendFramework1.12.9/library/Zend ${SiGE}/library
Caso use FTP suba o diretório para o mesmo local.
TODO: explicar instalação mpdf http://mpdf1.com/manual/index.php?tid=509
Permitir escrita para HTMLPurifier e Captcha
É necessário dar permissão total a dois diretórios, faça:
$ cd ${SiGE}/library/HTMLPurifier/DefinitionCache/
$ mkdir Serializer
$ chmod 777 Serializer/
$ cd ${SiGE}/public/
$ mkdir captcha
$ chmod 777 captcha/
Configurar SiGE para ambiente de produção
$ cd ${SiGE}/public
$ nano .htaccess
Mude SetEnv APPLICATION_ENV development
para SetEnv APPLICATION_ENV production
.
Configurar conexão com base de dados
Com o projeto configurado vamos editar os parâmetros de conexão com o PostgreSQL.
Dentro do diretório do projeto abra o arquivo ${SiGE}/application/configs/application.ini
,
copie os dados para a seção [production]
(cole abaixo de autoloaderNamespaces[] = "Sige"
)
e edite os parâmetros abaixo:
resources.db.params.host = "localhost"
resources.db.params.dbname = "database"
resources.db.params.username = "postgres"
resources.db.params.password = "**secret**"
Configurar SMTP para envio de e-mail
Temos também que configurar o envio de e-mail para validar participantes, recuperação de
senhas, etc. Ainda no arquivo ${SiGE}/application/configs/application.ini
,
copie o trecho a seguir e cole logo abaixo dos dados da conexão com o banco. Edite o trecho:
resources.mail.transport.type = "smtp"; não precisa editar
resources.mail.transport.host = "smtp.esl.com"; servidor gmail: smtp.gmail.com
resources.mail.transport.port = "587";465
resources.mail.transport.ssl = "tls"
resources.mail.transport.auth = "login"; não precisa editar
resources.mail.transport.username = "[email protected]";
resources.mail.transport.password = "**secret**"
resources.mail.transport.register = true; True by default
resources.mail.defaultFrom.email = "[email protected]"
resources.mail.defaultFrom.name = "I ESL"
resources.mail.defaultReplyTo.email = "[email protected]"
resources.mail.defaultReplyTo.name = "I ESL"
obs.: para a linha resources.mail.transport.port
:
- 587 is the Outgoing server (SMTP) port for IMAP. It uses a TLS encryption connection.
- 587 é a porta de Saída de serviço (SMTP) para IMAP. Ela usa conexão TLS criptografada.
- 465 is the Outgoing server (SMTP) port for POP. It uses an SSL encryption connection.
- 465 é a porta de Saída de serviço (SMTP) para POP. Ela usa conexão SSL criptografada.
Mais detalhes em Zend_Mail.
Configurar Encontro
Após criar um encontro no banco de dados, temos um id_encontro
. No arquivo
${SiGE}/application/configs/application.ini
edite a linha:
encontro.codigo = 1
Observação:
Mude o valor a cada novo encontro.
Crie o primeiro usuário administrador
Abra o SiGE no navegador e crie um usuário. Se tudo der certo um e-mail com uma senha padrão foi enviado para você. Tente fazer um login.
No banco de dados, na tebela pessoa
, modifique a coluna administrador
para true
.
Tradução (i18n)
Para traduzir as mensagens do SiGE você deve editar o arquivo ${SiGE}/application/Bootstrap.php
.
Na função _initTranslate
edite a linha:
$locale = "pt_BR";
Verifique as traduções disponíveis em ${SiGE}/application/langs
. Coloque em $locale
o mesmo
nome do diretório da sua língua padrão.
Para traduzir as mensagens que estão nos arquivos Javascript abra o arquivo
${SiGE}/application/layouts/scripts/twbs3.phtml
.
Procure a linha:
$this->headScript()->prependFile($this->baseUrl('js/jed/locale/pt_BR.js'));
e mude para a língua desejada. As opções estão em ${SiGE}/public/js/jed/locale
.
Certificados
Os arquivos relativos aos certificados, participante e palestrante, ficam localizados
em ${SiGE}/public/img/certificados/
. Lá teremos um diretório default/
que contém
arquivos iniciais para que um certificado possa ser gerado sem nenhuma configuração.
Para criar certificados para um determinado encontro devemos criar um diretório
em ${SiGE}/public/img/certificados/
com o id_encontro
do encontro. Por exemplo,
se id_encontro
for 1, criaremos o diretório ${SiGE}/public/img/certificados/1/
.
Utilize os arquivos modelo.svg
e assinatura-modelo.svg
dentro de ${SiGE}/public/img/certificados/default/
como modelos para a criação de seus certificados. Eles possuem as marcações e os tamanhos
específicos. Os tamanhos são:
Arquivo Tamanho
modelo.svg 1052x744 (mesmo tamanho de uma folha A4 paisagem) assinatura-modelo.svg 250x140
obs.: o arquivo modelo.svg
possui camadas para que ao trabalhar em cima do molde
você não se atrapalhe com outros objetos. Usando Inkscape acesse as camadas com o comando
Shift + Ctrl + L.
Após finalização do modelo, exporte o arquivo para JPG. Como o Inkscape não exporta diretamente para essa extensão, utilize o GIMP para essa tarefa.
O certificado do SiGE suporta até três assinaturas. Para isso você deve exportar o arquivo
de assinatura da seguinte forma: assinatura-1.png
- para que a assinatura apareça
a esquerda do certificado, assinatura-2.png
- para que a assinatura apareça no centro
e assinatura-3.png
- para que apareça a direita.
As assinaturas são opcionais e podem ser usadas da maneira que você deseja. Por exemplo,
se você possui um certificado que tenha algum detalhes no centro você pode optar por
criar apenas as assinaturas assinatura-1.png
e assinatura-3.png
.
obs.: Note que o arquivo de assinaturas possui a extensão PNG. Por ser uma imagem pequena e que necessita de alpha, optamos por usá-la.
\newpage
Abaixo uma simulação da árvore de diretórios ${SiGE}/public/img/certificados/
:
${SiGE}/public/img/certificados/
|
+ -- 1/
| |
| + -- modelo.jpg
| assinatura-1.png
| assinatura-3.png
|
+ -- default/
|
+ -- modelo.jpg
modelo.svg
assinatura-modelo.png
assinatura-1.png
Dados do evento
A página inicial contém os dados do evento. Para modificar os dados basta editar o arquivo
${SiGE}/public/js/index/index.js
.
Nesse arquivo temos um objeto chamado conference
, no qual você vai descrever seu encontro.
Comece editando o nome curto do encontro, juntamente com o nome completo, por exemplo:
short_name: 'COMSOLiD',
full_name: 'Comunidade Maracanauense de Software Livre e Inclusão Digital',
Contagem Regressiva
Para modficar a data e os dados referentes a contagem regressiva que aparece na página
inicial do SiGE, modifique os atributos starts_at
e ends_at
, por exemplo:
starts_at: moment(new Date(2014, 11, 16, 8, 0)),
ends_at: moment(new Date(2014, 11, 19, 17, 0)),
obs.: lembrando que em Javascript os meses vão de 0 a 11.
month
Integer value representing the month, beginning with 0 for January to 11 for December.
Fonte: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date
Características do encontro
Defina as características ou features do seu encontro, por exemplo:
features: {
columns: 3,
list: [
{
title: 'Feature 1',
description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit...',
icon: 'fa-graduation-cap'
},
{
title: 'Feature 2',
description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit...',
icon: 'fa-gamepad'
},
{
title: 'Feature 3',
description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit...',
icon: 'fa-desktop'
}
]
},
O atributo columns
pode ter valor 2
ou 3
.
Você pode criar quantas features
quiser adicionando ao atributo list
.
É recomendado que você crie no máximo 6
features, para que não polua muito a página.
Os ícones são do toolkit FontAwesome. Acesse o link Icons e veja as opções.
Mapa
Modifique as coordenadas do local onde acontecerá seu encontro, por exemplo:
map: {
latitude: -3.87259,
longitude: -38.610976,
zoom: 17,
address: 'IFCE - Campus Maracanaú - Av. Parque Central...'
}
Obs.: Existem algumas políticas de uso referentes ao OpenStreetMap (api usada para mostrar o mapa). Para um bom uso da api:
- Use somente
User-Agent
válidos; - Não envie cabeçalhos
no-cache
("Cache-Control: no-cache", "Pragma: no-cache" etc); - Faça cache do
Tile
(Tile
é a imagem do mapa obitida através da api, como o local não deve mudar, esse recurso deve ficar em cache); - No máximo são usadas duas threads de download.
Browsers modernos com a configuração padrão geralmente passam por todas as especificações acima.
Referência:
- http://wiki.openstreetmap.org/wiki/Tile_usage_policy
- https://leanpub.com/leaflet-tips-and-tricks/read
Redes Sociais
A última página contém os links para as redes sociais do seu encontro. Edite de acordo com o exemplo abaixo:
social_networks: [
{
url: 'https://twitter.com/comsolid',
channel: 'twitter'
},
{
url: 'https://facebook.com/comsolid',
channel: 'facebook'
},
{
url: 'https://github.com/comsolid',
channel: 'github'
},
],
Os botões são gerados usando o Social Buttons 3, utilize os nomes oferecidos pela api.
Por que as configurações em JS e não no banco de dados?
Você pode estar se perguntado isso e a resposta é:
Essas configurações são feitas apenas uma vez, e nós da COMSOLiD achamos que seria trabalhoso para o servidor ter que carregar essas informações do banco de dados cada vez que a página fosse acessada.
No arquivo ${SiGE}/application/configs/application.ini
altere as linhas:
twitter.username = "els"; sem "@"
twitter.hashtags = "els1"; sem "#" e separadas por ","
Layout do Sistema
Por usar o Twitter Bootstrap 3, fica mais fácil mudar o tema, ou até mesmo criar um.
O SiGE suporta por padrão 3 temas:
Outros temas podem ser encontrados em Bootswatch.
Para editar o tema edite o arquivo ${SiGE}/application/layouts/twbs3.phtml
, procure pela linha:
$this->headLink()->prependStylesheet(
$this->baseUrl('lib/css/bootstrap/default/bootstrap.min.css'));
e mude default
para lumen
ou darkly
ou ainda um tema que você tenha baixado.
Os temas devem ficar em ${SiGE}/lib/css/bootstrap/
.
Banner do Sistema
Para alterar o banner geral basta substituir o arquivo ${SiGE}/public/imagens/layout/topo_sige.png
.
As dimensões são: 962x135.
Versão Móvel
Edite o arquivo application/layouts/scripts/mobile.phtml
:
Linha 44: <h1>COMSOLiD <?=date('Y') ?></h1>