[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.
This commit is contained in:
Sriman Achanta
2023-06-09 13:09:41 -04:00
committed by GitHub
parent f63283e187
commit 7b8fb3385b
46 changed files with 7764 additions and 19050 deletions

View File

@@ -1,5 +1,5 @@
var canvas = undefined;
var image = undefined;
let canvas = undefined;
let image = undefined;
function initColorPicker() {
if (!canvas)
@@ -33,8 +33,8 @@ function colorPickerClick(event, currentFunction, currentRange) {
function eyeDrop(pixel) {
let hsv = RGBtoHSV(pixel);
let range = widenRange([hsv, hsv.slice(0)]);//sends hsv and a copy of hsv
return range
//sends hsv and a copy of hsv
return widenRange([hsv, hsv.slice(0)])
}
function expand(pixel, currentRange) {
@@ -46,8 +46,8 @@ function expand(pixel, currentRange) {
function shrink(pixel, currentRange) {
let hsv = RGBtoHSV(pixel);
let widenHSV = widenRange([[].concat(hsv), hsv]);
if (!shrinkRange(currentRange, widenHSV[0]))//Tries to shrink the lower part of the widen HSV
shrinkRange(currentRange, widenHSV[1]);//If the prev attempt failed, try to shrink the higher part of the widen HSV
if (!shrinkRange(currentRange, widenHSV[0])) //Tries to shrink the lower part of to widened HSV
shrinkRange(currentRange, widenHSV[1]); //If the prev attempt failed, try to shrink the higher part of to widened HSV
return currentRange
}
@@ -78,10 +78,10 @@ function RGBtoHSV(numbers) {
//Loops though the colors array, finds the smallest and biggest value for H,S and V. Returns the range containing every color
function createRange(HSVColors) {
let range = [[], []];
for (var i = 0; i < 3; i++) {
for (let i = 0; i < 3; i++) {
range[0][i] = HSVColors[0][i];
range[1][i] = HSVColors[0][i];
for (var j = HSVColors.length - 1; j >= 0; j--) {
for (let j = HSVColors.length - 1; j >= 0; j--) {
range[0][i] = Math.min(HSVColors[j][i], range[0][i]);
range[1][i] = Math.max(HSVColors[j][i], range[1][i]);
}
@@ -89,7 +89,7 @@ function createRange(HSVColors) {
return range;//[[Hmin,Smin,Vmin],[Hmax,Smax,Vmax]]
}
//This function adds 10 extra units to each side of the sliders, not to be confued with the expand selection button
//This function adds 10 extra units to each side of the sliders, not to be confused with the expand selection button
function widenRange(range) {
let expanded = [[], []];
for (let i = 0; i < 3; i++) {

View File

@@ -10,30 +10,30 @@ class StatsHistoryBuffer{
this.frameCount = 0;
this.bitAvgAccum = 0;
//calculated vals
//calculated values
this.bitRate_Mbps = 0;
this.framerate_fps = 0;
}
putAndPop(v){
this.headPtr++;
var idx = (this.headPtr)%this._array.length;
var poppedVal = this._array[idx];
const idx = (this.headPtr) % this._array.length;
const poppedVal = this._array[idx];
this._array[idx] = v;
return poppedVal;
}
addSample(time, frameSize_bits, dispFrame_count) {
var oldVal = this.putAndPop([time, frameSize_bits, dispFrame_count]);
const oldVal = this.putAndPop([time, frameSize_bits, dispFrame_count]);
this.bitAvgAccum += frameSize_bits;
if(oldVal !=null){
var oldTime = oldVal[0];
var oldFrameSize = oldVal[1];
var oldFrameCount = oldVal[2];
const oldTime = oldVal[0];
const oldFrameSize = oldVal[1];
const oldFrameCount = oldVal[2];
var deltaTime_s = (time - oldTime);
const deltaTime_s = (time - oldTime);
this.bitAvgAccum -= oldFrameSize;
@@ -125,10 +125,10 @@ export class WebsocketVideoStream{
}
dispImageData(){
if(this.prevImgDataTime != this.imgDataTime){
if(this.prevImgDataTime !== this.imgDataTime){
//From https://stackoverflow.com/questions/67507616/set-image-src-from-image-blob/67507685#67507685
//Ensure uniqueness by making the new one before revoking the old one.
var oldURL = this.imgObjURL
const oldURL = this.imgObjURL;
this.imgObjURL = URL.createObjectURL(this.imgData);
if(oldURL != null){
URL.revokeObjectURL(oldURL)
@@ -143,19 +143,19 @@ export class WebsocketVideoStream{
}
dispNoStream() {
this.image.src = require("../assets/loading.gif");
this.image.src = require("../../public/loading.svg");
}
animationLoop(){
// Update time metrics
var curTime_s = window.performance.now() / 1000.0;
var timeInState = curTime_s - this.dsm_restart_start_time;
const curTime_s = window.performance.now() / 1000.0;
const timeInState = curTime_s - this.dsm_restart_start_time;
// Save previous state
this.dsm_prev_state = this.dsm_cur_state;
// Evaluate state transitions
if(this.serverConnectionActive == false){
if(!this.serverConnectionActive){
//Any state - if the server connection goes false, always transition to disconnected
this.dsm_cur_state = this.DSM_DISCONNECTED;
} else {
@@ -221,12 +221,12 @@ export class WebsocketVideoStream{
//take current-state or state-transition actions
if(this.dsm_cur_state != this.dsm_prev_state){
if(this.dsm_cur_state !== this.dsm_prev_state){
//Any state transition
console.log("State Change: " + this.dsm_prev_state + " -> " + this.dsm_cur_state);
}
if(this.dsm_cur_state == this.DSM_SHOWING){
if(this.dsm_cur_state === this.DSM_SHOWING){
// Currently in SHOWING
// Show image and update status text
this.dispImageData();
@@ -236,24 +236,24 @@ export class WebsocketVideoStream{
this.statsTextDiv.innerHTML = this.dsm_cur_state;
}
if(this.dsm_cur_state != this.DSM_SHOWING && this.dsm_prev_state == this.DSM_SHOWING ){
if(this.dsm_cur_state !== this.DSM_SHOWING && this.dsm_prev_state === this.DSM_SHOWING ){
//Any transition out of showing - no stream
this.dispNoStream();
}
if(this.dsm_cur_state == this.DSM_RESTART_UNSUBSCRIBE){
if(this.dsm_cur_state === this.DSM_RESTART_UNSUBSCRIBE){
// Currently in UNSUBSCRIBE, do the unsubscribe actions
this.stopStream();
this.dsm_restart_start_time = curTime_s;
}
if(this.dsm_cur_state == this.DSM_SUBSCRIBE){
if(this.dsm_cur_state === this.DSM_SUBSCRIBE){
// Currently in SUBSCRIBE, do the subscribe actions
this.startStream();
this.dsm_restart_start_time = curTime_s;
}
if(this.dsm_cur_state == this.DSM_WAIT_FOR_VALID_PORT){
if(this.dsm_cur_state === this.DSM_WAIT_FOR_VALID_PORT){
// Currently waiting for a vaild port to be requested
if(this.newStreamPortReq != null){
this.streamPort = this.newStreamPortReq;
@@ -315,7 +315,7 @@ export class WebsocketVideoStream{
ws_onMessage(e){
//console.log("Got message from " + this.serverAddr)
var msgTime_s = window.performance.now() / 1000.0;
const msgTime_s = window.performance.now() / 1000.0;
if(typeof e.data === 'string'){
//string data from host
//TODO - anything to receive info here? Maybe "available streams?"

View File

@@ -1,5 +1,4 @@
import '@mdi/font/css/materialdesignicons.css';
import 'material-design-icons-iconfont/dist/material-design-icons.css'
import Vue from 'vue';
import Vuetify from 'vuetify/lib';
import theme from "../theme";