Este relatório descreve as atividades realizadas no âmbito de uma bolsa de investigação para o projeto SchoolSenses@Internet. O objetivo principal foi desenvolver novas funcionalidades para o portal do projeto, incluindo a adaptação da base de dados, adição de um plugin do Google Earth, criação de uma galeria dinâmica para as oficinas e divulgação do portal nos motores de busca.
1. Centro de Informática e Sistemas da Universidade de Coimbra (CISUC)
Departamento de Engenharia Informática
Faculdade de Ciências e Tecnologia da Universidade de Coimbra
SchoolSenses@Internet
Fundação para a Ciência e Tecnologia
Referência: POSC/EIA/56954/2004
Autor: António Manuel Costa Nascimento
2. Projecto SchoolSenses@Internet - Relatório – Julho 2008
RELATÓRIO DE BOLSA DE INVESTIGAÇÃO DE
António Manuel Costa Nascimento
anascimento@dei.uc.pt
No âmbito do projecto SchoolSenses@Internet
“Desenvolvimento de soluções no âmbito do projecto SchoolSenses@Internet”
Período e duração da bolsa: de 15 de Dezembro de 2007 a 15 de Junho
de 2008 (6 meses)
Página - 1
3. Projecto SchoolSenses@Internet - Relatório – Julho 2008
Índice
Índice .................................................................................................................. 2
Índice de Figuras ................................................................................................ 3
1 - Introdução ..................................................................................................... 4
2 – Portal Schoolsenses@Internet ..................................................................... 5
2.1 – Objectivos .............................................................................................. 5
2.1.1 – Adaptação ao projecto .................................................................... 6
2.1.2 – Configurações de servidor e base de dados ................................... 7
2.1.3 – Gestão de conteúdos do portal ....................................................... 7
2.1.4 – Reestruturação do front-end e back-end das Oficinas .................... 8
2.1.5 – Criação de uma galeria dinâmica para as Oficinas ......................... 9
2.1.6 – Adaptação de um WebFTP ao portal ............................................ 10
2.1.8 – Divulgação do schoolsenses@internet nos motores de busca
google, yahoo e sapo ................................................................................ 11
2.2 – Google Earth ........................................................................................ 12
2.2.1 - Objectivos ...................................................................................... 12
2.2.2 – Adaptação ao programa Google Earth .......................................... 12
2.2.3 - Actualização do google earth no portal com o novo plugin do google
earth airlines em JAVA .............................................................................. 13
2.2.4 – Construção de KML’s .................................................................... 14
2.2.5 – Validação e correcção de placemarks elaborados nas oficinas .... 15
2.2.6 – Pesquisa de soluções para implementar um fórum no google earth
.................................................................................................................. 16
2.3 – Base Dados Schoolsenses@Internet .................................................. 19
2.3.2 – Categorização e Reestruturação do modelo de dados do Clipart . 20
3 – Plano de Tarefas ........................................................................................ 21
4 – Tecnologias Usadas ................................................................................... 22
4.1 – ASP.NET ............................................................................................. 22
4.2 – Linguagem SQL SERVER ................................................................... 29
4.3 – Linguagem AJAX ................................................................................. 33
4.4 – Linguagem KML ................................................................................... 35
5 – Estrutura do Código ................................................................................... 36
6 - Referências ................................................................................................. 37
Página - 2
4. Projecto SchoolSenses@Internet - Relatório – Julho 2008
Índice de Figuras
Figura 1 - Página inicial do site schoolsenses@internet .................................... 5
Figura 2 - Arquitectura de três camadas aplicacionais ....................................... 6
Figura 3 - Painel de administração ..................................................................... 7
Figura 4 – Página demonstrativa dos conteúdos das oficinas............................ 8
Figura 5 – Apresentação do programa Jalbum. ................................................ 9
Figura 6 - Visualização da aplicação WebFTP no painel de administração. .... 10
Figura 7 - Configurações para o anúncio do portal schoolsenses na
webmasters tool do Google. ............................................................................. 11
Figura 8 - Plugin do google earth airlines embutido no portal
schoolsenses@internet .................................................................................... 13
Figura 9 - Edição de placemarks no programa Northgates KML Editor ........... 14
Figura 10 - Placemarks da workshop da Escola Costa Cabral, enviados por
telemóvel com GPS para a base de dados do schoolsenses .......................... 15
Figura 11 - Arquitectura do sistema schoolsenses@internet ........................... 16
Figura 12 – Esquema do funcionamento dinâmico dos KML’s controlável por
queries feitas à bases de dados. ...................................................................... 16
Figura 13 - Exemplo da recepção de dois mails provenientes de um telemóvel
com gps. ........................................................................................................... 17
Figura 14 - XML flash guestbook...................................................................... 18
Figura 15 - XML flash guestbook embutido no balão do GE. ........................... 18
Figura 16 - Exemplo de um fórum disponivel no google earth. GE Boards ...... 19
Figura 17 - Tabelas relacionadas com o clipart e os sentidos. ......................... 20
Figura 18 - Gráfico de Gant com data das tarefas ........................................... 21
Figura 19 - Visão global da framework .NET .................................................... 23
Figura 20 - Tecnologia Clinte Servidor ASP.Net .............................................. 25
Figura 21 - Ficheiros de uma aplicação web .................................................... 26
Figura 22 - Exemplo de código de um ficheiro .aspx vazio .............................. 27
Figura 23 - Estrutura de Pastas de uma aplicação Web .................................. 27
Figura 24 - Páginas Code-Behind .................................................................... 28
Figura 25 - Ligação de código de páginas Code-Behind ................................. 28
Figura 26 - Configurar a segurança de acesso ao código ASP.NET................ 29
Figura 27 - Modelo clássico com e sem AJAX ................................................. 34
Figura 28 - Servidor de KML's .......................................................................... 35
Página - 3
5. Projecto SchoolSenses@Internet - Relatório – Julho 2008
1 - Introdução
O projecto Schoolsenses@Internet tem como objectivo principal desenvolver
um site Web que possibilite a integração de aplicações geo-referenciadas e
multissensoriais desenvolvidas por alunos e professores de escolas do 1º ciclo
em Portugal, como uma estratégia para melhorar a qualidade do ensino
primário. A informação multisensorial georefenciada integra informação
adquirida por experiências situadas geograficamente, dando atenção para as
diferentes representações sensoriais que estão presentes nos nossos
pensamentos. Em contextos educacionais a informação multisensorial é um
factor importante para a motivação. As representações multisensoriais têm a
capacidade de envolver as pessoas de uma maneira intelectual e emocional.
Este projecto integra as potencialidades de tecnologias de informação e de
comunicação para suportar a criação da informação multisensorial
georeferenciada pelas crianças. Pretende-se desenvolver um site Web, onde
os alunos do 1º ciclo possam colaborar na construção de mensagens
multisensoriais georeferenciadas. Além disso, no contexto da escola, outras
tecnologias serão exploradas para permitir a criação e a partilha da informação
de uma maneira mais ubíqua, recorrendo ao uso de telemóveis, Pda’s,
Smartphones com GPS.
Os diversos actores serão, assim, envolvidos na construção de um espaço
comum e identitário na Internet. Trata-se de explorar, através de desafios e
problemas concretos, actividades que promovam oportunidades de
aprendizagem significativa, ligando contextos locais aos globais, contextos
reais aos abstractos, e desenvolvendo competências de cooperação e
colaboração. Pretende-se dar oportunidade às crianças de serem elas próprias
a construir, partilhar e comentar a informação. Esta abordagem, enquadrada
pelas ideias construcionistas sobre a aprendizagem de Papert e o trabalho de
autores como Druin ou Resnik, apoia-se na crença de que as melhores
experiências de aprendizagem acontecem quando existe um envolvimento
activo no desenho e construção de artefactos significativos para o próprio
aprendiz e para a comunidade em que está integrado.
O objectivo deste trabalho de seis meses de bolsa no âmbito do projecto
schoolsenses@internet consiste na inserção de novas soluções no portal,
reestruturação da base de dados, gestão de informação e por fim um estudo de
uma possível aplicação para o Google Earth e sua implementação.
Página - 4
6. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2 – Portal Schoolsenses@Internet
O website do projecto está disponivel em http://schoolsenses.dei.uc.pt e na
Figura 1 em baixo podemos ver a página principal. Os conteúdos do portal
encontram-se em português e em inglês.
Figura 1 - Página inicial do site schoolsenses@internet
O portal schoolsenses@internet encontra-se dividido em duas zonas, pública e
privada (na qual apenas utilizadores autorizados podem aceder a outras
opções).
2.1 – Objectivos
O primeiro objectivo agendado para o portal, de acordo com o plano de tarefas
do bolseiro, foi colocar a base de dados a funcionar, pois esta não tinha
permissões de escrita e não apresentava no front end da página qualquer
registo. Numa segunda fase após a ambientação com o servidor do
schoolsenses, e com o projecto desenvolvido em ASP.NET, SQL Server e
AJAX , o objectivo foi acrescentar algumas funcionalidades ao portal tais como
o novo plugin do google earth airlines, um webftp para que os vários
intervenientes do projecto, que pudessem colocar ou retirar ficheiros
remotamente. Com o aumento de oficinas e a necessidade de guardar mais
informação sobre estas havia a necessidade de mudar o front end. Para isso
acrescentou-se uma galeria de fotos dinâmica para fazer uma gestão da
informação de cada uma das oficinas.
Página - 5
7. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.1.1 – Adaptação ao projecto
Para uma melhor familirização com o projecto foi necessário ter em conta
alguns conceitos teóricos presentes nos artigos já publicados. É necessário ter
ideia das aplicações com que vamos trabalhar o projecto e das tecnologias em
que o portal está desenvolvido. Inicialmente, tomou-se contacto com a pasta do
projecto, de onde se pode retirar a ideia do tipo de tecnologias usadas, da
forma como estava organizado e dos vários tipos de linguagens utilizadas.
Verifica-se que a aplicação foi inicialmente construída em três camadas
aplicacionais. Uma aplicação de três camadas como demonstra a Figura 2 é
um programa de aplicação que está organizado em camada de apresentação,
camada de aplicação e camada de dados. Esta situação é vantajosa para os
programadores de software que evoluam continuamente uma aplicação
enquanto novas necessidades e oportunidades se levantam. O projecto
schoolsenses encontra-se alojado num servidor reservado, na Universidade de
Coimbra, no qual as entidades competentes do projecto entenderam ter
instalado o Windows Server 2003 32 bits, juntamente com o IIS e o SQL Server
para hospedar o projecto.
O servidor IIS tem a capacidade de hospedar as Active Server Pages, este
desempenha um papel importante entre a interface do utilizador e a lógica da
aplicação, de maneira a que os pedidos feitos pelo cliente sejam orientados
para o servidor de aplicações.
Figura 2 - Arquitectura de três camadas aplicacionais
Página - 6
8. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.1.2 – Configurações de servidor e base de dados
A configuração e instalação de programas no servidor têm uma grande
relevância. A versão disponível de momento era o Windows Server 2003
64bits, e para algumas das nossas aplicações a versão 64 bits tinha problemas
de estabilidade e muitas vezes o desempenho do servidor era afectado.
Decidiu-se fazer uma nova reposição de software ao servidor, e para tal foi
necessário fazer backups do projecto que estava a correr no Internet
Information Services (IIS), tendo em mente o software necessário para instalar
e conferir a homologação para nova reposição. Foi instalada a versão Windows
Server 2003 de 32 bits, que se verificou ser bastante mais estável. Uma vez
instalado o novo sistema operativo havia que instalar um conjunto de
ferramentas necessárias para o desenvolvimento de páginas web dinâmicas, o
Visual Studio 2005, o SQL Server 2005 e o IIS 7 para publicar a página online.
O IIS inclui uma gama de recursos administrativos para o gerenciamento de
sites. Com recursos programáticos como o Active Server Pages (ASP),
podemos criar e implementar aplicações web escalonáveis e flexíveis na
Internet e na intranet. Foi ainda necessário a configuração de uma VPN para o
DEI.
2.1.3 – Gestão de conteúdos do portal
Figura 3 - Painel de administração
A Figura 3 mostra a página de administração do portal. Após entrar no site
como administrador no portal, é possivel fazer gestão de adicionar e remover e
editar informações sobre: localidades, escolas, professores, administradores,
clipart, categorias de clipart, aprovação de objectos do clipart, artigos, oficinas
Página - 7
9. Projecto SchoolSenses@Internet - Relatório – Julho 2008
e outros. Estas funções ficaram a cargo do bolseiro durante um período de seis
meses.
2.1.4 – Reestruturação do front-end e back-end das
Oficinas
Com o aumento de oficinas desenvolvidas no âmbito do projecto schoolsenses
houve uma necessidade de catalogar online informação mais pormenorizada,
acerca dos vários elementos multimédia que eram usados durante as oficinas.
Como se pode ver em baixo na Figura 4, uma oficina é composta por um local,
uma data, pelos participantes do evento, por objectivos, por um ou mais
ficheiros KML que tenham sido usados nessa oficina e por fim uma galeria de
imagens mostrando acções no decorrer da oficina.
Figura 4 – Página demonstrativa dos conteúdos das oficinas.
Página - 8
10. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.1.5 – Criação de uma galeria dinâmica para as
Oficinas
Como já foi já descrito no subcapítulo anterior havia necessidade de recolher
informação fotográfica das várias oficinas, para tal decidiu usar-se um
programa para construção de galerias de fotografias de uma maneira rápida e
organizada (em pastas). Os dimensionamentos das imagens e dos thumbnails
são um dos fortes deste programa, tendo a vantagem de poupar bastante
tempo ao utilizador que pretende fazer a gestão das galerias. Na Figura 5
podemos ver o perfil do programa Jalbum, um software de licença grátis
bastante útil, que pode ser retirado de www.jalbum.com. O principio de
utilização do programa passa pela criação de galerias em ficheiro index.html
dentro da pasta da oficina. Seguidamente no formulário de inserção de oficinas
coloca-se o caminho de pastas da oficina e esta fica disponivel online.
Figura 5 – Apresentação do programa Jalbum.
Página - 9
11. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.1.6 – Adaptação de um WebFTP ao portal
A adaptação de um servidor de ficheiros (WebFTP) ao portal foi bastante
importante. Devido a estas modificações todos os intervenientes do projecto
passam a poder copiar e descarregar ficheiros directamente para o servidor.
Para além disso, uma vez que o administrador esteja remotamente a trabalhar
no servidor este fica com acesso directo a esses ficheiros. A aplicação
escolhida para estas modificações foi o gerenciador de ficheiros online
IZWebFileManager como podemos ver na Figura 6, desenvolvido na mesma
tecnologia ASP.NET usada no portal e que é compatível com a maior parte dos
browsers, MS Internet Explorer e Firefox.
Figura 6 - Visualização da aplicação WebFTP no painel de administração.
Página - 10
12. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.1.8 – Divulgação do schoolsenses@internet nos
motores de busca google, yahoo e sapo
Para melhor dar a conhecer o projecto schoolsenses@internet à comunidade
cíentifica foi elaborado um anúncio nos motores de pesquisa da google, yahoo
e sapo. Para anunciar o website no google usou-se uma aplicação chamada
Webmaster Tools, onde constam várias ferramentas desde a inserção de
palavras chave relacionadas com o projecto até à configuração e validação de
um ficheiro sitemap.xml que contém todos os links do portal.
Figura 7 - Configurações para o anúncio do portal schoolsenses na webmasters tool do Google.
Página - 11
13. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.2 – Google Earth
2.2.1 - Objectivos
Na segunda parte do plano de trabalhos do bolseiro cabia a função de adaptar
no GE um sistema de fórum dinâmico, que ficasse disponível para cada
placemark de um determinado KML. A intenção é que uma criança num
conjunto de mensagens, num dado placemark possa adicionar e/ou editar essa
mesma dentro do balão do GE. Para tal, esse fórum deveria ir buscar as
mensagens guardadas na base de dados e ter capacidade de edição e
inserção de novas mensagens. Foi necessário criar uma tabela nova no
modelo de dados que guardasse os caminhos de pastas de um determinado
kml.
A cargo de outro investigador do projecto schoolsenses@internet existe já uma
aplicação de onde é possivel enviar sms e mms para um endereço de email, e
posteriormente fazer o parsing para uma base de dados. Paralelamente à base
de dados está presente um sistema de servidor de kml, cujo objectivo é
carregar um dado ficheiro KML para depois ser mostrado no GE. A ideia seria
partilhar a mesma tabela da base dados e no fórum, por meio da acção dos
alunos, as mensagens inseridas (na BD de uma forma georeferenciada)
poderem ser alteradas.
2.2.2 – Adaptação ao programa Google Earth
O Google Earth é um programa desenvolvido e distribuído pela Google, cuja
função é apresentar um modelo tridimensional do globo terrestre, construído a
partir de fotografias de satélite obtidas em fontes diversas. Desta forma, o
programa pode ser usado simplesmente como um gerador de mapas
bidimensionais e fotos de satélite ou como um simulador das diversas
paisagens presentes no Planeta Terra. Com este programa, é possível
identificar lugares, construções, cidades, paisagens, entre outros elementos. O
programa é similar, embora mais complexo, ao serviço também oferecido pelo
Google conhecido como Google Maps.
Página - 12
14. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.2.3 - Actualização do google earth no portal com o
novo plugin do google earth airlines em JAVA
De ínicio o GE era uma aplicação stand alone, mas com o passar do tempo
apareceram third party plugins que vieram ajudar à implementação do GE em
páginas web. Através do código que o google earth airlines (GEA)
disponibilizou online, foi possivel adicionar ao portal do schoolsenses a
funcionalidade de navegação pelo globo, com grande parte das ferramentas já
oferecidas no GE. Com os últimos plungins do GEA há já a possiblidade de se
poder sobrevoar cidades dentro dum cockipt de avião e até fazer captura de
videos das nossas viagens pelo globo. O trabalho desenvolvido teve em vista a
reposição do novo código em Java cedido pelo GEA, que é chamado na página
googleearth.aspx, como podemos ver na Figura 8.
Figura 8 - Plugin do google earth airlines embutido no portal schoolsenses@internet
Página - 13
15. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.2.4 – Construção de KML’s
O nascimento da aplicação GE começa com a compra da empresa Keyhole por
parte da Google em 2004. Esta aplicação usa ficheiros do tipo KML, ou KMZ
(versão compactada do KML). A Keyhole Markup Language – KML – é uma
linguagem hierárquica baseada em XML utilizada pelo Google Earth para
representar elementos como linhas, imagens e polígonos. Uma ampla
documentação da linguagem, incluindo exemplos e tutoriais, encontra-se
disponível na Internet [12].
Apresenta-se abaixo o código de uma estrutura básica de um ficheiro KML.
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.0">
<Placemark>
<description>ESEV</description>
<name>Escola Superior de Tecnologia Viseu</name>
<Point>
<coordinates> 40°39'36.51, 7°54'49.54, 0</coordinates>
</Point>
</Placemark>
</kml>
Na Figura 9 faz-se referência a um programa de criação de informação num
determinado placemark, é o Northgates KML Editor, que permite arrastar
ficheiros a partir de qualquer ponto, salvar todo ou uma porção do kml e fazer
uma pré-visualização das alterações no editor directamente no GE. Pode-se
ainda inserir videos, sons, uma lista de imagens, mudar o estilo dos balões,
fazer pausa e recomeço durante a viagem num voo picado sobre o globo. Esta
aparenta ser a ferramenta perfeita para um utilizador que pretende produzir
conteúdos KML.
Figura 9 - Edição de placemarks no programa Northgates KML Editor
Página - 14
16. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.2.5 – Validação e correcção de placemarks
elaborados nas oficinas
Ao longo das várias worshops desenvolvidas planificaram-se actividades para
exploração do GE por parte das crianças. Numa primeira fase da actividade era
pedido ás crianças para localizarem as suas escolas. Um numero significativo
de crianças usavam para esta tarefa a palete de pesquisa e inseriam
directamente a morada, as restantes optavam apenas por clicar no globo até
chegarem ao destino pretendido. A Figura 10 apresenta alguns dos pontos
criados pelas crianças da Escola Costa Cabral na cidade do Porto. Alguns dos
pontos enviados pelo telemóvel com GPS ficaram em coordenadas erradas, e
foi necessário a recolocação correcta pelo administrador.
Figura 10 - Placemarks da workshop da Escola Costa Cabral, enviados por telemóvel com GPS
para a base de dados do schoolsenses
Página - 15
17. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.2.6 – Pesquisa de soluções para implementar um
fórum no google earth
De entre os vários sistemas de informação geográfica disponibilizados na
Internet, o Google Earth (GE) é um caso de significativo sucesso. Norman
justifica este facto pelas funcionalidades que este sistema oferece, referindo a
capacidade de sobrevoar suavemente pelo globo, ou de descer em voo picado
para um ponto específico, como uma experiência única e emocionalmente
envolvente. A aplicação Web SchoolSenses@Internet é composta por três
módulos, como podemos ver na Figura 11: servidor Google Maps, servidor de
conteúdos e interface com o utilizador. O servidor Google Maps é onde estão
armazenadas as informações que compõem os mapas utilizados pela
ferramenta. Ao iniciar, a aplicação contacta o servidor Google Maps e recebe a
API JavaScript para manipulação dos mapas. O servidor de conteúdos é
responsável pelo armazenamento das informações fornecidas pelos alunos,
que podem ser ficheiros de imagens, conteúdos em hipertexto e coordenadas
geográficas (latitude e longitude). Todas estas informações são armazenadas
em ficheiros XML.
Figura 11 - Arquitectura do sistema schoolsenses@internet
O que se pretende implementar no GE (disponível no portal schoolsenses) é
um sistema de KML’s dinâmicos e que seja possível fazer pesquisas aos vários
KML’s (através de queries à base de dados), como mostra a Figura 12 .
Figura 12 – Esquema do funcionamento dinâmico dos KML’s controlável por queries feitas à bases
de dados.
Página - 16
18. Projecto SchoolSenses@Internet - Relatório – Julho 2008
As mensagens enviadas por um telemóvel com GPS dão entrada num servidor
de email. Uma das mensagens transporta as coordenadas do ponto onde se
fez a mensagem. A outra mensagem transporta os conteúdos multimédia tais
como imagens, texto, som e video. No momento em que as mensagens dão
entrada no servidor e email é feito um parsing e são criadas pastas no servidor
KML (com a data destas) e posteriormente este caminho de pastas fica
guardado na base de dados.
Figura 13 - Exemplo da recepção de dois mails provenientes de um telemóvel com gps.
Após termos a base de dados preenchida com registos de mensagens, o
próximo objectivo consistia em pegar num KML com mensagens, e poder
adicionar ou editar estas, mas este teria que guardar as informações pessoais
do sujeito e a data de edição.
Ao fazer um estudo sobre a API do GE, verificou-se que os únicos elementos
que era possivel embutir dentro de um balão do GE, teriam que ser construídos
em flash. Pensou-se na possiblidade de construir um sistema de fórum que
consegui-se ler os ficheiros KML. Para além disso era necessário que, no
momento em que a pessoa se regista-se no portal do schoolsenses, a variável
de sessão do ulilizador identifica-se este utilizador no fórum (em flash). A
barreira a ultrapassar seria a forma como apanhar a variável de utilizador para
dentro do fórum flash concebido em action scrip. O objectivo era que esse
fórum flash fosse lançado no momento em que alguém carrega-se num
placemark no GE, de seguida aparecia um formulário semelhante ao da Figura
14, e então haveria possiblidade de adicionar uma mensagem (ou de alterar
uma já feita). Esta foi a possiblidade que se encontrou mais viável, visto que
não podemos usar iframes no interior de um balão de GE.
Página - 17
19. Projecto SchoolSenses@Internet - Relatório – Julho 2008
Figura 14 - XML flash guestbook
Na Figura 15 podemos ver com maior pormenor, o guestbook que foi
implementado no GE, através do XML flash guestbook. Como podemos ver ao
lado do balão temos outros placemarks com o ícone do schoolsenses. A visão
das mensagens que se pretendia ter era que quando se carregasse num outro
placemark, este já abrisse um novo XML Guestbook. Como em cada placemark
os elementos embutidos podem ser diferentes do próximo placemark, teriamos
uma chamada para vários guestbooks em flash. O único problema que se põe
é o da escalibilidade, pois o facto de haver um guestbook para cada placemark
pode tornar-se algo insustentável.
Figura 15 - XML flash guestbook embutido no balão do GE.
Página - 18
20. Projecto SchoolSenses@Internet - Relatório – Julho 2008
Até ao momento existe apenas um fórum implementado dentro do ambiente do
GE e este tem o nome de GEBoards. O GEboards é o primeiro fórum
funcional que existe inteiramente dentro do Google Earth. Pode enviar-se
mensagens sobre todas a posições, eventos no GE. Funciona apenas
em máquinas windows e é necessário ter o GE versão 4.2 ou superior.
O forte desta aplicação é que assenta sobre um fórum ao qual se pode
aceder num browser, independentemente do GE, em que um utilizador
necessita de se registar e criar as várias mensagens. De momento o
código ainda não está disponiblizado, mas esta era sem dúvida uma
óptima aplicação a implementar no GE do portal schoolsense@internet.
Figura 16 - Exemplo de um fórum disponivel no google earth. GE Boards
2.3 – Base Dados Schoolsenses@Internet
Numa fase incial previu-se um certo número de tabelas interligadas entre si
para guardar as informações necessárias: informação de oficinas, de
utilizadores, de clipart, de artigos, sentidos, professores, dados sobre escolas e
localizações. Com a progessão do projecto, desencadeou-se um novo leque de
necessidades principalmente com o clipart, pois a este elemento teriamos que
juntar conceitos novos, tais como categorias e subcategorias de sentigos
associados a um tipo de objecto. Para além disso, existiriam também as
mensagens enviadas para o google earth que estariam em outra base de
dados separada numa tecnologia diferente. Como tal, teve que se repensar
novamente várias soluções a implementar no modelo de dados.
Página - 19
21. Projecto SchoolSenses@Internet - Relatório – Julho 2008
2.3.2 – Categorização e Reestruturação do modelo de
dados do Clipart
Os elementos multimédia são o componente principal do projecto
schoolsenes@internet. Nesta zona é importante guardar informação acerca de
um objecto criado. Vejamos por exemplo: o objecto “cafeteira” podemos inseri-
lo dentro da categoria “água”, e também numa subcategoria “atmosférica”. Para
além disso este objecto pode representar vários sentidos como por exemplo:
visão/cores (e aí podemos dizer que é cinzento). No entanto pode haver outro
objecto com outro atributo, então a questão principal é como saber como
distinguir a qual cada sentido pertencia a um dado objecto. Para tal foi
necessário recorrer a uma nova modelação dos dados. Como podemos ver na
Figura 17, as tabelas encontram-se relacionadas com o clipart e com os
sentidos. Na imagem da direita da Figura 17 é possivel ver que um dado
sentido que está associado a vários objectos e pode ter interpretações
diferentes. Para guardar estes dados teve que usar-se três tabelas auxiliares a
Sentidos_Categorias_T1, Obj_Desc_Sent_T2 e a Obj_Desaf_T3 e assim
conseguimos apanhar sempre o IdObjecto e IdSentido que é relevante. Foi no
clipart onde se modificou a maioria das relações na base de dados.
Figura 17 - Tabelas relacionadas com o clipart e os sentidos.
Página - 20
22. Projecto SchoolSenses@Internet - Relatório – Julho 2008
3 – Plano de Tarefas
O trabalho levado a cabo durante estes seis meses de bolsa concedida,
tiveram o seguinte plano de tarefas:
Figura 18 - Gráfico de Gant com data das tarefas
a) “Catching up”
Data ínicio: 15 Janeiro 2008
Data fim: 31 Janeiro 2008
Descrição: Leitura de artigos, informação sobre o projecto.
b) Configuração do servidor
Data ínicio: 1 de Fevereiro 2008
Data fim: 13 de Fevereiro 2008
Descrição: Configuração onde o website schoolsenses estava alojado
c) Implementação
Data ínicio: 14 Fevereiro 2008
Data fim: 6 Maio 2008
Descrição: Implementação de módulos no portal.
d) Estudo GE
Data ínicio: 7 Maio 2008
Data fim: 16 Maio 2008
Descrição: Estudo de aplicações que poderiam ser usadas no GE.
e) Implementação Soluções GE
Data ínicio: 19 Maio 2008
Data fim: 6 Junho 2008
Descrição: Implementação de aplicações no GE.
f) Relatório
Data ínicio: 9 Junho 2008
Data fim: 13 Junho 2008
Descrição: Elaboração de um relatório.
Página - 21
23. Projecto SchoolSenses@Internet - Relatório – Julho 2008
4 – Tecnologias Usadas
4.1 – ASP.NET
O ASP.NET é a plataforma da Microsoft para o desenvolvimento de aplicações
Web, e é o sucessor da tecnologia Active Server Pages (ASP). É um
componente do IIS (Internet Information Services) que permite através de uma
linguagem de programação integrada na framework .NET, criar páginas
dinâmicas. Não é nem uma linguagem de programação como o VBScript, PHP,
nem um servidor Web como IIS ou o Apache.
O ASP.NET é baseado no framework .NET herdando todas as suas
características, por isso, como qualquer .NET, as aplicações para essa
plataforma podem ser escritas em várias linguagens, como o C# e o Visual
Basic .NET.
Embora se possa já desenvolver aplicações ASP.NET, utilizando somente o
bloco de notas e o compilador .NET, o ambiente mais comum das aplicações é
o Visual Studio .NET, que já possui algumas características que facilitaram o
nosso trabalho em termos de programação, através de componentes visuais
para a criação de formulários para as páginas web.
Uma aplicação web desenvolvida com tecnologia ASP.NET pode reutilizar
código de qualquer outro projecto escrito para a plataforma .NET, mesmo que
em uma linguagem diferente. Uma página ASP.NET escrita em VB.NET pode
chamar componentes escritos em C# ou WebServices escritos em C++, por
exemplo. Ao contrário da tecnologia ASP, as aplicações ASP.NET são
compiladas antes da execução, trazendo sensível ganho no desempenho.
As aplicações Web ASP.NET necessitam da framework .NET e do servidor IIS,
para executar, pelos menos na plataforma Windows.
Página - 22
24. Projecto S
SchoolSenses
s@Internet - Relatório – Julho 2008
Fig
gura 19 - Visã global da framework .N
ão f NET
A pla
ataforma .Net é um conjunto d tecnolog
de gias que fo projecta para mudar
oi ado m
o co
onceito de desenvol
e lvimento d aplicaçõ
de ões para a Internet A platafo
t. orma
.NET contemp o dese
T pla envolvimen de apl
nto licações e
escaláveis e distribuídas,
forne
ecendo no
ovas possibilidades p
para const
truir aplica
ações base
eadas em Web
Serv
vice, supor
rtando a inf
fra-estrutura da Inter
rnet, incluin HTTP e XML.
ndo
A pla
ataforma .N
NET basic
camente inc
clui:
• .NET fra
amework
• .NET Bu
uilding Block Service
es
• Visual S
Studio .Net
t
• .Net Ent
terprises S
Services(20 family)
003 )
A .N
NET framew
work é con
nstituída p duas partes princ
por p cipais: a C
CLR - Com
mmon
Lang
guage Ru
untime e a .NET Framewor class l
rk library. A primeira é a
resp
ponsável p
pela indepe
endência d linguag
de gem de pro
ogramação e a segunda
o
dispo
onibiliza o principa recurso de prog
os ais os gramação, além de incluir os três
princ
cipais componentes: ASP.NET Windows Forms e o ADO.NE
T, s ET.
Página - 23
3
25. Projecto SchoolSenses@Internet - Relatório – Julho 2008
O coração da plataforma .NET é o CLR (Common Language Runtime), que é
uma aplicação similar a uma máquina virtual que se encarrega de providenciar
a execução das aplicações para ela escritas. São oferecidos a estas aplicações
numerosos serviços que facilitam o seu desenvolvimento e manutenção que
favorece confiança e segurança.
O CLR é o verdadeiro responsável pela interoperabilidade entre as linguagens
suportadas pela plataforma .Net. O compilador de cada linguagem segue uma
série de padrões (Common Language Specification) para compilar seus
códigos, por isso as outras linguagens conseguem "entender" as classes e os
métodos, dentre outras informações, que essa linguagem definiu.
Por exemplo, quando se escreve uma classe em SmallTalk.Net e se compila, o
compilador de SmallTalk não irá compilá-la da mesma forma que compilaria
fora da plataforma, esse vai compilar segundo uma série de especificações que
o IL (Intermediate Language) vai gerar. Quando essa classe tiver que ser
acedida por uma outra, escrita em C#, por exemplo, a plataforma .Net
encarrega-se de ler a IL gerada e expôr a classe que foi criada.
No desenvolvimento do software, uma framework é uma estrutura de suporte
definida em que um outro projecto de software pode ser organizado e
desenvolvido. Uma framework pode incluir programas de suporte, bibliotecas
de código, linguagens de script e outros softwares para ajudar a desenvolver e
juntar diferentes componentes de um projeto de software.Frameworks são
projetados com a intenção de facilitar o desenvolvimento de software,
habilitando designers e programadores a gastarem mais tempo determinando
nas exigências do software do que com detalhes de baixo nível do sistema.
Página - 24
27. Projecto SchoolSenses@Internet - Relatório – Julho 2008
Na Figura 20 podemos ver de como a tecnologia Cliente/Servidor ASP.NET
funciona. Cria-se um projecto no Visual Studio .NET, editando os ficheiros
remotamente ou directamente do nosso computador. Uma vez que a pasta da
aplicação esteja no servidor, o código ASP.NET é corrido unicamente no
servidor, e aos browsers de quem está a visitar a aplicação só chegará código
HTML. Podemos ver ainda que durante este processo o servidor pode efectuar
transacções com o servidor da base de dados.
Aquando a criação de um novo projecto de uma aplicação Web, é necessário
saber que ficheiros essa aplicação vai ter, e qual a estrutura que esses
ficheiros disponibilizam. Para tal é importante saber com que tipos de ficheiros
nos regemos aquando a criação de uma aplicação Web no Visual Studio .NET.
A Figura 21 mostra os tipos de ficheiros existentes de uma aplicação Web.
Tipo de Ficheiro Extensão
Ficheiro de Solução de Projecto .snl ou .suo
Ficheiros de Projecto .vbproj ou .csproj
Formulários - .aspx
Serviços Web- .asmx
Ficheiros da Aplicação Web Classes ou code-behind - .vb ou .cs
Classes Globais Aplicação - .asax
Ficheiro Configuração - Web.config
Componentes do Projecto Ficheiros - .dll
Figura 21 - Ficheiros de uma aplicação web
Página - 26
28. Projecto S
SchoolSenses
s@Internet - Relatório – Julho 2008
Figura 22 - Exemplo d código de um ficheiro .a
2 de u aspx vazio
Na F
Figura 22 podemos ver um fic
cheiro de aplicação Web do t
tipo .aspx, que
,
norm nstruímos o nossos formulário
malmente é onde con os os.
Todo estes ficheiros s
os são guard
dados de uma form estrutu
ma urada, que no
er
serv
vidor, quer no disco rígido de um computa
m ador norma De seguida, na Figura
al.
23 mostramo a estru
os utura dos ficheiros de uma aplicaçã Web num
s s a ão
computador no
ormal á esq
querda, e num servid à direit
dor ta.
Figura 2 - Estrutura de Pastas de uma aplica
23 a d ação Web
Página - 27
7
29. Projecto SchoolSenses@Internet - Relatório – Julho 2008
Existem três maneiras de implementarmos código no ASP.net. Podemos
simplesmente misturar código HTML com Visual Basic (VB) no mesmo ficheiro
.aspx, podemos implementar no mesmo ficheiro, mas separar o código por
secções, distinguindo o código HTML do VB, e por fim e na nossa opinião, a
melhor forma é termos um ficheiro separado com as funções de VB, ficando
com o mesmo nome do ficheiro .aspx, mas com uma extensão diferente
(.aspx.vb). Na Figura 24 podemos ter uma ideia de como funcionam as páginas
com Code-Behind.
Figura 24 - Páginas Code-Behind
De maneira a compreendermos como trabalham as páginas Code-Behind,
precisamos de saber que têm que se criar ficheiros separados para a interface
e para a lógica de negócio. Podemos fazer isto usando a directiva @Page para
ligar os dados aos ficheiros.
Figura 25 - Ligação de código de páginas Code-Behind
De seguida vamos explicar como configurar a segurança de acesso ao código
de ASP.NET. Por norma, as aplicações Web que funcionam com confiança
total não têm qualquer restrição de permissões. Para modificar os níveis de
confiança da segurança de acesso ao código no ASP.NET, é necessário
Página - 28
30. Projecto SchoolSenses@Internet - Relatório – Julho 2008
estabelecer um parâmetro no Machine.config ou no Web.config e configurar a
aplicação como esta sendo parcialmente de confiança.
O elemento <trust> em Machine.config controla se a segurança de acesso ao
código vai ser activada ou não para uma aplicação Web. Deve-se abrir o
ficheiro Machine.config, e procurar por "<trust>", como está representado na
Figura 26 - Configurar a segurança de acesso ao código ASP.NET
Com o nível de confiança definido como "Full", a segurança de acesso ao
código é efectivamente desactivada porque nenhuma exigência de permissões
fica no caminho das tentativas de acesso aos recursos. Esta é a única opção
para as aplicações Web ASP.NET criadas na .NET Framework versão 2.0.
Descendo na lista de "Full" até "Minimal", cada nível retira mais permissões,
restringindo ainda mais a capacidade da nossa aplicação aceder a recursos
protegidos e realizar operações privilegiadas. Conforme o nível, maior será o
isolamento da aplicação.
4.2 – Linguagem SQL SERVER
Structured Query Language, ou Linguagem de Consulta Estruturada ou SQL, é
uma linguagem de pesquisa declarativa para bases de dados relacionais (base
de dados relacional). Muitas das características originais do SQL foram
inspiradas na álgebra relacional.
O SQL foi desenvolvido originalmente no início dos anos 70 nos laboratórios da
IBM em San Jose, dentro do projecto System R, que tinha por objectivo
demonstrar a viabilidade da implementação do modelo relacional proposto por
E. F. Codd. O nome original da linguagem era SEQUEL, acrónimo para
"Structured English Query Language" (Linguagem de Consulta Estruturada em
Página - 29
31. Projecto SchoolSenses@Internet - Relatório – Julho 2008
Inglês), vindo daí o facto de, até hoje, a sigla, em inglês, ser normalmente
pronunciada "síquel".
A linguagem SQL é um grande padrão de bases de dados. Isto deve-se à sua
simplicidade e facilidade de uso. O SQL diferencia-se das outras linguagens de
consulta a bases de dados no sentido em que uma consulta SQL especifica a
forma do resultado e não o caminho para chegar a ele. O SQL é uma
linguagem declarativa, em oposição a outras linguagens procedimentais. Isto
reduz o ciclo de aprendizagem daqueles que se iniciam na linguagem.
Embora o SQL tenha sido originalmente criado pela IBM, rapidamente surgiram
vários "dialectos" desenvolvidos por outros produtores. Essa expansão levou à
necessidade de ser criado e adaptado um padrão para a linguagem. Esta tarefa
foi realizada pela American National Standards Institute (ANSI) em 1986 e ISO
em 1987.
O SQL foi revisto em 1992 e a esta versão foi dada o nome de SQL-92. Foi
revisto novamente em 1999 e 2003 para se tornar SQL1999 (SQL3) e
SQL2003, respectivamente. O SQL1999 usa expressões regulares de
emparelhamento, queries recursivas e triggers. Também foi feita uma adição
controversa de tipos não-escaláveis e algumas características de Object
Oriented. O SQL 2003 introduz características relacionadas ao XML,
sequências padronizadas e colunas com valores de auto-generalização
(inclusive colunas-identidade).
DML - Linguagem de Manipulação de Dados
Primeiro há os elementos da DML (Data Manipulation Language - Linguagem
de Manipulação de Dados). A DML é um subconjunto da linguagem usada para
seleccionar, inserir, actualizar e apagar dados.
• SELECT é o normalmente mais usado do DML, comanda e permite ao
utilizador especificar uma query como uma descrição do resultado
desejado. A questão não especifica como os resultados deveriam ser
localizados.
Página - 30
32. Projecto SchoolSenses@Internet - Relatório – Julho 2008
• INSERT é usada para somar uma fila (formalmente um tuplo) a uma
tabela existente.
• UPDATE para mudar os valores de dados numa fila de tabela existente.
• DELETE permite remover filas existentes de uma tabela.
• BEGIN WORK (ou START TRANSACTION, dependendo do dialecto
SQL) pode ser usado para marcar o começo de uma transacção de
bases de dados que pode ser completada ou não.
• COMMIT envia todos os dados das mudanças permanentemente.
• ROLLBACK faz com que as mudanças nos dados existentes desde que
o último COMMIT ou ROLLBACK sejam descartadas.
COMMIT e ROLLBACK interagem com áreas de controlo como transacção e
alocação. Ambos terminam qualquer transacção aberta e liberam qualquer
cadeado ligado a dados. Na ausência de um BEGIN WORK ou uma declaração
semelhante, a semântica de SQL é dependente da implementação.
DDL - Linguagem de Definição de Dados
O segundo grupo é a DDL (Data Definition Language - Linguagem de Definição
de Dados). Uma DDL permite ao utilizador definir tabelas novas e elementos
associados. A maioria das bases de dados de SQL comerciais tem extensões
proprietárias no DDL.
Os comandos básicos da DDL são:
• CREATE cria um objecto (uma Tabela, por exemplo) dentro da base de
dados.
• DROP apaga um objecto do banco de dados.
Alguns sistemas de bases de dados usam o comando ALTER, que permite ao
Página - 31
33. Projecto SchoolSenses@Internet - Relatório – Julho 2008
utilizador alterar um objecto, por exemplo, adicionando uma coluna a uma
tabela existente.
Outros comandos DDL:
• ALTER TABLE
• CREATE INDEX
• ALTER INDEX
• DROP INDEX
• CREATE VIEW
• DROP VIEW
DCL - Linguagem de Controle de Dados
O terceiro grupo é o DCL (Data Control Language - Linguagem de Controle de
Dados). DCL controla os aspectos de autorização de dados e licenças de
usuários para controlar quem tem acesso para ver ou manipular dados dentro
do banco de dados.
Duas palavras-chaves da DCL:
• GRANT - autoriza ao utilizador a executar ou configurar operações.
• REVOKE - remove ou restringe a capacidade de um utilizador executar
operações.
Outros comandos DCL:
• ALTER PASSWORD
• CREATE SYNONYM
Página - 32
34. Projecto SchoolSenses@Internet - Relatório – Julho 2008
4.3 – Linguagem AJAX
AJAX (acrónimo em língua inglesa de Asynchronous Javascript And XML) é o
uso sistemático de tecnologias providas por browsers, como Javascript e XML,
para tornar páginas mais interactivas com o utilizador, utilizando-se de
solicitações assíncronas de informações. AJAX não é somente um novo
modelo, é também uma iniciativa na construção de aplicações Web mais
dinâmicas e criativas. AJAX não é uma tecnologia, são realmente várias
tecnologias trabalhando juntas, cada uma fazendo a sua parte, oferecendo
novas funcionalidades. O AJAX incorpora no seu modelo.:
Apresentação baseada em padrões, usando XHTML e CSS;
Intercâmbio e manipulação de dados usando XML e XSLT;
Recuperação assíncrona de dados usando o objecto XMLHttpRequest, e
JavaScript unindo todas elas em conjunto.
O modelo clássico de aplicação Web trabalha assim: A maioria das acções do
utilizador na interface dispara uma solicitação HTTP para o servidor Web. O
servidor processa algo, recuperando dados, realizando cálculos, conversando
com vários sistemas legacy , e então retorna uma página HTML para o cliente.
É um modelo adaptado do uso original da Web como um agente de hiper texto,
porém o que faz a Web boa para hipertexto, não necessariamente a faz boa
para aplicações de software.
Esta aproximação possui muito dos sentidos técnicos, mas não faz tudo que
um utilizador experiente poderia fazer. Enquanto o servidor está a fazer o seu
trabalho, o que é que o utilizador está a fazer? O que é certo, é que ele esteja a
esperar. E a cada etapa numa tarefa, o utilizador aguarda mais uma vez.
Obviamente, se nós estivéssemos a projectar a Web a partir do zero para
aplicações, não faríamos com que os utilizadores esperassem sem alcançar
nada. Uma vez que a interface está carregada, porque é que a interacção do
utilizador deveria parar a cada vez que a aplicação precisasse de algo do
Página - 33
35. Projecto SchoolSenses@Internet - Relatório – Julho 2008
servidor? Na realidade, é porque o utilizador deveria ver a aplicação e recorrer
ao servidor várias vezes?
A maior vantagem das aplicações AJAX é que elas correm no próprio browser.
Então, para estar apto a executar aplicações AJAX, bastar possuir algum dos
browsers modernos, ou seja, lançados após 2001. São eles: Mozilla Firefox,
Internet Explorer 5+, Opera, Konquero e Safari.
Figura 27 - Modelo clássico com e sem AJAX
Página - 34
36. Projecto SchoolSenses@Internet - Relatório – Julho 2008
4.4 – Linguagem KML
Como já foi descrito em cima a linguagem KML é uma linguagem hierárquica
baseada em XML utilizada pelo Google Earth. Este modelo abaixo na figura
mostrado mostra de que forma um utilizador remoto pode aceder a um servidor
de base de dados que contenha caminhos para pastas com ficheiros KML.
Figura 28 - Servidor de KML's
No âmbito do projecto schoolsenses, usou-se a tecnologia KML juntamente
com o ASP.NET para conseguir trabalhar dados dinamicamente, como
podemos ver mais detalhadamente um exemplo de código aplicacional onde é
usada uma função privada que lê e escreve num determinado ficheiro KML.
Private Sub Page_Load () Handles MyBase.Load
With Page.Response
.Clear(); .CacheControl = "no-cache“; .Expires = -1
.AddHeader("Pragma", "no-cache" & vbCrLf)
.AppendHeader("content-disposition",
"inline; filename=ge.kml")
.Write("<?xml version=“1.0” ?>” & vbCrLf)
line=“kml xlms=“http://earth.google.com/kml/2.0” >”
.Write (line & vbCrLf)
.WriteFile(“filename.kml" & vbCrLf)
.Write("</kml>" & vbCrLf)
End with
End Sub
Página - 35
37. Projecto SchoolSenses@Internet - Relatório – Julho 2008
5 – Estrutura do Código
O código da aplicação está estruturado da seguinte maneira:
• Páginas de acesso geral .aspx
• Pasta “admin” – Páginas de acesso exclusive a administradores
• Pasta “Aplications” – plugins disponiveis para download
• Pasta “App_Code”
o Aplicação geral e ligações à Base Dados
o Pasta “DL” – Multilanguage classes.
• Pasta “App_Data” – Ficheiros da Base de dados Sql Server.
• Pasta “App_GlobalResources” – Multilanguage support files
• Pasta “App_LocalResources” – Multilanguage support files
• Pasta “Bin” – bin files
• Pasta “Controlos” –Classes Ajax, suporte de animação.
• Pasta “css” – Ficheiros Cascading Style Sheets.
• Pasta “Dados” – Objectos do SensesClipArt e pasta partilhada para o
uso do WebFTP
o Pasta “Files” – All kind of files less images.
o Pasta “Imagem”
Pasta “Fullsize” – imagens tamanho real.
Pasta “Thum” –imagens pequenas.
• Pasta “images” – Imagens para design do portal
• Pasta “swf” – animações flash para design do portal
Página - 36
38. Projecto SchoolSenses@Internet - Relatório – Julho 2008
6 - Referências
• M. J. Silva, M. C. Gomes, and M. J. Marcelino, Geo-referenced
multisensory information: A productive concept for elementary school. In
Proceedings of the VIII IASTED International Conference on Computers
and Advanced Technology in Education (August, 2005), 405-410.
• Laurel, B. Computers as theatre. Reading, Mass: Addison-Wesley
Publishing Company, 1991.
• Druin, A. Cooperative Inquiry: Developing New Technologies for Children
With Children. In Proceedings of Human Factors in Computing Systems
(CHI 99). ACM Press, 1999, 223-230.
• N. Bouvin et al. Tools of contextualization: Extending the classroom to
the field. In Proceedings of the 4th International Conference for
Interaction Design and Children (June, 2005), 24-31.
• Google Earth KML Tutorial. http://www.keyhole.com/kml/kml_tut.html.
Página - 37