-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
executable file
·191 lines (164 loc) · 9.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Cartopolis</title>
<meta name="description" content="Cartopolis : l'Infrastructure de Données Spatiales de l'IRSTV">
<meta name="author" content="Erwan Bocher">
<meta name="viewport" content="width=device-width,initial-scale=1">
<!-- CSS Reset -->
<link rel="stylesheet" href="css/reset.css">
<!-- Global CSS for the page and tiles -->
<link rel="stylesheet" href="css/main.css">
<!-- Specific CSS for the tiles -->
<link rel="stylesheet" href="css/style.css">
<!-- Attach the Reveal CSS -->
<link rel="stylesheet" href="css/reveal.css">
</head>
<body>
<div id="container">
<div class="logo">
<img src="images/cartopolis_4.png" width="200" />
<h1>L'Infrastructure de Données Spatiales sur la ville</h1>
</div>
<!--
Ces tags sont utilisés pour filtrer les cadres dynamiquement
-->
<br/>
<ul id="filters">
<li data-filter="all" class ="active">Tous</li>
<li data-filter="carte">Cartes</li>
<li data-filter="catalogue">Catalogues</li>
<li data-filter="outil">Outils</li>
<li data-filter="autres">Autres</li>
</ul>
<ul id="about">
<li>
<a href="#" data-reveal-id="myModal">A propos</a>
</li>
</ul>
<br/>
<div id="main" role="main">
<ul id="tiles">
<!--
These are our grid items. Notice how each one has classes assigned that
are used for filtering. The classes match the "data-filter" properties above.
-->
<li data-filter-class='["all", "carte"]'>
<a href="http://webcarto.orbisgis.org/communes.html" target="blank">
<img src="images/communes.png" width="200">
</a>
<p>Evolution des communes en Loire Atlantique depuis 1789.</p>
</li>
<li data-filter-class='["all", "carte"]'>
<a href="http://webcarto.orbisgis.org/noisemap.html" target="blank">
<img src="images/noise_map.png" width="200">
</a>
<p>Cartographie du bruit à Nantes.</p>
</li>
<li data-filter-class='["all", "catalogue"]'>
<a href="http://www.cartopolis.org/geonetwork/apps/search/?hl=fre" target="blank">
<img src="images/geocatalog.png" width="200">
</a>
<p>Catalogue de métadonnées géographiques.</p>
</li>
<li data-filter-class='["all", "catalogue"]'>
<a href="http://services.orbisgis.org" target="blank">
<img src="images/orbismapcatalog.png" width="200">
</a>
<p>OrbisMapCatalog: plate-forme de partage de cartes.</p>
</li>
<li data-filter-class='["all", "outil"]'>
<a href="http://www.orbisgis.org" target="blank">
<img src="images/orbisgis.png" width="200">
</a>
<p>OrbisGIS: un SIG open source pour et par la recherche.</p>
</li>
<li data-filter-class='["all", "outil"]'>
<a href="http://www.orbisgis.org/projects/cts/" target="blank">
<img src="images/cts.png" width="200">
</a>
<p>CTS : une bibliothèque pour la gestion des projections géographiques.</p>
</li>
<li data-filter-class='["all", "outil"]'>
<a href="http://www.orbisgis.org" target="blank">
<img src="images/jna.png" width="200">
</a>
<p>Java Network Analyzer : analyser les graphes routiers avec le SIG OrbisGIS.</p>
</li>
<li data-filter-class='["all", "autres"]'>
<a href="http://www.cartopolis.org/wiki" target="blank" title="Wiki de CartoPOLIS">
<img src="images/wiki.png" width="200">
</a>
<p>Wiki de Cartopolis pour de plus amples informations sur le projet.</p>
</li>
<!-- End of grid blocks -->
</ul>
</div>
</div>
<!-- include jQuery -->
<script src="js/jquery.min.js"></script>
<!-- Include the imagesLoaded plug-in -->
<script src="js/jquery.imagesloaded.js"></script>
<!-- Include the plug-in -->
<script src="js/jquery.wookmark.js"></script>
<!-- Then just attach the Reveal plugin -->
<script src="js/jquery.reveal.js" type="text/javascript"></script>
<!-- Once the page is loaded, initalize the plug-in. -->
<script type="text/javascript">
(function($) {
$('#tiles').imagesLoaded(function() {
// Prepare layout options.
var options = {
autoResize: true, // This will auto-update the layout when the browser window is resized.
container: $('#main'), // Optional, used for some extra CSS styling
offset: 2, // Optional, the distance between grid items
itemWidth: 210, // Optional, the width of a grid item
fillEmptySpace: true // Optional, fill the bottom of each column with widths of flexible height
};
// Get a reference to your grid items.
var handler = $('#tiles li'),
filters = $('#filters li');
// Call the layout function.
handler.wookmark(options);
/**
* When a filter is clicked, toggle it's active state and refresh.
*/
var onClickFilter = function(event) {
var item = $(event.currentTarget),
activeFilters = [];
if (!item.hasClass('active')) {
filters.removeClass('active');
}
item.toggleClass('active');
// Filter by the currently selected filter
if (item.hasClass('active')) {
activeFilters.push(item.data('filter'));
}
handler.wookmarkInstance.filter(activeFilters);
}
// Capture filter click events.
filters.click(onClickFilter);
});
})(jQuery);
</script>
<div id="myModal" class="reveal-modal">
<a href="http://www.cartopolis.org"><img src="images/cartopolis_logo.png" width="50" alt="CartoPOLIS" style="float: right; margin: 50px 0 0 20px;" /></a>
<h2>A propos de CartoPOLIS</h2>
<p>
Le projet CartoPOLIS est piloté par l'<a href="http://www.irstv.fr/index.php?option=com_content&view=category&layout=blog&id=15&Itemid=39&lang=fr" target="blank" title="Atelier SIG de l'IRSTV"><u>Atelier SIG</u></a> de l'IRSTV. Il vise à construire une plate-forme commune et interopérable pour stocker, collecter, traiter et diffuser les données sur la ville ayant une composante géospatiale.
</p>
<p>
Le projet s'inscrit à l'interface de 5 axes de recherche: l'observation, la simulation, les bases de données, la production de connaissances spatialisées et la diffusion - valorisation scientifique.
</p>
<p>
<strong>En savoir plus ?</strong> Visitez <a href="http://www.cartopolis.org/wiki" target="blank" title="Wiki de CartoPOLIS"><u>la page de présentation du projet</u>.</a></p>
<a class="close-reveal-modal">×</a>
</div>
<div class="reveal-modal-bg"></div>
</body>
</html>