-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
276 lines (248 loc) · 18.8 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
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>Citadel on the Move</title>
<link rel="stylesheet" href="stylesheets/styles.css">
<link rel="stylesheet" href="stylesheets/pygment_trac.css">
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-2.1.1.min.js" type="text/javascript"></script>
<script src="javascripts/scale.fix.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript">
$(document).ready(function() {
$("#toc").prepend("<strong>SUMMARY</strong>");
$("h2, h3, h4").each(function(i) {
var current = $(this);
current.attr("id", "title" + i);
$("#toc .body").append("<li title=\"" + this.nodeName.toLowerCase() + "\"><a id=\"link" + i + "\" href=\"#title" + i + "\">" + current.text() + "</a></li>");
});
});
</script>
</head>
<body>
<nav>
<ul>
<li><a href="#quickstart">Get started</a></li>
<li><a href="#examples">Examples</a></li>
<li><a href="#ressources">Ressources</a></li>
<li><a href="#tutorials">Tutorials</a></li>
<li><a href="#community">Community</a></li>
<li><a href="#roadmap">Roadmap</a></li>
<li><a href="#credits">Credits</a></li>
<li class="lang"><a href="index_fr.html">FR</a></li>
</ul>
</nav>
<div class="wrapper">
<header>
<h1 class="header"><img src="images/Citadel-logo.png" alt= "Citadel on the Move" /></h1>
<p class="header">helps using <strong>Open Data</strong> to create <strong>Mobile Apps</strong> that make your city a smarter place to live</p>
<ul>
<li><a class="buttons" href="http://www.citadelonthemove.eu/"><i class="fa fa-link"></i> Website</a></li>
<li><a class="buttons" href="https://github.com/CitadelOnTheMove"><i class="fa fa-github"></i> GitHub Profile</a></li>
<li><a class="buttons" href="https://github.com/CitadelOnTheMove/CitadelOnTheMove.github.io/issues"><i class="fa fa-github"></i> Give Feedback!</a></li>
</ul>
</header>
<section>
<div id="toc"><ul class="body"></ul></div>
<a name="top" class="anchor" href="#top"></a>
<p><blockquote>Citadel aims to provide tools for anyone to publish and use open data to easily create mobile apps</blockquote></p>
<p>
<i class="fa fa-check"></i> No technical skills required<br />
<i class="fa fa-check"></i> Ready-to-use HTML5 mobile applications<br />
<i class="fa fa-check"></i> Easily publish spreadsheet data (CSV, Excel, data tables)<br />
<i class="fa fa-check"></i> Interoperable and open data format : develop once, reuse everywhere<br />
</p>
<h2 id="quickstart"><a name="quickstart" class="anchor" href="#quickstart"><span class="octicon octicon-link"></span></a><i class="fa fa-rocket"></i> Quickstart</h2>
<p>There are 2 main ways to use the Citadel tools. We recommend to start by using the tools on the Citadel plateform, which doesn't require any technical skill, and then switch to the Github tools if you want more control on the resulting apps, or want to host your own platform.</p>
<h3>Step 1 : Get and prepare your data</h3>
<p>Prepare a spreadsheet data file for the converter. Check out our <a href="#samples">sample files</a>, or <a href="#tutorials">follow the tutorial to prepare a file</a>.</p>
<h3>Step 2 : Convert your data to Citadel JSON</h3>
<p>Use the <a href="http://www.citadelonthemove.eu/en-us/opendata/convertmydataset.aspx" target="_blank"><i class="fa fa-icon-external-link"></i> Citadel table to JSON Converter tool</a> to convert your CSV or XLS files into Citadel JSON that will be directly usable into your apps. Please check out the <a href="#tutorials">Converter tutorials</a>, and FAQ and How-tos if you encounter any difficulty.</p>
</ol>
<h3>Step 3 : Make your app !</h3>
<h4>EASIEST : Use the <a href="http://www.citadelonthemove.eu/" target="_blank"><i class="fa fa-icon-external-link"></i> Citadel platform</a></h4>
<ol>
<li><a href="http://www.citadelonthemove.eu/Login">Log in to the plateform</a> (you will need to Register first if you don't have an account yet)</li>
<li><a href="http://www.citadelonthemove.eu/opendata/UploadMyDataset/tabid/243/category/EditProperty/language/en-US/Default.aspx" target="_blank"><i class="fa fa-icon-external-link"></i> Publish your converted JSON files</a> to the Citadel datastore</a></li>
<li>Use the <a href="http://www.citadelonthemove.eu/en-us/createanapp/applicationgenerationtool.aspx" target="_blank"><i class="fa fa-icon-external-link"></i> Application Generator</a> to make it an app ! (see AGT tutorial below for more details)</li>
</ol>
<h4>EASY : Use the Citadel mobile applications templates on Github</h4>
<p> (see detailed Templates tutorials)</p>
<ol>
<li>Choose and fork a template - or download it to your computer (see Templates differences and uses below)</li>
<li>Add your converted data into the template</li>
<li>Play with the settings and tweak the template to fit your needs !</li>
</ol>
<h2 id="examples"><a name="examples" class="anchor" href="#examples"><span class="octicon octicon-link"></span></a><i class="fa fa-check-square-o"></i> Examples, use cases and stories</h2>
<h3>Examples : live applications</h3>
<ul>
<li><a href="http://www.items.fr/apps/citadel/treefinder-issy/" target="_blank"><i class="fa fa-icon-external-link"></i> Treefinder app for Issy-les-Moulineaux</a></li>
<li><a href="http://citadel.binarysunset.net/treefinder/gent/" target="_blank"><i class="fa fa-icon-external-link"></i> Treefinder app for Ghent</a></li>
<li><a href="http://www.toegent.be/matinee/" target="_blank"><i class="fa fa-icon-external-link"></i> Art Galleries in Ghent</a></li>
<li><a href="http://www.toegent.be/gentmobiliteit/" target="_blank"><i class="fa fa-icon-external-link"></i> Realtime parking availability in Ghent</a></li>
<li><a href="http://www.toegent.be/gentverwent/" target="_blank"><i class="fa fa-icon-external-link"></i> "Gent Verwent" businesses in Ghent</a></li>
<li>...</li>
</ul>
<p>If you have created an app yourself and want to share it on this page, please <a href="mailto:info@citadelonthemove.eu">let us know</a>!</p>
<h3>Use cases</h3>
<ul>
<li>...</li>
</ul>
<h3>Stories</h3>
<ul>
<li>How mobile apps where build in Athens, Ghent, Issy, Manchester,...</li>
<li>...</li>
</ul>
<h3>Samples files and models</h3>
<p>These sample files are used in various cases: some can be used to structure your data, while other require different levels of processing, or can be used directly in the templates. The templates sample files indicates the mandatory and optionnal fields that you need to put into a CSV or XLS file so it can produce a valid and usable JSON file through the Converter.</p>
<p>Note : if you're experiencing troubles with accents, please check your file is encoded in UTF8.</p>
<p><a href="https://github.com/CitadelOnTheMove/CitadelOnTheMove.github.io/tree/master/examples" target="_blank"><i class="fa fa-icon-external-link"></i> Open samples folder on Github</a></p>
<ul>
<li>Sample templates files: use as models to structure your data</li>
<ul>
<li>POIs template : CSV, XLS</li>
<li>Remarkable trees template : CSV, XLS</li>
<li>Parking template : CSV, XLS</li>
<li>Events template : CSV, XLS</li>
</ul>
<li>Training input files: demonstrate various uses of the converter. See tutorials for a more detailed description</li>
<ul>
<li>1. <a href="examples/Training/1_Sortir_le_soir_a_Issy_v1.0.xlsx" target="_blank">Sortir le soir à Issy</a></li>
<li>2. <a href="examples/Training/2_Galleries_in_Athens_v1.0.xlsx" target="_blank">Galleries in Athens</a></li>
<li>3. <a href="examples/Training/3_Manchester_libraries_v1.0.csv" target="_blank">Manchester libraries</a></li>
<li>4. <a href="examples/Training/4_Sportcentres_in_Ghent_v1.0.csv" target="_blank">Sportcentres in Ghent</a></li>
</ul>
<li>Citadel-Json files: ready-to-use files</li>
<ul>
<li>Working Citadel-JSON files are provided with every application template. Check for ".json" files in the "data/" folder in their respective Github repository.</li>
</ul>
</ul>
<br />
<br />
<h2 id="ressources"><a name="ressources" class="anchor" href="#ressources"><span class="octicon octicon-link"></span></a><i class="fa fa-book"></i> Ressources, templates and documentation</h2>
<h3>Project history and details</h3>
<ul>
<li>Check out the <a href="http://www.citadelonthemove.eu/">Citadel on the Move website</a> for a complete and detailed presentation of the project</li>
</ul>
<h3>Github ressources</h3>
<h4>The mobile application templates</h4>
<p>These templates are meant to be forked and used to quickly deploy mobile applications. They are build on HTML5 and use the Citadel JSON file format. Most templates will work "out-ofthe-box" with none or very few changes. You are encouraged to build application upon them, and of course contribute back your improvements so they can benefit other people. The various templates demonstrate various uses of the mobile applications, and implement several functionnalities. Most templates use static JSON files, but can be set to use live data and/or a database</p>
<ul>
<li><a href="https://github.com/CitadelOnTheMove/Citadel-Pois-Template" target=_new><i class="fa fa-icon-external-link"></i> POIs template</a> : use this template to display POI (Points Of Interest = places) on a map. Different categories can be used so the user can switch between the different categories that are displayed on the map.</li>
<li><a href="https://github.com/CitadelOnTheMove/Citadel-Parkings-Template" target=_new><i class="fa fa-icon-external-link"></i> Parkings template</a> : use this template to display live parking data, including their location, and the number of parkings left.</li>
<li><a href="https://github.com/CitadelOnTheMove/Citadel-Events-Template" target=_new><i class="fa fa-icon-external-link"></i> Events template</a> : use this template to display events. This template provides a calendar filter so events can be filtered by proximity and by date and time.</li>
<li><a href="https://github.com/CitadelOnTheMove/Citadel-Environmental-Template" target=_new><i class="fa fa-icon-external-link"></i> Environnemental template</a> : use this template if you wish to display live sensor data such as temperature, live air analysis, etc. [currently uses Xively for the sensor interface]</li>
<li><a href="https://github.com/CitadelOnTheMove/Citadel-Crowd-sourcing-Template" target=_new><i class="fa fa-icon-external-link"></i> Crowd-sourcing template</a> : use this template if you want thet app users to add new data to your dataset. [requires a database]</li>
</ul>
<h4>The Application Generator Tool (AGT)</a></h4>
<p>This tool makes it easy to build an app without any technical skill. It is the source code of the tool that is available on Citadel platform.</p>
<ul>
<li><a href="https://github.com/CitadelOnTheMove/agt" target=_new><i class="fa fa-icon-external-link"></i> AGT source code</a></li>
<li><a href="http://www.citadelonthemove.eu/en-us/createanapp/applicationgenerationtool.aspx" target=_new><i class="fa fa-icon-external-link"></i> Application Generation Tool on Citadel website</a></li>
</ul>
<h4>The Data converter : converts CSV or Excel datasets to Citadel JSON files that are ready to be used into application templates</h4>
<ul>
<li>Converter GUI (java) : this standalone application can be downloaded and used directly on your computer to convert files to Citadel-JSON
<ul>
<li><a href="https://github.com/CitadelOnTheMove/converter-gui/wiki" target="_blank">Read the wiki documentation</a></li>
<li><a href="http://rbox.tv/citadel/converter/java/" target="_blank">Download the binaries</a> (get latest converter-X.X.jar version)</li>
</ul>
</li>
<li>Converter library (java) : this library is designed to be used within an application
<ul>
<li><a href="https://github.com/CitadelOnTheMove/converter-lib/wiki" target="_blank">Read the wiki documentation</a></li>
<li><a href="http://rbox.tv/citadel/converter/java/lib/" target="_blank">Download the binaries</a></li>
</ul>
</li>
<li>Converter portlet (Liferay, java) : this version is designed to include the converter in a Liferay portal
<ul>
<li><a href="https://github.com/CitadelOnTheMove/converter-portlet/wiki" target="_blank">Read the wiki documentation</a></li>
<li><a href="http://citadel.rbox.tv/" target="_blank">Use the Converter</a></li>
</ul>
</li>
<li>Converter PHP library (beta version) : this library can be used to convert dynamically convert files from CSV to Citadel-JSON through a basic API. Feedbacks and improvements welcomed !
<ul>
<li><a href="https://github.com/CitadelOnTheMove/converter-php-lib" target="_blank">Get to the repository and read the detailed documentation</a></li>
<li>This can basically be used to provide live data to your applicaitons, that are converted on the fly from CSV files</li>
</ul>
</li>
</ul>
<br />
<br />
<h2 id="tutorials"><a name="tutorials" class="anchor" href="#tutorials"><span class="octicon octicon-link"></span></a><i class="fa fa-graduation-cap"></i> Tutorials and How-tos</h2>
<h3>Tutorials</h3>
<p><a href="tutorials.html" target="_blank"><i class="fa fa-icon-external-link"></i> Open the Tutorials page</a></p>
<ul class="nobullet">
<li><i class="fa fa-file-text-o"></i> Tutorial 1: <a href="tutorials.html#tutorial1">Prepare your data sheet</a></li>
<li><i class="fa fa-file-text-o"></i> Tutorial 2: Use the convertor
<ul>
<li><a href="http://rbox.tv/citadel/converter/java/bd_restaurants_bars.mpg" target="_blank"><i class="fa fa-eye"></i> Screencast (Quicktime required)</a></li>
<li><a href="tutorials.html#tutorial2"><i class="fa fa-file-text-o"></i> A few tips about the Convertor</a></li>
</ul>
</li>
<li><i class="fa fa-file-text-o"></i> Tutorial 3: <a href="tutorials.html#tutorial3">Use the Application Generation Tool</a></li>
<li><i class="fa fa-file-text-o"></i> Tutorial 4: <a href="tutorials.html#tutorial4">Fork and customize an application template</a></li>
<li>...</li>
</ul>
<h3>Manuals</h3>
<ul class="nobullet">
<li><i class="fa fa-book"></i> <a href="https://github.com/CitadelOnTheMove/agt/wiki/Brief-User-Guide">Application Generator User Guide</a></li>
<li><i class="fa fa-book"></i> <a href="https://github.com/CitadelOnTheMove/agt/wiki/Detailed-User-Guide">Application Generator Detailed User Guide</a></li>
<li><i class="fa fa-book"></i> <a href="https://github.com/CitadelOnTheMove/agt/wiki/Programming-Guide---AGT">Application Generator Programming Guide</a></li>
<li><i class="fa fa-book"></i> <a href="https://github.com/CitadelOnTheMove/converter-lib/wiki">Convertor Wiki</a></li>
</ul>
<br />
<br />
<h2 id="community"><a name="community" class="anchor" href="#community"><span class="octicon octicon-link"></span></a><i class="fa fa-users"></i> Contribute !</h2>
<p>Citadel is always looking for your feedbacks, use case, stories, and to hear about anything that you have made with our tools : please send us your links to your blog posts, mobile applications and other things you've made with Citadel.</p>
<p>Please use the following channels to get in touch with us:</p>
<ul>
<li>Share a link or get in touch with our <a href="https://twitter.com/citadel_eu">Twitter account <strong>@citadel_eu</strong></a></li>
<li>Show your interest and post your Citadel-related news on our <a href="https://www.facebook.com/citadelonthemove.eu">Facebook page</a></li>
<li>Try out the Citadel tools and discuss with the community on the <a href="http://www.citadelonthemove.eu/">main Citadel on the Move website</a></li>
<li>Send us technical issues such as bug report and feature request an enhancements in the appropriate repository on <a href="https://github.com/CitadelOnTheMove/">our Github account</a>. You can use the pre-defined labels to help us categorize your feedback.</li>
<li>Or send us your news and stories to <a href="https://github.com/CitadelOnTheMove/CitadelOnTheMove.github.io/issues/new">these pages issue tracker</a> so we can add your links into our Tutorials / Examples / Stories / Applications section</li>
</ul>
<h3>Discuss in the Citadel Community</h3>
<p>The Citadel Community is hosted on the <a href="http://www.citadelonthemove.eu/">Citadel on the Move website</a> as a public ressource and common good. You'll need to create a account to contribute.</p>
<ul>
<li><a href="http://www.citadelonthemove.eu/en-us/exploremycitadel/talktothecommunity.aspx">Use the forum to discuss</a> about the AGT, the application and data templates, or anything related to the Citadel project itself</li>
<li><a href="http://www.citadelonthemove.eu/en-us/exploremycitadel/askaquestion.aspx">Ask a question</a> and vote for relevant answers</li>
<li><a href="http://www.citadelonthemove.eu/en-us/exploremycitadel/talktothecommunity.aspx">Ask for help</a> and help us improve the FAQ</li>
</ul>
<h3>Are you a developper ?</h3>
<p>If you're a developper and have added useful stuff to the templates, AGT or other of our github repos, contributing back is highly appreciated by the team ! Please submit your changes by pushing a Pull Request to the relevant repo, and/or get in touch so we can check with you how your changes could be integratede and benefit the other developpers and Citadel users.</p>
<p>Also you'll definitely want to see what we have in mind by checking the website and the roadmap, and maybe become a member of one of our teams :)</p>
<br />
<br />
<h2 id="roadmap"><a name="roadmap" class="anchor" href="#roadmap"><span class="octicon octicon-link"></span></a><i class="fa fa-road"></i> Roadmap</h2>
<p>We have many ideas to improve the Citadel toolbox, here's our roadmap for the near future:</p>
<ul>
<li>Add tutorials, examples, comprehensive how-tos...</li>
<li>Replace GMaps by Leaflet in templates</li>
<li>Facilitate integration of OSM data</li>
<li>Develop a library that produces Citadel-JSON (to enable CMS to produce JSON backends)</li>
<li>Enable the on-the-fly use the converter</li>
<li>Enable the converter to use geoJSON files</li>
<li>...</li>
</ul>
<br />
<br />
<h2 id="credits"><a name="credits" class="anchor" href="#credits"><span class="octicon octicon-link"></span></a><i class="fa fa-thumbs-o-up"></i> Credits and thanks</h2>
<p>Citadel code was funded and opensourced by an european project : see <a href="http://www.citadelonthemove.eu/">Citadel on the Move website</a> for full details</p>
<p>Thanks to <a href="http://fortawesome.github.io/">Font Awesome</a> for the great iconic font used in these pages.</p>
<br />
<br />
</section>
<footer>
<p><small>Hosted on <a href="http://pages.github.com">GitHub Pages</a> using the Dinky theme</small></p>
</footer>
</div>
<!--[if !IE]><script>fixScale(document);</script><![endif]-->
</body>
</html>