Ext.define('pbs-data-store-content', {
    extend: 'Ext.data.Model',
    fields: [
	'backup-type',
	'backup-id',
	{
	    name: 'backup-time',
	    type: 'date',
	    dateFormat: 'timestamp'
	},
	'files',
	{ name: 'size', type: 'int' },
	{
	    name: 'backup-group',
	    calculate: function (data) {
		return data["backup-type"] + '/' + data["backup-id"];
	    }
	},
    ],
});

Ext.define('PBS.DataStoreContent', {
    extend: 'Ext.tree.Panel',
    alias: 'widget.pbsDataStoreContent',

    rootVisible: false,

    controller: {
	xclass: 'Ext.app.ViewController',

	init: function(view) {
	    if (!view.datastore) {
		throw "no datastore specified";
	    }

	    this.data_store = Ext.create('Ext.data.Store', {
		model: 'pbs-data-store-content',
		sorters: 'backup-group',
		groupField: 'backup-group',
	    });

	    view.title = gettext('Data Store Content: ') + view.datastore;

	    Proxmox.Utils.monStoreErrors(view, view.store, true);
	    this.reload(); // initial load
	},

	reload: function() {
	    var view = this.getView();

	    let url = `/api2/json/admin/datastore/${view.datastore}/snapshots`;
	    this.data_store.setProxy({
		type: 'proxmox',
		url:  url
	    });


	    this.data_store.load(function(records, operation, success) {
		console.log('loaded records');

		let groups = {};

		records.forEach(function(item) {
		    var btype = item.data["backup-type"];
		    let group = btype + "/" + item.data["backup-id"];

		    if (groups[group] !== undefined)
			return;

		    var cls = '';
		    if (btype === 'vm') {
			cls = 'fa-desktop';
		    } else if (btype === 'ct') {
			cls = 'fa-cube';
		    } else if (btype === 'host') {
			cls = 'fa-building';
		    } else {
			return btype + '/' + value;
		    }

		    groups[group] = {
			text: group,
			leaf: false,
			iconCls: "fa " + cls,
			expanded: false,
			children: []
		    };
		});

		records.forEach(function(item) {
		    console.log(item);

		    let group = item.data["backup-type"] + "/" + item.data["backup-id"];
		    let children = groups[group].children;

		    let data = item.data;
		    data.text = Ext.Date.format(data["backup-time"], 'Y-m-d H:i:s');
		    data.leaf = true;

		    children.push(data);
		});

		let children = [];
		Ext.Object.each(groups, function(key, group) {
		    let last_backup = 0;
		    group.children.forEach(function(item) {
			if (item["backup-time"] > last_backup) {
			    last_backup = item["backup-time"];
			    group["backup-time"] = last_backup;
			    group.files = item.files;
			    group.size = item.size;
			}
		    });
		    group.count = group.children.length;
		    children.push(group)
		})

		view.setRootNode({
		    expanded: true,
		    children: children
		});

	    });

	},
    },

    initComponent: function() {
	var me = this;

	var render_backup_type = function(value, metaData, record) {
	    var btype = record.data["backup-type"];
	    var cls = '';
	    if (btype === 'vm') {
		cls = 'fa-desktop';
	    } else if (btype === 'ct') {
		cls = 'fa-cube';
	    } else if (btype === 'host') {
		cls = 'fa-building';
	    } else {
		return btype + '/' + value;
	    }
	    var fa = '<i class="fa fa-fw x-grid-icon-custom ' + cls  + '"></i> ';
	    return fa + value;
	};

	Ext.apply(me, {
	    columns: [
		{
		    xtype: 'treecolumn',
		    header: gettext("Backup Group"),
		    dataIndex: 'text',
		    flex: 1
		},
		{
		    xtype: 'datecolumn',
		    header: gettext('Backup Time'),
		    sortable: true,
		    dataIndex: 'backup-time',
		    format: 'Y-m-d H:i:s',
		    width: 150
		},
		{
		    header: gettext("Size"),
		    sortable: true,
		    dataIndex: 'size',
		    renderer: Proxmox.Utils.format_size,
		},
		{
		    xtype: 'numbercolumn',
		    format: '0',
		    header: gettext("Count"),
		    sortable: true,
		    dataIndex: 'count',
		},
		{
		    header: gettext("Files"),
		    sortable: false,
		    dataIndex: 'files',
		    flex: 4
		}
	    ],

	    tbar: [
		{
		    text: gettext('Reload'),
		    iconCls: 'fa fa-refresh',
		    handler: 'reload',
		},
	    ],
	});

	me.callParent();
    },
});