New metric boxes

frontend/js/helpers/config.js.example

@@ -20,66 +20,80 @@ const TOTAL_CHART_BOTTOM_TITLE = 'Total energy consumption';
 const TOTAL_CHART_BOTTOM_LABEL = 'Machine Energy';
 // function must return boolean
 const total_chart_bottom_condition = (metric) => {
-    if(metric.match(/^.*_energy.*_machine$/) !== null) return true;
-    return false;
+    return metric.match(/^.*_energy.*_machine$/) !== null;
 }
 
 // title and filter function for the top left most chart in the Detailed Metrics / Compare view
 const TOP_BAR_CHART_TITLE = 'Energy metrics'
 const top_bar_chart_condition = (metric) => {
-    if(metric.indexOf('_energy_') !== -1) return true;
-    return false;
+    return metric.indexOf('_energy_') !== -1;
 }
 
 // title and filter function for the top right radar chart in the Detailed Metrics / Compare view
 const RADAR_CHART_TITLE = 'General component distribution'
 const radar_chart_condition = (metric) => {
-    if(metric.indexOf('cpu_frequency_sysfs_core') == -1) return true;
-    return false;
+    return metric.indexOf('cpu_frequency_sysfs_core') == -1;
 }
 
 // filter function for the CO₂ calculations in the Detailed Metrics
 // please note that this metric must be unique per phase
 const phase_time_metric_condition = (metric) => {
-    if(metric == 'phase_time_syscall_system') return true;
-    return false;
+    return metric == 'phase_time_syscall_system';
 }
 
 const psu_machine_carbon_metric_condition = (metric) => {
-    if(metric.match(/^psu_carbon_.*_machine$/) !== null) return true;
-    return false;
+    return metric.match(/^psu_carbon_.*_machine$/) !== null;
 }
 
 const network_carbon_metric_condition = (metric) => {
-    if(metric == 'network_carbon_formula_global') return true;
-    return false;
+    return metric == 'network_carbon_formula_global';
 }
 
 const network_energy_metric_condition = (metric) => {
-    if(metric == 'network_energy_formula_global') return true;
-    return false;
+    return metric == 'network_energy_formula_global';
+}
+
+const network_io_metric_condition = (metric) => {
+    return metric == 'network_io_cgroup_container';
 }
 
 const machine_power_metric_condition = (metric) => {
-    if(metric.match(/^.*_power_.*_machine$/) !== null) return true;
-    return false;
+   return metric.match(/^.*_power_.*_machine$/) !== null;
 }
 
 const machine_energy_metric_condition = (metric) => {
-    if(metric.match(/^.*_energy_.*_machine$/) !== null) return true;
-    return false;
+    return metric.match(/^.*_energy_.*_machine$/) !== null;
 }
 
 const sci_metric_condition = (metric) => {
-    if(metric == 'software_carbon_intensity_global') return true;
-    return false;
+    return metric == 'software_carbon_intensity_global';
 }
 
 const embodied_carbon_share_metric_condition = (metric) => {
-    if(metric == 'embodied_carbon_share_machine') return true;
-    return false;
+    return metric == 'embodied_carbon_share_machine'
 }
 
+/*
+    Here you can define the ordering of the information cards shown in the detail view
+    You can also remove some if you want or change the icon. The name will be changed when the values are written
+    detail name defined in METRIC_MAPPINGS
+*/
+const HARDWARECARDS = [
+    { key: 'cpu', name: 'CPU', icon: 'microchip',  variable:true },
+    { key: 'gpu', name: 'GPU', icon: 'camera retro',  variable:true  },
+    { key: 'dram', name: 'DRAM', icon: 'memory',  variable:true },
+    { key: 'disk', name: 'Disk', icon: 'hdd',  variable:true  },
+    { key: 'machine', name: 'Machine', icon: 'server',  variable:true },
+];
+
+const EXTRACARDS = [
+    { key: 'runtime', name: 'Phase Duration', icon: 'hourglass half', variable:false },
+    { key: 'network-data', name: 'Data Transferred', icon: 'exchange', variable:false },
+    { key: 'network', name: 'Network', icon: 'sitemap', variable:true },
+    { key: 'embodied-carbon', name: 'Embodied Carbon', icon: 'industry', variable:false },
+    { key: 'sci', name: 'SCI', icon: 'leaf', variable:false },
+];
+
 /*
     Here you can statically define the badges that shall be shown in the timeline view
     although this could also be done dynamically it would be a slightly more heavy lifting for the database and only reflect the latest run.
@@ -246,6 +260,11 @@ METRIC_MAPPINGS = {
         "source": "Formula",
         "explanation": "Estimated external energy cost for network infrastructure."
     },
+    "network_power_formula_global": {
+        "clean_name": "Network Transmission",
+        "source": "Formula",
+        "explanation": "Estimated external energy cost for network infrastructure."
+    },
     "network_carbon_formula_global": {
         "clean_name": "Network Transmission CO₂",
         "source": "Formula",