<?php
echo '<h4 style="margin-left: 30px;">UP 2018 - Stand: ' . $time->i18nFormat('dd.MM.yyyy HH:mm') . '</h4>';
?>

<script type="text/javascript">

    $(function(){
        $.getJSON("/asd-control/files/data-up.json", function(mps) {           
            $("#output").pivotUI(mps, {
                rows: ["Schulart"],
                cols: ["Übermittlungsstatus"],
                autoSortUnusedAttrs: true,
                sorters:{
                 Übermittlungsstatus: $.pivotUtilities.sortAs(
                    ["n. überm. (kein Liefervers.)", "Schulaufs. abgelehnt", "übermittelt (PL-Fehler)", "n. überm. (Lieferversuch)" ,  "übermittelt (keine PL-Fehler)", "abgegeben", "Schulaufs. freigegeben"]
                )},
                rendererOptions: {
                    table: {
                        clickCallback: function(e, value, filters, pivotData){
                            console.log(filters);
                            if (typeof(filters.Schulart) == "undefined") {
                                Schulart = "Alle";
                            }
                            else {
                                Schulart = filters.Schulart;
                            }
                            if (typeof(filters.Übermittlungsstatus) == "undefined") {
                                Übermittlungsstatus = "Alle";
                            }
                            else {
                                Übermittlungsstatus = filters.Übermittlungsstatus;
                            }
                            $( "#heading").html('<table class="result"><tr><td>Schulart</td><td>Übermittlungsstatus</td></tr><tr><td>' + Schulart + '</td><td>' + Übermittlungsstatus + '</td></tr></table');
                            var names = [];
                            pivotData.forEachMatchingRecord(filters,
                                function(record){ names.push(record.Schule + ' (' + record.Datum.substring(0,10) + ')'); });
                            //alert(pivotData.getColKeys());
                            //alert(pivotData.colKeys);
                            //pivotData.colKeys.push('Hallo');
                            //alert(pivotData.colKeys);
                            //pivotData.applyFilter();
                            //alert(names.join("\n"));
                            list = '<ul>';
                            $.each(names, function() {
                                list += '<li>' + this + '</li>';
                            });
                            list += '</ul>';
                            $( "#schools" ).html(list);
                        }
                    }
                }           
            });
        });
     });
     
</script>

<div id="output" style="margin-left: 30px;"></div>
<p id="heading" style="margin-left: 30px;font-weight: bold;"><p>
<div id="schools" style="margin-left: 30px;"></div>  