Skip to content

Instantly share code, notes, and snippets.

@microraptor
Last active August 4, 2018 23:19
Show Gist options
  • Save microraptor/17e6665493cd1a225c293b61373d01ef to your computer and use it in GitHub Desktop.
Save microraptor/17e6665493cd1a225c293b61373d01ef to your computer and use it in GitHub Desktop.
This bash script displays information and a percentage bar of a defined quota. The total, unit and source of the used quota has to be defined in the file. quota.html takes the used quota from a file with only a number in the same directory.
#!/usr/bin/env bash
#######################################
# This script displays information and a percentage bar of a defined quota.
# The total, unit and source of the used quota has to be defined below.
# Color output and a GUI notification can be enabled.
# License: MIT
#######################################
# Unofficial strict mode
set -euo pipefail
IFS=$'\n\t'
# --help flag
if expr "$*" : ".*--help" > /dev/null; then
echo 'Usage: quota'
echo 'Display information of a defined quota'
echo 'Edit this bash script for configuration'
exit 0
fi
### SETUP ###
# Define the 'used' variable below, which holds the amount used of the total quota.
readonly used=$(du -sB GB "$HOME/" | cut -d G -f1)
#Another example: readonly used=$(curl --location --silent --show-error http://${SERVER}/${USERNAME}/quota)
readonly TOTAL=1000
readonly UNIT='GB'
readonly ENABLE_NOTIFICATION=false
readonly ENABLE_COLOR=true
readonly COLOR_SECTIONS=(85 95 100)
readonly COLORS=("$(echo -en '\e[00;32m')" "$(echo -en '\e[00;33m')" "$(echo -en '\e[00;35m')" "$(echo -en '\e[00;31m')")
readonly COLOR_GRAY=$(echo -en '\e[01;30m')
readonly COLOR_RESTORE=$(echo -en '\e[0m')
readonly SMILEYS=(':)' ':|' ':/' ':( WARNING!')
readonly SEPERATOR=' | '
### CALCULATIONS ###
# bc used below in a way that rounds the numbers correctly
percentage=$(echo "scale=1; ( ($used) * 100 + 0.05 * ($TOTAL) ) / ($TOTAL)" | bc)
percentage_int=$(echo "( ($used) * 100 + 0.5 * ($TOTAL) ) / ($TOTAL)" | bc)
percentage_blocks=$(echo "( ($percentage) + 0.5) / 2" | bc)
if [ "$percentage_blocks" -gt 50 ]; then
percentage_blocks=50
fi
section_index=1
while [ $section_index -le ${#COLOR_SECTIONS[@]} ]; do
if [ "${COLOR_SECTIONS[$section_index]}" -le "$percentage_int" ]; then
section_index=$((section_index + 1))
else
break
fi
done
readonly color=${COLORS[$section_index]}
bar="["
bar_color="[${color}"
for _ in $(seq $percentage_blocks); do
bar="${bar}="
bar_color="${bar_color}="
done
bar_color="${bar_color}${COLOR_GRAY}"
for _ in $(seq $((50 - percentage_blocks))); do
bar="${bar}-"
bar_color="${bar_color}-"
done
bar="${bar}]"
bar_color="${bar_color}${COLOR_RESTORE}]"
### OUTPUT ###
status="${TOTAL}${UNIT} total${SEPERATOR}\
${used}${UNIT} used${SEPERATOR}\
$((TOTAL - used - 1))${UNIT} free${SEPERATOR}\
${percentage}%${SEPERATOR}\
${SMILEYS[$section_index]}"
status_color="${color}${TOTAL}${COLOR_RESTORE}${UNIT} total${COLOR_GRAY}${SEPERATOR}\
${color}${used}${COLOR_RESTORE}${UNIT} used${COLOR_GRAY}${SEPERATOR}\
${color}$((TOTAL - used - 1))${COLOR_RESTORE}${UNIT} free${COLOR_GRAY}${SEPERATOR}\
${color}${percentage}${COLOR_RESTORE}%${COLOR_GRAY}${SEPERATOR}\
${color}${SMILEYS[$section_index]}${COLOR_RESTORE}"
if $ENABLE_COLOR; then
echo "$status_color"
echo "$bar_color"
else
echo "$status"
echo "$bar"
fi
if $ENABLE_NOTIFICATION; then
notify-send -u low "$status" "$bar"
fi
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Quota">
<title>Quota</title>
<link href="https://fonts.googleapis.com/css?family=VT323" rel="stylesheet">
<style>
html, body {
height: 90%;
}
body {
display: flex;
align-items: center;
justify-content: center;
font-family: 'VT323', monospace;
font-size: 24px;
color: #C0C0C0;
text-shadow: 0 0 5px #0000001A, 0 1px 3px #00000050, 0 3px 5px #00000030, 0 5px 1px #0000001A, 0 5px 10px #00000040, 0 10px 10px #00000030;
background-color: #303030;
background-image: url("data:image/svg+xml,%3Csvg width='84' height='48' viewBox='0 0 84 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h12v6H0V0zm28 8h12v6H28V8zm14-8h12v6H42V0zm14 0h12v6H56V0zm0 8h12v6H56V8zM42 8h12v6H42V8zm0 16h12v6H42v-6zm14-8h12v6H56v-6zm14 0h12v6H70v-6zm0-16h12v6H70V0zM28 32h12v6H28v-6zM14 16h12v6H14v-6zM0 24h12v6H0v-6zm0 8h12v6H0v-6zm14 0h12v6H14v-6zm14 8h12v6H28v-6zm-14 0h12v6H14v-6zm28 0h12v6H42v-6zm14-8h12v6H56v-6zm0-8h12v6H56v-6zm14 8h12v6H70v-6zm0 8h12v6H70v-6zM14 24h12v6H14v-6zm14-8h12v6H28v-6zM14 8h12v6H14V8zM0 8h12v6H0V8z' fill='%23404040' fill-opacity='0.2' fill-rule='evenodd'/%3E%3C/svg%3E");
/* Background Pattern by Steve Schoger www.heropatterns.com */
}
main {
width: auto;
text-align: center;
}
.status, .smiley {
font-size: 48px;
}
.gray {
color: #606060;
}
.color-0 {
color: #30C060;
}
.color-1 {
color: #C0C030;
}
.color-2 {
color: #C06030;
}
.color-3 {
color: #C03030;
}
</style>
</head>
<body>
<main>
<div class="status">
<span class="total color"></span><span class="unit"></span> total<span class="seperator gray"></span>
<span class="used color"></span><span class="unit"></span> used<span class="seperator gray"></span>
<span class="free color"></span><span class="unit"></span> free<span class="seperator gray"></span>
<span class="percentage color"></span>%
</div>
<figure class="bar"></figure>
<figure class="smiley color">¯\_(o.0)_/¯</figure>
</main>
<script type="text/javascript">
function displayQuota(used) {
used = Number.parseInt(used);
const TOTAL = 1000; // PUT THE QUOTA LIMIT HERE
const UNIT = 'GB'; // PUT THE UNIT OF THE QUOTA HERE
const COLOR_SECTIONS = [85, 95, 100]; // in percent
const SMILEYS = [':)', ':|', ':/', ':( WARNING!'];
const SEPERATOR = ' | ';
const BAR_WIDTH = 100;
let percentage = used * 100 / TOTAL;
let bar = '[' + Array(BAR_WIDTH).fill().map((element, index) => {
if (index / BAR_WIDTH * 100 < Math.round(percentage)) return '<span class="color">=</span>';
else return '<span class="gray">-</span>';
}).join('') + ']';
let sectionIndex = 0;
while (sectionIndex < COLOR_SECTIONS.length) {
if (COLOR_SECTIONS[sectionIndex] <= percentage) sectionIndex++;
else break;
}
for (let element of document.getElementsByClassName('unit')) element.innerText = UNIT;
for (let element of document.getElementsByClassName('seperator')) element.innerText = SEPERATOR;
for (let element of document.getElementsByClassName('total')) element.innerText = TOTAL.toString();
for (let element of document.getElementsByClassName('used')) element.innerText = used.toString();
for (let element of document.getElementsByClassName('free')) element.innerText = (TOTAL - used - 1).toString();
for (let element of document.getElementsByClassName('percentage')) element.innerText = percentage.toFixed(1).toString();
for (let element of document.getElementsByClassName('bar')) element.innerHTML = bar;
for (let element of document.getElementsByClassName('smiley')) element.innerText = SMILEYS[sectionIndex];
for (let element of document.getElementsByClassName('color')) element.classList.add('color-' + sectionIndex);
}
fetch('quota').then(response => response.text()).then(displayQuota);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment