xNightR00T File Manager

<?php
/**
 * Copyright © 2015 Magento. All rights reserved.
 * See COPYING.txt for license details.
 */
$tableParams = [
    'tableId' => 'mage2-observers-tree',
    'tableWidth' => '3-wide',
    'summaryTableId' => 'mage2-observers-summary-table',
    'summaryTableWidth' => '1-narrow',
];
?>

<?php echo $this->zrayTable($tableParams); //zrayTableHtml ?>

<script type="text/javascript">
    (function () {
        var storage = zray.getStorage('observers');
        // create main table
        var maintable = zray.createGeneralTreeTable(storage, jQuery('#<?php echo $tableParams['tableId']; ?>'));
        maintable.setColumns([
            {
                label: 'Area',
                propertyName: 'area',
                sortable: true,
                width: 90
            },
            {
                label: 'Event',
                propertyName: 'event',
                sortable: true,
                width: '25%'
            },
            {
                label: 'Observer',
                propertyName: 'observer',
                sortable: true,
                width: '20%',
                getHtml: function (val, rec) {
                    var cushion = $zendDevBar('<div>');
                    cushion.attr('title', val);
                    return cushion.text(val);
                }
            },
            {
                label: 'Class',
                propertyName: 'class',
                sortable: true,
                getHtml: function (val, rec) {
                    if (rec.method) {
                        val = val + '::' + rec.method;
                    }
                    if (!val || !rec.classFile || rec.classFile.length < 5 || !zray.getFileActions || !zray.showInIde) {
                        return val;
                    }
                    var showInIDEParams = {
                        filePath: rec.classFile,
                        line: rec.methodLine || 1,
                        fullUrl: document.location.href
                    };
                    return zray.getFileActions(val, val, rec.classFile, showInIDEParams);
                }
            }
        ]);
        // create main table - end

        var summaryTable = zray.createSummaryTable(storage, jQuery('#<?php echo $tableParams['summaryTableId']; ?>'));

        // set the columns structure
        summaryTable.setColumns([
            {
                label: '',
                propertyName: 'area',
                width: '10%',
                getHtml: function (value, record) {
                    return summaryTable.createCheckboxColumn(value, record, summaryTable);
                }
            },
            {
                label: 'Area',
                propertyName: 'area',
                width: '80%',
            },
            {
                label: 'Count',
                propertyName: 'count',
                width: '10%',
                attributes: {'class': 'zdb-numerical'},
                getHtml: function (val) {
                    return '(' + val + ')';
                }
            }
        ]);

        // set by which column the user choice will filter
        summaryTable.setFilterColumn('area');

        // set callback function to create the table rows from all the data
        // return an array of rows, with columns that match to setColumns
        summaryTable.setUpdateCallback(function (data) {
            if (!data) return [];

            var aggregated = {};
            $zendDevBar.each(data, function (key, observer) {
                if (aggregated[observer.area]) {
                    aggregated[observer.area]++;
                } else {
                    aggregated[observer.area] = 1;
                }
            });

            if (Object.keys(aggregated).length == 0) {
                return [];
            }

            var normalized = [];
            normalized.push({
                'area': 'All', 'count': jQuery.map(aggregated, function (v) {
                    return v
                }).reduce(function (acc, item) {
                    return acc += item
                })
            });

            return normalized.concat($zendDevBar.map(aggregated, function (count, area) {
                return {'area': area, 'count': count};
            }));
        });
        // create summary table - end

        // create pager
        zray.createPager(storage, jQuery('#magento-observers-pager'));
        // create search
        zray.createSearch(storage, jQuery('#magento-observers-search'), maintable);

        zray.registerDataHandler('Magento2', 'observers', function (extensionData, requestData) {
            storage.setData(extensionData[0].observers);
            zray.updateMenuTitle('Magento2', 'observers', 'Observers (' + extensionData[0].observers.length + ')');
        });

    })();
</script>