Skip to content

Commit

Permalink
wip: update system dashboard
Browse files Browse the repository at this point in the history
  • Loading branch information
@gabriel-aires
gabriel-aires committed Apr 20, 2022
1 parent c5e6949 commit e3929b6
Show file tree
Hide file tree
Showing 3 changed files with 91 additions and 81 deletions.
Binary file modified dist/ecmo-linux-x64.bin
View file
Binary file not shown.
166 changes: 85 additions & 81 deletions src/views/dashboard.cr
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,100 +2,104 @@
[:h3, "System Information for #{host[:name]}"],

[:details,
[:summary, {class: "btn solid #{tone}"}, "Machine Info"],
[:table,
[:tr,
[:th, "OS"],
[:td, host[:os]]],
[:tr,
[:th, "Architecture"],
[:td, host[:arch]]],
[:tr,
[:th, "Uptime"],
[:td, host[:uptime]]],
[:tr,
[:th, "Boot Time"],
[:td, Time.new(seconds: boot[:seconds], nanoseconds: 0, location: Time.local.location).to_s]]]],
[:summary, {class: "gra-btn gra-btn-full-width gra-btn-#{tone}"}, "Machine Info"],
[:div, {class: "gra-table-wrapper"},
[:table, {class: "gra-table"},
[:tr,
[:th, "OS"],
[:td, host[:os]]],
[:tr,
[:th, "Architecture"],
[:td, host[:arch]]],
[:tr,
[:th, "Uptime"],
[:td, host[:uptime]]],
[:tr,
[:th, "Boot Time"],
[:td, Time.new(seconds: boot[:seconds], nanoseconds: 0, location: Time.local.location).to_s]]]]],

[:br],

[:details,
[:summary, {class: "btn solid #{tone}"}, "Hardware Resources"],
[:table, {role: "grid"},
[:tr,
[:th, "Total Memory (Mb)"],
[:td, memory[:total_mb]]],
[:tr,
[:th, "Used Memory (Mb)"],
[:td, memory[:used_mb]]],
[:tr,
[:th, "Free Memory (Mb)"],
[:td, memory[:free_mb]]],
[:tr,
[:th, "Load (1m)"],
[:td, load[:load1]]],
[:tr,
[:th, "Load (5m)"],
[:td, load[:load5]]],
[:tr,
[:th, "Load (15m)"],
[:td, load[:load15]]]]],
[:summary, {class: "gra-btn gra-btn-full-width gra-btn-#{tone}"}, "Hardware Resources"],
[:div, {class: "gra-table-wrapper"},
[:table, {class: "gra-table"},
[:tr,
[:th, "Total Memory (Mb)"],
[:td, memory[:total_mb].to_s]],
[:tr,
[:th, "Used Memory (Mb)"],
[:td, memory[:used_mb].to_s]],
[:tr,
[:th, "Free Memory (Mb)"],
[:td, memory[:free_mb].to_s]],
[:tr,
[:th, "Load (1m)"],
[:td, load[:load1].to_s]],
[:tr,
[:th, "Load (5m)"],
[:td, load[:load5].to_s]],
[:tr,
[:th, "Load (15m)"],
[:td, load[:load15].to_s]]]]],

[:br],

[:details,
[:summary, {class: "btn solid #{tone}"}, "Net I/O"],
[:table, {role: "grid"},
[:tr,
[:th, "Upload (Mb)"],
[:td, net[:sent_mb]]],
[:tr,
[:th, "Download (Mb)"],
[:td, net[:received_mb]]],
[:tr,
[:th, "Packets Received"],
[:td, net[:packets_in]]],
[:tr,
[:th, "Packets Sent"],
[:td, net[:packets_out]]]]],
[:summary, {class: "gra-btn gra-btn-full-width gra-btn-full-#{tone}"}, "Net I/O"],
[:div, {class: "gra-table-wrapper"},
[:table, {class: "gra-table"},
[:tr,
[:th, "Upload (Mb)"],
[:td, net[:sent_mb].to_s]],
[:tr,
[:th, "Download (Mb)"],
[:td, net[:received_mb].to_s]],
[:tr,
[:th, "Packets Received"],
[:td, net[:packets_in].to_s]],
[:tr,
[:th, "Packets Sent"],
[:td, net[:packets_out].to_s]]]]],

[:h3, "Disk Details"],

disks.sort_by {|d| d[:usage].to_f}.reverse.map do |disk|

[:div,

[:details,
[:summary, {class: "btn solid #{tone}"},
[:div, {class: "grid", style: "width:95%; display: inline-block; vertical-align:bottom;"},
[:div, {class: "col-1-4 align-left"}, "Mountpoint #{disk[:mount]}"],
[:div, {class: "col-3-4 align-right"},
[:progress,
{ value: disk[:usage],
max: "100",
style: "width:85%;margin-top:0.4rem;vertical-align:top;" }]]]],

[:table, {role: "grid"},
[:tr,
[:th, "Filesystem type"],
[:td, disk[:fstype]]],
[:tr,
[:th, "Device"],
[:td, disk[:device]]],
[:tr,
[:th, "Size (Mb)"],
[:td, disk[:size_mb]]],
[:tr,
[:th, "Used (Mb)"],
[:td, disk[:used_mb]]],
[:tr,
[:th, "Free (Mb)"],
[:td, disk[:free_mb]]],
[:tr,
[:th, "Usage (%)"],
[:td, disk[:usage]]]],

[:br]]]
accent = case disk[:usage].to_f
when .<= 25.0 then "blue"
when .<= 50.0 then "green"
when .<= 75.0 then "yellow"
else "red"
end

offset = 100.0 - disk[:usage].to_f

[:details, {class: "gra-dropdown gra-#{accent}-color gra-mg-all-s gra-inline-block"},
[:summary, {class: "gra-dropdown-wrapper"},
[:h5, {class: "gra-block gra-thin-text gra-center-text gra-pd-all-s"}, disk[:mount]],
[:span, {class: "gra-block gra-progress-bar"},
[:span, {class: "gra-progress-bar-value #{accent}", style: "transform: translateX(-#{offset}%);"}]]],

[:ul, {class: "gra-dropdown-list gra-block-list"},
[:li, {class: "gra-dropdown-list-item gra-list-item"},
[:span, {class: "gra-bold-text"}, "Filesystem type: "],
[:span, disk[:fstype]]],
[:li, {class: "gra-dropdown-list-item gra-list-item"},
[:span, {class: "gra-bold-text"}, "Device: "],
[:span, disk[:device]]],
[:li, {class: "gra-dropdown-list-item gra-list-item"},
[:span, {class: "gra-bold-text"}, "Size (Mb): "],
[:span, disk[:size_mb].to_s]],
[:li, {class: "gra-dropdown-list-item gra-list-item"},
[:span, {class: "gra-bold-text"}, "Used (Mb): "],
[:span, disk[:used_mb].to_s]],
[:li, {class: "gra-dropdown-list-item gra-list-item"},
[:span, {class: "gra-bold-text"}, "Free (Mb): "],
[:span, disk[:free_mb].to_s]],
[:li, {class: "gra-dropdown-list-item gra-list-item"},
[:span, {class: "gra-bold-text"}, "Usage (%): "],
[:span, disk[:usage].to_s]]]]

end ,

Expand Down
6 changes: 6 additions & 0 deletions src/views/layout.cr
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,12 @@
color: rgb(245, 242, 240);
text-shadow: black 0px 1px;
}
summary, .gra-dropdown-list {
box-shadow: 0 0 0.2rem;
border-radius: 0.2rem;
width: 20rem;
cursor: pointer;
}
CSS
]],

Expand Down

0 comments on commit e3929b6

Please sign in to comment.