Merge pull request #90 from opendatasoft/apps

migration of Apps to the CL

assets/scss/components/hubpost.scss

@@ -0,0 +1,98 @@
+/* Bulma override / fix conflict */
+.input {
+  padding: 0;
+  border: none;
+  box-shadow: none;
+  margin-right: 1em !important;
+}
+
+.input:active, .input:focus {
+  border: none;
+  box-shadow: none;
+}
+
+select {
+  height: 100%;
+}
+
+/***/
+
+.hs-form {
+  margin: auto;
+  max-width: 500px;
+}
+
+div.hs-form-field {
+  padding: 10px 0 10px 0;
+}
+
+.hs-form input[name='firstname'], .hs-form input[name='lastname'] {
+  width: 100%;
+}
+
+.hs-input {
+  width: 100% !important;
+}
+
+.hs-form-field ul {
+  list-style-type: none;
+  padding: 0;
+}
+
+.hs-form-field > label {
+  color: $primary;
+}
+
+.hs-form-field ul label {
+  color: $danger;
+  font-weight: lighter;
+  font-size: 14px;
+  margin: 0;
+}
+
+.hs-form input, .hs-form textarea {
+  background-color: $body-background-color;
+  border: 1px solid $grey-light;
+  border-radius: 3px;
+  padding: 5px;
+}
+
+.hs-button {
+  padding: 8px 10px 8px 10px !important;
+  background-color: $info !important;
+  border: none !important;
+  color: white;
+  width: 200px;
+  height: 50px;
+  margin-top: 1em;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+  font-weight: 500;
+}
+
+.hs-button:focus {
+  outline: none;
+}
+
+.hs-button:hover {
+  background-color: $primary !important;
+  cursor: pointer;
+}
+
+.submitted-message > p {
+  text-align: center;
+  color: $info;
+  font-weight: 500;
+  font-size: 20px;
+}
+
+.submitted-message > p:before {
+  content: "icon";
+  text-indent: -999em;
+  display: block;
+  width: 120px;
+  height: 120px;
+  background: url("/static/img/form_icon_success.svg") no-repeat;
+  margin: 0 auto 20px auto;
+}

assets/scss/elements/content.scss

@@ -22,6 +22,16 @@ section.resources > div > article.block > .content {
   }
 }
 
+section.resources .content {
+  &.apps {
+    p img {
+      max-width: 600px;
+      margin: 0 auto 40px;
+      display: block;
+    }
+  }
+}
+
 
 
 

assets/scss/main.scss

@@ -50,6 +50,7 @@
 @import "./components/tabs";
 @import "./components/card";
 @import "./components/toc";
+@import "./components/hubpost";
 
 @import "./pages/pages";
 

content/apps/_index.md

@@ -0,0 +1,5 @@
+---
+description: "Learn and quickly implement new use cases and applications to build even further value with your own ODS platform!"
+title: "Apps"
+height: 400
+---

content/apps/canteen/index.md

@@ -0,0 +1,42 @@
+---
+title: "School Canteen Menu Displays"
+description: "Save school officials time: give them a printable menu model containing up-to-date information"
+tags: []
+hubspotFormId: 54303c2e-0e50-4acf-ad7e-361fb6498df0
+hubspotPortalId: 2041226
+hubspotCampaignId: 7011p000000ybQYAAY
+---
+
+**Save school officials time: give them a printable menu model containing up-to-date information**
+
+## Description
+
+**The context**
+
+French schools display their canteen menus each week either so that it can be read by students and their parents. In the majority of cases, the municipality sets the composition of the meals then sends the information to school establishments who then have to reprocess the information into a spreadsheet or a word processor in order to then print and display it.
+
+**The service**
+
+To help agents avoid repeating this task, Opendatasoft has created a model menu page that automatically generates the information from a dataset “school canteen menus”.
+
+**The ODS Advantage: the platform’s filters.** They enable you to choose the elements to show on the menu. Data that is only useful to territorial agents do not need to be displayed on documents destined to the public.
+
+**The Use Case**
+
+Rennes Metropolis offers its schools a ready-to-print menu page for which the text is generated from a dataset updated by the General Canteen Service. Thanks to the platform’s filters, allergens and organic ingredients are highlighted with specific colors. The dataset includes the menus for the ongoing, past, and following weeks, allowing schools to anticipate the preparation of the menus displayed.
+
+![Canteen menu](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/d28fa042592154aff047dc37d93d6aa7)
+
+![Canteen menu dataset](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/80ba947ae6cbc6ace40bf6e032be2464)
+
+## Requirements
+
+- An Opendatasoft platform
+
+## Get the App
+
+Get the code on [Github](https://github.com/opendatasoft/ods-cookbook/tree/master/dashboard/canteen-menu)
+
+See it live [here](https://discovery.opendatasoft.com/pages/menu-cantine/)
+
+Contact us to learn how we can accompany you in implementing this connection with the Waze API.

content/apps/covid-us-counties/index.md

@@ -0,0 +1,37 @@
+---
+title: "COVID-19 for US Counties"
+description: "Create a live COVID-19 for your county, city etc. with local data."
+tags: []
+hubspotFormId: 54303c2e-0e50-4acf-ad7e-361fb6498df0
+hubspotPortalId: 2041226
+hubspotCampaignId: 7011p000000ybQYAAY
+---
+
+**Create a live COVID-19 for your county, city etc. with local data.**
+
+## Description
+
+**The context**
+
+You have a regularly updated source of data about COVID-19 for your region (e.g. County or City) that that reflects information not available nationwide. You want to keep the population updated on the number of cases, the number of occupied hospital beds etc. in their surroundings. You want to make the data available for nation-wide aggregation.
+
+**The service**
+
+This page aggregates a number of indicators, with key figures, maps, tables etc. that allows to share detailed data with a simple visualization. All the aggregated data by day, by zipcode, by gender etc. are pre-configured.
+
+![Main figures and category graphs](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/d02448c54530bc3cfb632ce9e1378e72)
+
+![Maps and filtered graphs](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/81ebf78adfa945504d3b1cf8a0d89d14)
+
+## Requirements
+
+- An Opendatasoft platform
+- A dataset with records on COVID for every date and possibly split by gender, age etc.
+
+
+
+## Get the App
+
+Get the code on [Github](https://github.com/opendatasoft/ods-cookbook/tree/master/dashboard/covid-us)
+
+Contact us to learn how we can accompany you in implementing this connection with the Waze API.

content/apps/election/index.md

@@ -0,0 +1,42 @@
+---
+title: "Election Results Visualization"
+description: "Combine several datasets regarding election results and give your citizens a 360° representation of the share of votes across your territory."
+tags: []
+hubspotFormId: 54303c2e-0e50-4acf-ad7e-361fb6498df0
+hubspotPortalId: 2041226
+hubspotCampaignId: 7011p000000ybQYAAY
+---
+
+**Combine several datasets regarding election results and give your citizens a 360° representation of the share of votes across your territory.**
+
+## Description
+
+**The context**
+
+Elections are always a highlight for you and your constituents. To make your citizens want to follow the details of the live votes on your portal and facilitate the understanding of the results, you will need to offer them legible and engaging content.
+
+**The service**
+
+With Opendatasoft, it is possible to compare different fields of the same dataset or several datasets together. The visual representation of these combined and filtered data allows you to offer your community a comparative view of the distribution of votes by district, municipality or constituency.
+
+**The Use Case**
+
+Like the metropolis of Rennes, build an electoral map of your territory so that your citizens can view this information by polling station. They can understand how voters vote in their neighborhood and observe disparities with other areas of the municipality.
+
+Like the Hauts-de-Seine, guide your citizens in reading the voting results. The regional department has built an infographic containing data on the legislative and presidential elections since 1993. Filter buttons allow the user to choose the election that interests them, then to display the results (elected candidates, non-elected candidates, participation rate, number of invalid ballots, etc.) per constituency or municipality.
+
+![Rennes metropolis elections](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/ba48d5e36dec041c4105c621ac962175)
+
+![Hauts de seine elections visualization](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/fb73e1beedc13db100788ccac3153e21)
+
+## Requirements
+
+- An Opendatasoft platform
+
+## Get the App
+
+Get the code on [Github](https://github.com/opendatasoft/ods-cookbook/tree/master/dashboard/elections-v2)
+
+See it live [here](https://discovery.opendatasoft.com/pages/apps-elections-v2/)
+
+Contact us to learn how we can accompany you in implementing this connection with the Waze API.

content/apps/google-form/index.md

@@ -0,0 +1,39 @@
+---
+title: "Google Form Survey Results Visualization"
+description: "Automate the result display from your collaborative surveys by connecting Google Form to your Opendatasoft portal."
+tags: []
+hubspotFormId: 54303c2e-0e50-4acf-ad7e-361fb6498df0
+hubspotPortalId: 2041226
+hubspotCampaignId: 7011p000000ybQYAAY
+---
+
+**Automate the result display from your collaborative surveys by connecting Google Form to your Opendatasoft portal.**
+
+## Description
+
+**The context**
+
+You are preparing a survey and you need to visualize the results in a legible and structured way, as well as enrich them with other data. Google Form allows easy collection of these results, but not their advanced visualization or comparison with other data. Integrating Google Form with the Opendatasoft platform can help you take advantage of both tools.
+
+**The service**
+
+When you create a survey with Google Form, the answers are collected in a spreadsheet that updates as people respond. This spreadsheet can be shared via a URL of its own. All you need to do is set this URL as the source for publishing a new dataset. This will be updated in real time as soon as a new person responds to the survey. You will then be able to take advantage of the data visualization and comparison features offered by the platform to display the results of your survey in the most comprehensive and understandable way possible.
+
+![A Google form](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/e887393b95f14f3e65464d61bbef3b63)
+
+![The resulting dataset](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/c3eec695cbbd9d9c6ce55e5275992178)
+
+![A visualization based on the form data](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/ab2337375f8be8d087cda46524a930d7)
+
+## Requirements
+
+- A Google Account
+- An Opendatasoft platform
+
+## Get the App
+
+Get the code on [Github](https://github.com/opendatasoft/ods-cookbook/tree/master/dashboard/survey-spreadsheet-scenario)
+
+See it live [here](https://discovery.opendatasoft.com/explore/dataset/travel-experience-survey/information/)
+
+Contact us to learn how we can accompany you in implementing this connection with the Waze API.

content/apps/iot/index.md

@@ -0,0 +1,42 @@
+---
+title: "Make your IoT data speak"
+description: "Build dynamic and easy to read visualization on your sensors data and connected equipments"
+tags: []
+hubspotFormId: 54303c2e-0e50-4acf-ad7e-361fb6498df0
+hubspotPortalId: 2041226
+hubspotCampaignId: 7011p000000ybQYAAY
+---
+
+**Build dynamic and easy to read visualization on your sensors data and connected equipments**
+
+## Description
+
+**The context**
+
+Smart sorting bins and energy meters, traffic surveillance cameras, fleets of geolocated vehicles … the connected equipment is multiplying within the territories, producing a considerable amount of data in real time. Gross, voluminous and complex, this IoT data often remains indecipherable for the human eye.
+
+**The service**
+
+Opendatasoft provides you with a visualization model fully designed to represent, understand and analyze all your IoT data, regardless of their source and format. This app allows you to:
+
+- map all of your sensors to monitor their operating status and supervise their activity
+- simply and visually restore the raw data collected by your sensors, offering several levels of detail: location, operating status, description of measurements, analytical curves, etc.
+- draw up a history of the data produced by your connected objects, navigate easily through this history and analyze the evolution of values over time
+
+**The use case**
+
+In Paris, Trilib stations installed in several areas of the city generate data on waste. The app proposed by Opendatasoft allows to locate these stations on a map. By clicking on a geolocated point, a lateral banner opens to the right of the map, allowing to visualize the filling rates of the buckets, to check if they are active or not, and to browse the history of the data they have produced so far.
+
+![Trilib sorting stations in Paris](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/27b66c50b1674cad4070a1aa96d149ad)
+
+![Current filling rate and historical analysis](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/d4825a6b0055ac3ee62b6cc947234976)
+
+## Requirements
+
+- An Opendatasoft platform
+
+## Get the App
+
+Get the code on [Github](https://github.com/opendatasoft/odsapps-iot)
+
+Contact us to learn how we can accompany you in implementing this connection with the Waze API.

content/apps/kpi-dashboard/index.md

@@ -0,0 +1,51 @@
+---
+title: "KPI Dashboard"
+description: "Create personalized dashboards to measure the performance of your actions and highlight your concrete achievements"
+tags: []
+hubspotFormId: 54303c2e-0e50-4acf-ad7e-361fb6498df0
+hubspotPortalId: 2041226
+hubspotCampaignId: 7011p000000ybQYAAY
+---
+
+**Create personalized dashboards to measure the performance of your actions and highlight your concrete achievements**
+
+## Description
+
+**The context**
+
+Whether you are a community or a company, your goal is to provide an ever higher quality of service to your citizens or customers. For that, you need to evaluate the accomplishment of the actions carried out by your organization. These performance indicators reflect your strategic plan objectives, or your municipality’s political program.
+
+**The service**
+
+Opendatasoft allows you to build a dashboard of performance indicators related to datasets published on your portal. The use of such a tool offers you:
+
+- an understanding of essential metrics to track your achievements, all in one place.
+- the guarantee that your indicators will always be up to date because synchronized with the datasets of your portal.
+- the possibility of creating, for each indicator, pages aggregating editorial contents and data visualizations in order to contextualize, explain and enhance the concrete actions already implemented or being completed.
+
+**The + ODS: customization from A to Z.** Organisation using indicators such as color, icons, progress bars, integration of visuals … your dashboard is fully customizable. It can then perfectly integrate into the range of digital and communication tools used by your organization to highlight your actions, both internally and externally.
+
+**The use case**
+
+The city of Paris has built a dashboard of performance indicators using its website’s visual identity. Open to the public, the dashboard is designed around three axes, each represented by a color to facilitate sorting and readability: living together better (pink), the city that benefits everyone (blue) and the construction of tomorrow’s world (green). The municipality has chosen to represent a percentage rate of completion of its service’s actions, accompanied with a progress bar. Each action is contextualized by a page mixing texts, and data visualizations. This page also gives access to the data set’s source used to build the performance indicators.
+[https://indicateurs-parisdata.opendatasoft.com](https://indicateurs-parisdata.opendatasoft.com)
+
+![Portal's homepage](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/a0f632bc730e4976e6221d4f4396f159)
+
+![Indicator detailed page](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/4613ea2e82c1b62ea0d736cce7fbeee1)
+
+![Paris customer case : A city government dashboard for Parisians](https://odsplus.opendatasoft.com/api/v2/catalog/datasets/ods-plus-content-en/files/45d4e282650deee8f338433d9743995e)
+
+## Requirements
+
+- An Opendatasoft platform
+- Preparatory work done on the nature of the indicators to be put forward
+
+
+## Get the App
+
+Get the code on [Github](https://github.com/opendatasoft/odsapps-perfkpi)
+
+See it live [here](https://perfkpi-odsapps.opendatasoft.com/)
+
+Contact us to learn how we can accompany you in implementing this connection with the Waze API.