utils: updateColumnWidth: allow overriding tresholdWidth and make that more general

[proxmox-widget-toolkit.git] / src / Utils.js

diff --git a/src/Utils.js b/src/Utils.js
index 1dd2098dddc8729c32c23b209b06220ff4d6ae87..546cd64339e77da34b035963fe7b63bcaf243368 100644 (file)
--- a/src/Utils.js
+++ b/src/Utils.js
@@ -238,6 +238,30 @@ utilities: {
        return min < width ? width : min;
     },
 
+    // returns username + realm
+    parse_userid: function(userid) {
+       if (!Ext.isString(userid)) {
+           return [undefined, undefined];
+       }
+
+       let match = userid.match(/^(.+)@([^@]+)$/);
+       if (match !== null) {
+           return [match[1], match[2]];
+       }
+
+       return [undefined, undefined];
+    },
+
+    render_username: function(userid) {
+       let username = Proxmox.Utils.parse_userid(userid)[0] || "";
+       return Ext.htmlEncode(username);
+    },
+
+    render_realm: function(userid) {
+       let username = Proxmox.Utils.parse_userid(userid)[1] || "";
+       return Ext.htmlEncode(username);
+    },
+
     getStoredAuth: function() {
        let storedAuth = JSON.parse(window.localStorage.getItem('ProxmoxUser'));
        return storedAuth || {};
@@ -279,6 +303,16 @@ utilities: {
        window.localStorage.removeItem("ProxmoxUser");
     },
 
+    // The End-User gets redirected back here after login on the OpenID auth. portal, and in the
+    // redirection URL the state and auth.code are passed as URL GET params, this helper parses those
+    getOpenIDRedirectionAuthorization: function() {
+       const auth = Ext.Object.fromQueryString(window.location.search);
+       if (auth.state !== undefined && auth.code !== undefined) {
+           return auth;
+       }
+       return undefined;
+    },
+
     // comp.setLoading() is buggy in ExtJS 4.0.7, so we
     // use el.mask() instead
     setErrorMask: function(comp, msg) {
@@ -510,7 +544,7 @@ utilities: {
        });
     },
 
-    updateColumnWidth: function(container) {
+    updateColumnWidth: function(container, tresholdWidth) {
        let mode = Ext.state.Manager.get('summarycolumns') || 'auto';
        let factor;
        if (mode !== 'auto') {
@@ -519,7 +553,8 @@ utilities: {
                factor = 1;
            }
        } else {
-           factor = container.getSize().width < 1600 ? 1 : 2;
+           tresholdWidth = (tresholdWidth || 1400) + 1;
+           factor = Math.ceil(container.getSize().width / tresholdWidth);
        }
 
        if (container.oldFactor === factor) {
@@ -540,6 +575,9 @@ utilities: {
        container.updateLayout();
     },
 
+    // NOTE: depreacated, use updateColumnWidth
+    updateColumns: container => Proxmox.Utils.updateColumnWidth(container),
+
     dialog_title: function(subject, create, isAdd) {
        if (create) {
            if (isAdd) {
@@ -608,14 +646,22 @@ utilities: {
        return text;
     },
 
-    format_size: function(size) {
-       let units = ['', 'Ki', 'Mi', 'Gi', 'Ti', 'Pi', 'Ei', 'Zi', 'Yi'];
-       let num = 0;
-       while (size >= 1024 && num++ <= units.length) {
-           size = size / 1024;
+    format_size: function(size, useSI) {
+       let units = ['', 'K', 'M', 'G', 'T', 'P', 'E', 'Z', 'Y'];
+       let order = 0;
+       const baseValue = useSI ? 1000 : 1024;
+       while (size >= baseValue && order < units.length) {
+           size = size / baseValue;
+           order++;
        }
 
-       return size.toFixed(num > 0?2:0) + " " + units[num] + "B";
+       let unit = units[order], commaDigits = 2;
+       if (order === 0) {
+           commaDigits = 0;
+       } else if (!useSI) {
+           unit += 'i';
+       }
+       return `${size.toFixed(commaDigits)} ${unit}B`;
     },
 
     render_upid: function(value, metaData, record) {
@@ -855,7 +901,7 @@ utilities: {
        return value;
     },
 
-    render_usage: val => (val*100).toFixed(2) + '%',
+    render_usage: val => (val * 100).toFixed(2) + '%',
 
     render_cpu_usage: function(val, max) {
        return Ext.String.format(
@@ -865,13 +911,13 @@ utilities: {
        );
     },
 
-    render_size_usage: function(val, max) {
+    render_size_usage: function(val, max, useSI) {
        if (max === 0) {
            return gettext('N/A');
        }
-       return (val*100/max).toFixed(2) + '% (' +
-           Ext.String.format(gettext('{0} of {1}'),
-           Proxmox.Utils.render_size(val), Proxmox.Utils.render_size(max)) + ')';
+       let fmt = v => Proxmox.Utils.format_size(v, useSI);
+       let ratio = (val * 100 / max).toFixed(2);
+       return ratio + '% (' + Ext.String.format(gettext('{0} of {1}'), fmt(val), fmt(max)) + ')';
     },
 
     render_cpu: function(value, metaData, record, rowIndex, colIndex, store) {
@@ -1069,34 +1115,40 @@ utilities: {
        return acme;
     },
 
-    updateColumns: function(container) {
-       let mode = Ext.state.Manager.get('summarycolumns') || 'auto';
-       let factor;
-       if (mode !== 'auto') {
-           factor = parseInt(mode, 10);
-           if (Number.isNaN(factor)) {
-               factor = 1;
-           }
-       } else {
-           factor = container.getSize().width < 1400 ? 1 : 2;
+    get_health_icon: function(state, circle) {
+       if (circle === undefined) {
+           circle = false;
        }
 
-       if (container.oldFactor === factor) {
-           return;
+       if (state === undefined) {
+           state = 'uknown';
        }
 
-       let items = container.query('>'); // direct childs
-       factor = Math.min(factor, items.length);
-       container.oldFactor = factor;
+       var icon = 'faded fa-question';
+       switch (state) {
+           case 'good':
+               icon = 'good fa-check';
+               break;
+           case 'upgrade':
+               icon = 'warning fa-upload';
+               break;
+           case 'old':
+               icon = 'warning fa-refresh';
+               break;
+           case 'warning':
+               icon = 'warning fa-exclamation';
+               break;
+           case 'critical':
+               icon = 'critical fa-times';
+               break;
+           default: break;
+       }
 
-       items.forEach((item) => {
-           item.columnWidth = 1 / factor;
-       });
+       if (circle) {
+           icon += '-circle';
+       }
 
-       // we have to update the layout twice, since the first layout change
-       // can trigger the scrollbar which reduces the amount of space left
-       container.updateLayout();
-       container.updateLayout();
+       return icon;
     },
 },