7 <title>Festival d’Art Lyrique d'Aix en Provence › Webdoc player</title> |
7 <title>Festival d’Art Lyrique d'Aix en Provence › Webdoc player</title> |
8 |
8 |
9 <link rel="stylesheet" type="text/css" href="css/styles.css" /> |
9 <link rel="stylesheet" type="text/css" href="css/styles.css" /> |
10 |
10 |
11 <script type="text/javascript" src="lib/jquery.min.js"></script> |
11 <script type="text/javascript" src="lib/jquery.min.js"></script> |
12 <script type="text/javascript" src="lib/jquery-ui.min.js"></script> |
|
13 <script type="text/javascript" src="lib/underscore-min.js"></script> |
12 <script type="text/javascript" src="lib/underscore-min.js"></script> |
14 <script type="text/javascript" src="js/metadataplayer-core.js"></script> |
13 <script type="text/javascript" src="js/metadataplayer-core.js"></script> |
15 <script type="text/javascript" src="js/ldt-serializer.js"></script> |
14 <script type="text/javascript" src="js/ldt-serializer.js"></script> |
16 <script type="text/javascript" src="js/player.js"></script> |
15 <script type="text/javascript" src="js/player.js"></script> |
17 <script type="text/javascript"> |
16 <script type="text/javascript"> |
25 <div class="top-bar"> |
24 <div class="top-bar"> |
26 <div class="tags"> |
25 <div class="tags"> |
27 <h3 class="tags-title">Tags</h3> |
26 <h3 class="tags-title">Tags</h3> |
28 <ul class="tags-list"></ul> |
27 <ul class="tags-list"></ul> |
29 </div> |
28 </div> |
|
29 <span class="topright-buttons"> |
|
30 <a class="full-screen" href="#"></a> |
|
31 <a class="about" href="#"></a> |
|
32 </span> |
30 <h1 class="project-title"></h1> |
33 <h1 class="project-title"></h1> |
31 </div> |
34 </div> |
32 <div class="main-video" style="background:#101010;"> |
35 <div class="main-video"> |
33 <div class="video-container"></div> |
36 <div class="video-container"></div> |
34 <ul class="pictolist"></ul> |
37 <ul class="pictolist"></ul> |
35 |
|
36 </div> |
38 </div> |
37 <div class="bottom-bar"> |
39 <div class="bottom-bar"> |
38 <div class="play-button"> |
40 <div class="play-button"> |
39 <a href="#"></a> |
41 <a href="#"></a> |
40 </div> |
42 </div> |
41 <div class="chapters-bar"> |
43 <div class="timelines"> |
42 <ul class="chapters-list"></ul> |
44 <div class="timeline"> |
43 <ul class="chips-list"></ul> |
45 <div class="elapsed"></div> |
44 <div class="left-hiding-block"></div> |
46 <div class="progress-indicator"></div> |
45 <div class="right-hiding-block"></div> |
47 <div class="mouse-progress-indicator"></div> |
46 <div class="progress-indicator"></div> |
48 </div> |
|
49 <div class="chapters-bar"> |
|
50 <ul class="chapters-list"></ul> |
|
51 <ul class="chips-list"></ul> |
|
52 <div class="left-hiding-block"></div> |
|
53 <div class="right-hiding-block"></div> |
|
54 <div class="progress-indicator"></div> |
|
55 </div> |
47 </div> |
56 </div> |
48 <div class="chapter-nav"> |
57 <div class="chapter-nav"> |
49 <div class="prev-chapter inactive"></div> |
58 <div class="prev-chapter inactive"></div> |
50 <div class="next-chapter"></div> |
59 <div class="next-chapter"></div> |
51 </div> |
60 </div> |
52 </div> |
61 </div> |
53 <div class="annotation-templates"> |
62 <div class="annotation-templates"> |
54 <div class="annotations"> |
63 <div class="annotations"> |
|
64 |
|
65 <div class="annotation about-box white-annotation"> |
|
66 <a href="#" class="close-annotation"></a> |
|
67 <h2 class="annotation-title">À propos des Webdocs</h2> |
|
68 <h3>Une collaboration</h3> |
|
69 <ul class="about-collaboration"> |
|
70 <li> |
|
71 <img src="img/logo-aix.png" alt="Logo du Festival d’Art Lyrique d’Aix-en-Provence" /> |
|
72 <p>Festival d’Art Lyrique d’Aix-en-Provence</p> |
|
73 </li> |
|
74 <li> |
|
75 <img src="img/logo-iri.png" alt="Logo de l’Institut de Recherche et d’Innovation" /> |
|
76 <p>Institut de Recherche et d’Innovation</p> |
|
77 </li> |
|
78 </ul> |
|
79 </div> |
55 |
80 |
56 <div class="annotation text-annotation white-annotation"> |
81 <div class="annotation text-annotation white-annotation"> |
57 <a href="#" class="close-annotation"></a> |
82 <a href="#" class="close-annotation"></a> |
58 <h2 class="annotation-title"></h2> |
83 <h2 class="annotation-title"></h2> |
59 <div class="text-contents"></div> |
84 <div class="text-contents"></div> |