Skip to content

Commit

Permalink
working cropping with fixed WPI tag detection
Browse files Browse the repository at this point in the history
  • Loading branch information
@GGreenix @mcm001
GGreenix authored and mcm001 committed Nov 23, 2024
1 parent 44f78cb commit 8807195
Show file tree
Hide file tree
Showing 45 changed files with 680 additions and 779 deletions.
18 changes: 0 additions & 18 deletions photon-client/src/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -76,24 +76,6 @@ if (!is_demo) {
}
}
/* Custom scrollbar styles */
::-webkit-scrollbar {
width: 12px;
}
::-webkit-scrollbar-track {
background: #232c37;
}
::-webkit-scrollbar-thumb {
background-color: #ffd843;
border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
background-color: #e4c33c;
}
.main-container {
background-color: #232c37;
padding: 0 !important;
Expand Down
52 changes: 7 additions & 45 deletions photon-client/src/components/app/photon-camera-stream.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,41 +11,27 @@ const props = defineProps<{
id: string;
}>();
const emptyStreamSrc = "//:0";
const streamSrc = computed<string>(() => {
const port =
useCameraSettingsStore().currentCameraSettings.stream[props.streamType === "Raw" ? "inputPort" : "outputPort"];
if (!useStateStore().backendConnected || port === 0) {
return emptyStreamSrc;
return loadingImage;
}
return `http://${inject("backendHostname")}:${port}/stream.mjpg`;
});
const streamDesc = computed<string>(() => `${props.streamType} Stream View`);
const streamStyle = computed<StyleValue>(() => {
if (useStateStore().colorPickingMode) {
return { cursor: "crosshair" };
return { width: "100%", cursor: "crosshair" };
}
return {};
});
const containerStyle = computed<StyleValue>(() => {
const resolution = useCameraSettingsStore().currentVideoFormat.resolution;
const rotation = useCameraSettingsStore().currentPipelineSettings.inputImageRotationMode;
if (rotation === 1 || rotation === 3) {
return {
aspectRatio: `${resolution.height}/${resolution.width}`
};
}
return {
aspectRatio: `${resolution.width}/${resolution.height}`
};
return { width: "100%" };
});
const overlayStyle = computed<StyleValue>(() => {
if (useStateStore().colorPickingMode || streamSrc.value == emptyStreamSrc) {
if (useStateStore().colorPickingMode || streamSrc.value == loadingImage) {
return { display: "none" };
} else {
return {};
Expand All @@ -71,23 +57,13 @@ const handleFullscreenRequest = () => {
const mjpgStream: any = ref(null);
onBeforeUnmount(() => {
if (!mjpgStream.value) return;
mjpgStream.value["src"] = emptyStreamSrc;
mjpgStream.value["src"] = "//:0";
});
</script>

<template>
<div class="stream-container" :style="containerStyle">
<img :src="loadingImage" class="stream-loading" />
<img
v-show="streamSrc !== emptyStreamSrc"
:id="id"
ref="mjpgStream"
class="stream-video"
crossorigin="anonymous"
:src="streamSrc"
:alt="streamDesc"
:style="streamStyle"
/>
<div class="stream-container">
<img :id="id" ref="mjpgStream" crossorigin="anonymous" :src="streamSrc" :alt="streamDesc" :style="streamStyle" />
<div class="stream-overlay" :style="overlayStyle">
<pv-icon
icon-name="mdi-camera-image"
Expand All @@ -113,21 +89,7 @@ onBeforeUnmount(() => {

<style scoped>
.stream-container {
display: flex;
position: relative;
width: 100%;
}
.stream-loading {
position: absolute;
width: 100%;
height: 100%;
}
.stream-video {
position: absolute;
width: 100%;
height: 100%;
}
.stream-overlay {
Expand Down
2 changes: 1 addition & 1 deletion photon-client/src/components/app/photon-log-view.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ const logs = computed<LogMessage[]>(() =>
selectedLogLevels.value[message.level] &&
message.message.toLowerCase().includes(searchQuery.value?.toLowerCase() || "") &&
(timeInput.value === undefined ||
message.timestamp.getTime() >=
message.timestamp >=
new Date().setHours(
parseInt(timeInput.value.substring(0, 2)),
parseInt(timeInput.value.substring(3, 5)),
Expand Down
69 changes: 27 additions & 42 deletions photon-client/src/components/cameras/CameraCalibrationCard.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -81,11 +81,15 @@ const patternHeight = ref(8);
const boardType = ref<CalibrationBoardTypes>(CalibrationBoardTypes.Charuco);
const useOldPattern = ref(false);
const tagFamily = ref<CalibrationTagFamilies>(CalibrationTagFamilies.Dict_4X4_1000);
// Emperical testing - with stack size limit of 1MB, we can handle at -least- 700k points
const tooManyPoints = computed(
() => useStateStore().calibrationData.imageCount * patternWidth.value * patternHeight.value > 700000
);
const useMrCalRef = ref(true);
const useMrCal = computed<boolean>({
get() {
return useMrCalRef.value && useSettingsStore().general.mrCalWorking;
},
set(value) {
useMrCalRef.value = value && useSettingsStore().general.mrCalWorking;
}
});
const downloadCalibBoard = () => {
const doc = new JsPDF({ unit: "in", format: "letter" });
Expand Down Expand Up @@ -165,6 +169,7 @@ const startCalibration = () => {
patternHeight: patternHeight.value,
patternWidth: patternWidth.value,
boardType: boardType.value,
useMrCal: useMrCal.value,
useOldPattern: useOldPattern.value,
tagFamily: tagFamily.value
});
Expand Down Expand Up @@ -196,8 +201,6 @@ const endCalibration = () => {
});
};
let drawAllSnapshots = ref(true);
let showCalDialog = ref(false);
let selectedVideoFormat = ref<VideoFormat | undefined>(undefined);
const setSelectedVideoFormat = (format: VideoFormat) => {
Expand Down Expand Up @@ -248,7 +251,7 @@ const setSelectedVideoFormat = (format: VideoFormat) => {
<pv-select
v-model="useStateStore().calibrationData.videoFormatIndex"
label="Resolution"
:select-cols="8"
:select-cols="7"
:disabled="isCalibrating"
tooltip="Resolution to calibrate at (you will have to calibrate every resolution you use 3D mode on)"
:items="getUniqueVideoResolutionStrings()"
Expand All @@ -259,14 +262,14 @@ const setSelectedVideoFormat = (format: VideoFormat) => {
label="Decimation"
tooltip="Resolution to which camera frames are downscaled for detection. Calibration still uses full-res"
:items="calibrationDivisors"
:select-cols="8"
:select-cols="7"
@input="(v) => useCameraSettingsStore().changeCurrentPipelineSetting({ streamingFrameDivisor: v }, false)"
/>
<pv-select
v-model="boardType"
label="Board Type"
tooltip="Calibration board pattern to use"
:select-cols="8"
:select-cols="7"
:items="['Chessboard', 'Charuco']"
:disabled="isCalibrating"
/>
Expand All @@ -275,7 +278,7 @@ const setSelectedVideoFormat = (format: VideoFormat) => {
v-model="tagFamily"
label="Tag Family"
tooltip="Dictionary of aruco markers on the charuco board"
:select-cols="8"
:select-cols="7"
:items="['Dict_4X4_1000', 'Dict_5X5_1000', 'Dict_6X6_1000', 'Dict_7X7_1000']"
:disabled="isCalibrating"
/>
Expand All @@ -285,7 +288,7 @@ const setSelectedVideoFormat = (format: VideoFormat) => {
tooltip="Spacing between pattern features in inches"
:disabled="isCalibrating"
:rules="[(v) => v > 0 || 'Size must be positive']"
:label-cols="4"
:label-cols="5"
/>
<pv-number-input
v-show="boardType == CalibrationBoardTypes.Charuco"
Expand All @@ -294,42 +297,39 @@ const setSelectedVideoFormat = (format: VideoFormat) => {
tooltip="Size of the tag markers in inches must be smaller than pattern spacing"
:disabled="isCalibrating"
:rules="[(v) => v > 0 || 'Size must be positive']"
:label-cols="4"
:label-cols="5"
/>
<pv-number-input
v-model="patternWidth"
label="Board Width (squares)"
tooltip="Width of the board in dots or chessboard squares"
:disabled="isCalibrating"
:rules="[(v) => v >= 4 || 'Width must be at least 4']"
:label-cols="4"
:label-cols="5"
/>
<pv-number-input
v-model="patternHeight"
label="Board Height (squares)"
tooltip="Height of the board in dots or chessboard squares"
:disabled="isCalibrating"
:rules="[(v) => v >= 4 || 'Height must be at least 4']"
:label-cols="4"
:label-cols="5"
/>
<pv-switch
v-show="boardType == CalibrationBoardTypes.Charuco"
v-model="useOldPattern"
label="Old OpenCV Pattern"
:disabled="isCalibrating"
tooltip="If enabled, Photon will use the old OpenCV pattern for calibration."
:label-cols="4"
:label-cols="5"
/>
<pv-switch
v-model="useMrCal"
label="Try using MrCal over OpenCV"
:disabled="!useSettingsStore().general.mrCalWorking || isCalibrating"
tooltip="If enabled, Photon will (try to) use MrCal instead of OpenCV for camera calibration."
:label-cols="5"
/>
<v-banner
v-show="useSettingsStore().general.mrCalWorking"
rounded
color="secondary"
text-color="white"
class="mt-3"
icon="mdi-alert-circle-outline"
>
Mrcal was successfully loaded, and will be used!
</v-banner>
<v-banner
v-show="!useSettingsStore().general.mrCalWorking"
rounded
Expand Down Expand Up @@ -418,17 +418,12 @@ const setSelectedVideoFormat = (format: VideoFormat) => {
</v-col>
</v-row>
<v-row>
<v-col v-if="tooManyPoints" :cols="12">
<v-banner rounded color="red" text-color="white" class="mt-3" icon="mdi-alert-circle-outline">
Too many corners - finish calibration now!
</v-banner>
</v-col>
<v-col :cols="6">
<v-btn
small
color="secondary"
style="width: 100%"
:disabled="!settingsValid || tooManyPoints"
:disabled="!settingsValid"
@click="isCalibrating ? useCameraSettingsStore().takeCalibrationSnapshot() : startCalibration()"
>
<v-icon left class="calib-btn-icon"> {{ isCalibrating ? "mdi-camera" : "mdi-flag-outline" }} </v-icon>
Expand Down Expand Up @@ -468,16 +463,6 @@ const setSelectedVideoFormat = (format: VideoFormat) => {
</v-btn>
</v-col>
</v-row>
<v-row v-if="isCalibrating" style="display: flex; flex-direction: column">
<pv-switch
v-model="drawAllSnapshots"
class="pt-2"
label="Draw Collected Corners"
:switch-cols="8"
tooltip="Draw all snapshots"
@input="(args) => useCameraSettingsStore().changeCurrentPipelineSetting({ drawAllSnapshots: args }, false)"
/>
</v-row>
</div>
</v-card>
<v-dialog v-model="showCalibEndDialog" width="500px" :persistent="true">
Expand Down
Loading

0 comments on commit 8807195

Please sign in to comment.