genrimages
clone your own copy | download snapshot

Snapshots | iceberg

Inside this repository

fiche-i-annotation.tpl.html~
text/html

Download raw (7.9 KB)

<html>
    <head>
	<meta charset="utf-8">
	<title>Genrimages</title>
	<link href="styles.css" rel="stylesheet" type="text/css" />
        <link rel="stylesheet" href="genrimages.css">
        <style type="text/css" media="all">@import "annotation.css";</style>
        <script type="text/javascript" src="dist/js/jquery.min.js"></script>
        <script type="text/javascript" src="dist/js/jquery-ui.min.js"></script>
	<script type="text/javascript" src="jquery.annotate.js"></script>
	<script src="jquery.scrollTo/jquery.scrollTo.js"></script>
		<script language="javascript">
			$(window).load(function() {
				$("#toAnnotate").annotateImage({
//					getUrl: "http://localhost/genrimages/annotation/get.php?json=data-sophie/1482410596.json",
					getUrl: "/annotations/refactor.php?1=1",

					saveUrl: "save.php",
					deleteUrl: "delete.html",
					editable: true
				});
			});
		</script>
    </head>
    <body>
	<div id="surface">
	<div id="page">
	  <div id="menu_long">
	    <div id="menu">
		<div id="menu_haut">
		    <div id="logo"><img src="images/logo-glacial-italic.png" alt="Genrimages logo" title="Genrimages logo"/></div>
		    <div id="menu_infos">
			<div class="menu_infos_item">à propos</div>
			<div class="menu_infos_item">connexion</div>
			<div class="menu_filtres_item_search" style="width:500px;text-align:right;">
			    <input type="text" id="search" name="search" value="rechercher" class="search_box" />
			</div>
		    </div>
		</div>
		<br class="clear" />
		<div id="menu_bas">
		    <div id="menu_blurb">représentations sexuées et stéréotypes dans l'image</div>
			<div id="menu_filtres">
			    <div class="menu_filtres_item_filtrer"  id="click_filtrer">
				filtrer
			    </div>
			    <div class="menu_filtres_item">
				&rarr; <span class="item_sel_" id="click_medium">médiums</span>
			    </div>
			    <div class="menu_filtres_item">
				&rarr; <span class="item_sel_" id="click_niveaux">niveaux</span>
			    </div>
			    <div class="menu_filtres_item">
				&rarr; <span class="item_sel_" id="click_mots_cles">mots-clés</span>
			    </div>
			    <div class="menu_filtres_item_search">			<span id="menu_garder_selection" style="display:none;"><span class="garder_selection_bouton">Appliquer la sélection.</span></span>

		    </div></div>
			</div>
			<div id="menu_filtres_select" style="display:none;">
			    <div class="menu_filtres_item_select" id="click_medium_items" style="padding-left:65px;width:125px;display:none;">
				<li><span class="item_sel_">films</span></li><li><span class="item_sel">publicités</span></li>  <li>séries</li>
			    </div>
			    <div class="menu_filtres_item_select" id="click_niveaux_items" style="padding-left:20px;width:140px;display:none;">
				<li>primaire</li> <li><span class="item_sel">lycée</span></li><li>université</li>
			    </div>
			    <div class="menu_filtres_item_select"  id="click_mots_cles_items" style="width:400px;display:none;">
				Audiovisuel <span class="item_sel">Beauté</span> Corps Couple Cybersexisme Discriminations <span class="item_sel">Ecole</span> Genre Harcèlement Histoire Homophobie Mixité Orientation Parentalité Sexualité Sciences Sexisme Sexualité <span class="item_sel">Sport</span>
			    </div>
			</div>

				<br class="clear" />

		</div>
	    <br class="clear" />
		</div>
	    <div id="main">
	    <div id="content">
	    <div style="visibility:hidden;" id="coin_dossier"><span class="coin_dossier_item">Télécharger le pdf</span> <span class="coin_dossier_item">Ajouter à ma sélection</span></div>
	    <div style="" id="fiche_dossier">
	    <div id="fiche_dossier_panel_left">
	    <div id="fiche_dossier_main_title">
	      Clio Estate
	    </div>
	    <div id="fiche_dossier_main_vignette">
	      <!---<img src="images/clio.png" class="fiche_dossier_main_adapt"/>-->
	      <img id="toAnnotate" src="images/clio-410.png" alt="Publicité Polo" data-name="1482410596" />
	      </div>
	      <div id="fiche_dossier_main_thumbs"></div>
	    </div>
	    <div id="fiche_dossier_panel_right">
	    <div id="fiche_dossier_main_titres">
	      <span class="fiche_dossier_main_titres_item"><a href="fiche-i-dissect.tpl.html" class="trans">Fiche</a></span>
	      <span class="fiche_dossier_main_titres_item_">Annotation</span>
	    </div>
	    	    <div id="fiche_dossier_main_onglets">
	<span class="fiche_dossier_main_onglets_item_">Notes</span>
	<span class="fiche_dossier_main_onglets_item">Questions</span>	
		    </div>
	    	    <div id="fiche_dossier_main_ancres">
	<span class="fiche_dossier_main_ancres_item" id="click_objectifs">voir les notes proposées</span>
	<span class="fiche_dossier_main_ancres_item_sep">éditer ses propres notes</span>
		    </div>
		    <div id="fiche_dossier_main_scrollpane">
<div id="panel_right"></div>

		    </div>
	    <br class="clear" />

	    </div>
	    	    <br class="clear" />

		    <div class="vignettes_triggers">
<span class="test-trig" id="trig_01"><img src="images/vignette-bas-001.png" /></span>
<span class="test-trig" id="trig_02"><img src="images/vignette-bas-002.png" /></span>
		      <span class="test-trig" id="trig_03"><img src="images/vignette-bas-003.png" /></span>
<span class="test-trig" id="trig_04"><img src="images/vignette-bas-004.png" /></span>
		      <span class="test-trig" id="trig_05"><img src="images/vignette-bas-005.png" /></span>
		      		      <span class="test-trig" id="trig_06"><img src="images/vignette-bas-006.png" /></span>
		      </div>

	    </div>

	    </div>
	    </div>
	    </div>
	    </div>

		<script>
$(document).ready(function(){
$('#click_objectifs').click(function(){
  $('#fiche_dossier_main_scrollpane').scrollTo($('#tgt_objectifs'),500);
  $('#click_objectifs').css('color','#5d1ffc');
  $('#click_ressources').css('color','black');
	    });
$('#click_ressources').click(function(){
  $('#fiche_dossier_main_scrollpane').scrollTo($('#tgt_ressources'),500);
  $('#click_objectifs').css('color','black');
  $('#click_ressources').css('color','#5d1ffc');
	    });
$('#trig_01').click(function(){
	      $('#control_lay_9').click();
	      $('.layer').css('background','#5d1ffc');
	      $('#panel_right').css('backgroundColor','#5d1ffc');
	      $('#control_lay_9').css('backgroundColor','#75f380');
	      $('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_9'),500,{offset:-50});
	    });
	    $('#trig_02').click(function(){
	      $('#control_lay_10').click();
	      $('.layer').css('background','#5d1ffc');
	      $('#panel_right').css('backgroundColor','#5d1ffc');
	      $('#control_lay_10').css('backgroundColor','#75f380');
	      $('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_10'),500,{offset:-50});
	    });
	    $('#trig_03').click(function(){
	      $('#control_lay_3').click();
	      $('.layer').css('background','#5d1ffc');
	      $('#panel_right').css('backgroundColor','#5d1ffc');
	      $('#control_lay_3').css('backgroundColor','#75f380');
	      $('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_3'),500,{offset:-50});
	    });
	    $('#trig_04').click(function(){
	      $('#control_lay_2').click();
	      $('.layer').css('background','#5d1ffc');
	      $('#panel_right').css('backgroundColor','#5d1ffc');
	      $('#control_lay_2').css('backgroundColor','#75f380');
	      $('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_2'),500,{offset:-50});
	    });
	    $('#trig_05').click(function(){
	      $('#control_lay_5').click();
	      $('.layer').css('background','#5d1ffc');
	      $('#control_lay_5').css('backgroundColor','#75f380');
	      $('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_5'),500,{offset:-50});
	    });
	    $('#trig_06').click(function(){
	      $('#control_lay_11').click();
	      $('.layer').css('background','#5d1ffc');
	      $('#panel_right').css('backgroundColor','#5d1ffc');
	      $('#control_lay_11').css('backgroundColor','#75f380');
	      $('#fiche_dossier_main_scrollpane').scrollTo($('#control_lay_11'),500,{offset:-50});
	    });


});

	</script>
    </body>
</html>