codefornl · milovanderlinden · Dec 2, 2018 · Dec 3, 2018 · Dec 4, 2018 · Dec 4, 2018
diff --git a/.rancher-pipeline.yml b/.rancher-pipeline.yml
@@ -0,0 +1,11 @@
+stages:
+- name: Publish
+  steps:
+  - publishImageConfig:
+      dockerfilePath: ./Dockerfile
+      buildContext: .
+      tag: clarity-staging:${CICD_EXECUTION_SEQUENCE}
+- name: Deploy
+  steps:
+  - applyYamlConfig:
+      path: ./deployment.yaml
diff --git a/README.md b/README.md
@@ -9,8 +9,8 @@ BASE_URI : url of the cbase api
 The development environment will connect to the cbase.codefor.nl BASE_URI by default. Override it if you have a local setup for the API too.
 
 ```
-docker build .
-docker run -v <localdir>/public:/var/www/html/public -v <localdir>/private:/var/www/html/private -p 8080:80 <your built image>
+docker build -t clarity_dev_local:0.0.1 .
+docker run -v $(pwd)/public:/var/www/html/public -v $(pwd)/private:/var/www/html/private -p 8080:80 clarity_dev_local:0.0.1
 ```
 
 You can then access the site at http://localhost:8080 and make changes in your local php files.
diff --git a/deployment.yaml b/deployment.yaml
@@ -0,0 +1,36 @@
+kind: Service
+apiVersion: v1
+metadata:
+  name: clarity-service
+spec:
+  selector:
+    app: clarity
+  type: NodePort
+  ports:
+    - protocol: TCP
+      port: 80
+      targetPort: 80
+---
+apiVersion: apps/v1
+kind: Deployment
+metadata:
+  name: example-clarity
+  labels:
+    app: clarity
+spec:
+  replicas: 1
+  selector:
+    matchLabels:
+      app: clarity
+  template:
+    metadata:
+      labels:
+        app: clarity
+    spec:
+      imagePullSecrets:
+      - name: pipeline-docker-registry
+      containers:
+      - name: clarity
+        image: ${CICD_IMAGE}:${CICD_EXECUTION_SEQUENCE}
+        ports:
+        - containerPort: 80
diff --git a/private/locale/en.json b/private/locale/en.json
@@ -0,0 +1,17 @@
+{
+    "case studies": "case study|case studies",
+    "curator":"curator",
+    "All": "All",
+    "Category" : "Category|Categories",
+    "Type":"Type",
+    "Tools":"Tools",
+    "contact": "contact",
+    "Search": "Search",
+    "matching": "matching",
+    "about": "The CLARITY project is a two-year project, funded by the European Commission under the Horizon 2020 framework. Grant Agreement number: 693881",
+    "description": "The CLARITY project brings together stakeholder networks across Europe into an engaged and mobilised community that supports innovation in open eGovernment applications.",
+    "title": "Clarity - case studies",
+    "github": "is available as an open source application, maintained by Code for NL on <a href=\"https://github.com/codefornl/clarity\">github.com/codefornl/clarity</a>.",
+    "project": "is a part of the <a href=\"https://clarity-csa.eu/\">Clarity Open eGovernment Services</a> project.",
+    "contactcodefor": "Please contact <a href=\"http://www.codefor.nl\">Code for NL</a> for more information."
+}
diff --git a/private/locale/es.json b/private/locale/es.json
@@ -0,0 +1,17 @@
+{
+    "case studies": "caso de estudio|estudios de case",
+    "curator": "curador",
+    "All": "Todos",
+    "Category": "Categoría|Categorías",
+    "Type": "Tipo",
+    "Tools": "Herramientas",
+    "contact": "contactar",
+    "Search": "Buscar",
+    "matching": "pareo",
+    "about": "El proyecto CLARITY es un proyecto de dos años, financiado por la Comisión Europea en el marco del Horizonte 2020. Número de acuerdo de subvención: 693881",
+    "description": "El proyecto CLARITY reúne a las redes de partes interesadas de toda Europa en una comunidad comprometida y movilizada que apoya la innovación en aplicaciones abiertas de administración electrónica.",
+    "title": "Clarity - estudios de case",
+    "github": "está disponible como una aplicación de código abierto, mantenida por Code for NL en <a href=\"https://github.com/codefornl/clarity\">github.com/codefornl/clarity </a>.",
+    "project": "forma parte del proyecto <a href=\"https://clarity-csa.eu/\">Clarity Open eGovernment Services</a>.",
+    "contactcodefor": "Póngase en contacto con <a href=\"http://www.codefor.nl\">Code for NL</a> para obtener más información"
+}
diff --git a/private/locale/nl.json b/private/locale/nl.json
@@ -0,0 +1,17 @@
+{
+    "case studies": "case study|case studies",
+    "curator" : "curator",
+    "All": "Alle",
+    "Category": "Categorie|Categorieën",
+    "Type": "Type",
+    "Tools": "Hulpmiddelen",
+    "contact": "contact",
+    "Search" : "Zoek",
+    "matching" : "met",
+    "about": "Het CLARITY-project is een tweejarig project, gefinancierd door de Europese Commissie onder het Horizon 2020 framework met referentienummer: 693881",
+    "description": "Het CLARITY-project brengt netwerken van belanghebbenden in heel Europa samen in een geëngageerde en gemobiliseerde gemeenschap die innovatie ondersteunt in open digitale overheidstoepassingen.",
+    "title": "Clarity - case studies",
+    "github": "is beschikbaar als open source-toepassing, onderhouden door Code voor NL op <a href=\"https://github.com/codefornl/clarity\">github.com/codefornl/clarity</a>.",
+    "project": "is een onderdeel van het <a href=\"https://clarity-csa.eu/\">project Clarity Open eOverheid Services</a>.",
+    "contactcodefor": "Neem contact op met <a href=\"http://www.codefor.nl\">Code voor NL</a> voor meer informatie."
+}
diff --git a/private/templates/admin.cbase.html b/private/templates/admin.cbase.html
@@ -1,15 +1,6 @@
 <!doctype html>
 <html>
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Clarity - case studies</title>
-    <link href="/css/foundation.css" rel="stylesheet" type="text/css">
-    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet">
-    <link href="/css/style.css" rel="stylesheet" type="text/css">
-    <link href="/css/additions.css" rel="stylesheet" type="text/css">
-
-</head>
+    {{ include('head.html') }}
 
 <body class="layout">
 

diff --git a/private/templates/admin.html b/private/templates/admin.html
@@ -1,14 +1,6 @@
 <!doctype html>
 <html>
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Clarity - case studies</title>
-    <link href="/css/foundation.css" rel="stylesheet" type="text/css">
-    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet">
-    <link href="/css/style.css" rel="stylesheet" type="text/css">
-    <link href="/css/additions.css" rel="stylesheet" type="text/css">
-</head>
+    {{ include('head.html') }}
 
 <body class="layout">
 

diff --git a/private/templates/admin.usecase.html b/private/templates/admin.usecase.html
@@ -1,14 +1,6 @@
 <!doctype html>
 <html>
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Clarity - case studies</title>
-    <link href="/css/foundation.css" rel="stylesheet" type="text/css">
-    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet">
-    <link href="/css/style.css" rel="stylesheet" type="text/css">
-    <link href="/css/additions.css" rel="stylesheet" type="text/css">
-</head>
+    {{ include('head.html') }}
 <body class="layout">
 
     <h1 class="admin-mode-notifier">

diff --git a/private/templates/cbase.html b/private/templates/cbase.html
@@ -1,43 +1,20 @@
 <!doctype html>
 <html>
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-    <title>Clarity - {{ translate("case studies", cbase.language) }}</title>
-    <link href="/css/foundation.css" rel="stylesheet" type="text/css">
-    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet">
-    <link href="/css/style.css" rel="stylesheet" type="text/css">
-    <link href="/css/additions.css" rel="stylesheet" type="text/css">
-
-    <meta property='og:url' content='{{ uri }}'>
-    <meta property='og:title' name='title' content="{{ cbase.name }}">
-    <meta property='og:description' name='description' content="{{ cbase.description }}">
-    <meta property='og:image' content="{{ (cbase._embedded.usecase|first).image }}">
-    <link rel='image_src' href="{{ (cbase._embedded.usecase|first).image }}"/>
-    <meta name='keywords' content="">
-
-    <meta name="twitter:card" content="summary_large_image">
-    <meta name="twitter:title" content="{{ cbase.name }}">
-    <meta name="twitter:description" content="{{ cbase.description }}">
-    <meta name="twitter:image:src" content="{{ (cbase._embedded.usecase|first).image }}">
-</head>
-
-<body class="layout">
-
-    <header class="main-header layout__main-header">
-        <a href="/#{{ cbase.slug }}">
-            {% if cbase.logo_image %}
-            <img src="{{ cbase.logo_image }}" alt="Clarity - case studies" class="main-header__logo">
-            {% else %}
-            <img src="/svg/clarity-casestudies-logo.svg" alt="Clarity - case studies" class="main-header__logo">
-            {% endif %}
-        </a>
-    </header>
+    {{ include('head.html') }}
+    <body class="layout">
+        <header class="main-header layout__main-header">
+            <a href="/#{{ cbase.slug }}">
+                {% if cbase.logo_image %}
+                <img src="{{ cbase.logo_image }}" alt="Clarity - case studies" class="main-header__logo">
+                {% else %}
+                <img src="/svg/clarity-casestudies-logo.svg" alt="Clarity - case studies" class="main-header__logo">
+                {% endif %}
+            </a>
+        </header>
 
     <main class="main-content layout__main-content">
-
         <form class="searchbar layout__searchbar" action="/cbase/{{ cbase.slug }}">
-            <input type="text" class="searchbar__input" placeholder="{{ translate("Search", cbase.language) }} {{ cbase.name }} {{ translate("case studies", cbase.language) }}" name="q" value="{{ q }}">
+            <input type="text" class="searchbar__input" placeholder="{{ translate("Search") }} {{ cbase.name }} {{ translate("case studies", 2) }}" name="q" value="{{ q }}">
             <button class="searchbar__button"><img src="/svg/searchbar-icon.svg"></button>
         </form>
 
@@ -49,7 +26,7 @@
                     <a href="/cbase/{{ cbase.slug }}">
                         <h2 class="list-summary__title">{{ cbase.name }}</h2>
                     </a>
-                    <div class="list-summary__count">{{ cbase._embedded.usecase|length }} {{ translate("case studies", cbase.language) }} {% if q %}{{ translate("matching", cbase.language) }} "{{ q }}"{% endif %}</div>
+                    <div class="list-summary__count">{{ cbase._embedded.usecase|length }} {{ translate("case studies", cbase._embedded.usecase|length) }} {% if q %}{{ translate("matching") }} "{{ q }}"{% endif %}</div>
                     <p class="list-summary__description">{{ cbase.description }}</p>
                     <div class="list-summary__curator">
                         <div class="curator">
@@ -58,7 +35,7 @@ <h2 class="list-summary__title">{{ cbase.name }}</h2>
                                 src="https://img.codefor.nl?url={{ (cbase.image|default('https://clarity.codefor.nl/img/One_black_Pixel.png'))|url_encode }}&height=80&width=80" class="curator__avatar">
                             <div class="curator__contact">
                                 <h3 class="curator__name">{{ cbase.admin_name }}</h3>
-                                <div class="curator__badge">{{ translate("curator", cbase.language) }}</div>
+                                <div class="curator__badge">{{ translate("curator") }}</div>
                                 <a href="mailto:{{ cbase.admin_email }}" class="curator__email">{{ cbase.admin_email }}</a>
                             </div>
                         </div>
@@ -70,40 +47,13 @@ <h3 class="curator__name">{{ cbase.admin_name }}</h3>
             <div class="layout__project-list">
 
 {% for usecase in cbase._embedded.usecase %}
-
-                <a href="/cbase/{{ cbase.slug }}/usecase/{{ usecase.slug }}" name="{{ usecase.slug }}">
-                    <div class="project layout__project-list-item">
-                        <img
-                            data-original-img="{{ usecase.image }}"
-                            src="https://img.codefor.nl?url={{ (usecase.image|default('https://clarity.codefor.nl/img/One_black_Pixel.png'))|url_encode }}&height=426&width=640" class="project__image">
-                        <div class="project__meta">
-                            <div class="project__summary">
-                                <h3 class="project__title">{{ usecase.name }}</h3>
-                                <h4 class="project__location">{{ usecase.organisation }}</h4>
-                            </div>
-                            <!--
-                            <div class="project__tools">
-                                <img src="/svg/tools-icon.svg" class="project__tools-icon">
-                                <span class="project__tools-count">{{ usecase.tools|length }} tool</span>
-                            </div>
-                            -->
-                        </div>
-                    </div>
-                </a>
-
+    {{ include('partials/usecase-card.html')}}
 {% endfor %}
 
             </div>
         </div>
 
     </main>
-    <footer>
-        <div class="footer__text">
-            <p>"Clarity - case studies" is a part of the <a href="https://clarity-csa.eu/">Clarity Open eGovernment Services</a> project.</p>
-            <p>The CLARITY project is a two-year project, funded by the European Commission under the Horizon 2020 framework. Grant Agreement number: 693881</p>
-            <p>"Clarity - case studies" is available as an open source application, maintained by Code for NL on <a href="https://github.com/codefornl/clarity_slim">github.com/codefornl/clarity_slim</a>.</p>
-            <p>Please contact <a href="http://www.codefor.nl">Code for NL</a> for more information.</p>
-        </div>
-    </footer>
+    {{ include('footer.html')}}
 </body>
 </html>
diff --git a/private/templates/footer.html b/private/templates/footer.html
@@ -0,0 +1,8 @@
+<footer>
+    <div class="footer__text">
+        <p><b>{{ translate('title') }}</b> {{ translate('project') | raw }}</p>
+        <p>{{ translate("about") }}</p>
+        <p><b>{{ translate('title') }}</b> {{ translate('github') | raw }}</p>
+        <p>{{ translate('contactcodefor') | raw }}</p>
+    </div>
+</footer>
diff --git a/private/templates/head.html b/private/templates/head.html
@@ -0,0 +1,30 @@
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>{{ translate('title') }}</title>
+    <link href="/css/foundation.css" rel="stylesheet" type="text/css">
+    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,600" rel="stylesheet">
+    <link href="/css/style.css" rel="stylesheet" type="text/css">
+    <link href="/css/additions.css" rel="stylesheet" type="text/css">
+    <meta property='og:url' content='{{ uri }}'>
+    {% if usecase %}
+        <meta property='og:title' name='title' content="{{ usecase.name }}">
+        <meta property='og:description' name='description' content="{{ usecase.teaser }}">
+        <meta property='og:image' content="{{ usecase.image }}">
+        <link rel='image_src' href="{{ usecase.image }}"/>
+        <meta name="twitter:card" content="summary_large_image">
+        <meta name="twitter:title" content="{{ usecase.name }}">
+        <meta name="twitter:description" content="{{ usecase.teaser }}">
+        <meta name="twitter:image:src" content="{{ usecase.image }}">
+    {% else %}
+        <meta property='og:title' name='title' content="{{ translate('title') }}">
+        <meta property='og:description' name='description' content="{{ translate('description')}}">
+        <meta property='og:image' content="https://clarity-csa.eu/sites/default/files/slider_07.png">
+        <link rel='image_src' href="https://clarity-csa.eu/sites/default/files/slider_07.png"/>
+        <meta name="twitter:card" content="summary_large_image">
+        <meta name="twitter:title" content="{{ translate('title') }}">
+        <meta name="twitter:description" content="{{ translate('description')}}">
+        <meta name="twitter:image:src" content="https://clarity-csa.eu/sites/default/files/slider_07.png">
+    {% endif %}
+    <meta name='keywords' content="">
+</head>