3. Theory
3.6. Studies related to the TOEFL iBT preparation
Ao todo, o sistema poder ser dividido nos seguintes componentes:
• MSHLoader - Componente responsável pelo carregamento de modelos tridimen-
sionais no formato MSH.
• Interação de Periféricos - Componente responsável pela captura de eventos do
mouse, botões, teclado, janela, etc.
• Banco de dados - Componente responsável pela comunicação com o banco de
dados.
• Conversor - Componente responsável por realizar o mapeamento de uma peça do
construtor para um modelo tridimensional
• Construtor - Componente responsável por realizar a construção do espaço físico
virtual
• Editor - Componente responsável por realizar a edição do museu virtual
Na Figura 4.4 temos a arquitetura do nosso sistema representado como diagrama de componentes da UML.
Os componentes Editor e Construtor foram desenvolvidos para funcionar indepen- dentemente. O componente Editor realiza apenas as operações de edição do museu vir- tual, independentemente da forma como o museu está sendo construído (utilizando o
Construtor ou enviando a modelagem do museu através do Portal). Da mesma forma,
o componente Construtor foi desenvolvido para ser independente do editor usado. Os dois componentes utilizam o componente Banco de Dados, onde está as informações de edição e construção. Caso o usuário utilize o componente Construtor, o componente
Editor fica dependente do componente Conversor. Este componente tem a função de
CAPÍTULO 4. PROJETO DO SAMVC 23
Figura 4.4: Arquitetura do Sistema SAMVC.
interpretação. Essa interpretação vai desde as rotações que podem ser aplicadas as salas, como o posicionamento das mesmas. O componente MSHLoader é utilizado para carre- gar os modelos tridimensionais nesse formato. O componente Interação de Periféricos é o componente responsável pela captura dos eventos do teclado e mouse, mas outros periféricos são possíveis também.
4.4
Construtor de Museu
O Construtor de Museu se refere à parte do SAMVC onde o usuário utiliza a nossa ferramenta para a construção do espaço físico virtual do museu. Essa ferramenta foi cons- truída inteiramente utilizando classes da linguagem Java, não necessitando de nenhuma API auxiliar. Essa aba é dividida em duas partes:
1. Painel Principal: Este painel corresponde ao espaço com o qual o usuário poderá adicionar peças (salas). Esse painel foi construído para se assemelhar como um quebra cabeça, onde os usuários deverão colocar as peças para compor o museu desejado.
2. Modelo de Salas: Nesse painel estão as peças (salas) disponíveis para a criação do museu. Existem ao todo 11 peças diferentes (algumas têm portas, outras têm paredes, etc.). Com essas peças, podem ser construídos diversos museus virtuais com estruturas diferentes.
Figura 4.5: Interface do Construtor de Museu.
Na Figura 4.5 apresentamos a Interface do Construtor de Museu. Na parte superior dessa figura (delimitada pelo circulo 1) temos uma grade para o desenho da planta do museu. Na parte inferior temos um painel (delimitada pelo circulo 2) com os modelos de salas. Como esses modelos são fixos, o usuário não pode alterá-los, pois devemos garantir que para cada modelo de sala, exista uma modelagem tridimensional correspondente. Para a construção do museu, o usuário escolhe uma determinada peça. Após a escolha, o usuário clica na posição desejada no painel principal. Feito isso, uma sala com as características semelhantes a peça escolhida deverá aparecer no ambiente virtual. O painel principal foi desenvolvido como sendo uma grande matriz. A posição tridimensional da peça é calculada pelo componente Conversor a partir dos índices i, j da matriz como demonstra o algoritmo abaixo.
pos3D.x = bit Pos.x ∗ W I DT H _BI T ; (4.1)
pos3D.y = 0.0 f ; (4.2)
pos3D.z = bit Pos.y ∗ DE PT H _BI T ; (4.3)
Nessas equações WIDTH_BIT, DEPTH_BIT representam a largura e profundidade da sala tridimensional respectivamente. Já a variável bitPos é a posição i, j da matriz onde a peça foi adicionada e pos3D contém a posição tridimensional da sala. Netse caso, todas as modelagens tridimensionais das peças possuem WIDTH_BIT de largura,
HEIGHT_BIT de altura e DEPTH_BIT de profundidade. A posição Y da sala sempre é
zero, considerando que no nosso construtor de museus, não temos a opção de criar salas com alturas diferenciadas.
O usuário não tem a opção de modificar o modelo tridimensional da sala, mas tem a opção de selecionar, editar ou criar o material da sala (cor das paredes, textura da parede, chão, teto, etc.). Damos ao usuário essa opção, colocando Pop-ups nos modelos, sendo acessível pressionando o botão direito do mouse. Esse Pop-up nos fornece às seguintes opções, como mostrada na Figura 4.6.
CAPÍTULO 4. PROJETO DO SAMVC 25
Figura 4.6: Menu edição de materiais. (1) Criar Material. (2) Editar Material. (3) Seleci- onar Material.
1. Criar Material - Opção de criação de materiais. O material criado é baseado em um modelo de material padrão. Aparecerá uma janela ao qual temos a visualização da sala no lado esquerdo e várias opções na direita.
2. Editar Material - Opção de edição de materiais já existentes. Será feito uma lista- gem de todos os materiais criados pelo usuário.
3. Selecionar Material - Opção de seleção de material. Será exibido uma listagem de todos os materials que o usuário possui, quer seja o padrão, quer seja os construídos por ele.
Escolhendo a opção Criar Material, será mostrado uma janela onde o usuário esco- lherá o nome para o novo material. Será adicionado ao começo do nome, por convenção, o nome “salas” e no final, a extensão “.mat”, caso o usuário não coloque a extensão. Es- colhendo a opção Editar Material, aparecerá uma lista de materiais para que o usuário escolha qual material quer editar. Na janela de criação/edição de material, temos no lado esquerdo uma visualização de uma sala padrão com o material selecionado. No lado di- reito, temos uma lista de opções de edição. Na Figura 4.7, temos as opções do usuário para a edição de material.
1. Paredes iguais - selecionando esta opção, todas as paredes da sala serão iguais. 2. Escolher uma cor - selecionando a opção Cor, o usuário poderá escolher uma cor
apertando o botão.
3. Escolher uma textura - selecionando a opção Textura, o usuário poderá escolher uma das texturas.
As texturas que aparecem aqui listadas são as texturas do material padrão ou alguma textura que o usuário submeteu através do portal web. Essas texturas são organizadas em uma pasta no diretório do curador no servidor.
Ao fechar a janela, é perguntado se o usuário irá querer salvar o novo material no servidor. Caso o material já exista no servidor, o mesmo será sobrescrito. Ao salvar
Figura 4.7: Interface Criar/Editar Material. (1) Paredes Iguais. (2) Botão de escolha de cor. (3) Menu de opções de escolha de texturas.
o material, qualquer sala que já tenha sido adicionada com o material escolhido, será atualizado para o novo material.
Após o usuário adicionar as peças é possível realizar operações em cima destas. Essas operações são rotação e remoção da peça. Um Pop-up aparece ao clicar em alguma peça do painel principal como mostrado na Figura 4.8. Nesse pop-up temos três opções:
1. Girar +90o- Gira a peça no sentido anti-horário 2. Girar -90o- Gira a peça no sentido horário 3. Remover - Remove a peça do painel principal
Para cada opção escolhida, um evento é gerado para que o componente de Conver-
são possa reconhece-lo e tratá-lo caso seja necessário. Esses eventos foram criados para
que tenhamos uma construção em tempo real na parte tridimensional do museu virtual. Portanto, a cada evento realizado no painel principal, temos um tratamento especifico na parte tridimensional, evitando assim a construção de um componente de prévia de visu- alização. Isto facilita o trabalho do curador, evitando que o mesmo tenha que utilizar programas separados, um para construir o museu, e outro para editá-lo.
Ao pressionar o botão central do mouse em alguma peça já posicionada no painel principal, será adicionado naquela sala, a informação de um ponto inicial, representado aqui pelo desenho de uma seta. Esse ponto inicial representa a posição em que será posicionado a câmera quando o museu for acessado pelo aplicativo cliente. Ao fazer essa operação pela primeira vez, a câmera do ambiente virtual (Editor de Museu) é atualizada para a posição correspondente. As operações acima descritas também podem ser utilizadas para a manipulação do ponto inicial.
CAPÍTULO 4. PROJETO DO SAMVC 27
Figura 4.8: Editar Peça. (1) e (2) Girar +/- 90orespectivamente. (3) Remover peça.
4.5
Editor de Museu
O Editor de Museu faz as operações de adição, remoção, rotação, translação e atu- alização das obras ou objetos. Todas as obras e objetos presentes no editor são aquelas que foram submetidas através do Portal Web. É através desta ferramenta que temos uma prévia do museu virtual, construído ou não pelo Construtor. Nesta ferramenta, o com- ponente principal é um objeto da classe Canvas3D provida pela API Java3D.
Os eventos gerados pelo Construtor de Museu são capturados pelo componente
Conversor, modificados e postados para o Editor de Museu. Caso uma nova peça seja
adicionada ao painel principal, temos que carregar o modelo da sala escolhida para o grafo de cena. Caso uma peça seja removida, temos que removê-la do grafo de cena. Para auxiliar nesses eventos, criamos uma tabela hash que faz o mapeamento entre a peça e sua modelagem tridimensional. Junto com o evento, temos a peça que gerou o evento e a ação que está sendo realizada na peça. As ações podem ser: adição, remoção ou rotação. Com essa peça, procuramos a sua modelagem tridimensional para aplicar as operações necessárias no modelo tridimensional. Tratamos os eventos relacionados ao ponto inicial de forma similar ao das peças
Quando o museu é carregado, o editor de museu procura as informações dos modelos, das obras, dos objetos, etc. no banco de dados. Todas as obras e objetos enviados pelo usuário no portal são carregadas e guardadas. Nesse momento, são adicionados entradas nos respectivos menus (quadros no menu Adicionar Quadro, objetos no menu Adicionar
Objeto e assim por diante). Quando adicionamos uma Obra/Objeto no ambiente virtual,
precisamos ter mais informações além de sua posição e orientação. Essas informações serão utilizadas para o armazenamento no banco de dados das obras/objetos para facilitar a reconstrução do ambiente virtual. As informações que são armazenadas no banco de
dados são mostrados na Figura 4.9.
Figura 4.9: Banco de dados do SAMVC
O banco de dados pode ser separado em 2 partes. A parte fora da seleção é utilizada pelo portal Web. O portal Web tem controle dessas tabelas podendo inserir, editar, ex- cluir, etc. Nessa parte do banco de dados, o editor de museu virtual apenas pode ler as
CAPÍTULO 4. PROJETO DO SAMVC 29
informações dessas tabelas, com exceção da tabela museufiles onde o editor pode inserir ou remover informações. Já na parte de seleção azul, somente o editor de museu virtual pode manipular as informações dessas tabelas. Abaixo mostramos uma explicação sobre cada tabela.
• curador - Tabela que guarda as informações sobre o Curador do sistema. Essas
informações são preenchidas pelo portal Web.
• museu - Tabela que guarda as informações sobre o Museu Virtual que está criado.
Essas informações são preenchidas pelo portal Web.
• obra - Tabela que guarda as informações gerais das obras. Essas informações são
preenchidas pelo portal Web.
• video - Tabela que guarda as informações sobre a obra Vídeo. O curador faz upload
do video no portal Web.
• audio - Tabela que guarda as informações sobre a obra Audio. O curador faz upload
do audio no portal Web.
• escultura - Tabela que guarda as informações sobre uma Escultura. As esculturas
são enviadas pelo portal Web.
• quadro - Tabela que guarda as informações sobre um Quadro. A imagem do quadro
é enviada pelo portal Web.
• objeto - Tabela que guarda as informações sobre um Objeto. O Objeto é enviado
pelo portal Web.
• museufiles - Tabela que guarda as informações sobre a estrutura virtual do museu.
O curador pode enviar através do portal Web, uma modelagem tridimensional do seu museu. Esta tabela também é preenchida pelo editor de museus virtuais quando o curador opta por utilizar o construtor de museus virtuais.
• path - Tabela que guarda as informações sobre o(s) caminho(s) do guia virtual. • startPoint - Tabela que guarda as informações sobre a posição e orientação ini-
cial deste museu virtual. Essas informações são preenchidas pelo editor de museu virtual.
• luz - Tabela que guarda as informações sobre as luzes do museu virtual. Essas
informações são preenchidas pelo editor de museu virtual.
• parent - Tabela que guarda as informações sobre o pai (nó do grafo de cena) de um
determinado Objeto/Obra. Essas informações são preenchidas pelo editor de museu virtual.
• obra3d - Tabela que guarda as informações sobre uma obra dentro do museu vir-
tual. Essas informações são preenchidas pelo editor de museu virtual.
• objeto3d - Tabela que guarda as informações sobre um objeto dentro do museu
virtual. Essas informações são preenchidas pelo editor de museu virtual.
• portal - Tabela que guarda as informações sobre os portais dentro do museu virtual.
Essas informações são preenchidas pelo editor de museu virtual.
O curador pode enviar através do portal Web, uma modelagem tridimensional do seu museu. Esta tabela também é preenchida pelo editor de museus virtuais quando o cura- dor opta por utilizar o construtor de museus virtuais. Essas informações são preenchidas pelo editor de museu virtual. Observando a Figura 4.9, vemos que nas tabelas objeto3d,
obra3d, luz além da posição x, y, z e angle (angle corresponde a rotação em torno do
eixo y), temos também informações sobre a orientação da Obra/Objeto (ox, oy, oz, oan-
gle). Essa orientação é a responsável por alinhar a Obra/Objeto em relação ao modelo
tridimensional do grafo de cena (pode ser uma estrutura do museu ou um Objeto). Quando falamos em objeto, estamos nos referindo a qualquer estrutura geométrica tri- dimensional (Obras, Luzes, Objetos, Portais, etc). Quando falamos em Objeto, estamos nos referindo aos objetos adicionados pelo usuário no Portal (mesas, cadeiras, vasos, etc). Toda vez que selecionamos algum objeto no nosso museu virtual, precisamos identificar qual o tipo de objeto sobre o qual estamos querendo fazer as operações. Por exemplo, podemos selecionar uma obra já adicionada ou podemos selecionar a parede, o chão ou o teto. Para que saibamos qual o tipo do objeto selecionado, precisamos saber mais do que a sua geometria. A API Java3D possui diversos métodos auxiliares que nos fornece informações sobre o objeto que foi selecionado. Um desses métodos nos retorna o nó do grafo de cena que possui o objeto selecionado. Nesse caso, todas as Obras/Objetos adici- onadas são de filhas de uma determinada classe, que chamamos de Object3D, portanto, todos os objetos suportados pelo editor, obrigatoriamente tem que ser uma classe filha dessa classe.
Para que seja feita a adição de um objeto, precisamos saber a posição e a orientação do local onde o usuário irá inserir o objeto. Para isso, utilizamos operações providas pela API
Java3D que realiza técnicas de interseção de objetos. Quando o usuário clica dentro do
ambiente virtual, utilizamos a posição do mouse para a criação de um Raio que terá como origem a posição da câmera. O Java3D utiliza esse raio para detectar se o usuário clicou em algum objeto dentro do mundo virtual. Dependendo das informações geométricas, o menu mostrará opções de edição que aquele objeto suporta. O menu de edição somente mostrará opções de edição que aquele objeto suporta. Para facilitar o reconhecimento de qual objeto está sendo selecionado, verificamos se o objeto é na verdade uma instância da classe Object3D. Podemos ter os seguintes tipos da classe Object3D:
• OBJECT3D - Um Objeto tridimensional
• OBRA3D - Uma Obra (Quadro, Video, Escultura) • STARTPOINT - Ponto inicial do museu
• LUZ - Um objeto do tipo luz
• PORTAL - Um portal para outro museu
Para identificar um teto, chão ou parede, simplesmente analisamos a normal dessa geometria. Caso a normal não tenha a componente Y, dizemos que o objeto em questão é uma parede. Se ele possuir a componente Y e se esta for positiva, identificamos um chão. Caso contrário, será um teto. Superfícies inclinadas aqui são desconsideradas e não temos nenhuma ação para a mesma.
Se o objeto em questão for uma estrutura do museu, será mostrada a opção de adici- onar obras, objetos, luz, ponto inicial. As Obras (Quadro, Escultura, Audio ou Vídeo) só poderão ser adicionadas na estrutura do museu, ou em cima de algum Objeto. Já os
Objetos, podem tanto ser adicionados na estutura do museu quanto em cima de outro Ob- jeto. O menu de remover só irá aparecer caso o objeto selecionado seja algo diferente da
CAPÍTULO 4. PROJETO DO SAMVC 31
e segura o botão esquerdo do mouse e movimenta o mesmo. Nas Figuras 4.10 e 4.11 temos alguns exemplos de edições possíveis.
Figura 4.10: Menu de edição de obras. À esquerda adicionando um quadro e à direita adicionando um objeto
Figura 4.11: Menu de edição de obras. À esquerda adicionando uma escultura e à direita exibindo as opções de edição do objeto
Adicionando uma Obra do tipo Video, se o usuário possuir a API JMF [Gordon & Talley 1999], o vídeo será mostrado dentro do ambiente tridimensional. Criamos um
Player JMF que ao invés de renderizar o vídeo em um componente Java, renderizamos
o vídeo dentro de uma textura da API Java3D. O JMF faz toda a decodificação de audio e vídeo. Através de listeners, o JMF nos informa quando um novo quadro do vídeo deve ser renderizado. Com essa informação, fazemos a atualização da textura do objeto Vídeo. Quando o usuário deseja adicionar um objeto, é necessário fazer com que o objeto adicionado fique alinhado com a superficie do objeto selecionado. Para isso, precisamos
alinhar a normal da Obra/Objeto adicionado com a normal do ponto onde o clique foi realizado. Utilizamos o seguinte algoritmo para realizar o alinhamento.
f u n ç ã o a l i n h a m e n t o ( v e t o r 3 d n o r m a l , p o n t o 3 d p o i n t , a n g u l o D e E i x o r o t Y ) { 1 . v e t o r 3 d y = new V e c t o r 3 d ( 0 . 0 , 1 . 0 , 0 . 0 ) ; 2 . v e t o r 3 d x = new V e c t o r 3 d ( 1 . 0 , 0 . 0 , 0 . 0 ) ; 3 . R e a l a n g l e R a d = n o r m a l . a n g l e ( y ) ; 4 . v e t o r 3 d a x i s ; 5 . a x i s . c r o s s ( y , n o r m a l ) ; / / C a l c u l a o e i x o de r o t a ç ã o 6 . a x i s . n o r m a l i z a r ( ) ; / / N o r m a l i z a o v e t o r 7 . Se ( a n g l e R a d == 0 ) { / / T r a t a m e n t o s de e r r o s a . a x i s = ( 0 , 1 , 0 ) ; b . } 8 . S e n ã o Se ( a n g l e R a d == P I ) { a . a x i s = ( 1 , 0 , 0 ) ; b . } 9 . a n g u l o D e E i x o a x i s M a i n = ( a x i s , a n g l e R a d ) ; 1 0 . R e a l a n g l e Y = n o r m a l . a n g l e ( x ) ; 1 1 . Se ( n o r m a l . z < 0 ) { a . a n g l e Y = a n g l e Y ∗ ( − 1 ) ; b . } 1 2 . a n g u l o D e E i x o a x i s A n g l e Y = ( y , −angleY + P I / 2 ) ; 1 3 . r o t Y = a x i s A n g l e Y ; 1 4 . r e t o r n e a x i s M a i n ; }
Nesse algoritmo o ponto3D é formado pela tupla <x, y, z> que representam as coor- denadas de um vetor em R3. O elemento vetor3D é formado pela tupla <P> onde P é um ponto3D. O anguloDeEixo é formado pela tupla <V, A>, onde V é um vetor3D e A um ângulo medido em radianos.
Primeiro calculamos o ângulo que a normal faz com o eixo Y no passo 3. Agora precisamos descobrir qual o eixo de rotação que o objeto deve rotacionar para que sua normal se alinhe a normal do objeto selecionado. Fazemos isso com o produto vetorial entre o eixo Y e a normal e depois normalizamos esse vetor, que pode ser visto nos passo 5 e 6 respectivamente. Existe uma etapa de cálculo dos erros (passos 7 e 8). Esses erros ocorrem quando a normal da face intersectada tem apenas a componente Y diferente de 0. O objeto também deve sofrer uma rotação na componente Y (passos 10 e 11) primeiro, para que assim, o mesmo permaneça alinhado com a face de interseção . Para isso precisamos calcular o ângulo entre a normal da face de interseção e o eixo X do objeto. O objeto deve sofre uma rotação em sentido anti-horário (passos 12 e 13).
Essa função retorna um objeto da classe anguloDeEixo que contém o eixo de rotação e o ângulo de rotação que deverá ser aplicado ao objeto adicionado. Essa função precisa de 3 parâmetros. O vetor normal que indica a normal do ponto selecionado, o ponto tridimensional (point) que indica qual o ponto de intersecção e o rotY que será preenchido com o ângulo de rotação em torno do eixo Y que o objeto deverá ser rotacionado para se
CAPÍTULO 4. PROJETO DO SAMVC 33
alinhar corretamente. Ao realizar a movimentação dos objetos, esse cálculo é refeito toda vez que o valor da normal se alterar.
As posições dos objetos é sempre em relação à um nó do grafo de cena. Ao adicionar- mos um objeto na estrutura do museu, na verdade estamos adicionando o objeto no grafo de cena ao qual a estrutura está relacionada. O mesmo acontece se adicionar-mos um objeto em cima de um Objeto. A posição desse objeto é em relação ao Objeto. Se o
Objeto sofrer alguma alteração da sua posição ou orientação, o objeto adicionado também
será alterado.
Para otimizar as operações de edição dos objetos, criamos um sistema de cache em memória tanto para imagens, quanto para dados tridimensionais (vertices, normais, coor- denadas de textura, etc). Todas as imagens e dados tridimensionais que são carregadas pelo editor ficam armazenados em memória. Assim, evitamos que eles sejam carregadas novamente, caso sua utilização ocorra mais de uma vez. Esta otimização é bem utili-