Join GitHub today
GitHub is home to over 31 million developers working together to host and review code, manage projects, and build software together.Sign up
Enhance web interface #284
I just go started with OwnTracks a few days ago, awesome project! However I was not particularly pleased with the web interface it ships with, it looks a bit dusty to me and has quite limited functionality, so I just made my own using Vue.js and the HTTP API of the recorder.
Now I'm wondering if there's interest in updating the existing interface, I'd be able to help with that or provide code.
I made a single page, features include live updating of latest location using the websocket (similar to the existing solution, but with additional accuracy circles, as suggested in #282), multiple layers on the same map (latest locations, history line/track, history points, heatmap), date range selection (#179), (arguably) improved detail popups, filtering by user and device, auto center and zoom button, increased max zoom level for more detailed view of individual waypoints.
I had auto zoom on each update implemented, but found it more annoying than helpful. Could be a configurable thing.
Yet to be implemented: displaying user icons (I have none in my setup so I couldn't test), maybe the table of current locations (I don't need it), address displaying (I have no geo-ip set up either), deleting waypoints (I'm on it).
It's really not that much code.
If "I was not particularly pleased with the web interface it ships with" is a euphemism for "it looks rather awful" then I'm in full agreement; unfortunately I'll never be a Web dev.
We are very interested in your work, and you got several
User icons (i.e. CARDS are important to us here, as are reverse geo lookup and the Table of locations -- we use that a lot and I'm aware of a number of installations which use that, so please don't drop it; you are welcome to enhance it, of course. :)
I don't think deleting geo points is important as that can be accomplished with Unix utilities, but I'm not adverse to taking that.
Looking forward to seeing your first pull request. :-)
I'm glad it's being well received!
That made me chuckle :)
I implemented card faces (now that I have some, I really like them) and if "reverse geo lookup" simply means pulling the
Why are there both Leaflet/OSM and Google maps in use? I don't have a Google Maps API key and I quite like OSM, so I just went with that.
I think the existing table can just be kept, I did not touch it but worked on map features only.
While there's often one or multiple build steps involved in web development nowadays (Transpiling bleeding edge JS and CSS preprocessors, mostly), I chose to go with pure CSS and JS which every somewhat up-to-date browser should understand. Internet Explorer, anyone?
External JS dependencies are
Initially I thought the API for this already exists, now that I see this isn't the case, I'll leave this to someone else for now because I'm pretty bad in C.
I can prepare a PR so some people can test it, have a critical look on the implementation (e.g. I'm neither using
I started off using Google maps, and we later had contributions for OSM. Since then, we (OwnTracks project) have decided to go OSM only and I was actually thinking about ripping out the Google stuff. I haven't done that yet, but feel free to -- it suits us well. The reasoning we have: we want to stay as open as possible, hence OSM. While it can be argued that Google's maps are clearer/better-looking/whatever, I certainly disagree with them tracking us. OSM it is.
Let us replace it with the new interface, but I'd very much like us to be able to get at the "raw"-ish data somehow, maybe with a "download in format xxx" dropdown? We have users who use that raw data and we also have users with several dozen devices they want to see.
I'm not a friend of loading external dependencies on the fly, and I'd very much appreciate our delivering all we need along with the Recorder if at all possible. In addition to then always having what we need, we have one layer less of "tracking" when our Web interface is opened.
Thanks for the explanation, makes sense!
That shouldn't be hard, however I'd like to make sure the UI doesn't get cluttered and probably will have update my layout then.
I saw this is the case already (with the exception of jQuery), and can of course use local copies.
I absolutely agree with you here. One could just enable the Google location history on Android, but being able to get a location history of my devices while staying in absolute control over the data is why I chose OwnTracks in the first place!