Subversion Repositories eFlore/Applications.eflore-consultation

Rev

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

Rev 1419 Rev 1420
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="https://raw.githubusercontent.com/sindresorhus/screenfull.js/gh-pages/dist/screenfull.js"></script>
 - 
 
36 
		<script src="modules/mobile/presentations/js/mobile.js"></script>
35 
		<script src="modules/mobile/presentations/js/mobile.js"></script>
37
36
38 
		<style>
37 
		<style>
39 
			.btn {border-radius:2em;}
 38 
			.btn {border-radius:2em;}
40 
			.container-fluid {padding: 0px;}
 39 
			.container-fluid {padding: 0px;}
41 
			[class*="span"] {margin-left: 0px;}
 40 
			[class*="span"] {margin-left: 0px;}
42 
			.accordion {margin-top: 1em;}
 41 
			.accordion {margin-top: 1em;}
43 
			.accordion-heading .accordion-toggle {padding: 0pt 10px;}
 42 
			.accordion-heading .accordion-toggle {padding: 0pt 10px;}
44 
		</style>
 43 
		</style>
45 
	</head>
44 
	</head>
46 
 
 45 
 
47 
	<body>
46 
	<body>
48 
		<div id="smartflore-fiche">
 47 
		<div id="smartflore-fiche">
49 
			<div id="smartflore-entete">
 48 
			<div id="smartflore-entete">
50 
				<h1>
 49 
				<h1>
51 
					<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
52 
				</h1>
 51 
				</h1>
53 
			</div>
 52 
			</div>
54
53
55 
			<div id="smartflore-illustrations">
 54 
			<div id="smartflore-illustrations">
56 
				<div id="smartflore-noms">
 55 
				<div id="smartflore-noms">
57 
					<h2 class="smartflore-nom-verna">
 56 
					<h2 class="smartflore-nom-verna">
58 
						<?= $texte['titre'][0]; ?>
 57 
						<?= $texte['titre'][0]; ?>
59 
					</h2>
 58 
					</h2>
60 
					<h3 class="smartflore-nom-sci">
 59 
					<h3 class="smartflore-nom-sci">
61 
						<?= $texte['titre'][1]; ?>
 60 
						<?= $texte['titre'][1]; ?>
62 
					</h3>
 61 
					</h3>
63 
					<h4 class="smartflore-famille">
 62 
					<h4 class="smartflore-famille">
64 
						Famille des <?= $texte['titre'][2]; ?>
 63 
						Famille des <?= $texte['titre'][2]; ?>
65 
					</h4>
 64 
					</h4>
66 
				</div>
 65 
				</div>
67
66
68 
				<div id="smartflore-illustrations-galerie">
 67 
				<div id="smartflore-illustrations-galerie">
69 
					<? if (count($illustrations) != 0) : ?>
 68 
					<? if (count($illustrations) != 0) : ?>
70 
						<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">
71 
							<!-- Indicators -->
 70 
							<!-- Indicators -->
72 
							<ol class="carousel-indicators">
 71 
							<ol class="carousel-indicators">
73 
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
 72 
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
74 
								    <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>
75 
								<?php } ?>
 74 
								<?php } ?>
76 
							</ol>
 75 
							</ol>
77
76
78 
							<!-- Wrapper for slides -->
 77 
							<!-- Wrapper for slides -->
79 
							<div class="carousel-inner" role="listbox">
 78 
							<div class="carousel-inner" role="listbox">
80 
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
 79 
								<? for($ill = 0; $ill < count($illustrations); $ill++) { ?>
81 
								    <div class="item <?= ($ill == 0) ? 'active' : ''; ?>">
 80 
								    <div class="item <?= ($ill == 0) ? 'active' : ''; ?>">
82 
								    	<? if (trim($illustrations[$ill]['legende']['texte']) != '&nbsp;') : ?>
 81 
								    	<? if (trim($illustrations[$ill]['legende']['texte']) != '&nbsp;') : ?>
83 
											<? $alt = $illustrations[$ill]['legende']['titre'].' ('.$illustrations[$ill]['legende']['texte'].')'; ?>
 82 
											<? $alt = $illustrations[$ill]['legende']['titre'].' ('.$illustrations[$ill]['legende']['texte'].')'; ?>
84 
										<? else : ?>
 83 
										<? else : ?>
85 
											<? $alt = $illustrations[$ill]['legende']['titre']; ?>
 84 
											<? $alt = $illustrations[$ill]['legende']['titre']; ?>
86 
										<? endif; ?>
 85 
										<? endif; ?>
87 
								      	<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; ?>">
88 
								      	<div class="carousel-caption">
 87 
								      	<div class="carousel-caption">
89 
								      		<?= $alt; ?>
 88 
								      		<?= $alt; ?>
90 
								      	</div>
 89 
								      	</div>
91 
								    </div>
 90 
								    </div>
92 
							    <?php } ?>
 91 
							    <?php } ?>
93 
							</div>
 92 
							</div>
94
93
95 
							<!-- Controls -->
 94 
							<!-- Controls -->
96 
							<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">
97 
								<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
 96 
								<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
98 
							    <span class="sr-only">Previous</span>
 97 
							    <span class="sr-only">Previous</span>
99 
							</a>
 98 
							</a>
100 
							<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">
101 
							    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
 100 
							    <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
102 
							    <span class="sr-only">Next</span>
 101 
							    <span class="sr-only">Next</span>
103 
							</a>
 102 
							</a>
104 
						</div>
 103 
						</div>
105 
					<? endif; ?>
104 
					<? endif; ?>
106 
				</div>
 105 
				</div>
107 
			</div>
 106 
			</div>
108
107
109 
			<div id="smartflore-sections">
 108 
			<div id="smartflore-sections">
110 
				<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">
111 
					<div class="panel panel-default">
 110 
					<div class="panel panel-default">
112 
					<? foreach($texte['corps'] as $titre_section => $texte_section) : ?>
 111 
					<? foreach($texte['corps'] as $titre_section => $texte_section) : ?>
113 
						<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); ?>">
114 
					      <h4 class="panel-title">
 113 
					      <h4 class="panel-title">
115 
					        <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); ?>">
116 
					          	<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>
117 
								<?= $titre_section; ?>
 116 
								<?= $titre_section; ?>
118 
					        </a>
 117 
					        </a>
119 
					      </h4>
 118 
					      </h4>
120 
					    </div>
 119 
					    </div>
121 
					    <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); ?>">
122 
					      <div class="panel-body">
 121 
					      <div class="panel-body">
123 
					      	<?= $texte_section; ?>
 122 
					      	<?= $texte_section; ?>
124 
					      </div>
 123 
					      </div>
125 
					    </div>
 124 
					    </div>
126 
					<? endforeach; ?>
 125 
					<? endforeach; ?>
127 
					</div>
 126 
					</div>
128 
				</div>
 127 
				</div>
129 
			</div>
 128 
			</div>
130
129
131 
			<div id="smartflore-footer">
 130 
			<div id="smartflore-footer">
132 
				<div class="col-md-12">
 131 
				<div class="col-md-12">
133 
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
 132 
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
134 
						<a href="<?= $lien_fiche; ?>" target="_blank">
 133 
						<a href="<?= $lien_fiche; ?>" target="_blank">
135 
							<button type="button" class="btn btn-default" aria-label="Left Align">
 134 
							<button type="button" class="btn btn-default" aria-label="Left Align">
136 
								En savoir plus
 135 
								En savoir plus
137 
							</button>
 136 
							</button>
138 
						</a>
 137 
						</a>
139 
					</div>
 138 
					</div>
140
139
141 
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
 140 
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
142 
						<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">
143 
						  	Sources
 142 
						  	Sources
144 
						</button>
 143 
						</button>
145
144
146 
						<div id="smartflore-sources">
 145 
						<div id="smartflore-sources">
147 
							<?= $texte['sources']; ?>
 146 
							<?= $texte['sources']; ?>
148 
						</div>
 147 
						</div>
149 
					</div>
 148 
					</div>
150
149
151 
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
 150 
					<div class="col-md-4 col-xs-4 smartflore-footer-bouton">
152 
						<button type="button" class="btn btn-default" aria-label="Left Align">
 151 
						<button type="button" class="btn btn-default" aria-label="Left Align">
153 
							Modifier
 152 
							Modifier
154 
						</button>
 153 
						</button>
155 
					</div>
 154 
					</div>
156 
				</div>
 155 
				</div>
157 
			</div>
 156 
			</div>
158 
		</div>
 157 
		</div>
159 
	</body>
 158 
	</body>
160 
</html>
 159 
</html>