layout |
---|
base |
{% assign fdbk= site.data['feedback'] %} {% assign start = fdbk | first %} {% assign topics = site.data | where_exp: "item", "item.title" %} {% assign tutorials = site.pages | where:"layout", "tutorial_hands_on" %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.bundle.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]"></script> <script src="https://github.com/nagix/chartjs-plugin-colorschemes/releases/download/v0.4.0/chartjs-plugin-colorschemes.js"></script> <script type="text/javascript"> const isReduced = window.matchMedia(`(prefers-reduced-motion: reduce)`) === true || window.matchMedia(`(prefers-reduced-motion: reduce)`).matches === true; if(isReduced){ Chart.defaults.global.animation.duration = 0; } Chart.plugins.unregister(ChartDataLabels); function genColors(size) { var o = []; for(i = 0; i < size; i++){ o.push(`hsl(${ i * 360 / size }, 100%, 50%)`) } return o; } // Feedback over time function drawFdbkOverMonthGraph(id, datasets) { var fdbkOverMonthGraph = document.getElementById(id); var tutorialsBar = new Chart(fdbkOverMonthGraph, { type: 'line', data: { datasets: datasets }, options: { scales: { yAxes: [{ ticks: { beginAtZero: true } }], xAxes: [{ type: 'time', time: { displayFormats:{month:'YYYY-MM'}, min: '2018-09', unit: 'month', distribution: 'linear' } }] }, legend: { display: false }, title: { display: false, }, plugins: { colorschemes: { scheme: 'tableau.Classic20' } } } }); } function drawFdbkNoteGraph(id, data, labels) { var tutoBar = document.getElementById(id); var fdbkNoteGraph = new Chart(tutoBar, { type: 'horizontalBar', data: { labels: labels, datasets: [{ backgroundColor: genColors(data.length), data: data }] }, plugins: [ChartDataLabels], options: { legend: { display: false }, title: { display: false, }, plugins: { datalabels: { anchor: 'end', align: 'end' } } } }); } </script>{% assign fdbk_by_month = fdbk | group_by: 'month' %} {% assign fdbk_over_time = "" | split: ',' %} {% assign fdbk_over_time_labels = "" | split: ',' %} {% assign fdbk_count = 0 %} {% for f in fdbk_by_month %} {% assign new_fdbk = f.items | size %} {% assign fdbk_count = fdbk_count | plus: new_fdbk %} {% assign fdbk_over_time = fdbk_over_time | push: fdbk_count %} {% assign fdbk_over_time_labels = fdbk_over_time_labels | push: f.name %} {% endfor %} {% assign fdbk_by_note = fdbk | sort:'note' | group_by: 'note' %}
<script> var fdbk_over_month = { all_topics: [ { label: "All topic", data: [{% for c in fdbk_over_time %}{x:"{{ fdbk_over_time_labels[forloop.index0] }}", y: {{ c }} } {% unless forloop.last %},{% endunless %}{% endfor %}], fill: false, } ] }; var data_notes = { all_topics: [{% for n in (0..5) %}{% assign f_f_n = fdbk_by_note | where: "name",n | first %}{% if f_f_n.size == 0 %}0{% else %}{{ f_f_n.items | size }}{% endif %}{% unless forloop.last %},{% endunless %}{% endfor %}] }; var labels_notes = [{% for n in (0..5) %}"{{ n }}"{% unless forloop.last %},{% endunless %}{% endfor %}]; </script>{% assign fdbk_by_topic = fdbk | group_by: 'topic' | sort: 'name' %} {% for tn in fdbk_by_topic %} {% assign t_metadata = topics | where: "title",tn.name | first %} {% assign topic_name = t_metadata['name'] %} {% assign fdbk_by_month = tn.items | group_by: 'month' %} {% assign fdbk_over_time = "" | split: ',' %} {% assign fdbk_over_time_labels = "" | split: ',' %} {% assign fdbk_count = 0 %} {% for f in fdbk_by_month %} {% assign new_fdbk = f.items | size %} {% assign fdbk_count = fdbk_count | plus: new_fdbk %} {% assign fdbk_over_time = fdbk_over_time | push: fdbk_count %} {% assign fdbk_over_time_labels = fdbk_over_time_labels | push: f.name %} {% endfor %} {% assign fdbk_by_note = tn.items | sort:'note' | group_by: 'note' %}
<script> var topic_data = { label: "{{ tn.name }}", data: [{% for c in fdbk_over_time %}{x:"{{ fdbk_over_time_labels[forloop.index0] }}", y: {{ c }} } {% unless forloop.last %},{% endunless %}{% endfor %}], fill: false, }; fdbk_over_month['topic-{{ topic_name }}'] = [topic_data]; fdbk_over_month['all_topics'].push(topic_data); data_notes['topic-{{ topic_name }}'] = [{% for n in (0..5) %}{% assign f_f_n = fdbk_by_note | where: "name",n | first %}{% if f_f_n.size == 0 %}0{% else %}{{ f_f_n.items | size }}{% endif %}{% unless forloop.last %},{% endunless %}{% endfor %}]; </script>{% assign fdbk_by_tutorial = tn.items | group_by: 'tutorial' | sort: 'name' %}
{% for tun in fdbk_by_tutorial %}
{% assign tuto_metadata = tutorials | where: "title",tun.name | first %}
{% assign tuto_name = tuto_metadata['dir'] | split: "/" | last %}
{% if tuto_metadata['name'] != 'tutorial.md' %}
{% assign lang = tuto_metadata['name'] | split: "." | first | split: "-" | last %}
{% assign tuto_name = tuto_name | append: lang %}
{% endif %}
{% if tuto_name != '' %}
{% assign fdbk_by_month = tun.items | group_by: 'month' %}
{% assign fdbk_over_time = "" | split: ',' %}
{% assign fdbk_over_time_labels = "" | split: ',' %}
{% assign fdbk_count = 0 %}
{% for f in fdbk_by_month %}
{% assign new_fdbk = f.items | size %}
{% assign fdbk_count = fdbk_count | plus: new_fdbk %}
{% assign fdbk_over_time = fdbk_over_time | push: fdbk_count %}
{% assign fdbk_over_time_labels = fdbk_over_time_labels | push: f.name %}
{% endfor %}
{% assign fdbk_by_note = tun.items | sort:'note' | group_by: 'note' %}
{% endif %}
{% endfor %}
{% endfor %}
<p>Aggregation of feedback submitted since {{ start.month }} using the embed feedback form
at the bottom of tutorials. Thank you everyone who submitted feedback!
</p>
<div class="fdbk">
<h2>Overall</h2>
<div class="row">
<!-- feedback over time -->
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">{{ fdbk | size }} responses</h5>
{% assign chart_id = 'allFdbkOverMonthGraph' %}
<canvas id="{{ chart_id }}" width="400" height="400">
</canvas>
</div>
</div>
</div>
<!-- feedback notes -->
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">Rating Distribution</h5>
{% assign chart_id = 'allFdbkNoteGraph' %}
<canvas id="{{ chart_id }}" width="400" height="400">
</canvas>
</div>
</div>
</div>
</div>
<h2>By topic</h2>
{% for tn in fdbk_by_topic %}
{% assign t_metadata = topics | where: "title",tn.name | first %}
{% assign topic_name = t_metadata['name'] %}
<h3 id="topic-{{ topic_name }}">{{ tn.name }} <a href="{{ site.baseurl }}/topics/{{ topic_name }}">{% icon galaxy_instance %}</a></h3>
<div class="row">
<!-- feedback over time -->
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">{{ tn.items | size }} responses</h5>
{% assign chart_id = topic_name | append: '-topic-fdbkOverMonthGraph' %}
<canvas id="{{ chart_id }}" width="400" height="400">
</canvas>
</div>
</div>
</div>
<!-- feedback notes -->
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">Rating Distribution</h5>
{% assign chart_id = topic_name | append: '-topic-fdbkNoteGraph' %}
<canvas id="{{ chart_id }}" width="400" height="400">
</canvas>
</div>
</div>
</div>
</div>
{% assign fdbk_by_tutorial = tn.items | group_by: 'tutorial' %}
<div class="accordion" id="accordion-{{ topic_name }}">
{% for tun in fdbk_by_tutorial %}
{% assign tuto_metadata = tutorials | where: "title",tun.name | first %}
{% assign tuto_name = tuto_metadata['dir'] | split: "/" | last %}
{% if tuto_name == '' %}
<div class="alert alert-warning" role="alert">
<p>Tutorial "{{ tun.name }}" is not available anymore.</p>
</div>
{% else %}
{% if tuto_metadata['name'] != 'tutorial.md' %}
{% assign lang = tuto_metadata['name'] | split: "." | first %}
{% assign tuto_name = tuto_name | append: lang %}
{% endif %}
<div class="accordion-card card" id="tutorial-{{ tuto_name }}">
<div class="card-header" id="heading-{{ tuto_name }}">
<div class="mb-0">
<button class="btn btn-link collapsed" type="button" data-toggle="collapse" data-target="#collapse-{{ tuto_name }}" aria-expanded="false" aria-controls="collapse-{{ tuto_name }}">
{{ tun.name }}
</button>
</div>
</div>
<div id="collapse-{{ tuto_name }}" class="collapse" aria-labelledby="heading-{{ tuto_name }}" data-parent="#accordion-{{ topic_name }}">
<div class="card-body">
{% if tuto_metadata.enable == false %}
<div class="alert alert-warning" role="alert">
<p>This tutorial is not listed in the topic pages.</p>
</div>
{% endif %}
<div class="row">
<!-- feedback over time -->
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">{{ tun.items | size }} responses</h5>
{% assign chart_id = tuto_name | append: '-tutorial-fdbkOverMonthGraph' %}
<canvas id="{{ chart_id }}" width="400" height="400">
</canvas>
</div>
</div>
</div>
<!-- feedback notes -->
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">Rating Distribution</h5>
{% assign chart_id = tuto_name | append: '-tutorial-fdbkNoteGraph' %}
<canvas id="{{ chart_id }}" width="400" height="400">
</canvas>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col">
<div class="card">
<div class="card-body">
<h5 class="card-title">Detailed feedback</h5>
<table class="table table-striped">
<thead>
<tr>
<th>Date</th>
<th>What did you like?</th>
<th>What could be improved?</th>
</tr>
</thead>
<tbody>
{% assign d_f = tun.items | reverse %}
{% for f in d_f %}
{% if f.anonymous != "yes" %}
{% if f.pro != null or f.con != null %}
<tr>
<td>{{ f.date | date: "%b %-d, %Y" }}</td>
<td>{{ f.pro | xml_escape }}</td>
<td>{{ f.con | xml_escape }}</td>
</tr>
{% endif %}
{% endif %}
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
{% endfor %}
</div>
</section>