lexique langages & documents réfs paul franchi si 4 2011-12 techs sommaire...... 13/01/2014...

LexiqueLexique

Langages & Documents RéfsRéfs

Paul FranchiSI 4

2011-12

TechsTechs

SommaireSommaire

..

..

..

..

.

..

04/18/23 Transparent - 1

Chap IX - RDF

Resource Description Framework

Chap X - AJAX

Asynchronous JavaScript And XML

SommaireSommaire

LexiqueLexique

RéfsRéfs

TechsTechs

..

..

..

..

.

..

Transparent 218/04/23

Sommaire du Cours

Chap I - Documents: Historique, Modèles, Standards et Références

Chap II - HTML: voir le cours CIP1-CMD & HTML5

Chap III - XML: "eXtensible Markup Language", les Bases

Chap IV - DTD: "Document Type Definition"

Chap V - CSS: Feuilles de Styles en Cascades& CSS3

Chap VI - DOM, DHTML: "Domain Object Model "& Programmation

Dynamique en HTML & SPRY & JQuery

Chap VII - XSD: Schémas XML

Chap VIII - XML "Advanced" Processeurs et Dialectes: XPath, Xlink

Chap IX - XSLT: Transformations XML

Chap X - RDF: "Resource Description Framework"

Chap IX - AJAX: "Asynchronous JavaScript And XML"

Savoir-Faire: Know Hows

HTML XHTML CSS JS+DOM MATHML XPATH XLINK XSLT

Etat de l'art:

HTML5 CSS3 SPRY SVG RDF AJAX XUL

SommaireSommaire

LexiqueLexique

RéfsRéfs

TechsTechs

..

..

..

..

.

..


Web EPU courses (in French)

Création & Manipulltion de Document http://www.polytech.unice.fr/~pfz/cmd.html

Introduction to Internet http://rainbow.i3s.unice.fr/iai/ Langages & Documents

http:www.polytech.unice;fr/~pfz/document.html

W3C tutorial : http://www.w3schools.com/

Mozilla Development Center http://developer.mozilla.org/en/docs/Main_Page

W3C, http://www.w3.org/ Web Developer's Bookmarks http://antriksh.com/resources/

Biblio: many issues at EPU's lib

Some Références

SommaireSommaire

LexiqueLexique

RéfsRéfs

TechsTechs

..

..

..

..

.

..


Documentation et Manuels Documents du web

liste de balises HTML

code des couleurs RVB

code HTML des caractères ISO

liste des extensions de fichiers (formats)

Expressions Rationnelles

Manuels. Expressions régulières sous Em

acs

Recherche et remplacement sous Emacs

compléments Emacs

grep sous Unix

Tutoriaux du Web W3C : http://www.w3schools.com/

CSS Play : http://www.cssplay.co.uk/index

Zen Garden :

http://www.csszengarden.com/tr/francais/

CSS in10 steps :

http://www.barelyfitz.com/screencast/html-training/css/positioning/

10 steps to better CSS:

http://shapeshed.com/journal/10_steps_to_better_css/

SommaireSommaire

LexiqueLexique

RéfsRéfs

TechsTechs

..

..

..

..

.

..


Références Web

SommaireSommaire

LexiqueLexique

RéfsRéfs

TechsTechs

..

..

..

..

.

..


API – Application Programming Interface ANSI – American National Standards Institute ASCII – American Standard Code for Information Interchange (128 car.) AJAX – Asynchronous JavaScript & XML CSS – Cascading Style Sheets DHTML – Dynamic HTML DOM – Document Object Model DTD – Document Type Definition HTML – HyperText Markup Language HTTP – HyperText Transfer Protocol ISO - International Standards Organization Mozilla - Fondation (global community for free and open Internet software)) MVC - Model View Controler RDF - Resource Description Framework REST - Representational State Transfer RIA - Rich Internet Application RSS - Really Simple Syndication SGML - Standard Generalized Markup Language SOAP - Simple Access Object Protocol SPRY - Extensions JS pour HTML - Adobe Lab. SVG - Scalable Vector Graphics UNICODE – World wide Code (16 bits) UTF-8 – Unicode version 8 bits URL / URI – Uniform Resource Locator / Identifier XML – eXtensible Markup Language XBL – XML Binding Language (Mozilla) XForms – XML Forms XHTML – HTML 4 en XML XLink – XML Linking Language XPath – XML Path Language XPointer – XML Pointer Language XSL - eXtensible Stylesheet Language XSLT – XSL Transformations XSL-FO – XSL Formatting Objects XSD – XML Schémas Définition Language XUL – XML User Language (Mozilla) W3C – World Wide Web Consortium Web2.0 – Web dit "sémantique" WHATWG - Web Hypertext Application Technology Working Group WSDL - Web Service Description Language

Lexique

LexiqueLexique


Paul FranchiSI 4

2011-12

TechsTechs

SommaireSommaire

..

..

..

..

.

..


Chap IX - RDF

Resource Description Framework

RDF/XML

Dublin Core

OWL

RDF validator

RDF/XML

Dublin Core

OWL

RDF validator

LexiqueLexique

RéfsRéfs

TechsTechsRDF- Resource D

escription Framework (source W3C)

"Request" sur un serveur (url, .asp ou.php)

RDF -W3C Syntax Validator & Graph Generator

Dublin Core

RDF: Bag, Seq, Alt

RDF - Graphe Entité-Relation

OWL - "Web Ontology Language " (source W3C)

"Request" sur un document .xml

RDF/XML – Resource

with Properties and Values

AJAX- Asynchronous JavaScript and XML

Objet xmlHttpRequest

SommaireSommaire


RDF- Resource Description Framework (W3C)

RDF is a part of the W3C's Semantic Web Activity RDF is a W3C Recommendation RDF is a framework for describing resources on the web RDF provides a model for data, and a syntax so that independent parties can

exchange and use it RDF is designed to be read and understood by computers RDF is not designed for being displayed to people RDF is a XML Dialect

RDF - Examples of Use Describing properties for shopping items, such as price and availability Describing time schedules for web events Describing information about web pages, such as content, author, created and

modified date Describing content and rating for web pictures Describing content for search engines

Describing electronic libraries. RDF and "The Semantic Web"(W3C's "Semantic Web Vision")

Web information has exact meaning Web information can be understood and processed by computers Computers can integrate information from the web

RDF is a part of the W3C's Semantic Web Activity RDF is a W3C Recommendation RDF is a framework for describing resources on the web RDF provides a model for data, and a syntax so that independent parties can

exchange and use it RDF is designed to be read and understood by computers RDF is not designed for being displayed to people RDF is a XML Dialect

RDF - Examples of Use Describing properties for shopping items, such as price and availability Describing time schedules for web events Describing information about web pages, such as content, author, created and

modified date Describing content and rating for web pictures Describing content for search engines

Describing electronic libraries. RDF and "The Semantic Web"(W3C's "Semantic Web Vision")

Web information has exact meaning Web information can be understood and processed by computers Computers can integrate information from the web

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


RDF/XML – Resource with Properties and Values A Resource is anything that can have a URI (about=),

such as "http://polytech/LANGDOC/RDF" A Property is a Resource that has a name, such as

<author>or <homepage> A Property value, such as "Paul Franchi" or

"http://www.polytech.unice.fr/~pfz"

W3C RDF Syntax Validator & Graph Generator

A Resource is anything that can have a URI (about=), such as "http://polytech/LANGDOC/RDF"

A Property is a Resource that has a name, such as <author>or <homepage>

A Property value, such as "Paul Franchi" or "http://www.polytech.unice.fr/~pfz"

W3C RDF Syntax Validator & Graph Generator

<?xml version="1.0" encoding="ISO-8859-1"?><rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"

xmlns:pol="http://polytech#" ><rdf:Description rdf:about="http://polytech/LANGDOC/RDF"> <pol:author> Paul Franchi </pol:author> <pol:homepage> http://www.polytech.unice.fr/~pfz </pol:homepage> </rdf:Description> </rdf:RDF>

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire

Un modèle de Graphe Entités/Relations Une syntaxe RDF/XML pour "sérialiser" le graphe Un modèle de Graphe Entités/Relations Une syntaxe RDF/XML pour "sérialiser" le graphe



http://polytech#author

http://polytech#homepage

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


RDF: Description, Property, Attribute, Value, resource

<?xml version="1.0" encoding="ISO-8859-1"?><rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"

xmlns:cd="http://www.Bib/cd#">

<rdf:Description rdf:about="http://www.Bib/cd/Empire Burlesque"cd:artist="Bob Dylan" cd:country="USA" cd:company="Columbia" cd:price="10.90" cd:year="1985" />

<rdf:Description rdf:about="http://www.Bib/cd/Hide your heart"> <cd:artist rdf:resource="http://www.Bib/cd/Bonnie Tyler" /><cd:company>CBS Records</cd:company><cd:year>1988</cd:year> </rdf:Description> . . .

</rdf:RDF>

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


RDF - W3C Syntax Validator & Graph Generator

http://www.w3.org/RDF/Validator/http://www.w3.org/RDF/Validator/

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


RDF: Bag et les autres Conteneurs


xmlns:cd="http://www.Bib/cd#"> <rdf:Description rdf:about="http://www.Bib/cd/Beatles"> <cd:artist>

<rdf:Bag> <rdf:li>John</rdf:li> <rdf:li>Paul</rdf:li> <rdf:li>George</rdf:li><rdf:li>Ringo</rdf:li>

</rdf:Bag> </cd:artist> </rdf:Description></rdf:RDF>

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


RDF: Bag, Seq, Alt


xmlns:cd="http://www.Bib/cd#">

<rdf:Description rdf:about="http://www.Bib/cd/Beatles"> <cd:artist>

<rdf:Bag> <rdf:li>John</rdf:li> <rdf:li>Paul</rdf:li> <rdf:li>George</rdf:li><rdf:li>Ringo</rdf:li>

</rdf:Bag> </cd:artist> </rdf:Description>. . .

</rdf:RDF>

<cd:format> <rdf:Alt> <rdf:li>CD</rdf:li> <rdf:li>Record</rdf:li> <rdf:li>Tape</rdf:li> </rdf:Alt> </cd:format>

<cd:artist><rdf:Seq>

<rdf:li>George</rdf:li> <rdf:li>John</rdf:li> <rdf:li>Paul</rdf:li> <rdf:li>Ringo</rdf:li>

</rdf:Seq> </cd:artist>

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


RDF- les utilisations classiques

Dublin Core MetaData

OWL

Mozilla contents.rdf chrome.rdf XUL

Communication par RDF files (génération par Php, etc.)

RSS 1.0

Dublin Core MetaData

OWL

Mozilla contents.rdf chrome.rdf XUL

Communication par RDF files (génération par Php, etc.)

RSS 1.0

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


Dublin Core The Dublin Core Metadata Initiative (DCMI) has created some predefined properties for

describing documents. The Dublin Core Metadata Initiative (DCMI) has created some predefined properties for

describing documents.

Property Definition

Contributor An entity responsible for making contributions to the content of the resource

Coverage The extent or scope of the content of the resource

Creator An entity primarily responsible for making the content of the resource

Format The physical or digital manifestation of the resource

Date A date of an event in the lifecycle of the resource

Description An account of the content of the resource

Identifier An unambiguous reference to the resource within a given context

Language A language of the intellectual content of the resource

Publisher An entity responsible for making the resource available

Relation A reference to a related resource

Rights Information about rights held in and over the resource

Source A Reference to a resource from which the present resource is derived

Subject A topic of the content of the resource

Title A name given to the resource

Type The nature or genre of the content of the resource

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


Dublin Core

<?xml version="1.0" encoding="ISO-8859-1"?><rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"

xmlns:dc= "http://purl.org/dc/elements/1.1/" > <rdf:Description rdf:about="http://www.w3schools.com "> <dc:title>D-Lib Program</dc:title> <dc:description>W3Schools - Free tutorials</dc:description> <dc:publisher>Refsnes Data as</dc:publisher> <dc:date>1999-09-01</dc:date> <dc:type>Web Development</dc:type> <dc:format>text/html</dc:format> <dc:language>en</dc:language> </rdf:Description> </rdf:RDF>

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


OWL - "Web Ontology Language " (W3C)

What is OWL? OWL is built on top of RDF as a web

standard OWL is for processing information on the

web OWL was designed to be interpreted by

computers OWL was not designed for being read by

people OWL is written in XML

OWL has three sublanguages: OWL Lite OWL DL (includes OWL Lite) OWL Full (includes OWL DL)

OWL is Different from RDF OWL is a stronger language with greater

machine interpretability than RDF. OWL comes with a larger vocabulary and

stronger syntax than RDF.

What is OWL? OWL is built on top of RDF as a web

standard OWL is for processing information on the

web OWL was designed to be interpreted by

computers OWL was not designed for being read by

people OWL is written in XML

OWL has three sublanguages: OWL Lite OWL DL (includes OWL Lite) OWL Full (includes OWL DL)

OWL is Different from RDF OWL is a stronger language with greater

machine interpretability than RDF. OWL comes with a larger vocabulary and

stronger syntax than RDF.

What is Ontology?

For the web, Ontology is about the exact description of web

information and relationships between web information.

OWL Example (Airport) OWL Resource:

http://www.daml.org/2001/10/html/airport-ont

Class: Airport Properties:

elevation iataCode icaoCode latitude location longitude name

LexiqueLexique


Paul FranchiSI 4

2011-12

TechsTechs

SommaireSommaire

..

..

..

..

.

..


Chap X - AJAX

Asynchronous JavaScript And XML

Http synchrone

XMLHttpRequest

Http synchrone

XMLHttpRequest

Les exemples AJAX tournent sous FF3, mais pas (encore) sous FF4+

Les exemples AJAX tournent sous FF3, mais pas (encore) sous FF4+

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire



AJAX is not a new programming language, but a technique for creating better, faster, and more interactive web applications.

With AJAX, your JavaScript can communicate directly with the server, using the JavaScript XMLHttpRequest object. With this object, your JavaScript can trade data with a web server, without reloading the page.

AJAX uses asynchronous data transfer (HTTP requests) between the browser and the web server, allowing web pages to request small bits of information from the server instead of whole pages.

The AJAX technique makes Internet applications smaller, faster and more user-friendly.

AJAX is a browser technology independent of web server software.

AJAX is based on the following web standards: JavaScript XML HTML CSS

AJAX is not a new programming language, but a technique for creating better, faster, and more interactive web applications.

With AJAX, your JavaScript can communicate directly with the server, using the JavaScript XMLHttpRequest object. With this object, your JavaScript can trade data with a web server, without reloading the page.

AJAX uses asynchronous data transfer (HTTP requests) between the browser and the web server, allowing web pages to request small bits of information from the server instead of whole pages.

The AJAX technique makes Internet applications smaller, faster and more user-friendly.

AJAX is a browser technology independent of web server software.

AJAX is based on the following web standards: JavaScript XML HTML CSS

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


<html><script type="text/javascript">

function HTTP() {

}</script><body>

HTTP() ;

</body> </html>

Côté "Client"

Côté "Serveur"

AJAX : schéma "HttpRequest / Response"

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


L'Objet XMLHttpRequest

Attributs readyState status 200 si ok - 404 si la page n'est pas trouvée. responseText données chargées dans une chaîne de

caractères. responseXml données chargées sous forme xml, onreadystatechange propriété activée par un évènement de

changement d'état. On lui assigne une fonction.

Méthodes open(mode, url, boolean)

mode: type de requête, GET ou POST url: l'adresse des données, boolean: true (asynchrone) / false (synchrone). en option on peut ajouter un login et un mot de passe.

send("chaine") null pour une commande GET.

Attributs readyState status 200 si ok - 404 si la page n'est pas trouvée. responseText données chargées dans une chaîne de

caractères. responseXml données chargées sous forme xml, onreadystatechange propriété activée par un évènement de

changement d'état. On lui assigne une fonction.

Méthodes open(mode, url, boolean)

mode: type de requête, GET ou POST url: l'adresse des données, boolean: true (asynchrone) / false (synchrone). en option on peut ajouter un login et un mot de passe.

send("chaine") null pour une commande GET.

0 (non init) 1 (connexion) 2 (requete) 3 (réponse), 4 (terminé)

0 (non init) 1 (connexion) 2 (requete) 3 (réponse), 4 (terminé)

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


function submitForm(){ var xhr; try { xhr = new ActiveXObject('Msxml2.XMLHTTP'); } catch (e) { //IE try { xhr = new ActiveXObject('Microsoft.XMLHTTP'); } catch (e2) { //FF try { xhr = new XMLHttpRequest(); } catch (e3) { xhr = false; } } } xhr.onreadystatechange = function() { if(xhr.readyState == 4) { if(xhr.status == 200) document.ajax.dyn="Received:" + xhr.responseText; else document.ajax.dyn="Error code " + xhr.status; } };

xhr.open( GET", "data.xml", true); xhr.send(null); }

Script AJAX

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


<html><script type="text/javascript"> function syncHTTP() {try { var xmlHttp; try { // IE7, Firefox, Opera 8.0+, Safari netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead"); xmlHttp=new XMLHttpRequest(); } catch (e) { alert("Your browser is not a good one!"); return false; } xmlHttp.open ("GET","http://www.w3schools.com/ajax/time.asp", false); // synchrone xmlHttp.send (null); if(xmlHttp.status != 200) { throw new ERROR("HTTP " + xmlHttp.status); } //200=OK document.myForm.time.value=xmlHttp.responseText;}catch (e) { alert("Erreur au HTTP"); return false;} } // syncHTTP()</script><body> <form name="myForm"> Name: <input type="text" onkeyup="syncHTTP() ;" name="username" />Time: <input type="text" name="time" /></form> </body> </html>

"Http synchrone"

"Request" synchrone sur un serveur

LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


<html><script type="text/javascript"> var xmlHttp;function ajaxFunction() {

/* voir suivant */ xmlHttp.onreadystatechange = function() { /* voir suivant */ } }</script>

<form name="myForm"> Name:

<input type="text" onkeyup="ajaxFunction();" name="username" />

Time: <input type="text" name="time" />

</form></body></html>

XMLHttpRequest asynchrone: onreadystatechange()


LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


function ajaxFunction() {var xmlHttp;try { // IE7, Firefox, Opera 8.0+, Safari netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead"); xmlHttp = new XMLHttpRequest(); }catch (e) { // Internet Explorer 6 et - try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("Your browser does not support AJAX!"); return false; } } } xmlHttp.onreadystatechange = function() { if (xmlHttp.readyState==4) {

document.myForm.time.value = xmlHttp.responseText; } } xmlHttp.open("GET","http://www.w3schools.com/ajax/time.asp", true); xmlHttp.send (null); } // ajaxFunction

XMLHttpRequest asynchrone: onreadystatechange()


LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


<?xml version="1.0" encoding="ISO-8859-1"?><script type="text/javascript"><![CDATA[ var xmlhttp;function loadXMLDoc (url) {xmlhttp=null;if (window.XMLHttpRequest) { // code for IE7, Firefox, Mozilla, etc. netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead"); xmlhttp=new XMLHttpRequest(); }else if (window.ActiveXObject) { // code for IE5, IE6 xmlhttp = new ActiveXObject ("Microsoft.XMLHTTP"); }if (xmlhttp!=null) { xmlhttp.onreadystatechange = onResponse; xmlhttp.open ("GET", url, true); xmlhttp.send (null); }else { alert ("Your browser does not support XMLHTTP."); }}

XMLHttpRequest asynchrone: onResponse() XMLHttpRequest asynchrone: onResponse()


LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


function onResponse(){if (xmlhttp.readyState!=4) return;if (xmlhttp.status!=0 && xmlhttp.status!=200) // OK? { alert ("Problem retrieving XML data"); return; }

TRAITEMENT_DU_XML() ; // ou TRAITEMENT_DU_TEXTE()}]]></script></head><body><div id="copy"><button onclick="loadXMLDoc('cd_catalog.xml')">Get CD info</button></div> </body>

XMLHttpRequest asynchrone: onResponse() XMLHttpRequest asynchrone: onResponse()


LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


TRAITEMENT_DU_TEXTE() { // extraction du "string source"var reponse = xmlhttp.responseText ;

/******* traitement avec RegExp, match(), split(), substr(), slice(), etc.

****/

var debut=new RegExp ("[\\d\\D]*?<\/CD>");alert (xmlhttp.responseText.match(debut)[0]) ;

}

XMLHttpRequest: responseText


LexiqueLexique

RéfsRéfs





Dublin Core

RDF: Bag, Seq, Alt








SommaireSommaire


TRAITEMENT_DU_XML() {txt="<table border='1'>";x = xmlhttp.responseXML.

documentElement.getElementsByTagName("CD");for (i=0;i<x.length;i++) { txt=txt + "<tr>"; xx=x[i].getElementsByTagName("TITLE"); { try { txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>"; } catch (er) { txt=txt + "<td> </td>"; } } xx=x[i].getElementsByTagName("ARTIST"); { try { txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>"; } catch (er) { txt=txt + "<td> </td>"; } } txt=txt + "</tr>"; }txt=txt + "</table>";document.getElementById('copy').innerHTML = txt;}

XMLHttpRequest: responseXML.
