integration/edition.html
changeset 41 3ec2343f2b85
parent 39 d3d8a88878ed
child 42 40909e8d6855
equal deleted inserted replaced
40:76efa2333f31 41:3ec2343f2b85
     6         <meta name="description" content="Interface d'édition de Hashcuts (Mashups vidéo cliquables)" />
     6         <meta name="description" content="Interface d'édition de Hashcuts (Mashups vidéo cliquables)" />
     7         <meta name="copyright" content="Institut de Recherche et d'Innovation (IRI), 2012" />
     7         <meta name="copyright" content="Institut de Recherche et d'Innovation (IRI), 2012" />
     8         <meta name="author" content="Anthony Ly, Raphaël Velt" />
     8         <meta name="author" content="Anthony Ly, Raphaël Velt" />
     9         <title>Hashcut &gt; Edition</title>
     9         <title>Hashcut &gt; Edition</title>
    10         <link rel="stylesheet" href="lib/jquery-ui.css" />
    10         <link rel="stylesheet" href="lib/jquery-ui.css" />
       
    11         <link rel="stylesheet" href="lib/jquery.tagit.css" />
    11         <link rel="stylesheet" href="css/reset.css" />
    12         <link rel="stylesheet" href="css/reset.css" />
    12         <link rel="stylesheet" href="css/common.css" />
    13         <link rel="stylesheet" href="css/common.css" />
    13         <link rel="stylesheet" href="css/edition.css" />
    14         <link rel="stylesheet" href="css/edition.css" />
    14     </head>
    15     </head>
    15     <body>
    16     <body>
    22                 <div class="popin update-title" id="update-title">
    23                 <div class="popin update-title" id="update-title">
    23                     <img class="pointer" src="img/popin-triangle.png" alt="" />
    24                     <img class="pointer" src="img/popin-triangle.png" alt="" />
    24                     <div class="popin-content">
    25                     <div class="popin-content">
    25                         <form class="clearfix" action="#" method="">
    26                         <form class="clearfix" action="#" method="">
    26                             <div class="form-left">
    27                             <div class="form-left">
    27                                 <p class="titre-wrap">
    28                                 <label for="hashcut-title">Titre :</label>
    28                                     <label for="hashcut-title">Titre :</label>
    29                                 <input type="text" id="hashcut-title" name="" value="Hashcut sans titre" />
    29                                     <input type="text" id="hashcut-title" name="" value="Hashcut sans titre" />
    30                                 <label for="hashcut-tags">Tags :</label>
    30                                 </p>
    31                                 <ul id="hashcut-tags"></ul>
    31                                 <p>
    32                             </div>
    32                                     <label for="hashcut-tags">Tags :</label>
    33                             <div class="form-right">
    33                                     <input type="text" id="hashcut-tags" name="" value="" />
       
    34                                 </p>
       
    35                             </div>
       
    36                             <p class="form-right">
       
    37                                 <label for="hashcut-description">Description :</label>
    34                                 <label for="hashcut-description">Description :</label>
    38                                 <textarea name="" id="hashcut-description"></textarea>
    35                                 <textarea name="" id="hashcut-description"></textarea>
    39                             </p>
    36                             </div>
    40                         </form>
    37                         </form>
    41                     </div>
    38                     </div>
    42                 </div><!-- popin update-title -->
    39                 </div><!-- popin update-title -->
    43 
    40 
    44                 <div class="popin user info" id="user">
    41                 <div class="popin user info" id="user">
   210                                             <label for="segment-title">Titre :</label>
   207                                             <label for="segment-title">Titre :</label>
   211                                             <input type="text" id="segment-title" />
   208                                             <input type="text" id="segment-title" />
   212                                         </p>
   209                                         </p>
   213                                         <p>
   210                                         <p>
   214                                             <label for="segment-tags">Tags :</label>
   211                                             <label for="segment-tags">Tags :</label>
   215                                             <input type="text" id="segment-tags" />
   212                                             <ul id="segment-tags"></ul>
   216                                         </p>
   213                                         </p>
   217                                     </div>
   214                                     </div>
   218                                     <div class="form-segment-right">
   215                                     <div class="form-segment-right">
   219                                         <p>
   216                                         <p>
   220                                             <label for="segment-description">Description :</label>
   217                                             <label for="segment-description">Description :</label>
   235 
   232 
   236                     </div><!-- bloc-segmentation -->
   233                     </div><!-- bloc-segmentation -->
   237 
   234 
   238                     <div class="bloc-pvw">
   235                     <div class="bloc-pvw">
   239 
   236 
   240                         <div class="frise">
   237                         <div class="frise mashup-frise">
   241                             <div class="frise-overflow">
   238                             <div class="frise-overflow">
   242                                 <div class="frise-segments">
   239                                 <div class="frise-segments">
   243                                 </div>
   240                                 </div>
   244                                 <div class="frise-indications">
   241                                 <div class="frise-indications">
   245                                 </div>
   242                                 </div>
   268                                                 <th>Description :</th>
   265                                                 <th>Description :</th>
   269                                                 <td><span class="annotation-description"></span></td>
   266                                                 <td><span class="annotation-description"></span></td>
   270                                             </tr>
   267                                             </tr>
   271                                             <tr>
   268                                             <tr>
   272                                                 <th>Tags :</th>
   269                                                 <th>Tags :</th>
   273                                                 <td><span class="annotation-tags">(fonctionnalité à venir)</span></td>
   270                                                 <td><span class="annotation-tags"></span></td>
   274                                             </tr>
   271                                             </tr>
   275                                         </tbody>
   272                                         </tbody>
   276                                     </table>
   273                                     </table>
   277                                 </div>
   274                                 </div>
   278                             </div>
   275                             </div>
   284                     <div class="liste-segment">
   281                     <div class="liste-segment">
   285                         <div class="validate critical">
   282                         <div class="validate critical">
   286                             <div class="validate-tooltip"></div>
   283                             <div class="validate-tooltip"></div>
   287                         </div>
   284                         </div>
   288                         <h2>Liste des segments</h2>
   285                         <h2>Liste des segments</h2>
   289                         <div class="frise">
   286                         <div class="frise mashup-frise">
   290 							<p class="aucun-segment">Aucun segment</p>
   287 							<p class="aucun-segment">Aucun segment</p>
   291                             <div class="frise-overflow">
   288                             <div class="frise-overflow">
   292                                 <div class="frise-segments">
   289                                 <div class="frise-segments">
   293                                 </div>
   290                                 </div>
   294                                 <div class="frise-indications">
   291                                 <div class="frise-indications">
   318             </div><!-- footer -->
   315             </div><!-- footer -->
   319         </div><!-- wrap -->
   316         </div><!-- wrap -->
   320         <!-- JavaScript -->
   317         <!-- JavaScript -->
   321         <script type="text/javascript" src="lib/jquery.min.js"></script>
   318         <script type="text/javascript" src="lib/jquery.min.js"></script>
   322         <script type="text/javascript" src="lib/jquery-ui.min.js"></script>
   319         <script type="text/javascript" src="lib/jquery-ui.min.js"></script>
       
   320         <script type="text/javascript" src="lib/tag-it.js"></script>
   323         <script type="text/javascript" src="lib/underscore-min.js"></script>
   321         <script type="text/javascript" src="lib/underscore-min.js"></script>
   324         <script type="text/javascript" src="lib/popcorn-complete.min.js"></script>
   322         <script type="text/javascript" src="lib/popcorn-complete.min.js"></script>
   325         <script type="text/javascript" src="js/init.js"></script>
   323         <script type="text/javascript" src="js/init.js"></script>
   326         <script type="text/javascript" src="js/medialist-serializer.js"></script>
   324         <script type="text/javascript" src="js/medialist-serializer.js"></script>
   327         <script type="text/javascript" src="js/model.js"></script>
   325         <script type="text/javascript" src="js/model.js"></script>
       
   326         <script type="text/javascript" src="js/mashupcore.js"></script>
   328         <script type="text/javascript" src="js/editor.js"></script>
   327         <script type="text/javascript" src="js/editor.js"></script>
   329         <script type="text/javascript" src="js/common.js"></script>
   328         <script type="text/javascript" src="js/common.js"></script>
   330         <script type="text/javascript">
   329         <script type="text/javascript">
   331     $(function() {
   330     $(function() {
   332         var hashcut = new IriSP.Hashcut({url: "data/bpidata.json"});
   331         var hashcut = IriSP.editor({url: "data/moon.json"});
   333     });
   332     });
   334         </script>
   333         </script>
   335     </body>
   334     </body>
   336 </html>
   335 </html>