js/ClusterAdministration.js

   1 /*global Proxmox*/
   2 Ext.define('pmg-cluster', {
   3     extend: 'Ext.data.Model',
   4     fields: [
   5         'type', 'name', 'ip', 'hostrsapubkey', 'rootrsapubkey',
   6         'fingerprint', { type: 'integer', name: 'cid' },
   7         { type: 'boolean', name: 'insync' },
   8         'memory', 'loadavg', 'uptime', 'rootfs', 'conn_error', 'level',
   9         { type: 'number', name: 'memory_per',
  10           calculate: function(data) {
  11               var mem = data.memory;
  12               return Ext.isObject(mem) ? mem.used/mem.total : 0;
  13           }
  14         },
  15         { type: 'number', name: 'rootfs_per',
  16           calculate: function(data) {
  17               var du = data.rootfs;
  18               return Ext.isObject(du) ? du.used/du.total : 0;
  19           }
  20         }
  21     ],
  22     proxy: {
  23         type: 'proxmox',
  24         url: "/api2/json/config/cluster/status"
  25     },
  26     idProperty: 'cid'
  27 });
  28
  29 Ext.define('PMG.ClusterJoinNodeWindow', {
  30     extend: 'Proxmox.window.Edit',
  31     xtype: 'pmgClusterJoinNodeWindow',
  32
  33     title: gettext('Cluster Join'),
  34
  35     width: 800,
  36
  37     method: 'POST',
  38
  39     url: '/config/cluster/join',
  40
  41     items: [
  42         {
  43             xtype: 'textfield',
  44             fieldLabel: 'IP Address',
  45             name: 'master_ip'
  46         },
  47         {
  48             xtype: 'textfield',
  49             inputType: 'password',
  50             fieldLabel: gettext('Password'),
  51             name: 'password'
  52         },
  53         {
  54             xtype: 'textfield',
  55             fieldLabel: gettext('Fingerprint'),
  56             name: 'fingerprint'
  57         }
  58     ]
  59 });
  60
  61 Ext.define('PMG.ClusterAddNodeWindow', {
  62     extend: 'Ext.window.Window',
  63     xtype: 'pmgClusterAddNodeWindow',
  64     mixins: ['Proxmox.Mixin.CBind'],
  65
  66     width: 800,
  67
  68     modal: true,
  69
  70     title: gettext('Cluster Join') + ' : ' + gettext('Information'),
  71
  72     ipAddress: undefined,
  73
  74     fingerprint: undefined,
  75
  76     items: [
  77         {
  78             xtype: 'component',
  79             border: false,
  80             padding: 10,
  81             html: gettext("Please use the 'Join' button on the node you want to add, using the following IP address and fingerprint.")
  82         },
  83         {
  84             xtype: 'container',
  85             layout: 'form',
  86             border: false,
  87             padding: '0 10 10 10',
  88             items: [
  89                 {
  90                     xtype: 'textfield',
  91                     fieldLabel: gettext('IP Address'),
  92                     cbind: { value: '{ipAddress}' },
  93                     editable: false
  94                 },
  95                 {
  96                     xtype: 'textfield',
  97                     fieldLabel: gettext('Fingerprint'),
  98                     cbind: { value: '{fingerprint}' },
  99                     editable: false
 100                 }
 101             ]
 102         }
 103     ]
 104 });
 105
 106 Ext.define('PMG.ClusterAdministration', {
 107     extend: 'Ext.tab.Panel',
 108     xtype: 'pmgClusterAdministration',
 109
 110     title: gettext('Cluster Administration'),
 111
 112     border: false,
 113     defaults: { border: false },
 114
 115     viewModel: {
 116         parent: null,
 117         data: {
 118             nodecount: 0,
 119             master: null
 120         }
 121     },
 122
 123     items: [
 124         {
 125             xtype: 'grid',
 126             title: gettext('Nodes'),
 127             controller: {
 128                 xclass: 'Ext.app.ViewController',
 129
 130                 init: function(view) {
 131                     view.store.on('load', this.onLoad, this);
 132                     Proxmox.Utils.monStoreErrors(view, view.getStore());
 133                 },
 134
 135                 onLoad: function(store, records, success) {
 136                     var vm = this.getViewModel();
 137                     if (!success || !records) {
 138                         return;
 139                     }
 140                     vm.set('nodecount', records.length);
 141
 142                     var master = null;
 143                     Ext.Array.each(records, function(ni) {
 144                         if (ni.data.type === 'master') {
 145                             master = ni;
 146                         }
 147                     });
 148                     vm.set('master', master);
 149                 },
 150
 151                 onCreate: function() {
 152                     var view = this.getView();
 153
 154                     Proxmox.Utils.API2Request({
 155                         url: '/config/cluster/create',
 156                         method: 'POST',
 157                         waitMsgTarget: view,
 158                         failure: function (response, opts) {
 159                             Ext.Msg.alert(gettext('Error'), response.htmlStatus);
 160                         },
 161                         success: function(response, options) {
 162                             var upid = response.result.data;
 163                             var win = Ext.create('Proxmox.window.TaskProgress', { upid: upid });
 164                             win.show();
 165                             win.on('destroy', function() { view.store.load(); });
 166                         }
 167                     });
 168                 },
 169
 170                 onJoin: function() {
 171                     var view = this.getView();
 172                     var win = Ext.create('PMG.ClusterJoinNodeWindow', {});
 173                     win.show();
 174                     win.on('destroy', function() {
 175                         // fixme: logout
 176                     });
 177                 },
 178
 179                 onAdd: function() {
 180                     var vm = this.getViewModel();
 181
 182                     var win = Ext.create('PMG.ClusterAddNodeWindow', {
 183                         ipAddress: vm.get('master').get('ip'),
 184                         fingerprint: vm.get('master').get('fingerprint')
 185                     });
 186
 187                     win.show();
 188                 }
 189             },
 190             store: {
 191                 autoLoad: true,
 192                 model: 'pmg-cluster'
 193             },
 194             tbar: [
 195                 {
 196                     text: gettext('Create'),
 197                     reference: 'createButton',
 198                     handler: 'onCreate',
 199                     bind: {
 200                         disabled: '{nodecount}'
 201                     }
 202                 },
 203                 {
 204                     text: gettext('Add'),
 205                     reference: 'addButton',
 206                     handler: 'onAdd',
 207                     bind: {
 208                         disabled: '{!master}'
 209                     }
 210                 },
 211                 {
 212                     text: gettext('Join'),
 213                     reference: 'joinButton',
 214                     handler: 'onJoin',
 215                     bind: {
 216                         disabled: '{nodecount}'
 217                     }
 218                 }
 219             ],
 220             columns: [
 221                 {
 222                     header: gettext('Node'),
 223                     width: 150,
 224                     dataIndex: 'name'
 225                 },
 226                 {
 227                     header: gettext('Role'),
 228                     width: 100,
 229                     dataIndex: 'type'
 230                 },
 231                 {
 232                     header: gettext('ID'),
 233                     width: 80,
 234                     dataIndex: 'cid'
 235                 },
 236                 {
 237
 238                     header: gettext('IP'),
 239                     width: 150,
 240                     dataIndex: 'ip'
 241                 },
 242                 {
 243                     header: gettext('State'),
 244                     width: 100,
 245                     renderer: function(value, metaData, record) {
 246                         var d = record.data;
 247                         var state = 'active';
 248                         if (!d.insync) state = 'syncing';
 249                         if (d.conn_error) {
 250                             metaData.tdCls = 'x-form-invalid-field';
 251                             var html = '<p>' +  Ext.htmlEncode(d.conn_error) + '</p>';
 252                             html = html.replace(/\n/g, '<br>');
 253                             metaData.tdAttr = 'data-qwidth=600 data-qtitle="ERROR" data-qtip="' +
 254                                 html.replace(/\"/g,'&quot;') + '"';
 255                             state = 'error';
 256                         }
 257                         return state;
 258                     },
 259                     dataIndex: 'insync'
 260                 },
 261                 {
 262                     header: gettext('Subscription'),
 263                     width: 120,
 264                     renderer: Proxmox.Utils.format_subscription_level,
 265                     dataIndex: 'level'
 266                 },
 267                 {
 268                     header: gettext('Uptime'),
 269                     width: 150,
 270                     renderer: Proxmox.Utils.render_uptime,
 271                     dataIndex: 'uptime'
 272                 },
 273                 {
 274                     header: gettext('Load average'),
 275                     renderer: function(value) {
 276                         if (Ext.isArray(value)) {
 277                             return value[0];
 278                         }
 279                         return value;
 280                     },
 281                     dataIndex: 'loadavg'
 282                 },
 283                 {
 284                     xtype: 'widgetcolumn',
 285                     widget: {
 286                         xtype: 'progressbarwidget',
 287                         textTpl: '{value:percent}'
 288                     },
 289                     header: gettext('RAM usage'),
 290                     dataIndex: 'memory_per'
 291                 },
 292                 {
 293                     xtype: 'widgetcolumn',
 294                     widget: {
 295                         xtype: 'progressbarwidget',
 296                         textTpl: '{value:percent}'
 297                     },
 298                     header: gettext('HD space'),
 299                     dataIndex: 'rootfs_per'
 300                 }
 301             ]
 302         }
 303     ]
 304 });