Merge pull request 'Superhaufen' (#208) from feature/superhaufen-plus into master

Reviewed-on: https://git.cantorgymnasium.de/gcg/gcg-website/pulls/208

assets/scss/_common.scss

@@ -432,7 +432,7 @@ details[open] summary {
 
 #wc-canvas {
   width: 100%;
-  height: 600px;
+  height: 400px;
 }
 
 .top-banner {
@@ -446,3 +446,14 @@ details[open] summary {
 .content-justify {
   text-align: justify;
 }
+
+.fb-tile-color {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 195px;
+}
+
+.fb-tile-icon {
+  font-size: 96px;
+}

config.yml

@@ -7,6 +7,7 @@ defaultContentLanguage: de
 enableEmoji: true
 enableRobotsTxt: true
 timeZone: Europe/Berlin
+removePathAccents: true
 markup:
   defaultMarkdownHandler: goldmark
   goldmark:

content/german/schulchronik/2018.md

@@ -23,10 +23,6 @@ topics:
       Inhalt
 
 
-
-      {{< card >}}
-
-
   - title: Schulfest "Make Cantor great again"
     content: |
       Inhalt

content/german/superhaufen/_index.md

@@ -0,0 +1,6 @@
+---
+title: Superhaufen
+draft: false
+bg_image: media/backgrounds/page-title.webp
+description: null
+---

layouts/_default/superhaufen.html

@@ -0,0 +1,7 @@
+<div class="card border-primary rounded-0 hover-shadow mb-5">
+    <div class="card-body">
+      <h4 class="card-title"><a href="{{ .Permalink }}">{{ .Title | truncate 20 }}</a></h4>
+      <a href="{{ .Permalink }}" class="btn btn-primary btn-sm">{{ i18n "show_more"}}</a>
+    </div>
+</div>
+  

layouts/partials/head.html

@@ -17,6 +17,8 @@
   <link rel="shortcut icon" href="{{ `media/favicon.png` | absURL }}" type="image/x-icon">
   <link rel="icon" href="{{ `media/favicon.png` | absURL }}" type="image/x-icon">
 
+  <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Tilt+Warp">
+  
   <script src="{{ `plugins/wordcloud/wordcloud2.min.js` | absURL }}"></script>
 
 

layouts/schulchronik/single.html

@@ -28,9 +28,18 @@
           {{ partial "chronik-modal" (dict "id" "pretext" "title" .Title "content" .Params.pretext) }}
         {{ end }}
         <div id="wc-canvas"></div>
-        {{ $topics := slice (slice .Params.Title 100 "pretext") }}
+        {{ $topics := slice }}
+        {{ if .Params.pretext }}
+        {{ $topics = $topics | append (slice (slice .Params.Title 200 "pretext")) }}
+        {{ else }}
+        {{ $topics = $topics | append (slice (slice .Params.Title 200)) }}
+        {{ end }}
         {{ range .Params.topics }}
-          {{ $topics  = $topics | append (slice (slice .title 40 (md5 .title) )) }}
+          {{ if .superhaufen.enable }}
+          {{ $topics  = $topics | append (slice (slice .title 30 (.superhaufen.link | urlize)  "superhaufen" )) }}
+          {{ else }}
+          {{ $topics  = $topics | append (slice (slice .title 30 (md5 .title) )) }}
+          {{ end }}
         {{ end }}
         {{ $topics = $topics | jsonify }}
         <script>
@@ -38,19 +47,33 @@
             document.getElementById('wc-canvas'),
             {
               click: function (item) {
-                if (item[1] != 100 || (item[1] == 100 && item[2] == "pretext")) {
+                if (item[1] != 200 || (item[1] == 200 && item[2] == "pretext")) {
+                  if( item[3] == "superhaufen" ) {
+                    window.location.href = "{{ `/superhaufen/` | relLangURL }}" + item[2];
+                  } else {
                    $('#' + item[2]).modal('show');
                   }
+                }
               },
               color: function (word, weight) {
-                return (weight === 100) ? '#ffbc3b' : '#1a1a37';
+                return (weight === 200) ? '#ffbc3b' : '#1a1a37';
               },
-              fontFamily: 'Fira Sans, serif',
+              hover: function(item, dimension, event) {
+                console.log("item:", item);
+                console.log("dimension:", dimension);
+                console.log("event:", event);
+                item && item[2] ? event.target.style.textDecorationLine = "underline" : null
+              },
+              fontFamily: 'Tilt Warp, serif',
               fontWeight: 700,
               list: JSON.parse("{{ $topics }}"),
               shrinkToFit: true,
-              gridSize: 25,
+              gridSize: 50,
               rotateRatio: 0,
+              shuffle: false,
+              shape: "square",
+              ellipticity: 1,
+              clearCanvas: true
             } 
           );
         </script>

layouts/superhaufen/list.html

@@ -0,0 +1,15 @@
+{{ define "main" }}
+
+<section class="section-sm pb-0">
+	<div class="container">
+		<div class="row">
+			{{ range .Data.Pages }}
+				<div class="col-lg-4 col-sm-6">
+				{{ .Render "superhaufen" }}
+				</div>
+			{{ end }}
+		</div>
+	</div>
+</section>
+
+{{ end }}

layouts/superhaufen/single.html

@@ -0,0 +1,60 @@
+{{ define "main" }}
+
+<section class="section-sm pb-0">
+  <div class="container">
+    <div class="row">
+      <div class="col-12 mb-4 content">
+        {{ .Content }}
+      </div>
+    </div>
+  </div>
+  <div class="container">
+    <div class="row">
+      {{ range .Params.tiles }}
+      <div id="{{ md5 .title }}" class="modal">
+        <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable" role="document">
+          <div class="modal-content">
+            <div class="modal-header">
+              <h5 class="modal-title">{{ .title }}</h5>
+              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                <span aria-hidden="true">&times;</span>
+              </button>
+            </div>
+            <div class="modal-body">
+              <div class="content">
+                {{ .content | markdownify }}
+              </div>
+              {{ range .unterhaufen }}
+                <div class="container mb-0">
+                  <div class="card border-primary rounded-0 hover-shadow mb-5">
+                    <div class="card-body mb-0">
+                      <details class="mb-0">
+                      <summary class="mb-0">{{ .title }}</summary>
+                      <div class="content"><p class="content">{{ .content }}</p></div>
+                      </details>
+                    </div>
+                  </div>
+                </div>
+              {{ end }}
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="col-lg-4 col-sm-6">
+        <div class="card border-primary rounded-0 hover-shadow mb-5">
+          <div class="container fb-tile-color" style="background-color:{{ .bg_color }};">
+            <i class="{{ .icon }} fb-tile-icon" style="color: {{ .font_color }};"></i>
+          </div>
+          <div class="card-body">
+            <h4 class="card-title">{{ .title | truncate 55 }}</h4>
+            <button type="button" class="btn btn-primary btn-sm" onclick="$('#{{ md5 .title }}').modal('show');">{{
+              i18n "show_more"}}</button>
+          </div>
+        </div>
+      </div>
+      {{ end }}
+    </div>
+  </div>
+</section>
+
+{{ end }}

static/schulchronik/admin/config.yml

@@ -136,6 +136,39 @@ collections:
       - {label: "Type", name: "type", widget: "hidden", default: "cantorpreis"}
       - {label: "Gallerie-Komponente", name: "gallery", widget: "boolean", default: false, required: false, hint: "Benötigt für Gallerie bzw. Bildeinbettung"}
       - {label: "Text", name: "body", widget: "markdown", required: false}
+  - name: "superhaufen"
+    icon: "superhaufen"
+    label: "Superhaufen"
+    label_singular: "Superhaufen"
+    folder: "content/german/superhaufen"
+    filter: {field: "type", value: "superhaufen"}
+    create: true
+    editor:
+      preview: false
+    media_folder: '/static/media/schulchronik/superhaufen'
+    public_folder: '/media/schulchronik/superhaufen'
+    fields:
+      - {label: "Titel", name: "title", widget: "string"}
+      - {label: "Entwurf", name: "draft", widget: "boolean", default: false, required: false}
+      - {label: "Hintergrundbild", name: "bg_image", widget: "hidden", default: "/media/backgrounds/page-title.webp"}
+      - {label: "Type", name: "type", widget: "hidden", default: "superhaufen"}
+      - label: "Kacheln"
+        name: "tiles"
+        widget: "list"
+        required: false
+        fields:
+          - {label: "Titel", name: "title", widget: "string", required: true}
+          - {label: "Hintergrundfarbe", name: "bg_color", widget: "color", required: true}
+          - {label: "Symbol", name: "icon", widget: "string", required: true}
+          - {label: "Symbolfarbe", name: "font_color", widget: "color", required: true}
+          - {label: "Inhalt", name: "content", widget: "markdown", required: true}
+          - label: "Unter-Unterhaufen"
+            name: "unterhaufen"
+            widget: "list"
+            required: false
+            fields:
+              - {label: "Titel", name: "title", widget: "string", required: false}
+              - {label: "Inhalt", name: "content", widget: "markdown", required: true}
   - name: "schulchronik"
     icon: "pillar"
     label: "Schulchronik"
@@ -156,10 +189,24 @@ collections:
       - label: "Kreative Haufen"
         name: "topics"
         widget: "list"
+        required: false
         fields:
           - {label: "Titel", name: "title", widget: "string", required: true}
           - {label: "Inhalt", name: "content", widget: "markdown", required: true}
+          - label: "Superhaufen"
+            name: "superhaufen"
+            widget: "object"
             required: false
+            fields:
+              - {label: "Aktiviert", name: "enable", widget: "boolean", required: false}
+              - label: "Superhaufen"
+                name: "link"
+                widget: "relation"
+                collection: "superhaufen"
+                search_fields: ["title"]
+                value_field: "title"
+                required: false
+                collapsed: true
       - label: "Cantorpreisträger"
         name: "cantorpreisträger"
         widget: "relation"

static/schulchronik/admin/index.html

@@ -21,7 +21,7 @@
       CMS.init();
     </script>
     <script id="icons">
-      var icons = [['settings', 'mdi mdi-cog-outline'], ['user', 'mdi mdi-fountain-pen-tip'], ['page', 'mdi mdi-file-document-outline'], ['page-add', 'mdi mdi-file-document-plus-outline'], ['document', 'mdi mdi-file-document-multiple-outline'], ['news', 'mdi mdi-newspaper'], ['award', 'mdi mdi-seal-variant'], ['group', 'mdi mdi-crowd'], ['trophy', 'mdi mdi-trophy-outline'], ['pi', 'mdi mdi-pi-box'], ['pillar', 'mdi mdi-pillar'], ['graduation-cap', 'mdi mdi-school-outline'], ['help', 'mdi mdi-lifebuoy'], ['dash', 'mdi mdi-monitor-dashboard'], ['presentation', 'mdi mdi-presentation']];
+      var icons = [['settings', 'mdi mdi-cog-outline'], ['user', 'mdi mdi-fountain-pen-tip'], ['page', 'mdi mdi-file-document-outline'], ['page-add', 'mdi mdi-file-document-plus-outline'], ['document', 'mdi mdi-file-document-multiple-outline'], ['news', 'mdi mdi-newspaper'], ['award', 'mdi mdi-seal-variant'], ['group', 'mdi mdi-crowd'], ['trophy', 'mdi mdi-trophy-outline'], ['pi', 'mdi mdi-pi-box'], ['pillar', 'mdi mdi-pillar'], ['graduation-cap', 'mdi mdi-school-outline'], ['help', 'mdi mdi-lifebuoy'], ['dash', 'mdi mdi-monitor-dashboard'], ['presentation', 'mdi mdi-presentation'], ['superhaufen', 'mdi mdi-view-dashboard']];
       icons.forEach(icon => {
         CMS.registerIcon(icon[0], ({}) => { return(h('i', {className: icon[1] + " icon-md"})); });
       });