# HG changeset patch
# User Anthony Ly <anthonyly.com@gmail.com>
# Date 1364998765 -7200
# Node ID 4aec3f00ea876aa3d67672333033b17de7d4cb19
# Parent  ca1b8c0fbe353f0e07d663323db6f702043de904
intégration création cinecard v1

diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/css/iri.css
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/integ/css/iri.css	Wed Apr 03 16:19:25 2013 +0200
@@ -0,0 +1,65 @@
+.sidebar{display: table-cell; padding-top:60px; vertical-align: top;  }
+.sidebar .content{width: 280px; padding: 18px 0 0 12px; height: 100%;}
+.inner-content{padding-right: 16px;}
+.sidebar h2{font-size: 20px; margin-bottom: 24px;}
+.user{ height: 30px; line-height: 30px;}
+.user img{width: 30px; height: 30px; margin: 0 24px 24px 0; float: left;}
+.user p{float: left;}
+h3.instruction{color: #c7c7c7; clear: both; padding-bottom: 14px; margin: 0; border-bottom: 1px solid #3b3b3b;}
+.stickers li{margin: 0 10px 10px 0;float:left;width: 81px; height: 80px;background-color: #fff;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; background-repeat: no-repeat; background-position: center 13px;}
+.stickers li span{width: 100%;color: #212121; font-size: 12px;font-weight: bold; line-height: 12px; display: inline-block; text-align: center;padding-top: 48px;}
+li.culte{background-image: url(../img/culte-scene-icon.png);}
+li.star{background-image: url(../img/star-icon.png);}
+li.like{background-image: url(../img/like-icon.png);}
+.stickers li:nth-child(3n+3) { margin-right: 0;}
+.sidebar h3{font-size: 13px; font-weight: bold; margin-bottom: 12px;}
+
+.more{margin-bottom: 16px;width: 100%; height: 12px; background-color: #191919; display: inline-block;}
+.more:hover{background-color: #3b3b3b;}
+.more span{ margin: 4px auto 0 auto;width: 13px; height: 4px; background: url(../img/arrow-more.png) 0 0 no-repeat; display: block;}
+.more.less span{background-position: bottom left;}
+.more-hide{display: none;}
+
+.stars li:nth-child(4n+4) { margin-right: 0;}
+.stars li{margin: 0 8px 10px 0;width: 58px; height: 78px;border: 1px solid #767676; float: left;}
+.stars img{width: 58px; height: 78px;}
+
+.images li:nth-child(3n+3) { margin-right: 0;}
+.images li{margin: 0 8px 10px 0;width: 80px; height: 80px;border: 1px solid #767676; float: left;}
+.images img{width: 80px; height: 80px;}
+
+.videos li:nth-child(3n+3) { margin-right: 0;}
+.videos li{margin: 0 8px 10px 0;width: 80px; height: 64px;border: 1px solid #767676; float: left;}
+.videos img{width: 80px; height: 64px;}
+
+.renkan{display: table-cell; padding-top:60px; vertical-align: top;  background-color: #eee; width:100%; background: url(../img/bg-renkan.png) 0 0; min-width: 400px;}
+.renkan .wrap-top{width: 100%; height: 56px; background-color:rgba(0,0,0,.4);}
+.renkan .wrap-top h2{ font-size: 30px; padding-left: 18px; line-height: 56px; display: inline-block;}
+
+.zoom{width: 30px; margin: 18px 0 0 16px;-webkit-box-shadow: 0px 2px 1px rgba(0, 0, 0, 0.1);-moz-box-shadow:    0px 2px 1px rgba(0, 0, 0, 0.1);box-shadow:         0px 2px 1px rgba(0, 0, 0, 0.1);}
+.zoom li{padding: 0;width: 30px; height: 30px;}
+.zoom a{margin: 0;width: 30px; height: 30px; display: inline-block; background: url(../img/zoom.png) center top no-repeat;}
+.zoom a:hover{background-color: #191919;}
+.zoom .in{background-color: #929292; background-position: center 8px;}
+.zoom .out{background-color: #fff; background-position: center -22px;}
+
+.renkan .actions{width: 194px; float: right; margin: 12px 12px 0 0;}
+.renkan .actions li{float: left;}
+.renkan .actions a{width: 92px; height: 32px; display: inline-block; text-align: center; line-height: 32px; font-size: 11px; font-weight: bold;text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.8);-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.75);
+-moz-box-shadow:    0px 1px 1px rgba(0, 0, 0, 0.75);
+box-shadow:         0px 1px 1px rgba(0, 0, 0, 0.75);-webkit-border-radius: 4px;
+-moz-border-radius: 4px;
+border-radius: 4px;}
+a.cancel{margin-right: 8px;
+	background: #555555; background: -moz-linear-gradient(top,  #555555 0%, #7a7a7a 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#555555), color-stop(100%,#7a7a7a)); background: -webkit-linear-gradient(top,  #555555 0%,#7a7a7a 100%); background: -o-linear-gradient(top,  #555555 0%,#7a7a7a 100%); background: -ms-linear-gradient(top,  #555555 0%,#7a7a7a 100%); background: linear-gradient(to bottom,  #555555 0%,#7a7a7a 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#555555', endColorstr='#7a7a7a',GradientType=0 ); /* IE6-9 */
+}
+a.cancel:hover{
+	background: #7a7a7a;background: -moz-linear-gradient(top,  #7a7a7a 0%, #555555 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7a7a7a), color-stop(100%,#555555));background: -webkit-linear-gradient(top,  #7a7a7a 0%,#555555 100%);background: -o-linear-gradient(top,  #7a7a7a 0%,#555555 100%);background: -ms-linear-gradient(top,  #7a7a7a 0%,#555555 100%);background: linear-gradient(to bottom,  #7a7a7a 0%,#555555 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7a7a7a', endColorstr='#555555',GradientType=0 );
+
+}
+a.send{
+	background: #126ae3;background: -moz-linear-gradient(top,  #126ae3 0%, #1899e1 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#126ae3), color-stop(100%,#1899e1)); background: -webkit-linear-gradient(top,  #126ae3 0%,#1899e1 100%);background: -o-linear-gradient(top,  #126ae3 0%,#1899e1 100%); background: -ms-linear-gradient(top,  #126ae3 0%,#1899e1 100%); background: linear-gradient(to bottom,  #126ae3 0%,#1899e1 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#126ae3', endColorstr='#1899e1',GradientType=0 ); /* IE6-9 */
+}
+a.send:hover{
+	background: #1899e1;background: -moz-linear-gradient(top,  #1899e1 0%, #126ae3 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1899e1), color-stop(100%,#126ae3));background: -webkit-linear-gradient(top,  #1899e1 0%,#126ae3 100%);background: -o-linear-gradient(top,  #1899e1 0%,#126ae3 100%);background: -ms-linear-gradient(top,  #1899e1 0%,#126ae3 100%);background: linear-gradient(to bottom,  #1899e1 0%,#126ae3 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1899e1', endColorstr='#126ae3',GradientType=0 );
+}
\ No newline at end of file
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/img/arrow-more.png
Binary file integ/img/arrow-more.png has changed
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/img/bg-renkan.png
Binary file integ/img/bg-renkan.png has changed
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/img/culte-scene-icon.png
Binary file integ/img/culte-scene-icon.png has changed
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/img/like-icon.png
Binary file integ/img/like-icon.png has changed
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/img/star-icon.png
Binary file integ/img/star-icon.png has changed
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/img/zoom.png
Binary file integ/img/zoom.png has changed
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/iri-creation-cinecard.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/integ/iri-creation-cinecard.html	Wed Apr 03 16:19:25 2013 +0200
@@ -0,0 +1,191 @@
+<!DOCTYPE html>
+<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"><![endif]-->
+<!--[if IE 7]>	<html class="no-js lt-ie9 lt-ie8" lang="en"><![endif]-->
+<!--[if IE 8]><html class="no-js lt-ie9" lang="en"><![endif]-->
+<!--[if IE 9]><html class="no-js ie9" lang="en"><![endif]-->
+<!--[if gt IE 9]><!--> <html class="no-js" lang="en"><!--<![endif]-->
+<head>
+<meta charset="utf-8" />
+<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+<title>Cinegift</title>
+<meta name="description" content="" />
+<meta name="viewport" content="width=980" />
+<link rel="stylesheet" href="css/default.css" />
+<link rel="stylesheet" href="css/reset.css" />
+<link rel="stylesheet" href="css/styles.css" />
+<link rel="stylesheet" href="css/iri.css" />
+<!-- Custom scrollbars CSS -->
+<link href="css/jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css" />
+<script src="js/libs/modernizr-2.5.3.min.js"></script>
+</head>
+
+<body class="profile">
+<!--[if lt IE 9]><p class=chromeframe>Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p><![endif]-->
+	<header>
+		<h1><img src="img/logo.png" alt="AlloCiné LAB" class="logo" /></h1>
+		<nav>
+			<ul>
+				<li><a href="social.html">Social</a></li>
+				<li><a href="index.html">Discover</a></li>
+				<li><a href="#">Profile</a></li>
+				<li class="current"><a href="#">Cadeaux</a></li>
+			</ul>
+		</nav>
+		
+		<section class="connect">
+
+		<div class="connected_profiles">
+			<span>Angelo Chiacchio</span> 
+			<img src="img/profil.jpg" alt="photo de profil" />
+		</div><!-- /connected_profiles -->
+		
+		<span class="logout">loggout</span>
+
+	</section>
+		<!-- /connect -->
+	</header>
+
+	<div role="main">
+		<section class="central">
+
+			<div class="sidebar">
+				<div class="content">
+					<div class="inner-content">
+					
+						<h2>Création CineCard</h2>
+						<h3>Destinataire</h3>
+						<div class="user clearfix">
+							<img src="img/profil.jpg" alt="">
+							<p>Jean-Louis Frechin</p>
+						</div>
+						<h3 class="instruction">Glisser un contenu dans la carte</h3>
+						<h3>Stickers</h3>
+						<ul class="stickers">
+							<li class="culte">
+								<span>SCENES CULTE</span>
+							</li>
+							<li class="star">
+								<span>MON<br />AVIS</span>
+							</li>
+							<li class="like">
+								<span>TU VAS<br />AIMER</span>
+							</li>
+							<span id="stickers-more" class="more-hide">
+								<li class="culte">
+									<span>SCENES CULTE</span>
+								</li>
+								<li class="star">
+									<span>MON<br />AVIS</span>
+								</li>
+								<li class="like">
+									<span>TU VAS<br />AIMER</span>
+								</li>
+							</span>
+						</ul>
+						<a class="more" href="#stickers-more"><span></span></a>
+
+						<h3>Stars</h3>
+						<ul class="stars clearfix">
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<span id="stars-more" class="more-hide">
+								<li><img src="img/angelo.jpg" alt=""></li>
+								<li><img src="img/angelo.jpg" alt=""></li>
+								<li><img src="img/angelo.jpg" alt=""></li>
+								<li><img src="img/angelo.jpg" alt=""></li>
+							</span>
+						</ul>
+						<a class="more" href="#stars-more"><span></span></a>
+
+						<h3>Stars</h3>
+						<ul class="images clearfix">
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<span id="images-more" class="more-hide">
+								<li><img src="img/angelo.jpg" alt=""></li>
+								<li><img src="img/angelo.jpg" alt=""></li>
+								<li><img src="img/angelo.jpg" alt=""></li>
+							</span>
+						</ul>
+						<a class="more" href="#images-more"><span></span></a>
+
+						<h3>Vidéos</h3>
+						<ul class="videos clearfix">
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<li><img src="img/angelo.jpg" alt=""></li>
+							<span id="videos-more" class="more-hide">
+								<li><img src="img/angelo.jpg" alt=""></li>
+								<li><img src="img/angelo.jpg" alt=""></li>
+								<li><img src="img/angelo.jpg" alt=""></li>
+							</span>
+						</ul>
+						<a class="more" href="#videos-more"><span></span></a>
+
+					</div>
+				</div><!-- /content -->
+				
+			</div><!-- /sidebar -->
+
+			<div class="renkan">
+				<div class="wrap-top">
+					<h2>Drive 2011</h2>
+					<ul class="actions">
+						<li><a class="cancel" href="#">ANNULER</a></li>
+						<li><a class="send" href="#">ENVOYER</a></li>
+					</ul>
+				</div>
+
+				<ul class="zoom">
+					<li><a class="in" href="#"></a></li>
+					<li><a class="out" href="#"></a></li>
+				</ul>
+			</div>
+
+
+
+
+
+
+
+
+
+
+
+
+		</section>
+		<!-- /central -->
+	</div>
+	<!-- /main -->
+
+	<footer>
+		<nav>
+			<ul>
+				<li><a href="#">Mes goûts</a></li>
+				<li class="current"><a href="#">Ma vitrine</a></li>
+				<li><a href="wishlist.html">Mes envies</a></li>
+				<li><a href="ratings.html">Mes notes</a></li>
+				<li><a href="not_interested.html">Pas intéressé</a></li>
+			</ul>
+		</nav>
+		<a href="#" class="logofoot" ><img src="img/logo-footer.png" alt="Cinégift" /></a>
+	</footer>
+
+<script src="js/libs/jquery-1.7.1.min.js"></script>
+<script src="js/libs/jquery-ui-1.8.21.custom.min.js"></script>
+
+<script type='text/javascript' src='js/jquery.simplemodal.js'></script>
+<script type="text/javascript" src="js/jquery.jcarousel.min.js"></script>
+<!-- mousewheel plugin -->
+<script src="js/jquery.mousewheel.min.js"></script>
+<!-- custom scrollbars plugin -->
+<script src="js/jquery.mCustomScrollbar.js"></script>
+
+<script src="js/script.js"></script>
+<script src="js/iri.js"></script>	
+
+</body>
+</html>
\ No newline at end of file
diff -r ca1b8c0fbe35 -r 4aec3f00ea87 integ/js/iri.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/integ/js/iri.js	Wed Apr 03 16:19:25 2013 +0200
@@ -0,0 +1,32 @@
+$(function(){
+
+
+
+$(window).bind('resize', function(){
+	setSidebarContentHeight();
+});
+setSidebarContentHeight();
+function setSidebarContentHeight(){
+	var newHeight = $(window).height() - $('header').height() - $('footer').height();
+	$(".sidebar .content").css('height', newHeight);
+}
+
+$(".sidebar .content").mCustomScrollbar({
+	advanced:{
+	    updateOnContentResize: true
+	}
+});
+
+$('a.more').bind('click', function(e){
+	e.preventDefault();
+	var target = $(this).attr('href');
+	if($(this).hasClass('less')){
+		$(target).hide();
+		$(this).removeClass('less')
+	}else{
+		$(target).show();
+		$(this).addClass('less')
+	}	
+});// a.more
+
+});
\ No newline at end of file