Commit Graph

20 Commits

Author SHA1 Message Date
Gold856
d7e536dda9 Clean up spacing and other things in various parts of the UI (#1972)
## Description

After the Vue 3 upgrade, the spacing for various UI elements was left
inconsistent in many places. Dialogs were hit especially hard and had
some very inconsistent spacing. Additionally, the 24 pixels of padding
around all cards was noted as a waste of space and unnecessary, so it
has been shrunk down to 20 pixels to make the UI a tiny bit more compact
and to make it visually closer to some parts of the UI that have 16
pixels of padding (the camera views are the most notable example).
Padding between input elements has also been reduced to 20 pixels (this
required some hackery to get consistent sizes on input elements, since
switches and sliders have different heights.)

Some other minor UI tweaks were made, such as removing the divider
between dialog contents and dialog buttons because it visually looks
better, shrinking the banner padding so it doesn't displace as much
content, making the banner background one uniform color instead of a
highlight around the icon, fixing the targets tab so that the columns
stop shifting around when the values change, preserving newlines in the
log view, cleaning up the object detection UI, and making the import
dialogs have consistently inset input elements.

Old dashboard:

![image](https://github.com/user-attachments/assets/409c7ddd-4b7d-4535-9f3f-3970d9dd85f8)

New dashboard:

![image](https://github.com/user-attachments/assets/587ac540-1d6d-40e5-9c6b-00697bab6cbc)

Old Camera tab:

![image](https://github.com/user-attachments/assets/2f1d50a1-131f-4fb7-8617-e1cb4dc5504c)

New Camera tab:

![image](https://github.com/user-attachments/assets/6d5581b7-faff-400a-8e34-e3abf00e0af6)

Old Calibration Info:

![image](https://github.com/user-attachments/assets/81133cc1-c861-4746-9b1e-8320312037de)

New Calibration Info:

![image](https://github.com/user-attachments/assets/0de5935c-84a7-4606-bbc1-8e6d227b7b60)

Old Log Viewer:

![image](https://github.com/user-attachments/assets/f2c32a10-3353-4781-93d7-8e0ffa8ca7fe)

New Log Viewer:

![image](https://github.com/user-attachments/assets/0aeee866-c182-4e80-9025-56bf383d714f)

Old Pipeline Creation Dialog:

![image](https://github.com/user-attachments/assets/a0eb368d-d9af-4cb3-8d9c-fcd12a5caf36)

New Pipeline Creation Dialog:

![image](https://github.com/user-attachments/assets/f05f34a3-f42e-4e8f-9ccd-171a48980b8f)

Old Factory Reset:

![image](https://github.com/user-attachments/assets/9c16a7f7-a454-4ee4-8574-98abf9b94e2d)

New Factory Reset:

![image](https://github.com/user-attachments/assets/fb67888c-c4f1-4e8e-9d02-6943e7a918eb)

Old Pipeline Change:

![image](https://github.com/user-attachments/assets/3acb215a-6639-4d50-a4e6-18b50c3ec1bd)

New Pipeline Change:

![image](https://github.com/user-attachments/assets/a2b18582-cdbd-407c-9690-f11aecf78c76)

Old Import Dialog:

![image](https://github.com/user-attachments/assets/ff43b0bd-3f99-44e5-97fa-c250cd331790)

New Import Dialog:

![image](https://github.com/user-attachments/assets/7ec46023-d47a-45d7-80b8-6881b812300e)

## Meta

Merge checklist:
- [x] Pull Request title is [short, imperative
summary](https://cbea.ms/git-commit/) of proposed changes
- [x] The description documents the _what_ and _why_
- [ ] If this PR changes behavior or adds a feature, user documentation
is updated
- [ ] If this PR touches photon-serde, all messages have been
regenerated and hashes have not changed unexpectedly
- [ ] If this PR touches configuration, this is backwards compatible
with settings back to v2024.3.1
- [ ] If this PR touches pipeline settings or anything related to data
exchange, the frontend typing is updated
- [ ] If this PR addresses a bug, a regression test for it is added
2025-07-12 00:02:23 -04:00
Graham
bec8092660 Vue 3 Upgrade (#1900)
## Description

Upgrades to Vue 3 and necessary associated dependencies. Also fixes some
issues with the layout and adds validation for object detection models.

Closes #885, closes #1943, closes #1449.
## Meta

Merge checklist:
- [x] Pull Request title is [short, imperative
summary](https://cbea.ms/git-commit/) of proposed changes
- [x] The description documents the _what_ and _why_
- [ ] If this PR changes behavior or adds a feature, user documentation
is updated
- [ ] If this PR touches photon-serde, all messages have been
regenerated and hashes have not changed unexpectedly
- [ ] If this PR touches configuration, this is backwards compatible
with settings back to v2024.3.1
- [ ] If this PR touches pipeline settings or anything related to data
exchange, the frontend typing is updated
- [ ] If this PR addresses a bug, a regression test for it is added

---------

Co-authored-by: Matt M <matthew.morley.ca@gmail.com>
Co-authored-by: Gold856 <117957790+Gold856@users.noreply.github.com>
Co-authored-by: samfreund <techguy763@gmail.com>
2025-05-06 18:21:41 -04:00
Devon Doyle
5e5df483e2 Camera disconnected + stream normalization improvements (#1701) 2025-01-13 23:30:25 -08:00
oh-yes-0-fps
418eada0b5 Convert to user selected camera matching (#1556) 2025-01-01 03:04:20 -05:00
Programmers3539
70c2cdebe0 Charuco Support (#1312)
Add charuco calibration to photonvision. Currently does not support generating custom charuco boards. This does not support https://calib.io/pages/camera-calibration-pattern-generator. Currently only supports the 4X4_50 family. Also removes all dotboard calibration. Fixes using the lowest possible fps while doing calibration (now uses the highest fps available for each resolution).
2024-05-10 13:12:13 -04:00
Sriman Achanta
e4f475a253 Improve UI stability, reliability, and readability (#1104)
closes #1090
closes #1030

Also fixes various styling issues and overflow issues for mobile support
2024-01-02 09:03:16 -07:00
Sriman Achanta
623b4e5b84 Show Saved Snapshots in UI (#995)
Add Camera Control tab to Cameras for the button to live in
2023-11-05 11:33:45 -05:00
Sriman Achanta
8b9a198d0b [photon-client] Fix imports and simplify process of updated pipeline settings in store (#946)
* Update CameraSettingsStore.ts

* Fix imports
2023-10-11 15:31:50 -07:00
Sriman Achanta
f623e4a1cc [PhotonClient] Vite and Typescript complete refactor (#884) 2023-08-20 22:51:35 -07:00
Sriman Achanta
58419cfe38 Update vue-router to use HTML5 history (#856)
closes #855

Only issues I see is that only HTML5 History API supported browsers support this which is fine given that the only thing that doesn't is probably the laptop they use to flash routers at competitions.

The 404 page can be up for debate lol.
2023-06-10 17:15:28 -04:00
Sriman Achanta
7b8fb3385b [PhotonClient] Update dependencies to latest, update assets, and styling fixes (#767)
Currently, there is a difficult-to-reproduce bug where the backend reports that camera calibration was successful in logs via the logger but then throws an exception causing the backend to return a 500 error code with no request body which causes the frontend to interpret this as a failed calibration attempt. This ultimately leads to the entire instance of photonvision crashing and requiring the entire pi to be restarted. It is believed this issue resides inside the ConfigManager's saving action following the calibration update but is not confirmed.
2023-06-09 10:09:41 -07:00
Chris Gerth
aaac6a4fbb Add Websocket Camera Streaming (#529)
* WIP adding second websocket handling for cameras

* just more WIP

* even more wip. Most java-side framework completed, but not yet debugged

* IT LIVES. Still needs lots of cleanup. But we're transferring and displaying data!

* moved down an architecture layer. Improved multiple-camera handling

* Additional WIP to help improve smoothness and performance, though not yet tested

* bugfixes galore

* tweak compression

* spotless

* more tweaks for handling slow/intermittent streams

* wpilibformat maybe?

* clang-format maybe?

* WIP - adding thinclient. I don't like it yet, it should be more auto-generated than it is.

* thinclient formatting fixups

* Reduced amount of empty send data by limiting to only one stream per client (which is all we really need). Framerate is up slightly, overhead is down.

* bugfixes, faster streaming, better mjpeg compression settings, thinclient working

* spotless and formatting

* cmon wpiformat....

* re-added mjpg streams

* added a loading GIF to imporve the feeling of responsiveness

* formatting

* urlparams and built-in thinclient

* wpiformat

* prevent wpiformat complaints

* Removed uint8 array and base64 conversion from client side

* Synced up js implementations for ws streaming

* formatting/spotless
2022-10-30 13:16:17 -05:00
Matt
a151f23319 Add team number dialog, NT connected chip (#313)
Makes NT connection status visible from the UI
2021-11-25 15:43:29 -05:00
Chris Gerth
3257736ffa Add .pdf taraget generation (#307)
* Added rectangle target generation

* added dot grid support

* dot grid functional. Added branding and ruler

* comments, rebuild, testing

* proper branding rework

* undo index.html commit
2021-11-21 20:34:06 -05:00
Matt
23f3c0e6e1 Use chessboard squares (vs interior corners); fix resolution selector bug (#139)
* Change chessboard size to be squares not interior corners

This reduces ambiguity

* Force users to select resolution

This forces the correct video mode index to be selected. Otherwise the 0th camera videomode index will be used, as it's zero-inited. This is undesirable.

* Make target model an enum

This will allow the UI to remember the currently selected target.
2020-10-13 06:58:50 -07:00
Matt
9f0e89ea29 UI 3d mode, ConfigManager bugfixes (#103)
* stupid bugs I guess idk where else to put this commit

* Run spotless

* Fix config file loading

Splits load into own method

* Run spotless
2020-08-26 13:03:56 -04:00
Declan Freeman-Gleason
19b57235fe UI bug fixes and feature refinements (#59)
* Rework settings page; touch up contour, output, and 3D tabs; font sizing

No stream placeholder; driver mode refined; cameras page

Make settings snackbar work

Lint fix

Fix settings page padding

Actually hide settings fields if unsupported

* Make toggle buttons less confusing; fix driver toggle; form validation

* Make eyedropper work and make input/select styling more consistent

* Fix color picker and tabbing bugs

* Set up camera and settings pages to talk to the backend

* Add auto reconnect

* Add lots of tooltips and improve related thematic consistency

* Only show output stream while color picking

* Unbreak robot offset

* Increase tooltip delay and refactor tooltip label into a component

* Remove toggle button switching behavior

* Fix PnP tab and add a flag to disable FOV configuration

* Move FPS indicator

* Make GPU acceleration status use one value in the store

* Only allow IPv4 static IPs and remove accidentally committed index
2020-07-31 16:50:50 -04:00
Declan Freeman-Gleason
8b46ad1cab UI Redesign (#22)
* Rework UI into a new, responsive layout

* Send two streams (only one is currently downscaled)
2020-07-13 19:34:31 -07:00
Declan Freeman-Gleason
895edb988a UI Rebrand (#1)
* Rebrand UI and increase responsiveness

* Fix typo in PipelineViews and SettingsViews directory name

* Inset FPS indicator in stream preview

* Rebrand favicon
2020-06-28 06:11:09 -04:00
Matt
bdbd6b9d18 Rename to PhotonVision 2020-06-27 19:11:56 -07:00