diff -r c0e4d761bcb6 -r 9144b17b390e integration/edition.html
--- a/integration/edition.html	Mon Jun 10 18:02:41 2013 +0200
+++ b/integration/edition.html	Tue Jun 11 10:43:19 2013 +0200
@@ -83,10 +83,7 @@
 						</div>
 						<div class="timeline-annotations-wrap">
 							<div class="indicateur-annotation"></div>
-							<!--<div class="timeline-annotations"></div>-->
-							<ul class="timeline-annotations">
-		
-							</ul>
+							<ul class="timeline-annotations"></ul>
 						</div>
 <!-- chapter-widget -->
 						<div class="chapter-widget">
@@ -102,42 +99,6 @@
 								</div>
 							</div>
 							<div class="chapter-widget-info">
-								<!--
-								<form action="#" class="form-chapter-edit">
-									<div class="row">
-										<div class="span3 text-right">
-											<input name="title" type="text">
-											<input name="tags" type="text" class="tag-it">
-										</div>
-										<div class="span3">
-											<input type="hidden" name="begin">
-											<input type="hidden" name="duration">
-											<input type="hidden" name="end">
-											<table class="table text-right">
-												<thead>
-													<tr>
-														<th class="span1">Début</th>
-														<th class="span1">Durée</th>
-														<th class="span1">Fin</th>
-													</tr>
-												</thead>
-												<tbody>
-													<tr>
-														<td class="span1 begin">4:20</td>
-														<td class="span1 duration">4:20</td>
-														<td class="span1 end">4:20</td>
-													</tr>
-												</tbody>
-											</table>
-										</div>
-									</div>
-									<div class="row">
-										<div class="span6 text-center">
-											<textarea class="" name="description" id=""></textarea>
-										</div>
-									</div>
-								</form>
-							-->
 							</div>
 							<div class="list-chapter-wrap">
 								<h4><i class="icon-flag"></i> <i class="icon-th-list"></i> Liste des chapitres</h4>
@@ -153,27 +114,6 @@
 										</tr>
 									</thead>
 									<tbody class="list-chapter-rows-wrap">
-										<!--
-										<tr id="row-list-chapter-id1">
-											<td>Titre d'un chapitre</td>
-											<td>Tags, Tags, Tags</td>
-											<td>79:55</td>
-											<td>79:55</td>
-											<td>79:55</td>
-											<td>
-												<table>
-													<tr>
-														<td>
-															<a href="" class="btn edit-chapter"><i class="icon-pencil"></i></a>
-														</td>
-														<td>
-															<a data-title="Chapitre 1" href="#row-list-chapter-id1" class="btn btn-delete"><i class="icon-trash delete-annotation"></i></a>
-														</td>
-													</tr>
-												</table>
-											</td>
-										</tr>
-									-->
 									</tbody>
 								</table>
 							</div>
@@ -214,294 +154,11 @@
 											</tr>
 										</thead>
 										<tbody id="list-annotations-rows">
-											<!--
-											<tr id="row-list-annotation-id1">
-												<td>Titre annotation</td>
-												<td>Vidéo</td>
-												<td>4:26</td>
-												<td>4:26</td>
-												<td>4:26</td>
-												<td>
-													<a href="#" data-id="annotation-123" class="btn btn-edit-annotation" data-type="video">
-														<i class="icon-pencil"></i></a>
-													<a data-id="annotation-123" data-type="annotation" data-title="Annotation XYZ" href="#row-list-annotation-id1" class="btn btn-delete">
-														<i class="icon-trash delete-annotation"></i>
-													</a>
-												</td>
-											</tr>
-											<tr id="row-list-annotation-id2">
-												<td>Titre annotation</td>
-												<td>Diaporama</td>
-												<td>4:26</td>
-												<td>4:26</td>
-												<td>4:26</td>
-												<td>
-													<a href="#" data-id="annotation-456" class="btn btn-edit-annotation" data-type="diaporama">
-														<i class="icon-pencil "></i></a>
-													<a data-id="annotation-456" data-type="annotation" data-title="Annotation XYZ" href="#row-list-annotation-id2" class="btn btn-delete">
-														<i class="icon-trash delete-annotation"></i>
-													</a>
-												</td>
-											</tr>
-										-->
+
 										</tbody>
 									</table>
 								</div>
-							</div>
-<!-- exemple annotation all -->
-							<div class="tab-pane" id="annotation-azerty">
-	<!-- head -->
-								<form action="#" class="form-info-general-annotation">
-									<div class="row">
-										<div class="span3 text-right">
-											<input type="text" placeholder="Titre de l'annotation..">
-											<textarea name="" id=""></textarea>
-										</div>
-										<div class="span3">
-											<input type="text" placeholder="Titre de l'annotation..">
-											<table class="table text-right">
-												<thead>
-													<tr>
-														<th class="span1">Début</th>
-														<th class="span1">Durée</th>
-														<th class="span1">Fin</th>
-													</tr>
-												</thead>
-												<tbody>
-													<tr>
-														<td id="id741-begin" class="span1">4:20</td>
-														<td id="id741-duration" class="span1">4:20</td>
-														<td id="id741-end" class="span1">4:20</td>
-													</tr>
-												</tbody>
-											</table>
-										</div>
-									</div>
-									<div class="row">
-										<div class="span6 text-center">
-											<div data-id="id741" id="id741" class="slider-duration"></div>
-										</div>
-										<div class="span6 text-right">
-											<button data-id="id741" type="submit" class="btn btn-primary btn-save-annotation">
-												<i class="icon-save"></i> Enregistrer l'annotation
-											</button>
-										</div>
-									</div>
-								</form>
-	<!-- Liens -->
-								<div class="edit-annotation-title row">
-									<h3 class="span3"><i class="icon-link"></i> Liens</h3>
-								</div>
-								<div class="row annotation-links-content">
-										<div class="span6">
-											<form class="form-horizontal">
-												<table class="table">
-													<thead>
-														<tr>
-															<th>URL</th>
-															<th>Titre du lien</th>
-															<th>Actions</th>
-														</tr>
-													</thead>
-													<tbody>
-														<tr>
-															<td><input class="input-medium" type="text" placeholder="http://"></td>
-															<td><input class="input-medium" type="text" placeholder="Titre du lien"></td>
-															<td>
-																<a class="btn" href="#"><i class="icon-trash"></i></a>
-																<a class="btn" href="#"><i class="icon-plus"></i></a>
-															</td>
-														</tr>
-														<tr>
-															<td><input class="input-medium" type="text" placeholder="http://"></td>
-															<td><input class="input-medium" type="text" placeholder="Titre du lien"></td>
-															<td>
-																<a class="btn" href="#"><i class="icon-trash"></i></a>
-																<a class="btn" href="#"><i class="icon-plus"></i></a>
-															</td>
-														</tr>
-													</tbody>
-												</table>
-											</form>
-										</div>
-
-								</div>
-	<!-- Son -->
-								<div class="edit-annotation-title row">
-									<h3 class="span3"><i class="icon-volume-up"></i> Son</h3>
-								</div>
-								<div class="row annotation-audio-content">
-										<div class="span6">
-											<form class="form-horizontal">
-												<div class="control-group">
-													<label class="control-label" for="url-source">URL source :</label>
-													<div class="controls">
-														<input type="text" id="url-source" placeholder="http://">
-													</div>
-												</div>
-												<div class="control-group">
-													<label class="control-label" for="embed">Code embed :</label>
-													<div class="controls">
-														<textarea name="" id="embed" cols="30" rows="10"></textarea>
-													</div>
-												</div>
-											</form>
-										</div>
-								</div>
-
-	<!-- vidéo -->
-								<div class="edit-annotation-title row">
-									<h3 class="span3"><i class="icon-film"></i> Vidéo</h3>
-									<span class="span3">
-										<span class="label-add-video">Ajouter une vidéo </span> 
-										<a data-type-media="video" data-id="annotation-azerty" data-title="Ajouter une vidéo" class="btn btn-success open-modal" href="modal-bibliotheque-video.html"><i class="icon-plus"></i></a>
-									</span>
-								</div>
-								<div class="row annotation-video-content">
-									<div class="span6">
-										<img src="img/460x345.gif" alt="">
-										<table class="table">
-											<tbody>
-												<tr>
-													<th>Titre</th>
-													<td>Titre de la vidéo Azerty</td>
-												</tr>
-												<tr>
-													<th>Date</th>
-													<td>14 / 05 / 2016</td>
-												</tr>
-												<tr>
-													<th>Durée</th>
-													<td>25 m 35 s</td>
-												</tr>
-												<tr>
-													<th>Description</th>
-													<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quidem iste blanditiis ducimus sint nemo aspernatur rem hic facere culpa dolore quis itaque magni voluptates aliquid veritatis non harum quo libero.</td>
-												</tr>
-											</tbody>
-										</table>
-									</div>
-								</div>
-							
-	<!-- html -->
-								<div class="edit-annotation-title row">
-									<h3 class="span3"><i class="icon-link"></i> Html</h3>
-								</div>
-								<div class="row edit-annotation-html">
-									<div class="span6">
-										<textarea class="" name="" id="" cols="30" rows="10"></textarea>
-										
-									</div>
-									<div class="span6 text-right">
-										<a href="#" class="btn btn-html-apercu"><i class="icon-eye-open"></i> Aperçu</a>
-									</div>
-									<div class="html-apercu span6"></div>
-								</div>
-							
-
-	<!-- text -->
-								<div class="edit-annotation-title row">
-									<h3 class="span3"><i class="icon-align-left"></i> Texte</h3>
-								</div>
-								<div class="row">
-									<div class="span6 wysiwyg-wrap">
-										<textarea class="wysiwyg" name="" id="" cols="30" rows="10"></textarea>
-									</div>
-								</div>
-	<!-- diaporama -->
-						
-								<div class="edit-annotation-title row">
-									<h3 class="span3"><i class="icon-picture"></i> Diaporama</h3>
-									<span class="span3">
-										Ajouter une image 
-										<a data-type-media="image" data-diaporama="diaporama-id1" data-title="Ajouter une image" class="btn btn-success open-modal" href="modal-bibliotheque-image.html"><i class="icon-plus"></i></a>
-									</span>
-								</div>
-								<div class="row config-diaporama">
-									<form action="">
-										<div class="span3">
-											<label for="">Diaporama :</label>
-										    <div class="btn-group" data-toggle="buttons-radio">
-											    <button type="button" class="btn btn-primary">Manuel</button>
-											    <button type="button" class="btn btn-primary active">Auto</button>
-										    </div>	
-										</div>
-										<div class="span3">
-											<label for="">Durée image : </label>
-											<input pattern="[0-9]*" class="span1 number-spin" type="text" value="1"> sec
-										</div>
-									</form>
-								</div>
-								<div class="row">
-									<div class="span6">
-										<table class="table">
-											<thead>
-												<tr>
-													<th>Aperçu</th>
-													<th>Titre</th>
-													<th>Description</th>
-													<th>Actions</th>
-												</tr>
-											</thead>
-											<tbody id="diaporama-id1" class="list-image-diaporama ui-sortable">
-												<tr id="rid-id1" class="row-image-diaporama">
-													<td><img src="img/60x60.gif" alt=""> </td>
-													<td>Titre annotation 1</td>
-													<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis aliquid non placeat consequuntur fugit minima.</td>
-													<td>
-														<table>
-															<tr>
-																<td><a data-type-media="image" data-title="Modifier une image" class="btn open-modal" href="modal-image.html"><i class="icon-pencil"></i></a></td>
-																<td><a data-title="une image" href="#rid-id1" class="btn btn-delete"><i class="icon-trash"></i></a></td>
-															</tr>
-															<tr>
-																<td><a href="" class="btn btn-sort down"><i class="icon-angle-down"></i></a></td>
-																<td><a href="" class="btn btn-sort up"><i class="icon-angle-up"></i></a></td>
-															</tr>
-														</table>
-													</td>
-												</tr>
-												<tr id="rid-id2" class="row-image-diaporama">
-													<td><img src="img/60x60.gif" alt=""> </td>
-													<td>Titre annotation 2</td>
-													<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis aliquid non placeat consequuntur fugit minima.</td>
-													<td>
-														<table>
-															<tr>
-																<td><a href="" class="btn"><i class="icon-pencil"></i></a></td>
-																<td><a href="" class="btn"><i class="icon-trash"></i></a></td>
-															</tr>
-															<tr>
-																<td><a href="" class="btn btn-sort down"><i class="icon-angle-down"></i></a></td>
-																<td><a href="" class="btn btn-sort up"><i class="icon-angle-up"></i></a></td>
-															</tr>
-														</table>
-													</td>
-												</tr>
-												<tr id="rid-id3" class="row-image-diaporama">
-													<td><img src="img/60x60.gif" alt=""> </td>
-													<td>Titre annotation 3</td>
-													<td>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis aliquid non placeat consequuntur fugit minima.</td>
-													<td>
-														<table>
-															<tr>
-																<td><a href="" class="btn"><i class="icon-pencil"></i></a></td>
-																<td><a href="" class="btn"><i class="icon-trash"></i></a></td>
-															</tr>
-															<tr>
-																<td><a href="" class="btn btn-sort down"><i class="icon-angle-down"></i></a></td>
-																<td><a href="" class="btn btn-sort up"><i class="icon-angle-up"></i></a></td>
-															</tr>
-														</table>
-													</td>
-												</tr>
-											</tbody>
-										</table>
-									</div>
-								</div>
-						
-							</div><!-- /exemple annotation all -->
-
+							</div><!-- /.liste annotations -->
 						</div><!-- /.tab-content -->
 					</div><!-- /.col-right -->
 				</div>
@@ -552,9 +209,9 @@
 </div>
 
 <div id="templates">
+
 <script id="tpl-head" type="text/html">
 <form action="#" class="form-info-general-annotation" data-id="{{id}}">
-	
 	<div class="row">
 		<div class="span3 text-right">
 			<label class="label-left" for="head-title-{{id}}">Titre :</label>
@@ -751,8 +408,12 @@
 
 <script id="tpl-links-row" type="text/html">
 <tr>
-	<td class="control-group"><input class="input-medium url-link" type="text" value="{{url}}" placeholder="http://"></td>
-	<td><input class="input-medium title-link" type="text" value="{{title}}" placeholder="Titre du lien"></td>
+	<td class="control-group">
+		<input class="input-medium url-link" type="text" value="{{url}}" placeholder="http://">
+		<div class="help-inline"><i class="icon-unlink"></i> Le lien est incorrect.</div>
+	</td>
+	<td><input class="input-medium title-link" type="text" value="{{title}}" placeholder="Titre du lien">
+	</td>
 	<td>
 		<a class="btn delete-link" href="#"><i class="icon-trash"></i> </a>
 	</td>