Subversion Repositories eFlore/Applications.eflore-consultation

Rev

Rev 1420 | Rev 1424 | Go to most recent revision | Only display areas with differences | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 1420 Rev 1423
1
<?php 	
1
<?php 	
2
	$icones = array('glyphicon-eye-open', 'glyphicon-grain', 'glyphicon-home');
2
	$icones = array('glyphicon-eye-open', 'glyphicon-grain', 'glyphicon-home');
3
	$index_icones = 0;
3
	$index_icones = 0;
4
?>
4
?>
5
<!DOCTYPE html>
5
<!DOCTYPE html>
6
<html>
6
<html>
7
	<head> 
7
	<head> 
8
		<title>Smart'Flore</title> 
8
		<title>Smart'Flore</title> 
9
		
9
		
10
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
10
		<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
11
		<meta http-equiv="content-style-type" content="text/css" />
11
		<meta http-equiv="content-style-type" content="text/css" />
12
		<meta http-equiv="content-script-type" content="text/javascript" />
12
		<meta http-equiv="content-script-type" content="text/javascript" />
13
		<meta http-equiv="content-language" content="fr" />
13
		<meta http-equiv="content-language" content="fr" />
14
		<meta http-equiv="cache-control" content="no-cache">
14
		<meta http-equiv="cache-control" content="no-cache">
15
		
15
		
16
		<!-- Favicones -->
16
		<!-- Favicones -->
17
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
17
		<link rel="shortcut icon" type="image/x-icon" href="http://resources.tela-botanica.org/tb/img/16x16/favicon.ico" />
18
		
18
		
19
		<!-- Viewport -->
19
		<!-- Viewport -->
20
		<meta name="apple-mobile-web-app-capable" content="yes" />
20
		<meta name="apple-mobile-web-app-capable" content="yes" />
21
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
21
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
22
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
22
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">
23
		
23
		
24
		<!-- CSS -->
24
		<!-- CSS -->
25
		<link href="http://www.tela-botanica.org/commun/jquery/photoswipe/3.0.5/photoswipe.css" type="text/css" rel="stylesheet" />
25
		<link href="http://www.tela-botanica.org/commun/jquery/photoswipe/3.0.5/photoswipe.css" type="text/css" rel="stylesheet" />
26
		<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
26
		<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
27
		<link href="<?= $css ?>" rel="stylesheet" type="text/css" id="custom-css" />
27
		<link href="<?= $css ?>" rel="stylesheet" type="text/css" id="custom-css" />
28
		<link href="modules/mobile/presentations/css/smartflore.css" rel="stylesheet" type="text/css" id="smart-flore-css" />
28
		<link href="modules/mobile/presentations/css/smartflore.css" rel="stylesheet" type="text/css" id="smart-flore-css" />
29
 
29
 
30
		<!-- Javascript -->
30
		<!-- Javascript -->
31
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
31
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
32
		<script src="http://www.tela-botanica.org/commun/jquery/photoswipe/3.0.5/klass.min.js"></script>
32
		<script src="http://www.tela-botanica.org/commun/jquery/photoswipe/3.0.5/klass.min.js"></script>
33
		<script src="http://www.tela-botanica.org/commun/jquery/photoswipe/3.0.5/code.photoswipe.jquery-3.0.5.min.js"></script>
33
		<script src="http://www.tela-botanica.org/commun/jquery/photoswipe/3.0.5/code.photoswipe.jquery-3.0.5.min.js"></script>
34
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
34
		<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
35
		<script src="modules/mobile/presentations/js/mobile.js"></script>	
35
		<script src="modules/mobile/presentations/js/mobile.js"></script>	
36
		
36
		
37
		<style>	
37
		<style>	
38
			.btn {border-radius:2em;}
38
			.btn {border-radius:2em;}
39
			.container-fluid {padding: 0px;}
39
			.container-fluid {padding: 0px;}
40
			[class*="span"] {margin-left: 0px;}
40
			[class*="span"] {margin-left: 0px;}
41
			.accordion {margin-top: 1em;}
41
			.accordion {margin-top: 1em;}
42
			.accordion-heading .accordion-toggle {padding: 0pt 10px;}
42
			.accordion-heading .accordion-toggle {padding: 0pt 10px;}
43
		</style>
43
		</style>
44
	</head>	
44
	</head>	
45
 
45
 
46
	<body>	
46
	<body>	
47
		<div id="smartflore-fiche">
47
		<div id="smartflore-fiche">
48
			<div id="smartflore-entete">
48
			<div id="smartflore-entete">
49
				<h1>
49
				<h1>
50
					<img id="smart-flore-logo-tela" src="http://resources.tela-botanica.org/tb/img/128x128/logo_carre_officiel.png" /> <span class="smart-flore-sf">S</span>mart'<span class="smart-flore-sf">F</span>lore
50
					<img id="smart-flore-logo-tela" src="http://resources.tela-botanica.org/tb/img/128x128/logo_carre_officiel.png" /> <span class="smart-flore-sf">S</span>mart'<span class="smart-flore-sf">F</span>lore
51
				</h1>
51
				</h1>
52
			</div>
52
			</div>
53
			
53
			
54
			<div id="smartflore-illustrations">
54
			<div id="smartflore-illustrations">
55
				<div id="smartflore-noms">
55
				<div id="smartflore-noms">
56
					<h2 class="smartflore-nom-verna">
56
					<h2 class="smartflore-nom-verna">
57
						<?= $texte['titre'][0]; ?>
57
						<?= $texte['titre'][0]; ?>
58
					</h2>
58
					</h2>
59
					<h3 class="smartflore-nom-sci">
59
					<h3 class="smartflore-nom-sci">
60
						<?= $texte['titre'][1]; ?>
60
						<?= $texte['titre'][1]; ?>
61
					</h3>
61
					</h3>
62
					<h4 class="smartflore-famille">
62
					<h4 class="smartflore-famille">
63
						Famille des <?= $texte['titre'][2]; ?>
63
						Famille des <?= $texte['titre'][2]; ?>
64
					</h4>
64
					</h4>
65
				</div>
65
				</div>
66
				
66
				
67
				<div id="smartflore-illustrations-galerie">
67
				<div id="smartflore-illustrations-galerie">
68
					<? if (count($illustrations) != 0) : ?>
68
					<? if (count($illustrations) != 0) : ?>
69
						<div id="smartflore-illustrations-galerie-carousel" class="carousel slide" data-ride="carousel" data-interval="false">
69
						<div id="smartflore-illustrations-galerie-carousel" class="carousel slide" data-ride="carousel" data-interval="false">
70
							<!-- Indicators -->
70
							<!-- Indicators -->
71
							<ol class="carousel-indicators">
71
							<ol class="carousel-indicators">
72
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
72
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
73
								    <li data-target="#smartflore-illustrations-galerie-carousel" data-slide-to="<?= $ill; ?>" class="active"></li>
73
								    <li data-target="#smartflore-illustrations-galerie-carousel" data-slide-to="<?= $ill; ?>" class="active"></li>
74
								<?php } ?>
74
								<?php } ?>
75
							</ol>
75
							</ol>
76
							
76
							
77
							<!-- Wrapper for slides -->
77
							<!-- Wrapper for slides -->
78
							<div class="carousel-inner" role="listbox">
78
							<div class="carousel-inner" role="listbox">
79
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
79
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
80
								    <div class="item <?= ($ill == 0) ? 'active' : ''; ?>">
80
								    <div class="item <?= ($ill == 0) ? 'active' : ''; ?>">
81
								    	<? if (trim($illustrations[$ill]['legende']['texte']) != '&nbsp;') : ?>
81
								    	<? if (trim($illustrations[$ill]['legende']['texte']) != '&nbsp;') : ?>
82
											<? $alt = $illustrations[$ill]['legende']['titre'].' ('.$illustrations[$ill]['legende']['texte'].')'; ?>
82
											<? $alt = $illustrations[$ill]['legende']['titre'].' ('.$illustrations[$ill]['legende']['texte'].')'; ?>
83
										<? else : ?>
83
										<? else : ?>
84
											<? $alt = $illustrations[$ill]['legende']['titre']; ?>
84
											<? $alt = $illustrations[$ill]['legende']['titre']; ?>
85
										<? endif; ?>
85
										<? endif; ?>
86
								      	<img class="img-responsive center-block" src="<?= $illustrations[$ill]['src']; ?>" alt="<?= $alt; ?>">
86
								      	<img class="img-responsive center-block" src="<?= $illustrations[$ill]['src']; ?>" alt="<?= $alt; ?>">
87
								      	<div class="carousel-caption">
87
								      	<div class="carousel-caption">
88
								      		<?= $alt; ?>
88
								      		<?= $alt; ?>
89
								      	</div>
89
								      	</div>
90
								    </div>
90
								    </div>
91
							    <?php } ?>
91
							    <?php } ?>
92
							</div>
92
							</div>
93
							
93
							
94
							<!-- Controls -->
94
							<!-- Controls -->
95
							<a class="left carousel-control" href="#smartflore-illustrations-galerie-carousel" role="button" data-slide="prev">
95
							<a class="left carousel-control" href="#smartflore-illustrations-galerie-carousel" role="button" data-slide="prev">
96
								<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
96
								<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
97
							    <span class="sr-only">Previous</span>
97
							    <span class="sr-only">Previous</span>
98
							</a>
98
							</a>
99
							<a class="right carousel-control" href="#smartflore-illustrations-galerie-carousel" role="button" data-slide="next">
99
							<a class="right carousel-control" href="#smartflore-illustrations-galerie-carousel" role="button" data-slide="next">
100
							    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
100
							    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
101
							    <span class="sr-only">Next</span>
101
							    <span class="sr-only">Next</span>
102
							</a>
102
							</a>
103
						</div>
103
						</div>
104
					<? endif; ?>		
104
					<? endif; ?>		
105
				</div>
105
				</div>
106
			</div>
106
			</div>
107
			
107
			
108
			<div id="smartflore-sections">
108
			<div id="smartflore-sections">
109
				<div class="panel-group" id="smartflore-accordeon-sections" role="tablist" aria-multiselectable="true">
109
				<div class="panel-group" id="smartflore-accordeon-sections" role="tablist" aria-multiselectable="true">
110
					<div class="panel panel-default">
110
					<div>
111
					<? foreach($texte['corps'] as $titre_section => $texte_section) : ?>
111
					<? foreach($texte['corps'] as $titre_section => $texte_section) : ?>
112
						<div class="panel-heading smartflore-titre-section" role="tab" id="heading<?= md5($titre_section); ?>">
112
						<div class="panel-heading smartflore-titre-section" role="tab" id="heading<?= md5($titre_section); ?>">
113
					      <h4 class="panel-title">
113
					      <h4 class="panel-title">
114
					        <a data-toggle="collapse" data-parent="#smartflore-accordeon-sections" href="#collapse<?= md5($titre_section); ?>" aria-expanded="true" aria-controls="collapse<?= md5($titre_section); ?>">
114
					        <a data-toggle="collapse" data-parent="#smartflore-accordeon-sections" href="#collapse<?= md5($titre_section); ?>" aria-expanded="true" aria-controls="collapse<?= md5($titre_section); ?>">
115
					          	<span class="glyphicon <?= $icones[$index_icones++]; ?> smartflore-titre-section-icone margin-left-1em margin-top-03em"></span>
115
					          	<span class="glyphicon <?= $icones[$index_icones++]; ?> smartflore-titre-section-icone margin-left-1em margin-top-03em"></span>
116
								<?= $titre_section; ?>
116
								<?= $titre_section; ?>
117
					        </a>
117
					        </a>
118
					      </h4>
118
					      </h4>
119
					    </div>
119
					    </div>
120
					    <div id="collapse<?= md5($titre_section); ?>" class="panel-collapse collapse smartflore-contenu-section" role="tabpanel" aria-labelledby="heading<?= md5($titre_section); ?>">
120
					    <div id="collapse<?= md5($titre_section); ?>" class="panel-collapse collapse smartflore-contenu-section" role="tabpanel" aria-labelledby="heading<?= md5($titre_section); ?>">
121
					      <div class="panel-body">
121
					      <div class="panel-body">
122
					      	<?= $texte_section; ?>
122
					      	<?= $texte_section; ?>
123
					      </div>
123
					      </div>
124
					    </div>
124
					    </div>
125
					<? endforeach; ?>
125
					<? endforeach; ?>
126
					</div>
126
					</div>
127
				</div>
127
				</div>
128
			</div>
128
			</div>
129
			
129
			
130
			<div id="smartflore-footer">
130
			<div id="smartflore-footer">
131
				<div class="col-md-12">
131
				<div class="col-md-12">
132
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
132
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
133
						<a href="<?= $lien_fiche; ?>" target="_blank">
133
						<a href="<?= $lien_fiche; ?>" target="_blank">
134
							<button type="button" class="btn btn-default" aria-label="Left Align">
134
							<button type="button" class="btn btn-default" aria-label="Left Align">
135
								En savoir plus
135
								En savoir plus
136
							</button>
136
							</button>
137
						</a>
137
						</a>
138
					</div>
138
					</div>
139
					
139
					
140
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
140
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
141
						<button id="smartflore-footer-button-sources" type="button" class="btn btn-default" aria-label="Left Align">
141
						<button id="smartflore-footer-button-sources" type="button" class="btn btn-default" aria-label="Left Align">
142
						  	Sources
142
						  	Sources
143
						</button>
143
						</button>
144
						
144
						
145
						<div id="smartflore-sources">
145
						<div id="smartflore-sources">
146
							<?= $texte['sources']; ?>
146
							<?= $texte['sources']; ?>
147
						</div>
147
						</div>
148
					</div>
148
					</div>
149
					
149
					
150
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
150
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
151
						<button type="button" class="btn btn-default" aria-label="Left Align">
151
						<button type="button" class="btn btn-default" aria-label="Left Align">
152
							Modifier
152
							Modifier
153
						</button>
153
						</button>
154
					</div>
154
					</div>
-
 
155
				</div>
-
 
156
				
-
 
157
				<div class="col-md-12" id="smartflore-partenaires">
-
 
158
					<div class="panel-group" id="smartflore-accordeon-partenaires" role="tablist" aria-multiselectable="true">
-
 
159
						<div class="panel-heading smartflore-titre-partenaires" role="tab" id="heading-partenaires">
-
 
160
					      <h4 class="panel-title">
-
 
161
					        <a data-toggle="collapse" data-parent="#smartflore-accordeon-partenaires" href="#collapse-partenaires" aria-expanded="true" aria-controls="collapse-partenaires">
-
 
162
					          	<span class="glyphicon glyphicon-linkglyphicon glyphicon-link smartflore-titre-partenaires-icone margin-left-1em margin-top-03em"></span>
-
 
163
								Partenaires
-
 
164
					        </a>
-
 
165
					      </h4>
-
 
166
					    </div>
-
 
167
					    <div id="collapse-partenaires" class="panel-collapse collapse smartflore-contenu-partenaires" role="tabpanel" aria-labelledby="heading-partenaires">
-
 
168
					      <div class="panel-body">
-
 
169
					      		<div class="col-md-6 col-xs-6">
-
 
170
					      			<img class="smartflore-footer-partenaires-logo" src="<?= $url_logos; ?>logo-msjs.jpg" />
-
 
171
					      		</div>
-
 
172
					      		<div class="col-md-6 col-xs-6">
-
 
173
					      			<img class="smartflore-footer-partenaires-logo" src="<?= $url_logos; ?>logo-fondation-nd.jpg" />
-
 
174
					      		</div>
-
 
175
					      </div>
-
 
176
					    </div>
-
 
177
					</div>
155
				</div>
178
				</div>
156
			</div>
179
			</div>
157
		</div>
180
		</div>
158
	</body>
181
	</body>
159
</html>
182
</html>