https://github.com/danbrakeley/dog
Dog is a debug tool that serves a web page that opens a websocket back to itself for sharing real-time logs, as well as for arbitrary two-way communication.
https://github.com/danbrakeley/dog
Last synced: 6 months ago
JSON representation
Dog is a debug tool that serves a web page that opens a websocket back to itself for sharing real-time logs, as well as for arbitrary two-way communication.
- Host: GitHub
- URL: https://github.com/danbrakeley/dog
- Owner: danbrakeley
- License: mit
- Created: 2020-10-12T15:32:23.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2021-04-19T14:08:36.000Z (about 5 years ago)
- Last Synced: 2024-06-20T14:02:49.917Z (about 2 years ago)
- Language: Go
- Size: 1.11 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# Dog
A logger that spins up a web browser and sends logs in real-time via websocket.
## How to Build
1. If you don't already have it, [install a recent version of Go](https://golang.org/doc/install).
2. If you are on Windows, you'll want a bash shell.
- I use git-bash, which comes with [Git for Windows](https://gitforwindows.org).
3. In bash, `cd` into the path where you cloned this repo, then run `./build-dev.sh`, which does the following:
- runs tests
- builds cmd/example, writing the output to `local/example[.exe]`.
4. Run `local/example[.exe]`, then point a web browser at `localhost:8080`
I've also been playing with [Air](https://github.com/cosmtrek/air) for hot-reloading. I created [my own fork/branch](https://github.com/danbrakeley/air/tree/brakeley) to pull in an unmerged PR, and added a [quick install script](https://github.com/danbrakeley/air/blob/brakeley/brakeley-install.sh).
## TODO
- mark a field as "global", showing it in a static position, and not after the log lines where it appears
- should this be on the server's side or a client ui?
- structured data filters
- add filter for specific fields that must exist
- add way to filter on field values (exact, and ranges for numbers)
- resizable column widths
- Add options to periodically send memory/gc stats to the web viewer
- maybe a generic system for adding named fields and displaying them on the sidebar?
- Instead of mirroring frog's interface, maybe make it a module that requires frog to work?
- add multiple filters that can be quickly switched between
- add highlights in addition to filters, for adding custom background colors to rows containing specific terms
- ~~cleanup http server and any open connections on Close()~~
- ~~add visually distinct formatting for fatal log lines~~
- ~~save captured logs to text ndjson file~~
- ~~add toggles for log levels~~
- ~~add simple text filter (or regex?)~~
- ~~"currently visible" -> "active lines", then add "visible" as readonly display of actually visible lines~~
- ~~auto reload on connection if web page found to be out of date~~
- ~~display structured data ("fields")~~
- infinity scroll
```js
// source: https://www.javascripttutorial.net/dom/css/check-if-an-element-is-visible-in-the-viewport/
const isInViewport = (element) => {
const rect = element.getBoundingClientRect();
return (
rect.top >= 0 &&
rect.left >= 0 &&
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
rect.right <= (window.innerWidth || document.documentElement.clientWidth)
);
}
scroll_parent.addEventListener('scroll',
() => {
let str = '----- ';
let nodes = log_line_parent.children;
for (let i = 0; i < nodes.length; i++) {
if (isInViewport(nodes[i])) {
str += '#';
} else {
str += '_';
}
}
dlog(str);
},
{ passive: true },
);
```
## License
See LICENSE.txt for the current license. License may change in the future.
Thanks to the MIT licensed software that I use, including:
```text
* Halfmoon JS
* Version: 1.1.1
* https://www.gethalfmoon.com
* Copyright, Halfmoon UI
* Licensed under MIT (https://www.gethalfmoon.com/license)
```
```text
* FileSaver.js
* A saveAs() FileSaver implementation.
*
* By Eli Grey, http://eligrey.com
*
* License : https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md (MIT)
* source : http://purl.eligrey.com/github/FileSaver.js
```