diff --git a/.rancher-pipeline.yml b/.rancher-pipeline.yml new file mode 100644 index 0000000..2684db3 --- /dev/null +++ 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 index 9ce41d0..7959eea 100644 --- 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 /public:/var/www/html/public -v /private:/var/www/html/private -p 8080:80 +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. \ No newline at end of file diff --git a/deployment.yaml b/deployment.yaml new file mode 100644 index 0000000..21561b1 --- /dev/null +++ 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 new file mode 100644 index 0000000..c4eb915 --- /dev/null +++ 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 github.com/codefornl/clarity.", + "project": "is a part of the Clarity Open eGovernment Services project.", + "contactcodefor": "Please contact Code for NL for more information." +} \ No newline at end of file diff --git a/private/locale/es.json b/private/locale/es.json new file mode 100644 index 0000000..e37711b --- /dev/null +++ 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 github.com/codefornl/clarity .", + "project": "forma parte del proyecto Clarity Open eGovernment Services.", + "contactcodefor": "Póngase en contacto con Code for NL para obtener más información" +} \ No newline at end of file diff --git a/private/locale/nl.json b/private/locale/nl.json new file mode 100644 index 0000000..4e244e9 --- /dev/null +++ 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 github.com/codefornl/clarity.", + "project": "is een onderdeel van het project Clarity Open eOverheid Services.", + "contactcodefor": "Neem contact op met Code voor NL voor meer informatie." +} \ No newline at end of file diff --git a/private/templates/admin.cbase.html b/private/templates/admin.cbase.html index 97bdd1b..cec823f 100644 --- a/private/templates/admin.cbase.html +++ b/private/templates/admin.cbase.html @@ -1,15 +1,6 @@ - - - - Clarity - case studies - - - - - - + {{ include('head.html') }} diff --git a/private/templates/admin.html b/private/templates/admin.html index 89764ac..a9e2141 100644 --- a/private/templates/admin.html +++ b/private/templates/admin.html @@ -1,14 +1,6 @@ - - - - Clarity - case studies - - - - - + {{ include('head.html') }} diff --git a/private/templates/admin.usecase.html b/private/templates/admin.usecase.html index dd65b41..1b539df 100644 --- a/private/templates/admin.usecase.html +++ b/private/templates/admin.usecase.html @@ -1,14 +1,6 @@ - - - - Clarity - case studies - - - - - + {{ include('head.html') }}

diff --git a/private/templates/cbase.html b/private/templates/cbase.html index 439f136..e01c526 100644 --- a/private/templates/cbase.html +++ b/private/templates/cbase.html @@ -1,43 +1,20 @@ - - - - Clarity - {{ translate("case studies", cbase.language) }} - - - - - - - - - - - - - - - - - - - - -
- - {% if cbase.logo_image %} - - {% else %} - - {% endif %} - -
+ {{ include('head.html') }} + +
+ + {% if cbase.logo_image %} + + {% else %} + + {% endif %} + +
- @@ -49,7 +26,7 @@

{{ cbase.name }}

-
{{ cbase._embedded.usecase|length }} {{ translate("case studies", cbase.language) }} {% if q %}{{ translate("matching", cbase.language) }} "{{ q }}"{% endif %}
+
{{ cbase._embedded.usecase|length }} {{ translate("case studies", cbase._embedded.usecase|length) }} {% if q %}{{ translate("matching") }} "{{ q }}"{% endif %}

{{ cbase.description }}

@@ -58,7 +35,7 @@

{{ cbase.name }}

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">

{{ cbase.admin_name }}

-
{{ translate("curator", cbase.language) }}
+
{{ translate("curator") }}
@@ -70,40 +47,13 @@

{{ cbase.admin_name }}

{% for usecase in cbase._embedded.usecase %} - - -
- -
-
-

{{ usecase.name }}

-

{{ usecase.organisation }}

-
- -
-
-
- + {{ include('partials/usecase-card.html')}} {% endfor %}
-
- -
+ {{ include('footer.html')}} \ No newline at end of file diff --git a/private/templates/footer.html b/private/templates/footer.html new file mode 100644 index 0000000..53d467a --- /dev/null +++ b/private/templates/footer.html @@ -0,0 +1,8 @@ +
+ +
\ No newline at end of file diff --git a/private/templates/head.html b/private/templates/head.html new file mode 100644 index 0000000..2ac6a7a --- /dev/null +++ b/private/templates/head.html @@ -0,0 +1,30 @@ + + + + {{ translate('title') }} + + + + + + {% if usecase %} + + + + + + + + + {% else %} + + + + + + + + + {% endif %} + + \ No newline at end of file diff --git a/private/templates/homepage.html b/private/templates/homepage.html index 1254df0..e53e323 100644 --- a/private/templates/homepage.html +++ b/private/templates/homepage.html @@ -1,116 +1,23 @@ - - - - Clarity - case studies - - - - - - - - - - - - - - - - - +{{ include('head.html')}} -
- +
-
- - -{% for cbase in cbases %} - -
- - -
- -
- -

{{ cbase.name }}

-
-
{{ cbase._embedded.usecase|length }} {{ translate("case studies", cbase.language) }}
-

{{ cbase.description }}

-
-
- -
-

{{ cbase.admin_name }}

-
{{ translate("curator", cbase.language) }}
- -
-
-
-
- -{% if cbase._embedded.usecase|length > 3 %} - {{ translate("All", cbase.language) }} {{ cbase.name }} {{ translate("case studies", cbase.language) }} → -{% endif %} - -
- -
- -{% for usecase in cbase._embedded.usecase|shuffle|slice(0, 3) %} - - -
- -
-
-

{{ usecase.name }}

-

{{ usecase.organisation }}

-
- -
-
-
- -{% endfor %} -
-
- -
- -{% endfor %} - + {% for cbase in cbases %} + {{ include('partials/cbase-list.html')}} + {% endfor %}
-
- -
+ {{ include('footer.html')}} \ No newline at end of file diff --git a/private/templates/partials/cbase-card.html b/private/templates/partials/cbase-card.html new file mode 100644 index 0000000..ad65db2 --- /dev/null +++ b/private/templates/partials/cbase-card.html @@ -0,0 +1,19 @@ +
+ +

{{ cbase.name }}

+
+
{{ cbase._embedded.usecase|length }} {{ translate("case studies", cbase._embedded.usecase|length) }}
+

{{ cbase.description }} 

+
+
+ +
+

{{ cbase.admin_name }}

+
{{ translate("curator") }}
+ +
+
+
+
\ No newline at end of file diff --git a/private/templates/partials/cbase-list.html b/private/templates/partials/cbase-list.html new file mode 100644 index 0000000..1505fe3 --- /dev/null +++ b/private/templates/partials/cbase-list.html @@ -0,0 +1,22 @@ +
+ + +
+ + {{ include('partials/cbase-card.html') }} + + {% if cbase._embedded.usecase|length > 3 %} + {{ translate("All") }} {{ cbase.name }} {{ translate("case studies", cbase._embedded.usecase|length) }} → + {% endif %} +
+ +
+ + {% for usecase in cbase._embedded.usecase|shuffle|slice(0, 3) %} + {{ include('partials/usecase-card.html')}} + {% endfor %} + +
+
+ +
\ No newline at end of file diff --git a/private/templates/partials/usecase-card.html b/private/templates/partials/usecase-card.html new file mode 100644 index 0000000..0d2338e --- /dev/null +++ b/private/templates/partials/usecase-card.html @@ -0,0 +1,19 @@ + +
+ +
+
+

{{ usecase.name }}

+

{{ usecase.organisation }}

+
+ +
+
+
\ No newline at end of file diff --git a/private/templates/usecase.html b/private/templates/usecase.html index 4019d08..c759559 100644 --- a/private/templates/usecase.html +++ b/private/templates/usecase.html @@ -1,27 +1,7 @@ - - - - Clarity - case studies - - - - - - - - - - - - - - - - - - + {{ include('head.html') }} +
@@ -37,13 +17,13 @@
- ← {{ usecase._embedded.cbase.name }} {{ translate("case studies", usecase._embedded.cbase.language) }} + ← {{ usecase._embedded.cbase.name }} {{ translate("case studies", 2) }}

{{ usecase.name }}

-

{{ usecase.organisation }} ({{ usecase.country }})

+ {% if usecase.organisation %} + {% if usecase.country %} +

{{ usecase.organisation }} ({{ usecase.country }})

+ {% else %} +

{{ usecase.organisation }}

+ {% endif %} + {% endif %}
@@ -66,17 +52,17 @@

{{ usecase.organisation }} ({{ usecase.coun

@@ -97,13 +83,6 @@

{{ usecase.contact_name }}

-
- -
+ {{ include('footer.html')}} \ No newline at end of file diff --git a/private/translations.php b/private/translations.php deleted file mode 100644 index bc1afbc..0000000 --- a/private/translations.php +++ /dev/null @@ -1,31 +0,0 @@ - [ - "nld" => "case studies" - ], - "curator" => [ - "nld" => "curator" - ], - "All" => [ - "nld" => "Alle" - ], - "Category" => [ - "nld" => "Categorie" - ], - "Type" => [ - "nld" => "Type" - ], - "Tools" => [ - "nld" => "Tools" - ], - "contact" => [ - "nld" => "contactpersoon" - ], - "Search" => [ - "nld" => "Doorzoek" - ], - "matching" => [ - "nld" => "met" - ] -]; \ No newline at end of file diff --git a/public/css/additions.css b/public/css/additions.css index f949571..8348382 100644 --- a/public/css/additions.css +++ b/public/css/additions.css @@ -87,9 +87,7 @@ .project__location { overflow: hidden; } -.layout__project-list-item { - padding: 0 10px 20px; -} + footer { background: #444; } diff --git a/public/css/style.css b/public/css/style.css index 9263b76..7f9b1bc 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -90,13 +90,12 @@ } .list-summary__title { font-family: 'Open Sans', sans-serif; - font-size: 27px; + font-size: 1.2rem; font-weight: 600; line-height: 1.4; } .list-summary__count { font-family: 'Open Sans', sans-serif; - font-size: 18px; line-height: 1.6; color: #557deb; font-weight: 600; @@ -157,27 +156,23 @@ } .project__meta { background: #557deb; - padding: 15px; - height: 80px; -} -.project__summary { - float: left; - width: 80%; + padding: 1rem; } + .project__title { color: #fff; font-family: 'Open Sans', sans-serif; - font-size: 20px; font-weight: 600; - line-height: 1.4; - margin-bottom: 2px; - line-height: 1; + line-height: 1.4em; + min-height: 1.4em; + margin-bottom: .2rem; white-space: nowrap; } .project__location { font-family: 'Open Sans', sans-serif; font-size: 18px; - line-height: 1.6; + line-height: 1.6em; + min-height: 1.6em; color: rgba(255, 255, 255, 0.5); font-size: 15px; white-space: nowrap; @@ -341,17 +336,20 @@ } .layout__project-list-item { float: left; - width: 33.33333%; - padding: 0 20px 20px 0px; + width: 30%; + box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.062), 0 6px 20px 0 rgba(0, 0, 0, 0.062); + margin: .5rem; } @media only screen and (max-width: 870px) and (min-width: 461px ) { .layout__project-list-item { - width: 100%; + width: inherit; + margin: 4rem; } } @media only screen and (max-width: 460px) { .layout__project-list-item { - width: 100%; + width: inherit; + margin: .5rem; } } .layout__project-detail-section { diff --git a/public/index.php b/public/index.php index 15001cf..89e9c09 100644 --- a/public/index.php +++ b/public/index.php @@ -32,12 +32,40 @@ $basePath)); $view->addExtension(new \Twig_Extension_Debug()); $view->addExtension(new \Twig_Extensions_Extension_Array()); - $translateFunction = new Twig_SimpleFunction('translate', function ($text, $language) { - $translations = include(__DIR__ . '/../private/translations.php'); - return $translations[$text][$language] ? - $translations[$text][$language] : - $text; + + $translateFunction = new Twig_SimpleFunction('translate', function ($text, $count=1) { + + if (isset($_GET['l'])) { + $lang = $_GET['l']; + } else { + $lang = substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2); + } + + $acceptLang = ['nl', 'es', 'en']; + $lang = in_array($lang, $acceptLang) ? $lang : 'en'; + if(file_exists(__DIR__ . "/../private/locale/{$lang}.json")){ + $f = file_get_contents(__DIR__ . "/../private/locale/{$lang}.json"); + } else { + $f = file_get_contents(__DIR__ . "/../private/locale/en.json"); + } + $translations = json_decode($f, true); + + if(isset($translations[$text])){ + $lang_arr = explode("|", $translations[$text]); + if(count($lang_arr) > 1){ + if($count > 1){ + return $lang_arr[1]; + } else { + return $lang_arr[0]; + } + } else { + return $lang_arr[0]; + } + } else { + return $text; + } }); + $view->getEnvironment()->addFunction($translateFunction); return $view; };