[
  {
    "path": ".gitignore",
    "content": "# Swap\n[._]*.s[a-v][a-z]\n[._]*.sw[a-p]\n[._]s[a-v][a-z]\n[._]sw[a-p]\n\n# Session\nSession.vim\n\n# Temporary\n.netrwhist\n*~\n# Auto-generated tag files\ntags\n\n# Byte-compiled / optimized / DLL files\n__pycache__/\n*.py[cod]\n*$py.class\n\n# C extensions\n*.so\n"
  },
  {
    "path": "LICENSE",
    "content": "MIT License\n\nCopyright (c) 2017 Denis Khoshaba\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
  },
  {
    "path": "Makefile",
    "content": "# build app\n\n.PHONY: install\ninstall:\n\tsudo npm install -g pm2\n\tnpm install\n\n.PHONY: stop\nstop:\n\tpm2 delete live-htop || true\n\tkill $$(pgrep -f htopgen.sh) || true\n\n.PHONY: start\nstart:\n\t./htopgen.sh &\n\tpm2 start process.yml\n\n.PHONY: renew-cert-dry-run\nrenew-cert-dry-run:\n\tsudo certbot renew --dry-run\n\n.PHONY: renew-cert\nrenew-cert:\n\tsudo certbot renew\n"
  },
  {
    "path": "README.md",
    "content": "# 0xfee1dead.top\n\nLive `htop` output of a server\n\n## Build\n\n### Prerequisites\n\n* htop\n* Node\n* [aha](https://github.com/theZiz/aha)\n* coreutils\n\nRunning `make install` installs the npm modules and the `pm2` cli tool\n\n## Run\n\n```make run``` will run the node `pm2` and `htopgen.sh` to generate the `htop.html` files\n\n## Screenshot\n\n![In-browser screenshot](0xfee1dead.top.png)\n\n## Thanks\n\n* [krismsd](https://github.com/krismsd) for helping me out with `sockets.io`\n* [tobiasahlin](https://github.com/tobiasahlin) for the css spinner\n"
  },
  {
    "path": "config/certbot.sh",
    "content": "#!/bin/sh\n\nif ! grep ^ /etc/apt/sources.list /etc/apt/sources.list.d/*  | grep -q certbot; then\n  sudo add-apt-repository ppa:certbot/certbot\n  sudo apt-get update\n  sudo apt-get install python-certbot-nginx -y\nfi\n\necho \"y\" | sudo ufw enable\nsudo ufw allow 'Nginx Full'\nsudo ufw delete allow 'Nginx HTTP'\nsudo ufw allow 'OpenSSH'\n\nsudo certbot --nginx -d 0xfee1dead.top -d www.0xfee1dead.top\n"
  },
  {
    "path": "config/nginx.default",
    "content": "server {\n\n        root /var/www/html;\n\n        index index.html index.htm index.nginx-debian.html;\n\n        server_name 0xfee1dead.top www.0xfee1dead.top _;\n\n        location / {\n                proxy_pass http://localhost:8080;\n                root /home/ubuntu/0xfee1dead.top/public/;\n                proxy_http_version 1.1;\n                proxy_set_header Upgrade $http_upgrade;\n                proxy_set_header Connection 'upgrade';\n                proxy_set_header Host $host;\n                proxy_cache_bypass $http_upgrade;\n                # First attempt to serve request as file, then\n                # as directory, then fall back to displaying a 404.\n                try_files $uri $uri/ =404;\n        }\n\n        location ~* socket.io/* {\n                proxy_set_header X-Real-IP $remote_addr;\n                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n                proxy_set_header Host $http_host;\n                proxy_set_header X-NginX-Proxy true;\n\n                proxy_pass http://localhost:8080;\n                proxy_redirect off;\n\n                proxy_http_version 1.1;\n                proxy_set_header Upgrade $http_upgrade;\n                proxy_set_header Connection \"upgrade\";\n        }\n\n        location ^~ /.well-known/acme-challenge/ {\n        alias /var/www/acme-challenge/;\n        }\n}\n"
  },
  {
    "path": "htopgen.sh",
    "content": "#!/bin/bash\n\ntouch public/htop.html\ntouch public/htop.html.aux\n\nwhile true; do\n  echo q | htop | aha --stylesheet --black --line-fix | sed 's/<\\/style>/body {overflow-x: hidden; font-size: 2vh;}<\\/style>/g' > ./public/htop.html.aux && mv -f ./public/htop.html.aux ./public/htop.html\n  sleep 2\ndone\n"
  },
  {
    "path": "index.html",
    "content": "<!DOCTYPE html>\n<html>\n  <head>\n    <title>/usr/bin/htop</title>\n    <link rel=\"stylesheet\" type=\"text/css\" href=\"stylesheet.css\" />\n    <link rel='shortcut icon' href='favicon.ico' type='image/x-icon' />\n    <link rel='stylesheet' href='ribbon.css' meta http-equiv=\"Content-Type\" content=\"application/xml+xhtml; charset=UTF-8\" />\n    <script src=\"/socket.io/socket.io.js\"></script>\n    <script>\n      var socket = io();\n\t\t\tsocket.on('fileUpdate', (msg) => {\n\t\t\t\tdocument.getElementById(\"feed\").innerHTML = msg;\n      });\n    </script>\n    <!-- Global site tag (gtag.js) - Google Analytics -->\n    <script async src=\"https://www.googletagmanager.com/gtag/js?id=UA-76175181-5\"></script>\n    <script>\n      window.dataLayer = window.dataLayer || [];\n      function gtag(){dataLayer.push(arguments);}\n      gtag('js', new Date());\n      gtag('config', 'UA-76175181-5');\n    </script>\n  </head>\n  <body>\n    <a class='github-fork-ribbon' href='https://github.com/theden/0xfee1dead.top' target='_blank' title='Fork me on GitHub'>Fork me on GitHub</a>\n    <div id=\"feed\">\n\t\t\t<div style=\"text-align:center; font-family: monospace; font-size: 2vh;\">[live htop]<div class=\"spinner\">\n\t\t\t\t\t<div class=\"double-bounce1\"></div>\n\t\t\t\t\t<div class=\"double-bounce2\"></div>\n\t\t\t\t</div> \n\t\t\t\t<div>\n\t\t\t\t\t<a style=\"position: fixed; bottom: 0; right: 0; left: 0; width: 100%;font-family: monospace; font-size: 2vh; color: white; text-decoration: none;\" href=\"http://theden.sh\" target=\"_blank\">✌ theden.sh</a>\n\t\t\t\t</div>\n\t\t\t\t<a style=\"position: fixed; bottom: 0; right: 0; left: 0; width: 100%;font-family: monospace; font-size: 2vh; color: white; text-decoration: none;\" href=\"http://theden.sh\" target=\"_blank\">✌ theden.sh</a>\n\t</body>\n</html>\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"0xfee1dead.top\",\n  \"version\": \"1.0.0\",\n  \"description\": \"\",\n  \"main\": \"index.js\",\n  \"scripts\": {\n    \"test\": \"echo \\\"Error: no test specified\\\" && exit 1\"\n  },\n  \"author\": \"Denis Khoshaba\",\n  \"dependencies\": {\n    \"express\": \"^4.15.3\",\n    \"fs\": \"0.0.1-security\",\n    \"http\": \"0.0.0\",\n    \"path\": \"^0.12.7\",\n    \"pm2\": \"^2.6.1\",\n    \"socket.io\": \"^2.0.3\",\n    \"watch\": \"^1.0.2\"\n  },\n  \"license\": \"GPL-2.0\"\n}\n"
  },
  {
    "path": "process.yml",
    "content": "apps:\n  - script: \"server.js\"\n    name: \"live-htop\"\n    instances: 0  # \"0\" means as much instances as you have CPU cores\n    exec_mode: cluster\n    watch: false # if true, it will restart your app everytime a file change is detected on the folder or subfolder of your app.\n    combine_logs: true\n"
  },
  {
    "path": "public/reload.js",
    "content": "(function refresh () {\n  var verboseLogging = false\n  var socketUrl = window.location.origin\n  if (!window.location.origin.match(/:[0-9]+/)) {\n    socketUrl = window.location.origin + ':80'\n  }\n  socketUrl = socketUrl.replace(/(^http(s?):\\/\\/)(.*:)(.*)/,'ws$2://$39856') // This is dynamically populated by the reload.js file before it is sent to the browser\n  var socket\n\n  if (verboseLogging) {\n    console.log('Reload Script Loaded')\n  }\n\n  if (!('WebSocket' in window)) {\n    throw new Error('Reload only works with browsers that support WebSockets')\n  }\n\n  // Explanation of the flags below:\n\n  // The first change flag is used to tell reload to wait until the socket closes at least once before we allow the page to open on a socket open event. Otherwise reload will go into a inifite loop, as the page will have a socket on open event once it loads for the first time\n  var firstChangeFlag = false\n\n  // The navigatedAwayFromPageFlag is set to true in the event handler onbeforeunload because we want to short-circuit reload to prevent it from causing the page to reload before the navigation occurs.\n  var navigatedAwayFromPageFlag\n\n    // Wait until the page loads for the first time and then call the webSocketWaiter function so that we can connect the socket for the first time\n  window.addEventListener('load', function () {\n    if (verboseLogging === true) {\n      console.log('Page Loaded - Calling webSocketWaiter')\n    }\n    websocketWaiter()\n  })\n\n  // If the user navigates away from the page, we want to short-circuit reload to prevent it from causing the page to reload before the navigation occurs.\n  window.addEventListener('beforeunload', function () {\n    if (verboseLogging === true) {\n      console.log('Navigated away from the current URL')\n    }\n\n    navigatedAwayFromPageFlag = true\n  })\n\n  // Check to see if the server sent us reload (meaning a manually reload event was fired) and then reloads the page\n  var socketOnMessage = function (msg) {\n    if (msg.data === 'reload') {\n      socket.close()\n    }\n  }\n\n  var socketOnOpen = function (msg) {\n    if (verboseLogging) {\n      console.log('Socket Opened')\n    }\n\n    // We only allow the reload on two conditions, one when the socket closed (firstChange === true) and two if we didn't navigate to a new page (navigatedAwayFromPageFlag === false)\n    if (firstChangeFlag === true && navigatedAwayFromPageFlag !== true) {\n      if (verboseLogging) {\n        console.log('Reloaded')\n      }\n\n      // Reset the firstChangeFlag to false so that when the socket on open events are being fired it won't keep reloading the page\n      firstChangeFlag = false\n\n      // Now that everything is set up properly we reload the page\n      window.location.reload()\n    }\n  }\n\n  // Socket on close event that sets flags and calls the webSocketWaiter function\n  var socketOnClose = function (msg) {\n    if (verboseLogging) {\n      console.log('Socket Closed - Calling webSocketWaiter')\n    }\n\n    // We encountered a change so we set firstChangeFlag to true so that as soon as the server comes back up and the socket opens we can allow the reload\n    firstChangeFlag = true\n\n    // Call the webSocketWaiter function so that we can open a new socket and set the event handlers\n    websocketWaiter()\n  }\n\n  var socketOnError = function (msg) {\n    if (verboseLogging) {\n      console.log(msg)\n    }\n  }\n\n  // Function that opens a new socket and sets the event handlers for the socket\n  function websocketWaiter () {\n    if (verboseLogging) {\n      console.log('Waiting for socket')\n    }\n    setTimeout(function () {\n      socket = new WebSocket(socketUrl) // eslint-disable-line\n\n      socket.onopen = socketOnOpen\n      socket.onclose = socketOnClose\n      socket.onmessage = socketOnMessage\n      socket.onerror = socketOnError\n    }, 250)\n  }\n})()\n\n"
  },
  {
    "path": "public/ribbon.css",
    "content": "/*!\n * \"Fork me on GitHub\" CSS ribbon v0.2.0 | MIT License\n * https://github.com/simonwhitaker/github-fork-ribbon-css\n*/.github-fork-ribbon{width:12.1em;height:12.1em;position:fixed\n;overflow:hidden;top:0;right:0;z-index:9999;pointer-events:none;font-size:2vh;text-decoration:none;text-indent:-999999px}.github-fork-ribbon.fixed{position:fixed}.github-fork-ribbon:before,.github-fork-ribbon:after{position:absolute;display:block;width:15.38em;height:1.54em;top:3.23em;right:-3.23em;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)}.github-fork-ribbon:before{content:\"\";padding:.38em 0;background-color:#a00;background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,0.15)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:-moz-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:-ms-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:-o-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0.15));background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.15));-webkit-box-shadow:0 .15em .23em 0 rgba(0,0,0,0.5);-moz-box-shadow:0 .15em .23em 0 rgba(0,0,0,0.5);box-shadow:0 .15em .23em 0 rgba(0,0,0,0.5);pointer-events:auto}.github-fork-ribbon:after{content:attr(title);color:#fff;font:700 1em \"Helvetica Neue\",Helvetica,Arial,sans-serif;line-height:1.54em;text-decoration:none;text-shadow:0 -.08em rgba(0,0,0,0.5);text-align:center;text-indent:0;padding:.15em 0;margin:.15em 0;border-width:.08em 0;border-style:dotted;border-color:#fff;border-color:rgba(255,255,255,0.7)}.github-fork-ribbon.left-top,.github-fork-ribbon.left-bottom{right:auto;left:0}.github-fork-ribbon.left-bottom,.github-fork-ribbon.right-bottom{top:auto;bottom:0}.github-fork-ribbon.left-top:before,.github-fork-ribbon.left-top:after,.github-fork-ribbon.left-bottom:before,.github-fork-ribbon.left-bottom:after{right:auto;left:-3.23em}.github-fork-ribbon.left-bottom:before,.github-fork-ribbon.left-bottom:after,.github-fork-ribbon.right-bottom:before,.github-fork-ribbon.right-bottom:after{top:auto;bottom:3.23em}.github-fork-ribbon.left-top:before,.github-fork-ribbon.left-top:after,.github-fork-ribbon.right-bottom:before,.github-fork-ribbon.right-bottom:after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}\n"
  },
  {
    "path": "public/stylesheet.css",
    "content": "body         {color: white; background-color: black; overflow-x: hidden;}\n.reset       {color: white;}\n.bg-reset    {background-color: black;}\n.inverted    {color: black;}\n.bg-inverted {background-color: white;}\n.dimgray     {color: dimgray;}\n.red         {color: red;}\n.green       {color: lime;}\n.yellow      {color: yellow;}\n.blue        {color: #3333FF;}\n.purple      {color: fuchsia;}\n.cyan        {color: aqua;}\n.white       {color: white;}\n.bg-black    {background-color: black;}\n.bg-red      {background-color: red;}\n.bg-green    {background-color: lime;}\n.bg-yellow   {background-color: yellow;}\n.bg-blue     {background-color: #3333FF;}\n.bg-purple   {background-color: fuchsia;}\n.bg-cyan     {background-color: aqua;}\n.bg-white    {background-color: white;}\n.underline   {text-decoration: underline;}\n.bold        {font-weight: bold;}\n.blink       {text-decoration: blink;}\n\n.spinner {\n  width: 40px;\n  height: 40px;\n\n  position: relative;\n  margin: 100px auto;\n}\n\n.double-bounce1, .double-bounce2 {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  background-color: #333;\n  opacity: 0.6;\n  position: absolute;\n  top: 0;\n  left: 0;\n\n  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;\n  animation: sk-bounce 2.0s infinite ease-in-out;\n}\n\n.double-bounce2 {\n  -webkit-animation-delay: -1.0s;\n  animation-delay: -1.0s;\n}\n\n@-webkit-keyframes sk-bounce {\n  0%, 100% { -webkit-transform: scale(0.0) }\n  50% { -webkit-transform: scale(1.0) }\n}\n\n@keyframes sk-bounce {\n  0%, 100% {\n    transform: scale(0.0);\n    -webkit-transform: scale(0.0);\n  } 50% {\n    transform: scale(1.0);\n    -webkit-transform: scale(1.0);\n  }\n}\n"
  },
  {
    "path": "server.js",
    "content": "var express = require('express');\nvar path = require('path');\nvar fs = require('fs');\nvar app = express()\nvar http = require('http').Server(app);\nvar io = require('socket.io')(http);\nvar watch = require('watch');\n\napp.use(express.static('public'))\nvar publicDir = path.join(__dirname, 'public')\n\n\napp.get('/', function(req, res){\n  res.sendFile(__dirname + '/index.html');\n});\n\nvar sockets = [];\nio.on('connection', function(socket){\n  sockets.push(socket);\n\n  socket.on('disconnection', () => {\n    let index = sockets.indexOf(socket);\n    socket.splice(index, 1);\n  })\n});\n\nvar port = 8080\nhttp.listen(port, function(){\n  console.log('listening on ' + port);\n});\n\nwatch.watchTree(__dirname + '/public', function (f, curr, prev) {\n  if (typeof f === 'string' && f.endsWith('htop.html')) {\n    fs.readFile(__dirname + '/public/htop.html', 'utf8', (err, data) => {\n      if (err) {\n        console.log(err);\n        return;\n      }\n      sockets.forEach(s => {\n          s.emit('fileUpdate', data);\n      })\n    });\n  }\n});\n"
  }
]