Relatorio Bic Schoolsenses@Internet

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

Projecto SchoolSenses@Internet - Relatório – Julho 2008

Página - 1

RELATÓRIO DE BOLSA DE INVESTIGAÇÃO DE

António Manuel Costa Nascimento

[email protected]

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 - 2

Í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 - 3

Í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 - 4

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 - 5

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 - 6

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 - 7

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 - 8

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 - 9

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 - 10

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 - 11

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 - 12

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 - 13

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 - 14

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 - 15

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 - 16

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 - 17

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 - 18

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 - 19

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 - 20

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 - 21

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 - 22

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.

A pla

o co

.NET

forne

Serv

A pla

•

•

•

•

A .N

Lang

resp

dispo

princ

ataforma .

onceito de

T contemp

ecendo no

vice, supor

ataforma .N

.NET fra

.NET Bu

Visual S

.Net Ent

NET framew

guage Ru

ponsável p

onibiliza o

cipais com

Projecto S

Fig

Net é um

e desenvol

pla o dese

ovas possi

rtando a inf

NET basic

amework

uilding Blo

Studio .Net

terprises S

work é con

untime e

pela indepe

os principa

ponentes:

SchoolSenses

gura 19 - Visã

conjunto d

lvimento d

envolvimen

bilidades p

fra-estrutu

camente inc

ck Service

t

Services(20

nstituída p

a .NET

endência d

ais recurso

ASP.NET

s@Internet -

Página - 23

ão global da f

de tecnolog

de aplicaçõ

nto de apl

para const

ra da Inter

clui:

es

003 family)

por duas p

Framewor

de linguag

os de prog

T, Windows

- Relatório –

3

framework .N

gias que fo

ões para

licações e

truir aplica

rnet, incluin

)

partes princ

rk class l

gem de pro

gramação,

s Forms e o

Julho 2008

NET

oi projecta

a Internet

escaláveis

ações base

ndo HTTP

cipais: a C

library. A

ogramação

além de

o ADO.NE

ado para m

t. A platafo

e distribu

eadas em

e XML.

CLR - Com

primeira

o e a seg

incluir os

ET.

mudar

orma

ídas,

Web

mmon

é a

unda

três


Página - 24

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 - 25

Figura 20 - Tecnologia Clinte Servidor ASP.Net


Página - 26

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

Ficheiros da Aplicação Web

Formulários - .aspx

Serviços Web- .asmx

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

Na F

norm

Todo

serv

23

com

Figura 22

malmente é

os estes

vidor, quer

mostramo

putador no

Projecto S

Figura 22

podemos

é onde con

ficheiros s

no disco r

os a estru

ormal á esq

Figura 2

SchoolSenses

2 - Exemplo d

ver um fic

nstruímos o

são guard

ígido de um

utura dos

querda, e

23 - Estrutura

s@Internet -

Página - 27

de código de u

cheiro de

os nossos

dados de

m computa

s ficheiros

num servid

a de Pastas d

- Relatório –

7

um ficheiro .a

aplicação

formulário

uma form

ador norma

s de uma

dor à direit

de uma aplica

Julho 2008

aspx vazio

Web do t

os.

ma estrutu

al. De seg

a aplicaçã

ta.

ação Web

tipo .aspx,

urada, que

uida, na F

ão Web

, que

er no

igura

num


Página - 28

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 - 29

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 - 30

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 - 31

• 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 - 32

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 - 33

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 - 34

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 - 35

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 - 36

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 - 37

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.

Documents

Relatorio Bic Schoolsenses@Internet