soutenancex

berserkarithmeticInternet and Web Development

Dec 14, 2013 (3 years and 5 months ago)

98 views

Authors:

RIEFOLO Anthony

FANCHETTE Edouard

Tutors :

BETBEDER Marie
-
Laure

REFFAY Christophe

MULCE project

Interface to display XML
objects

1

Summary

I.
What

is

MULCE
project

?

a.
Brief

presentation
.

b.
XML corpus.

c.
Goal of the
project
.

II.
Technologic

choices
.

a.
Browse

the XML.

b.
JavaScript
framework

for web applications:
ExtJS
.

c.
XML to
ExtJS
.

III.
The interface.

a.
Layout

of the interface.

b.
Its

implementation
.

2

I.
What

is

MULCE
project

?


3

a.
Brief

presentation
.



MULCE : The
Mu
lti
-
modal
L
earning
C
orpus
E
xchange.



A data
-
sharing system which allow researches to
access to different corpora.



Goal : Provide a
learning corpus sharing platform
.

What is MULCE project ?

Brief presentation.

Technologic choices.

The interface.

4

I.
What

is

MULCE
project

?

b.
XML corpus.





What

is

MULCE
project

?

XML corpus

Technologic choices.

The interface.

5

I.
What

is

MULCE
project

?



XML : E
x
tensible
M
ark
-
up
L
anguage
.




Allow

to structure information in
treelike

fields
.




Structure
validated

by a
schema
.

b.
XML corpus.

Example
XML
shema

of a forum
act

:



What is MULCE project ?

XML corpus and goal of the project
.

Technologic choices.

The interface.

6

I.
What

is

MULCE
project

?

c.
Goal of the
project
.



Build a visualization tool of different objects con
-

tained

in a corpora.



Consultation of corpus
with

user
-
friendly

interface

What

is

MULCE
project

?

Goal of the
project
.

Technologic

choices
.

The interface.

7

I.
What

is

MULCE
project

?

II.
Technologic

choices
.



8

II.
Technologic

choices
.


a.
Browse

the XML.



To
gather

information for traitement.



It
is

possible
thanks

to
PHP

using

XPATH
.





What is MULCE project ?




Technologic choices.

Browse the XML.

The interface.

9

a.
Browse

the XML.

Example

of XPATH query:




Gather the name of an actor giving his “id”

What is MULCE project ?




Technologic choices.

Browse the XML.

The interface.

10

II.
Technologic

choices
.


$
xml = new Domxpath($dom);

$
elements = $xml
-
>query(‘//
mcesid:memberlist
/
mcesid:actors
/
mcesid:actor
[@
id
="'.$
actor_id
.'"]');

foreach
($elements as $
noeud
) {


return
$
noeud
-
>getAttribute(“
designation
”);

}



<mcesid:memberlist>


<mcesid:actors>


<mcesid:actor
id
="Al1"
designation
="Jane" status="learner" institution="Open University" Country="United Kindom" Gender="female" Age="46"/>


<mcesid:actor
id
="Al2"
designation
="Bruce" status="learner" institution="Open University" Country="United Kindom" Gender="male" Age="42"/>


<mcesid:actor
id
="Al3"
designation
="Tony" status="learner" institution="Open University" Country="United Kindom" Gender="male" Age="54"/>


<mcesid:actor
id
="Al4"
designation
="Valerie" status="learner" institution="Open University" Country="U
nited Kindom" Gender="female" Age="54"/>





</mcesid:actors>

</mcesid:memberlist>





Ext JS is a cross
-
browser JavaScript library for building
rich internet applications. It includes:


High performance, customizable UI widgets


Well designed and extensible Component model


An intuitive, easy to use API



What is MULCE project ?




Technologic choices.

JavaScript framework for web applications: ExtJS

The interface.

11

II.
Technologic

choices
.


B.
JavaScript
framework

for web applications:
ExtJS


Examples of tools available in the framework :

grids, trees, forms, toolbar, custom search field,

combobox
, and many more items.


c.
XML to
ExtJS






JSON :
J
ava
S
cript
O
bject
N
otation




-

Portability


-

Simplicity


-

Easy integration to
javaScript


-

lighter treatments that with XML file





What is MULCE project ?




Technologic choices.

XML to ExtJS

The interface.

12

II.
Technologic

choices
.


c.
XML to
ExtJS




What

is

MULCE
project

?




Technologic

choices
.

XML to
ExtJS

The interface.

13

II.
Technologic

choices
.


For example, a menu structure description using JSON notation :

In comparison, the same example in XML format :

c.
XML to
ExtJS




Corpus.xml

Page.php

Framework

JavaScript

ExtJs

Browse

XML

Send

Json Object

Transform into Json

What is MULCE project ?




Technologic choices.

XML to ExtJS

The interface.

14

II.
Technologic

choices
.


III.
The interface


15

III.
The interface


Hierarchical view of tool
spaces

List of acts

Complete visualization of the select act

What is MULCE project ?




Technologic choices.

The interface.

Layout of the interface.

16

a.
Layout

of the interface.


What is MULCE project ?




Technologic choices.

The interface.

Its implementation.

17

III.
The interface


b.
Its

implementation
.


What is MULCE project ?




Technologic choices.

The interface.

Its implementation.

18

b.
Its

implementation
.


III.
The interface


What is MULCE project ?




Technologic choices.

The interface.

Its implementation.

19

III.
The interface


b.
Its

implementation
.


20

Conclusion




Discovery of Xpath and framework ExtJS




Some problems appears.




Meeting every weeks.