Cours gratuits » Cours informatique » Cours développement web » Cours XML » Cours XML : initiation a SMIL le langage d’integrations multimedias synchronise

Cours XML : initiation a SMIL le langage d’integrations multimedias synchronise

Problème à signaler:

Télécharger



★★★★★★★★★★3.5 étoiles sur 5 basé sur 1 votes.
Votez ce document:

Cours XML : initiation à SMIL le langage d’intégrations multimédias synchronise

Rappel:

Qu'est-ce qu'XML ?

XML

XML signifie eXtensible Markup Language : en français, c'est un langage de balisage extensible.

C'est un langage :

Cela signifie que ce format de fichier est conçu pour transmettre des informations. À ce titre, il ne faut pas se limiter aux échanges d'informations entre humains, ou entre une a

pplication et un humain : XML est tout aussi bien conçu, si ce n'est mieux, pour des échanges entre applications informatiques.

C'est un langage de balisage :

Cela signifie qu'on accole aux données des « étiquettes » qui qualifient leur contenu. Par exemple, dans Émile Zola, on étiquettera « Émile » comme étant un prénom, et « Zola » comme étant un nom de famille.

C'est un langage extensible :

Cela signifie deux choses en fait :

selon ses besoins, on peut définir et utiliser les « étiquettes » que l'on souhaite ;

une fois qu'un jeu d'étiquettes est défini, même par quelqu'un d'autre, on peut l'étendre en y ajoutant ses propres créations.

Il ne faut en fait pas parler de langage XML au singulier, mais bien de langages au pluriel. En effet, XML désigne un certain type de fichier texte, respectant des règles d'écriture. À partir de ces règles, il est possible de définir de nouveaux langages, comme par exemple XHTML, SVG, Docbook, MathML...

Le prologue

<?xml version="1.0" encoding="UTF-8"?>

Cette première ligne est le prologue du fichier. Il indique la version de la recommandation XML qui sert de base à l'écriture du fichier (il n'y a eu à cette date qu'une seule version, la version 1.0), ainsi que l'encodage de caractères utilisé. Cette ligne est facultative, mais cela ne coûte (presque) rien de l'ajouter... d'autant plus que cela permet de spécifier explicitement l'encodage. Par défaut, il s'agit de l'UTF-8.

Les commentaires

<!-- Quelques physiciens importants -->

Un commentaire, comme en HTML, commence par la chaîne de caractères <!-- et se termine par -->. Tout ce qui est entre ces deux chaînes de caractères n'est pas une donnée du document, mais un commentaire laissé par le développeur et tout comme en HTML, la visualisation du document XML dans un navigateur ne fait pas apparaître ce texte. Attention, il est interdit à l'intérieur d'un commentaire de placer la chaîne « -- ».

Les éléments et attributs

Nous abordons là les étiquettes dont nous avons parlé en guise d'introduction. Ce sont les éléments et attributs qui permettent de qualifier les données, et de leur conférer un sens.

Les éléments

Il existe deux types d'éléments : les éléments vides... et ceux qui ne le sont pas.

Un élément non vide commence par une balise ouvrante et se termine par une balise fermante. Dans le document précédent, des exemples de balises ouvrantes sont <savants> ou <contributions> ; les balises fermantes correspondantes sont respectivement </savants> et </contributions>.

Un élément vide ne comporte qu'une seule balise, dite « auto-fermante ». C'est le cas de l'élément identité : il est caractérisé par la balise <identité... : vous noterez qu'elle se termine par />.

Entre les balises ouvrante et fermante d'un élément non vide peuvent se trouver d'autres éléments. C'est le cas ici de la plupart des éléments, comme par exemple savant : l'indentation du code met en évidence la relation hiérarchique des éléments. Cette structure hiérarchique forme une arborescence.

Dans un document XML, un élément joue un rôle particulier : il s'agit de l'élément racine, qui doit être unique et contenir tous les autres éléments de l'arborescence. Ici, il s'agit de l'élément savants.

Les attributs

Quand on veut préciser ce que contient un élément, on peut placer un attribut sur la balise ouvrante. Par exemple, l'élément date comporte deux attributs, nommés naissance et décès. Un attribut possède un nom, ainsi qu'une valeur. Par exemple, l'attribut prénom du deuxième savant a pour valeur Isaac. Les attributs ne sont jamais repris dans la balise fermante : l'attribut id présent dans la balise ouvrante de l'élément savant est absent de la balise fermante </savant>.

Enfin, l'ordre dans lequel les attributs sont écrits dans une balise ouvrante n'a aucune importance : les attributs du dernier élément savant sont inversés par rapport aux deux premiers, mais les deux formes sont strictement équivalentes.

Les entités

Vous aurez noté que certains caractères ont une signification en XML : c'est le cas par exemple des caractères < ou >. Quand on doit les utiliser, il faut donc trouver une parade pour qu'ils ne soient pas interprétés. Pour cela, on utilise des entités, qui codent ces caractères par des chaînes de caractères les représentant ou des nombres. Une entité commence par le caractère & et se termine par un point-virgule ;. Par exemple, le caractère < doit être écrit &lt; ou &#060;. En particulier, le caractère & doit lui-même être codé comme une entité sous la forme &amp;.

XML ne définit que cinq entités, au contraire de HTML où plusieurs dizaines existent. Les entités prédéfinies de XML sont :

&lt; pour <

&gt; pour >

&amp; pour &

&quote; pour "

&aquote; pour '

Les deux dernières entités peuvent par exemple être utilisées dans des valeurs d'attributs.

Les sections CDATA

Lorsqu'un contenu est susceptible de contenir plusieurs entités, il peut être fastidieux de les écrire. On utilise alors ce que l'on appelle une « section CDATA », qui est destinée à contenir des informations affichées telles quelles, sans traitement par l'outil de consultation (navigateur Internet ou tout autre type d'application chargée de traiter le document XML). C'est le cas dans notre exemple où l'on a écrit <![CDATA[Relativités restreinte & générale, nature corpusculaire de la lumière & effet photoélectrique]]> : il n'a pas été nécessaire de remplacer chaque occurrence de & par l'entité correspondante &amp;.

Depuis la publication de SMIL 1.0 [SMIL10], l'intérêt pour l'intégration des concepts SMIL dans HTML, le Langage de Balise HyperTexte [HTML4], et les autres langages XML a augmenté. De plus, le Groupe de Travail HTML au W3C a spécifié XHTML, le Langage de Balise HyperTexte Extensible [XHTML10], en vue d'en créer un sous-ensemble, de l'étendre, et de l'intégrer dans d'autres langages. La stratégie prise en compte pour intégrer des fonctionnalités respectives avec d'autres langages basés sur XML est fondée sur les concepts de modularisation et de profilage [SMIL-MOD], [XMOD].

La modularisation est une approche selon laquelle une fonctionnalité de balisage est spécifiée comme un ensemble de modules qui contiennent des éléments, des attributs et des valeurs d'attributs sémantiquement liés à XML. Le profilage est la création d'un langage basé sur XML par la combinaison de ces modules, dans le but de fournir la fonctionnalité requise par une application particulière.

Le profilage introduit la capacité de façonner un langage basé sur XML pour des besoins spécifiques, i.e. optimiser la présentation et l'interaction selon les capacités du client. Le profilage ajoute aussi la capacité d'intégrer des fonctionnalités à partir d'autres langages balisés, libérant ainsi l'auteur du langage de la spécification de ces fonctionnalités. De surcroît, cela renforce la cohérence du balisage grâce à l'utilisation d'un même modèle pour intégrer une fonction. Des constructions identiques facilitent la conception, avec,du côté de l'agent utilisateur, un potentiel de ré-utilisation du code. Par exemple, une application de planification gérant les fonctionnalités de temporisation et de synchronisation SMIL pourrait être utilisée avec des documents SMIL, des documents XHTML + SMIL et des documents SVG.

La modularisation permet aux concepteurs de langage de spécifier un balisage dédié destiné à une intégration dans d'autres profils de langage existants. Des exemples de spécifications destinées à une telle intégration sont MathML et XForms [MathML], [XFORMS].

La modularisation et le profilage utilisent les propriétés d'extensibilité de XML, ainsi que des technologies apparentées comme les espaces de nommage XML et les schémas XML [XML10], [XML-NS], [XSCHEMA].

Cette partie de la spécification de SMIL 2.0 décrit la charpente sur laquelle la modularisation et le profilage XML reposent, spécifie les modules de SMIL 2.0, leurs identifiants, ainsi que les exigences pour la conformité au sein de cette charpente.

2.1.1 La modularisation et le profilage

Cette section est informative.

L'approche de la modularisation utilisée dans cette spécification dérive de celle utilisée dans la modularisation de XHTML [XMOD]. La charpente sur laquelle la modularisation et le profilage SMIL reposent est décrite ici simplement.

Un module est une collection d'éléments, d'attributs et de valeurs d'attribut sémantiquement liés à XML, qui représente une unité de fonctionnalité. Les modules sont définis dans des ensembles cohérents. Cette cohérence est exprimée dans le fait que les éléments de ces modules sont associés au même espace de nommage.

Un profil de langage est une combinaison de ces modules. Les modules sont atomiques, i.e. ils ne peuvent être divisés en sous-ensembles quand ils sont inclus dans un profil de langage. En outre, une spécification de module peut inclure un ensemble conditions préalables d'intégration, auxquelles les profils de langage contenant le module doivent satisfaire.

Généralement, il y a un profil de langage principal qui inclut pratiquement tous les modules associés à un même espace de nommage. Par exemple, le profil de langage SMIL 2.0 utilise la plupart des modules SMIL 2.0. D'habitude, le même nom est utilisé pour référencer approximativement les deux - "SMIL 2.0" dans l'exemple. Aussi, le nom « profil » est utilisé pour signifier « profil de langage ».

D'autres profils de langage peuvent être spécifiés comme sous-ensemble du plus important, ou comme incorporant un mélange de modules associés à différents espaces de nommage. SMIL 2.0 Basic est un exemple du premier, XHTML+SMIL du dernier.

Un module spécial dans le profil de langage est celui appelé module Structure, dans lequel est contenu l'élément racine du profil de langage, i.e. <smil> ou <html>. N'importe lequel des profils de langage qui inclut des modules associés avec un seul espace de nommage inclura le module Structure associé à cet espace de nommage.

Les autres modules qui requièrent une attention particulière sont ceux qui caractérisent le noyau des fonctionnalités de l'espace de nommage. Ceci s'exprime par les notions de langage hôte et d'ensemble d'intégration. Les deux se rapportent à un ensemble d'exigences de conformité pour les profils de langage, parmi celles-ci l'obligation d'incorporer au moins le jeu des modules de base. Cet ensemble de conditions peut être différent entre un langage hôte et un ensemble d'intégration. Un langage hôte doit incorporer le module Structure ; un ensemble d'intégration peut ne pas l'inclure. Il peut également exister d'autres différences.

Le but principal de la conformité du profil de langage est d'améliorer l'interopérabilité. De préférence, les modules obligatoires pour la conformité avec le langage hôte sont définis de sorte que n'importe quel document interchangé dans un profil de langage conforme va produire une présentation raisonnable si le moteur de rendu, tout en gérant le jeu des modules obligatoires associés, devait ignorer tous les autres éléments et attributs (inconnus). Ici, l'expression « présentation raisonnable » est à comprendre comme quelque chose d'intelligible, ce qui n'est pas nécessairement un reflet proche des intentions originelles de l'auteur. Pour obtenir ce dernier résultat, une négociation devrait être conduite pour s'entendre sur les profils de langage spécifiques qui devront être utilisés pour les communications entre les documents.

SMIL

Synchronized Multimedia Integration

SMIL

  • Pour quoi

– langage de description de présentation multimédia

  • Par qui

– W3C

  • Quand

– Première version juin 98

Objectifs de conception

  • La synchronisation de média

– sur le WEB

– Position dans l’espace

– Position dans le temps

– Prendre en compte les contraintes réseau ...

  • L’interactivité : liens
  • Format textuel : xml
  • Intégration : combiner des ressources de type différent

 Objectif à venir

  • Intégration de smil dans

– xhtml

– svg

Comment visualiser du SMIL

  • Realplayer 8

SMIL un dialecte XML

<?xml version="1.0" encoding="iso-8859-1"?>

<!DOCTYPE smil PUBLIC "-//W3C//DTD SMIL 1.0//EN"

<smil>

<head>

<meta name= "nom" content= "contenu"/>

<layout>

...

</layout>

</head>

<body>

...

 Deux parties principales

  • Élément <layout> contient

– une description de la fenêtre principale (élément

<root-layout>)

– pour chacune des régions de la présentation, sa position, sa taille et une identification unique (élément <region>)

  • Élément <body> contient

– Une description de chacun des média présentés

Élément <root-layout>

  • Description de la fenêtre principale

– ses dimensions (en pixels)

– la couleur de fond

  • Exemple

<root-layout width="300" height="200" background-color="white" />

 Élément <region>

  • Description d’une région

– son identification : attribut id

– sa position : attributs left et top

– ses dimensions : attributs width et height

  • Exemple

<region id="vim_icon" left="75" top="50" width="32" height="32" />

  • Chaque média visuel doit avoir une région associée

 Positionnement d’une région

  • Position absolue (en nombre de pixels)

– left="75" top="50"

  • Position relative (en % de la taille de la fenêtre principale)

– left="50%" top="40%"

 Recouvrement de deux régions

  • Deux régions peuvent se recouvrir

– L’attribut z-index donne le niveau

– La région dont le z-index est le plus grand est au dessus

  • Exemple

<region id="bullet6" title="marque6" left="10" top="540" width="14" height="14" z-index="4" />

 Ajuster un média à sa région

  • Attribut fit

– fit="fill" s’étendre dans la sous fenêtre

– fit="meet" s’étendre sans déformation en remplissant une seule dimension

– fit="slice" s’étendre sans déformation en remplissant tout l’espace

– fit="scroll" mettre un (des) ascenseur(s)

  • Exemple

<region id="vim_icon" left="75" top="50" width="32" height="32" fit="scroll" />

 Élément <body>

Faire une séquence avec <par>

On peut créer une séquence avec un élément <par>

<par>

<img region="r" begin="0s" src="img1.gif" dur="4s"/>

<img region="r" begin="4s" src="img2.gif" dur="4s"/>

<img region="r" begin="8s" src="img3.gif" dur="4s"/>

</par>

Mais il est préférable d'employer un élément <seq>

<seq>

<img region="r" src="img1.gif" dur="4s"/>

<img region="r" src="img2.gif" dur="4s"/>

<img region="r" src="img3.gif" dur="4s"/>

</seq>

Synchronisation de média

<par>

<audio begin="5s" src="audio2.mp3" />

</par>

– mise en séquence

Type de média acceptés par

RealPlayer

Type de média élément

Image gif, jpeg <img>

Microsoft wav, mp3, Sun Audio,

Sun Audio Zipped <audio>

Texte simple <text>

Real movie, AVI, MPEG, MOV <video>

 Les média

  • Positionnement d’un média

<img region="r2" begin="4s" src="img.gif" />

  • Les média

<txt region="r1" src="titre.txt" />

<img region="r2" begin="4s" src="img.gif" />

<video region="r3" begin="4s" src="film.rm" />

<audio begin="4s" src="son.mp3" />

 Attributs dur et fill

  • Définir une durée au sein d’une séquence

<seq>

<img src="image1.jpg" region="photo" dur="22s"/>

<text src="image2.gif" region="sousTitre" dur="6s"/>

<img src="image3.jpg" region="photo" dur="7s" />

</seq>

  • Figer une image pour toute la durée de la présentation

<img src="image1.jpg" region="photo" fill="freeze"/>

 Valeurs d’horloge

  • Valeur d’horloge

02:33:45 2h 33mn 45s

45:24

02:00.24 45mn 24s

2mn 0,24s

  • Valeur décimale

1.24s

12.6h 1,24 secondes

12,6 heures

 – Unités : {h, min, s, ms} s par défaut

Naviguer dans le temps, élément <A>

  • Définition d’une cible : attribut id

<img src="image.jpg" region="photo" dur="8s" id="diapo5"/>

  • Définition d’un lien : élément <A>

<a href="#diapo5">

<text src="texte/melanger.txt" region="r5"/>

</a>

SMIL - Yves bekkers - IFSIC 20

 Conclusion

  • Un outil pour cours et conférences sur le WEB
  • SMIL permet de

– placer des média dans l’espace (3 dim)

– synchroniser des média dans le temps

– naviguer dans le temps


52