--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/integration/edition.html Wed Oct 17 18:24:00 2012 +0200
@@ -0,0 +1,292 @@
+<!DOCTYPE html>
+<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
+<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
+<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
+<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <title>Edition</title>
+ <link rel="stylesheet" href="css/reset.css" />
+ <link rel="stylesheet" href="css/style.css" />
+ <link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.24.custom.css">
+ <script src="js/vendor/modernizr-2.6.1.min.js"></script>
+ </head>
+ <body>
+ <div class="wrap">
+ <div class="wrap-header">
+ <a title="Bibliothèque centre Pompidou" href="#"><img src="img/pompidou-logo.jpg" alt="Bibliothèque centre Pompidou" /></a>
+ </div>
+ <div class="header">
+ <!-- popin header -->
+ <div class="popin update-title" id="update-title">
+ <img class="pointer" src="img/popin-triangle.png" alt="" />
+ <div class="popin-content">
+ <form class="clearfix" action="#" method="">
+ <div class="form-left">
+ <p class="titre-wrap">
+ <label for="titre-video">Titre :</label>
+ <input type="text" id="titre-video" name="" value="Mon Hashcut" />
+ </p>
+ <p>
+ <label for="tags-video">Tags :</label>
+ <input type="text" id="tags-video" name="" value="Lune, Espace, Lune" />
+ </p>
+ </div>
+ <p class="form-right">
+ <label for="description-video">Description :</label>
+ <textarea name="" id="description-video" cols="30" rows="10"></textarea>
+ </p>
+ </form>
+ </div>
+ </div><!-- popin update-title -->
+
+ <div class="popin user info" id="user">
+ <img class="pointer" src="img/popin-triangle.png" alt="" />
+ <div class="popin-content">
+ <h2>Mashup75</h2>
+ <h3>mash@cinecast.fr</h3>
+ <a href="#" class="nb-hashcut">12 Hashcuts</a>
+ <a href="#" class="change-account">Changer de compte</a>
+ </div>
+ </div><!-- popin user info-->
+
+ <div class="popin user signup" id="user">
+ <img class="pointer" src="img/popin-triangle.png" alt="" />
+ <div class="popin-content">
+ <h2>Créer un compte :</h2>
+ <form action="#">
+ <p>
+ <label for="signup-pseudo">Pseudonyme : </label>
+ <input type="text" id="signup-pseudo" name="" />
+ </p>
+ <p >
+ <label for="signup-email">Email : </label>
+ <input type="text" id="signup-email" name="" />
+ </p>
+ <p >
+ <label for="signup-password">Mot de passe : </label>
+ <input type="password" id="signup-password" name="" />
+ </p>
+ <p>
+ <label for="signup-password">Confirmer le mot de passe : </label>
+ <input type="password" id="signup-password" name="" />
+ </p>
+ </form>
+
+ </div>
+ </div><!-- popin user signup-->
+
+ <h1><a title="Hashcut - Le Mashup cliquable" class="clearfix" href="#">
+ <img src="img/hashcut-logo.jpg" alt="Hashcut" />
+ <span>Le Mashup<br />Cliquable</span>
+ </a></h1>
+ <div class="title-video-wrap">
+ <a class="open-popin" href="#update-title">Hashcut sans titre</a>
+ <p class="time-length">Durée: <span>02:24</span></p>
+ </div>
+ <div class="profil-wrap">
+ <a href="#" class="all-hashcut">Tous les Hashcuts</a>
+ <a href="#user" class="my-profil open-popin">Mon profil</a>
+ </div>
+ </div><!-- header -->
+ <div class="content clearfix">
+ <div class="col-left">
+ <form action="#" method="">
+ <h2>Sélectionner les vidéos</h2>
+ <p>
+ <input type="text" name="" placeholder="Rechercher une vidéo" />
+ <input type="submit" value="" />
+ </p>
+ </form>
+ <ul class="list-video">
+ <li class="item-video">
+ <a class="clearfix" href="#">
+ <span class="number">12</span>
+ <img src="img/apercu-video.jpg" alt="aperçu" />
+ <span class="video-info">
+ <span class="title-video">Le a Lune</span>
+ <span class="author">Par : Mozilla Foundation</span>
+ <span class="time-lenght">Durée : <span>12:33</span></span>
+ </span>
+ </a>
+ </li><!-- item-video -->
+ <li class="item-video">
+ <a class="clearfix active" href="#">
+ <span class="number">12</span>
+ <img src="img/apercu-video.jpg" alt="aperçu" />
+ <span class="video-info">
+ <span class="title-video">Le a Lune</span>
+ <span class="author">Par : Mozilla Foundation</span>
+ <span class="time-lenght">Durée : <span>12:33</span></span>
+ </span>
+ </a>
+ </li><!-- item-video -->
+ <li class="item-video">
+ <a class="clearfix" href="#">
+ <span class="number">12</span>
+ <img src="img/apercu-video.jpg" alt="aperçu" />
+ <span class="video-info">
+ <span class="title-video">Le a Lune</span>
+ <span class="author">Par : Mozilla Foundation</span>
+ <span class="time-lenght">Durée : <span>12:33</span></span>
+ </span>
+ </a>
+ </li><!-- item-video -->
+ </ul>
+ </div><!-- col-left -->
+
+ <div class="col-middle">
+
+ <div class="bloc-pvw">
+ <div class="col-middle-header">
+ <a href="#" class="segmenter">Segmenter <em>La cuisine du Popcorn</em></a>
+ <a href="#" class="previsualiser">Prévisualiser</a>
+ </div>
+ <div class="video">
+ <a class="publier-button" title="Publier" href="#"></a>
+ <img src="img/visuel-player.png" alt="" />
+ </div>
+
+ <div class="frise clearfix">
+
+ <span class="indication" style="left:24%;">00:30</span>
+ <span class="indication" style="left:44%;">00:30</span>
+ <span class="indication" style="left:64%;">00:30</span>
+ <span class="indication" style="left:84%;">00:30</span>
+
+ <div class="segments">
+ <div class="segment" style="background-color:red;width:20%;"></div>
+ <div class="segment" style="background-color:green;width:20%;"></div>
+ <div class="segment" style="background-color:red;width:20%;"></div>
+ <div class="segment" style="background-color:green;width:20%;"></div>
+ <div class="segment" style="background-color:red;width:20%;"></div>
+ </div>
+
+
+ <div class="popin frise-description" id="frise-description">
+ <img class="pointer" src="img/popin-triangle.png" alt="" />
+ <div class="popin-content">
+ <ul class="tools">
+ <li><a class="edit" href="#"></a></li>
+ <li><a class="bottom" href="#"></a></li>
+ <li><a class="top" href="#"></a></li>
+ <li><a class="delete" href="#"></a></li>
+ </ul>
+
+ <h2>Chargement de la capsule lunaire</h2>
+ <table>
+ <tbody>
+ <tr>
+ <th>Extrait de :</th>
+ <td>Le Voyage dans la Lune (05:01 - 05:24)</td>
+ </tr>
+ <tr>
+ <th>Description :</th>
+ <td>Lors d'un colloque d'astronomie, le professeur Barbenfouillis crée l'événement en faisant part à l'assemblée de son projet de voyage dans la Lune. Il organise ensuite la visite à ses confrères de l'atelier où l'obus spatial est en chantier. Il sera propulsé en direction de la Lune au moyen d'un canon géant.</td>
+ </tr>
+ <tr>
+ <th>Tags :</th>
+ <td>astronomie, lune, fiction, histoire du cinéma, canon, projectile</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div><!-- popin frise-description -->
+
+ </div><!-- frise -->
+ </div><!-- bloc-pvw -->
+
+
+ </div><!-- col-middle -->
+
+ <div class="col-right">
+ <div class="liste-segment">
+ <h2>Liste des segments</h2>
+ <div class="frise clearfix">
+
+ <span class="indication" style="left:64%;">00:30</span>
+ <span class="indication" style="left:84%;">00:30</span>
+ <div class="segments">
+ <div class="segment" style="background-color:red;width:20%;"></div>
+ <div class="segment" style="background-color:yellow;width:20%;"></div>
+ <div class="segment" style="background-color:blue;width:20%;"></div>
+ <div class="segment" style="background-color:green;width:20%;"></div>
+ <div class="segment" style="background-color:brown;width:20%;"></div>
+ </div>
+ </div>
+ </div>
+
+ <ul class="list-video" id="sortable">
+ <li class="item-video">
+ <a class="clearfix" href="#">
+ <img src="img/apercu-video.jpg" alt="aperçu" />
+ <span class="video-info">
+ <span class="title-video">Le a Lune 1</span>
+ <span class="subtitle">Chargement de la Capsule</span>
+ <span class="duration">01:17 - 02:01 (00:44)</span>
+ </span>
+ </a>
+ <ul class="tools">
+ <li><a class="edit" href="#"></a></li>
+ <li><a class="bottom" href="#"></a></li>
+ <li><a class="top" href="#"></a></li>
+ <li><a class="delete" href="#"></a></li>
+ </ul>
+ </li><!-- item-video -->
+ <li class="item-video">
+ <a class="clearfix" href="#">
+ <img src="img/apercu-video.jpg" alt="aperçu" />
+ <span class="video-info">
+ <span class="title-video">Le a Lune 2</span>
+ <span class="subtitle">Chargement de la Capsule</span>
+ <span class="duration">01:17 - 02:01 (00:44)</span>
+ </span>
+ </a>
+ <ul class="tools">
+ <li><a class="edit" href="#"></a></li>
+ <li><a class="bottom" href="#"></a></li>
+ <li><a class="top" href="#"></a></li>
+ <li><a class="delete" href="#"></a></li>
+ </ul>
+ </li><!-- item-video -->
+ <li class="item-video">
+ <a class="clearfix" href="#">
+ <img src="img/apercu-video.jpg" alt="aperçu" />
+ <span class="video-info">
+ <span class="title-video">Le a Lune 3</span>
+ <span class="subtitle">Chargement de la Capsule</span>
+ <span class="duration">01:17 - 02:01 (00:44)</span>
+ </span>
+ </a>
+ <ul class="tools">
+ <li><a class="edit" href="#"></a></li>
+ <li><a class="bottom" href="#"></a></li>
+ <li><a class="top" href="#"></a></li>
+ <li><a class="delete" href="#"></a></li>
+ </ul>
+ </li><!-- item-video -->
+ </ul>
+ </div><!-- col-right -->
+
+ </div><!-- content -->
+
+ <div class="footer clearfix">
+ <ul class="links-left">
+ <li><a href="#">Mentions légales</a></li>
+ <li><a href="#">Contacts</a></li>
+ </ul>
+ <ul class="links-right">
+ <li><a title="IRI" href="#"> <img src="img/logo-iri.png" alt="iri" /></a></li>
+ <li><a title="cinecast" href="#"><img src="img/logo-cinecast.png" alt="cinecast" /></a></li>
+ <li>© 2012</li>
+ </ul>
+ </div>
+ </div>
+ <!-- JavaScript -->
+ <script src="js/vendor/jquery-1.8.0.min.js"></script>
+ <script src="js/vendor/jquery-ui-1.8.24.custom.min.js"></script>
+ <script src="js/plugins.js"></script>
+ <script src="js/main.js"></script>
+ </body>
+</html>