- Added Image Upload Node
- Added Black & White Image Threshold Filter Node - Changed Color of Node Headers to #58a6ff - Misc Changes
This commit is contained in:
parent
60737aa68f
commit
4c4623fa71
@ -17,11 +17,13 @@ SERVER_URL = "http://localhost:5000"
|
||||
CHECKIN_ENDPOINT = f"{SERVER_URL}/api/agent/checkin"
|
||||
CONFIG_ENDPOINT = f"{SERVER_URL}/api/agent/config"
|
||||
DATA_POST_ENDPOINT = f"{SERVER_URL}/api/agent/data"
|
||||
HEARTBEAT_ENDPOINT = f"{SERVER_URL}/api/agent/heartbeat"
|
||||
|
||||
HOSTNAME = socket.gethostname().lower()
|
||||
RANDOM_SUFFIX = uuid.uuid4().hex[:8]
|
||||
AGENT_ID = f"{HOSTNAME}-agent-{RANDOM_SUFFIX}"
|
||||
|
||||
# Default poll interval for config. Adjust as needed.
|
||||
CONFIG_POLL_INTERVAL = 5
|
||||
|
||||
# ---------------- State ----------------
|
||||
@ -31,6 +33,14 @@ capture_thread_started = False
|
||||
current_interval = 1000
|
||||
config_ready = threading.Event()
|
||||
overlay_visible = True
|
||||
heartbeat_thread_started = False
|
||||
|
||||
# Track if we have a valid connection to Borealis
|
||||
IS_CONNECTED = False
|
||||
CONNECTION_LOST_REPORTED = False
|
||||
|
||||
# Keep a copy of the last config to avoid repeated provisioning
|
||||
LAST_CONFIG = {}
|
||||
|
||||
# ---------------- Signal Bridge ----------------
|
||||
class RegionLauncher(QtCore.QObject):
|
||||
@ -45,24 +55,50 @@ class RegionLauncher(QtCore.QObject):
|
||||
|
||||
region_launcher = None
|
||||
|
||||
# ---------------- Agent Networking ----------------
|
||||
def check_in():
|
||||
try:
|
||||
requests.post(CHECKIN_ENDPOINT, json={"agent_id": AGENT_ID, "hostname": HOSTNAME})
|
||||
print(f"[INFO] Agent ID: {AGENT_ID}")
|
||||
except Exception as e:
|
||||
print(f"[ERROR] Check-in failed: {e}")
|
||||
# ---------------- Helper: Reconnect ----------------
|
||||
def reconnect():
|
||||
"""
|
||||
Attempt to connect to Borealis until successful.
|
||||
Sets IS_CONNECTED = True upon success.
|
||||
"""
|
||||
global IS_CONNECTED, CONNECTION_LOST_REPORTED
|
||||
while not IS_CONNECTED:
|
||||
try:
|
||||
requests.post(CHECKIN_ENDPOINT, json={"agent_id": AGENT_ID, "hostname": HOSTNAME}, timeout=5)
|
||||
IS_CONNECTED = True
|
||||
CONNECTION_LOST_REPORTED = False
|
||||
print(f"[INFO] Agent ID: {AGENT_ID} connected to Borealis.")
|
||||
except Exception:
|
||||
if not CONNECTION_LOST_REPORTED:
|
||||
print(f"[CONNECTION LOST] Attempting to Reconnect to Borealis Server at {SERVER_URL}")
|
||||
CONNECTION_LOST_REPORTED = True
|
||||
time.sleep(10)
|
||||
|
||||
# ---------------- Networking ----------------
|
||||
def poll_for_config():
|
||||
"""
|
||||
Polls for agent configuration from Borealis.
|
||||
Returns a config dict or None on failure.
|
||||
"""
|
||||
try:
|
||||
res = requests.get(CONFIG_ENDPOINT, params={"agent_id": AGENT_ID})
|
||||
res = requests.get(CONFIG_ENDPOINT, params={"agent_id": AGENT_ID}, timeout=5)
|
||||
if res.status_code == 200:
|
||||
return res.json()
|
||||
except Exception as e:
|
||||
print(f"[ERROR] Config polling failed: {e}")
|
||||
else:
|
||||
print(f"[ERROR] Config polling returned status: {res.status_code}")
|
||||
except Exception:
|
||||
# We'll let the config_loop handle setting IS_CONNECTED = False
|
||||
pass
|
||||
return None
|
||||
|
||||
def send_image_data(image):
|
||||
"""
|
||||
Attempts to POST screenshot data to Borealis if IS_CONNECTED is True.
|
||||
"""
|
||||
global IS_CONNECTED, CONNECTION_LOST_REPORTED
|
||||
if not IS_CONNECTED:
|
||||
return # Skip sending if not connected
|
||||
|
||||
try:
|
||||
buffer = BytesIO()
|
||||
image.save(buffer, format="PNG")
|
||||
@ -72,12 +108,35 @@ def send_image_data(image):
|
||||
"agent_id": AGENT_ID,
|
||||
"type": "screenshot",
|
||||
"image_base64": encoded
|
||||
})
|
||||
}, timeout=5)
|
||||
|
||||
if response.status_code != 200:
|
||||
print(f"[ERROR] Screenshot POST failed: {response.status_code} - {response.text}")
|
||||
except Exception as e:
|
||||
print(f"[ERROR] Failed to send image: {e}")
|
||||
if IS_CONNECTED and not CONNECTION_LOST_REPORTED:
|
||||
# Only report once
|
||||
print(f"[CONNECTION LOST] Attempting to Reconnect to Borealis Server at {SERVER_URL}")
|
||||
CONNECTION_LOST_REPORTED = True
|
||||
IS_CONNECTED = False
|
||||
|
||||
def send_heartbeat():
|
||||
"""
|
||||
Attempts to send heartbeat if IS_CONNECTED is True.
|
||||
"""
|
||||
global IS_CONNECTED, CONNECTION_LOST_REPORTED
|
||||
if not IS_CONNECTED:
|
||||
return
|
||||
|
||||
try:
|
||||
response = requests.get(HEARTBEAT_ENDPOINT, params={"agent_id": AGENT_ID}, timeout=5)
|
||||
if response.status_code != 200:
|
||||
print(f"[ERROR] Heartbeat returned status: {response.status_code}")
|
||||
raise ValueError("Heartbeat not 200")
|
||||
except Exception:
|
||||
if IS_CONNECTED and not CONNECTION_LOST_REPORTED:
|
||||
print(f"[CONNECTION LOST] Attempting to Reconnect to Borealis Server at {SERVER_URL}")
|
||||
CONNECTION_LOST_REPORTED = True
|
||||
IS_CONNECTED = False
|
||||
|
||||
# ---------------- Region Overlay ----------------
|
||||
class ScreenshotRegion(QtWidgets.QWidget):
|
||||
@ -140,12 +199,15 @@ class ScreenshotRegion(QtWidgets.QWidget):
|
||||
geo = self.geometry()
|
||||
return geo.x(), geo.y(), geo.width(), geo.height()
|
||||
|
||||
|
||||
# ---------------- Threads ----------------
|
||||
def capture_loop():
|
||||
"""
|
||||
Continuously captures the user-defined region every current_interval ms if connected.
|
||||
"""
|
||||
global current_interval
|
||||
print("[INFO] Screenshot capture loop started")
|
||||
config_ready.wait()
|
||||
|
||||
while region_widget is None:
|
||||
print("[WAIT] Waiting for region widget to initialize...")
|
||||
time.sleep(0.2)
|
||||
@ -153,7 +215,7 @@ def capture_loop():
|
||||
print(f"[INFO] Agent Capturing Region: x:{region_widget.x()} y:{region_widget.y()} w:{region_widget.width()} h:{region_widget.height()}")
|
||||
|
||||
while True:
|
||||
if overlay_visible:
|
||||
if overlay_visible and IS_CONNECTED:
|
||||
x, y, w, h = region_widget.get_geometry()
|
||||
try:
|
||||
img = ImageGrab.grab(bbox=(x, y, x + w, y + h))
|
||||
@ -162,39 +224,87 @@ def capture_loop():
|
||||
print(f"[ERROR] Screenshot error: {e}")
|
||||
time.sleep(current_interval / 1000)
|
||||
|
||||
def config_loop():
|
||||
global region_widget, capture_thread_started, current_interval, overlay_visible
|
||||
check_in()
|
||||
def heartbeat_loop():
|
||||
"""
|
||||
Heartbeat every 10 seconds if connected.
|
||||
If it fails, we set IS_CONNECTED=False, and rely on config_loop to reconnect.
|
||||
"""
|
||||
while True:
|
||||
send_heartbeat()
|
||||
time.sleep(10)
|
||||
|
||||
def config_loop():
|
||||
"""
|
||||
1) Reconnect (if needed) until the agent can contact Borealis
|
||||
2) Poll for config. If new config is different from LAST_CONFIG, re-provision
|
||||
3) If poll_for_config fails or we see connection issues, set IS_CONNECTED=False
|
||||
and loop back to reconnect() on next iteration
|
||||
"""
|
||||
global capture_thread_started, heartbeat_thread_started
|
||||
global current_interval, overlay_visible, LAST_CONFIG, IS_CONNECTED
|
||||
|
||||
while True:
|
||||
# If we aren't connected, reconnect
|
||||
if not IS_CONNECTED:
|
||||
reconnect()
|
||||
|
||||
# Attempt to get config
|
||||
config = poll_for_config()
|
||||
if config and config.get("task") == "screenshot":
|
||||
print("[PROVISIONING] Agent Provisioning Command Issued by Borealis")
|
||||
x = config.get("x", 100)
|
||||
y = config.get("y", 100)
|
||||
w = config.get("w", 300)
|
||||
h = config.get("h", 200)
|
||||
current_interval = config.get("interval", 1000)
|
||||
overlay_visible = config.get("visible", True)
|
||||
if config is None:
|
||||
# This means we had a poll failure, so mark disconnected and retry.
|
||||
IS_CONNECTED = False
|
||||
continue
|
||||
|
||||
print(f"[PROVISIONING] Agent Configured as \"Screenshot\" Collector w/ Polling Rate of <{current_interval/1000:.1f}s>")
|
||||
# If it has a "task" : "screenshot"
|
||||
if config.get("task") == "screenshot":
|
||||
# Compare to last known config
|
||||
if config != LAST_CONFIG:
|
||||
# Something changed, so provision
|
||||
print("[PROVISIONING] Agent Provisioning Command Issued by Borealis")
|
||||
|
||||
if not region_widget:
|
||||
region_launcher.trigger.emit(x, y, w, h)
|
||||
elif region_widget:
|
||||
region_widget.setVisible(overlay_visible)
|
||||
x = config.get("x", 100)
|
||||
y = config.get("y", 100)
|
||||
w = config.get("w", 300)
|
||||
h = config.get("h", 200)
|
||||
current_interval = config.get("interval", 1000)
|
||||
overlay_visible = config.get("visible", True)
|
||||
|
||||
print('[PROVISIONING] Agent Configured as "Screenshot" Collector')
|
||||
print(f'[PROVISIONING] Polling Rate: {current_interval / 1000:.1f}s')
|
||||
|
||||
# Show or move region widget
|
||||
if not region_widget:
|
||||
region_launcher.trigger.emit(x, y, w, h)
|
||||
else:
|
||||
region_widget.setGeometry(x, y, w, h)
|
||||
region_widget.setVisible(overlay_visible)
|
||||
|
||||
LAST_CONFIG = config
|
||||
|
||||
# Make sure capture thread is started
|
||||
if not capture_thread_started:
|
||||
threading.Thread(target=capture_loop, daemon=True).start()
|
||||
capture_thread_started = True
|
||||
|
||||
# Make sure heartbeat thread is started
|
||||
if not heartbeat_thread_started:
|
||||
threading.Thread(target=heartbeat_loop, daemon=True).start()
|
||||
heartbeat_thread_started = True
|
||||
|
||||
# Signal that provisioning is done so capture thread can run
|
||||
config_ready.set()
|
||||
|
||||
# Sleep before next poll
|
||||
time.sleep(CONFIG_POLL_INTERVAL)
|
||||
|
||||
def launch_region(x, y, w, h):
|
||||
"""
|
||||
Initializes the screenshot region overlay widget exactly once.
|
||||
"""
|
||||
global region_widget
|
||||
if region_widget:
|
||||
return
|
||||
print(f"[INFO] Agent Starting...")
|
||||
print("[INFO] Agent Starting...")
|
||||
region_widget = ScreenshotRegion(x, y, w, h)
|
||||
region_widget.show()
|
||||
|
||||
@ -202,5 +312,9 @@ def launch_region(x, y, w, h):
|
||||
if __name__ == "__main__":
|
||||
app_instance = QtWidgets.QApplication(sys.argv)
|
||||
region_launcher = RegionLauncher()
|
||||
|
||||
# Start the config loop in a background thread
|
||||
threading.Thread(target=config_loop, daemon=True).start()
|
||||
|
||||
# Enter Qt main event loop
|
||||
sys.exit(app_instance.exec_())
|
||||
|
||||
@ -51,6 +51,7 @@
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
font-weight: bold;
|
||||
color: #58a6ff;
|
||||
font-size: 10px;
|
||||
}
|
||||
.borealis-node-content {
|
||||
@ -68,7 +69,7 @@ input, select, button {
|
||||
background-color: #2a2a2a;
|
||||
color: #ccc;
|
||||
border: 1px solid #444;
|
||||
font-size: 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
/* Label / Dark Text styling */
|
||||
|
||||
@ -70,17 +70,6 @@ const APINode = ({ id, data }) => {
|
||||
});
|
||||
};
|
||||
|
||||
const resetAgent = () => {
|
||||
if (!selectedAgent) return;
|
||||
fetch("/api/agent/reset", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ agent_id: selectedAgent })
|
||||
}).then(() => {
|
||||
setSelectedAgent("");
|
||||
});
|
||||
};
|
||||
|
||||
const toggleOverlay = () => {
|
||||
const newVisibility = !overlayVisible;
|
||||
setOverlayVisible(newVisibility);
|
||||
@ -148,13 +137,7 @@ const APINode = ({ id, data }) => {
|
||||
style={{ flex: 1, fontSize: "9px" }}
|
||||
onClick={provisionAgent}
|
||||
>
|
||||
Provision
|
||||
</button>
|
||||
<button
|
||||
style={{ flex: 1, fontSize: "9px" }}
|
||||
onClick={resetAgent}
|
||||
>
|
||||
Reset Agent
|
||||
(Re)Provision
|
||||
</button>
|
||||
<button
|
||||
style={{ flex: 1, fontSize: "9px" }}
|
||||
|
||||
303
Data/WebUI/src/nodes/Image Processing/BW_Threshold.jsx
Normal file
303
Data/WebUI/src/nodes/Image Processing/BW_Threshold.jsx
Normal file
@ -0,0 +1,303 @@
|
||||
/**
|
||||
* =================================================================
|
||||
* Borealis Threshold Node
|
||||
* with Per-Node Unique ID & BorealisValueBus Persistence
|
||||
* =================================================================
|
||||
*
|
||||
* GOALS:
|
||||
* 1) Generate a unique ID for this node instance (the "threshold node instance ID").
|
||||
* 2) Store that ID in node.data._thresholdId if it’s not already there.
|
||||
* 3) Use that ID to read/write the threshold from window.BorealisValueBus,
|
||||
* so that if the node is forcibly unmounted & remounted but re-uses the
|
||||
* same node.data._thresholdId, we restore the slider.
|
||||
*
|
||||
* HOW IT WORKS:
|
||||
* - On mount, we check if node.data._thresholdId exists.
|
||||
* - If yes, we use that as our "instance ID".
|
||||
* - If no, we create a new random ID (like a GUID) and store it in node.data._thresholdId
|
||||
* and also do a one-time `setNodes()` call to update the node data so it persists.
|
||||
* - Once we have that instance ID, we look up
|
||||
* `window.BorealisValueBus["th|" + instanceId]` for a saved threshold.
|
||||
* - If found, we initialize the slider with that. Otherwise 128.
|
||||
* - On slider change, we update that bus key with the new threshold.
|
||||
* - On each unmount/mount cycle, if the node’s data still has `_thresholdId`,
|
||||
* we reload from the same bus key, preventing a “rubber-banding” reset.
|
||||
*
|
||||
* NOTE:
|
||||
* - We do call setNodes() once if we have to embed the newly generated ID into node.data.
|
||||
* But we do it carefully, minimal, so we don't forcibly re-create the node.
|
||||
* If your parent code overwrites node.data, we lose the ID.
|
||||
*
|
||||
* WARNING:
|
||||
* - If the parent changes the node’s ID or data every time, there's no fix. This is the
|
||||
* best we can do entirely inside this node’s code.
|
||||
*/
|
||||
|
||||
import React, { useEffect, useRef, useState } from "react";
|
||||
import { Handle, Position, useStore, useReactFlow } from "reactflow";
|
||||
|
||||
// Ensure BorealisValueBus exists
|
||||
if (!window.BorealisValueBus) {
|
||||
window.BorealisValueBus = {};
|
||||
}
|
||||
|
||||
// Default global update rate
|
||||
if (!window.BorealisUpdateRate) {
|
||||
window.BorealisUpdateRate = 100;
|
||||
}
|
||||
|
||||
/**
|
||||
* Utility to generate a random GUID-like string
|
||||
*/
|
||||
function generateGUID() {
|
||||
// Very simple random hex approach
|
||||
return "xxxx-4xxx-yxxx-xxxx".replace(/[xy]/g, function (c) {
|
||||
const r = Math.random() * 16 | 0;
|
||||
const v = c === "x" ? r : (r & 0x3 | 0x8);
|
||||
return v.toString(16);
|
||||
});
|
||||
}
|
||||
|
||||
const PersistentThresholdNode = ({ id, data }) => {
|
||||
const edges = useStore((state) => state.edges);
|
||||
const { setNodes } = useReactFlow(); // so we can store our unique ID in node.data if needed
|
||||
|
||||
// We'll store:
|
||||
// 1) The node’s unique threshold instance ID (guid)
|
||||
// 2) The slider threshold in local React state
|
||||
const [instanceId, setInstanceId] = useState(() => {
|
||||
// See if we already have an ID in data._thresholdId
|
||||
const existing = data?._thresholdId;
|
||||
return existing || ""; // If not found, empty string for now
|
||||
});
|
||||
|
||||
const [threshold, setThreshold] = useState(128);
|
||||
|
||||
// For checking upstream changes
|
||||
const [renderValue, setRenderValue] = useState("");
|
||||
const valueRef = useRef(renderValue);
|
||||
|
||||
// MOUNT / UNMOUNT debug
|
||||
useEffect(() => {
|
||||
console.log(`[ThresholdNode:${id}] MOUNTED (instanceId=${instanceId || "none"})`);
|
||||
return () => {
|
||||
console.log(`[ThresholdNode:${id}] UNMOUNTED (instanceId=${instanceId || "none"})`);
|
||||
};
|
||||
}, [id, instanceId]);
|
||||
|
||||
/**
|
||||
* On first mount, we see if we have an instanceId in node.data.
|
||||
* If not, we create one, call setNodes() to store it in data._thresholdId.
|
||||
*/
|
||||
useEffect(() => {
|
||||
if (!instanceId) {
|
||||
// Generate a new ID
|
||||
const newId = generateGUID();
|
||||
console.log(`[ThresholdNode:${id}] Generating new instanceId=${newId}`);
|
||||
|
||||
// Insert it into this node’s data
|
||||
setNodes((prevNodes) =>
|
||||
prevNodes.map((n) => {
|
||||
if (n.id === id) {
|
||||
return {
|
||||
...n,
|
||||
data: {
|
||||
...n.data,
|
||||
_thresholdId: newId
|
||||
}
|
||||
};
|
||||
}
|
||||
return n;
|
||||
})
|
||||
);
|
||||
setInstanceId(newId);
|
||||
} else {
|
||||
console.log(`[ThresholdNode:${id}] Found existing instanceId=${instanceId}`);
|
||||
}
|
||||
}, [id, instanceId, setNodes]);
|
||||
|
||||
/**
|
||||
* Once we have an instanceId (existing or new), load the threshold from BorealisValueBus
|
||||
* We skip if we haven't assigned instanceId yet.
|
||||
*/
|
||||
useEffect(() => {
|
||||
if (!instanceId) return; // wait for the ID to be set
|
||||
|
||||
// Look for a previously saved threshold in the bus
|
||||
const savedKey = `th|${instanceId}`;
|
||||
let savedVal = window.BorealisValueBus[savedKey];
|
||||
if (typeof savedVal !== "number") {
|
||||
// default to 128
|
||||
savedVal = 128;
|
||||
}
|
||||
console.log(`[ThresholdNode:${id}] init threshold from bus key=${savedKey} => ${savedVal}`);
|
||||
setThreshold(savedVal);
|
||||
}, [id, instanceId]);
|
||||
|
||||
/**
|
||||
* Threshold slider handle
|
||||
*/
|
||||
const handleSliderChange = (e) => {
|
||||
const newVal = parseInt(e.target.value, 10);
|
||||
setThreshold(newVal);
|
||||
console.log(`[ThresholdNode:${id}] Slider => ${newVal}`);
|
||||
|
||||
// Immediately store in BorealisValueBus
|
||||
if (instanceId) {
|
||||
const savedKey = `th|${instanceId}`;
|
||||
window.BorealisValueBus[savedKey] = newVal;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Helper function to apply threshold to base64
|
||||
*/
|
||||
const applyThreshold = async (base64Data, cutoff) => {
|
||||
if (!base64Data || typeof base64Data !== "string") {
|
||||
return "";
|
||||
}
|
||||
return new Promise((resolve) => {
|
||||
const img = new Image();
|
||||
img.crossOrigin = "anonymous";
|
||||
|
||||
img.onload = () => {
|
||||
const canvas = document.createElement("canvas");
|
||||
canvas.width = img.width;
|
||||
canvas.height = img.height;
|
||||
const ctx = canvas.getContext("2d");
|
||||
ctx.drawImage(img, 0, 0);
|
||||
|
||||
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
|
||||
const dataArr = imageData.data;
|
||||
|
||||
for (let i = 0; i < dataArr.length; i += 4) {
|
||||
const avg = (dataArr[i] + dataArr[i + 1] + dataArr[i + 2]) / 3;
|
||||
const color = avg < cutoff ? 0 : 255;
|
||||
dataArr[i] = color;
|
||||
dataArr[i + 1] = color;
|
||||
dataArr[i + 2] = color;
|
||||
}
|
||||
ctx.putImageData(imageData, 0, 0);
|
||||
|
||||
resolve(canvas.toDataURL("image/png"));
|
||||
};
|
||||
|
||||
img.onerror = () => resolve(base64Data);
|
||||
img.src = base64Data;
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* Main logic loop (polling)
|
||||
*/
|
||||
useEffect(() => {
|
||||
let currentRate = window.BorealisUpdateRate || 100;
|
||||
let intervalId = null;
|
||||
|
||||
const runNodeLogic = async () => {
|
||||
// find upstream edge
|
||||
const inputEdge = edges.find((e) => e.target === id);
|
||||
if (inputEdge && inputEdge.source) {
|
||||
const upstreamValue = window.BorealisValueBus[inputEdge.source] ?? "";
|
||||
if (upstreamValue !== valueRef.current) {
|
||||
const thresholded = await applyThreshold(upstreamValue, threshold);
|
||||
valueRef.current = thresholded;
|
||||
setRenderValue(thresholded);
|
||||
window.BorealisValueBus[id] = thresholded;
|
||||
}
|
||||
} else {
|
||||
// No upstream
|
||||
if (valueRef.current) {
|
||||
console.log(`[ThresholdNode:${id}] no upstream => clear`);
|
||||
}
|
||||
valueRef.current = "";
|
||||
setRenderValue("");
|
||||
window.BorealisValueBus[id] = "";
|
||||
}
|
||||
};
|
||||
|
||||
const startInterval = () => {
|
||||
intervalId = setInterval(runNodeLogic, currentRate);
|
||||
};
|
||||
startInterval();
|
||||
|
||||
// watch for update rate changes
|
||||
const monitor = setInterval(() => {
|
||||
const newRate = window.BorealisUpdateRate || 100;
|
||||
if (newRate !== currentRate) {
|
||||
currentRate = newRate;
|
||||
clearInterval(intervalId);
|
||||
startInterval();
|
||||
}
|
||||
}, 500);
|
||||
|
||||
return () => {
|
||||
clearInterval(intervalId);
|
||||
clearInterval(monitor);
|
||||
};
|
||||
}, [id, edges, threshold]);
|
||||
|
||||
/**
|
||||
* If threshold changes, re-apply to upstream immediately (if we have upstream)
|
||||
*/
|
||||
useEffect(() => {
|
||||
const inputEdge = edges.find((e) => e.target === id);
|
||||
if (!inputEdge) {
|
||||
return;
|
||||
}
|
||||
const upstreamVal = window.BorealisValueBus[inputEdge.source] ?? "";
|
||||
if (!upstreamVal) {
|
||||
return;
|
||||
}
|
||||
applyThreshold(upstreamVal, threshold).then((transformed) => {
|
||||
valueRef.current = transformed;
|
||||
setRenderValue(transformed);
|
||||
window.BorealisValueBus[id] = transformed;
|
||||
});
|
||||
}, [threshold, edges, id]);
|
||||
|
||||
// Render the node
|
||||
return (
|
||||
<div className="borealis-node">
|
||||
<Handle type="target" position={Position.Left} className="borealis-handle" />
|
||||
<div className="borealis-node-header" style={{ fontSize: "11px" }}>
|
||||
Threshold Node
|
||||
</div>
|
||||
|
||||
<div className="borealis-node-content" style={{ fontSize: "9px" }}>
|
||||
<div style={{ marginBottom: "6px", color: "#ccc" }}>
|
||||
<strong>Node ID:</strong> {id} <br />
|
||||
<strong>Instance ID:</strong> {instanceId || "(none)"} <br />
|
||||
(Slider persists across re-mount if data._thresholdId is preserved)
|
||||
</div>
|
||||
|
||||
<label>Threshold ({threshold}):</label>
|
||||
<input
|
||||
type="range"
|
||||
min="0"
|
||||
max="255"
|
||||
value={threshold}
|
||||
onChange={handleSliderChange}
|
||||
style={{
|
||||
width: "100%",
|
||||
marginBottom: "6px",
|
||||
background: "#2a2a2a"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<Handle type="source" position={Position.Right} className="borealis-handle" />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
// Export as a React Flow Node
|
||||
export default {
|
||||
type: "PersistentThresholdNode",
|
||||
label: "Persistent Threshold Node",
|
||||
description: `
|
||||
Stores a unique ID in node.data._thresholdId and uses it to track the slider threshold
|
||||
in BorealisValueBus, so the slider doesn't reset if the node is re-mounted with the same data.
|
||||
`,
|
||||
content: "Convert incoming base64 image to black & white thresholded image, with node-level persistence.",
|
||||
component: PersistentThresholdNode
|
||||
};
|
||||
173
Data/WebUI/src/nodes/Image Processing/Upload_Image.jsx
Normal file
173
Data/WebUI/src/nodes/Image Processing/Upload_Image.jsx
Normal file
@ -0,0 +1,173 @@
|
||||
/**
|
||||
* ==================================================
|
||||
* Borealis - Image Upload Node (Raw Base64 Output)
|
||||
* ==================================================
|
||||
*
|
||||
* COMPONENT ROLE:
|
||||
* This node lets the user upload an image file (JPG/JPEG/PNG),
|
||||
* reads it as a data URL, then strips off the "data:image/*;base64,"
|
||||
* prefix, storing only the raw base64 data in BorealisValueBus.
|
||||
*
|
||||
* IMPORTANT:
|
||||
* - No upstream connector (target handle) is provided.
|
||||
* - The raw base64 is pushed out to downstream nodes via source handle.
|
||||
* - Your viewer (or other downstream node) must prepend "data:image/png;base64,"
|
||||
* or the appropriate MIME string for display.
|
||||
*/
|
||||
|
||||
import React, { useEffect, useRef, useState } from "react";
|
||||
import { Handle, Position, useReactFlow } from "reactflow";
|
||||
|
||||
// Global Shared Bus for Node Data Propagation
|
||||
if (!window.BorealisValueBus) {
|
||||
window.BorealisValueBus = {};
|
||||
}
|
||||
|
||||
// Global Update Rate (ms) for All Data Nodes
|
||||
if (!window.BorealisUpdateRate) {
|
||||
window.BorealisUpdateRate = 100;
|
||||
}
|
||||
|
||||
const ImageUploadNode = ({ id, data }) => {
|
||||
const { setNodes } = useReactFlow();
|
||||
|
||||
const [renderValue, setRenderValue] = useState(data?.value || "");
|
||||
const valueRef = useRef(renderValue);
|
||||
|
||||
// Handler for file uploads
|
||||
const handleFileUpload = (event) => {
|
||||
console.log("handleFileUpload triggered for node:", id);
|
||||
|
||||
// Get the file list
|
||||
const files = event.target.files || event.currentTarget.files;
|
||||
if (!files || files.length === 0) {
|
||||
console.log("No files selected or files array is empty");
|
||||
return;
|
||||
}
|
||||
|
||||
const file = files[0];
|
||||
if (!file) {
|
||||
console.log("File object not found");
|
||||
return;
|
||||
}
|
||||
|
||||
// Debugging info
|
||||
console.log("Selected file:", file.name, file.type, file.size);
|
||||
|
||||
// Validate file type
|
||||
const validTypes = ["image/jpeg", "image/png"];
|
||||
if (!validTypes.includes(file.type)) {
|
||||
console.warn("Unsupported file type in node:", id, file.type);
|
||||
return;
|
||||
}
|
||||
|
||||
// Setup FileReader
|
||||
const reader = new FileReader();
|
||||
reader.onload = (loadEvent) => {
|
||||
console.log("FileReader onload in node:", id);
|
||||
const base64DataUrl = loadEvent?.target?.result || "";
|
||||
|
||||
// Strip off the data:image/...;base64, prefix to store raw base64
|
||||
const rawBase64 = base64DataUrl.replace(/^data:image\/[a-zA-Z]+;base64,/, "");
|
||||
console.log("Raw Base64 (truncated):", rawBase64.substring(0, 50));
|
||||
|
||||
valueRef.current = rawBase64;
|
||||
setRenderValue(rawBase64);
|
||||
window.BorealisValueBus[id] = rawBase64;
|
||||
|
||||
// Update node data
|
||||
setNodes((nds) =>
|
||||
nds.map((n) =>
|
||||
n.id === id
|
||||
? { ...n, data: { ...n.data, value: rawBase64 } }
|
||||
: n
|
||||
)
|
||||
);
|
||||
};
|
||||
reader.onerror = (errorEvent) => {
|
||||
console.error("FileReader error in node:", id, errorEvent);
|
||||
};
|
||||
|
||||
// Read the file as a data URL
|
||||
reader.readAsDataURL(file);
|
||||
};
|
||||
|
||||
// Poll-based output (no upstream)
|
||||
useEffect(() => {
|
||||
let currentRate = window.BorealisUpdateRate || 100;
|
||||
let intervalId = null;
|
||||
|
||||
const runNodeLogic = () => {
|
||||
// Simply emit current value (raw base64) to the bus
|
||||
window.BorealisValueBus[id] = valueRef.current;
|
||||
};
|
||||
|
||||
const startInterval = () => {
|
||||
intervalId = setInterval(runNodeLogic, currentRate);
|
||||
};
|
||||
|
||||
startInterval();
|
||||
|
||||
// Monitor for global update rate changes
|
||||
const monitor = setInterval(() => {
|
||||
const newRate = window.BorealisUpdateRate || 100;
|
||||
if (newRate !== currentRate) {
|
||||
currentRate = newRate;
|
||||
clearInterval(intervalId);
|
||||
startInterval();
|
||||
}
|
||||
}, 250);
|
||||
|
||||
return () => {
|
||||
clearInterval(intervalId);
|
||||
clearInterval(monitor);
|
||||
};
|
||||
}, [id, setNodes]);
|
||||
|
||||
return (
|
||||
<div className="borealis-node" style={{ minWidth: "160px" }}>
|
||||
{/* No target handle because we don't accept upstream data */}
|
||||
<div className="borealis-node-header">
|
||||
{data?.label || "Raw Base64 Image Upload"}
|
||||
</div>
|
||||
|
||||
<div className="borealis-node-content">
|
||||
<div style={{ marginBottom: "8px", fontSize: "9px", color: "#ccc" }}>
|
||||
{data?.content || "Upload a JPG/PNG, store only the raw base64 in ValueBus."}
|
||||
</div>
|
||||
|
||||
<label style={{ fontSize: "9px", display: "block", marginBottom: "4px" }}>
|
||||
Upload Image File
|
||||
</label>
|
||||
|
||||
<input
|
||||
type="file"
|
||||
accept=".jpg,.jpeg,.png"
|
||||
onChange={handleFileUpload}
|
||||
style={{
|
||||
fontSize: "9px",
|
||||
padding: "4px",
|
||||
background: "#1e1e1e",
|
||||
color: "#ccc",
|
||||
border: "1px solid #444",
|
||||
borderRadius: "2px",
|
||||
width: "100%",
|
||||
marginBottom: "8px"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Handle type="source" position={Position.Right} className="borealis-handle" />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default {
|
||||
type: "ImageUploadNode_RawBase64", // Unique ID for the node type
|
||||
label: "Upload Image",
|
||||
description: `
|
||||
A node to upload an image (JPG/PNG) and store it in base64 format for later use downstream.
|
||||
`.trim(),
|
||||
content: "Upload an image, output only the raw base64 string.",
|
||||
component: ImageUploadNode
|
||||
};
|
||||
@ -81,6 +81,5 @@ Run-Step "Install Python Dependencies for Collector Agent" {
|
||||
Push-Location $venvFolder
|
||||
Write-Host "`nLaunching Borealis API Collector Agent..." -ForegroundColor Green
|
||||
Write-Host "===================================================================================="
|
||||
Write-Host "$($symbols.Running) Starting Agent..." -NoNewline
|
||||
python "Agent\api-collector-agent.py"
|
||||
Pop-Location
|
||||
@ -18,6 +18,4 @@ numpy # Numerical operations
|
||||
opencv-python # Computer vision processing
|
||||
pytesseract # OCR engine
|
||||
easyocr # Deep-learning-based OCR
|
||||
Pillow # Image processing
|
||||
|
||||
# API Collector Agent Dependencies
|
||||
Pillow # Image processing
|
||||
Loading…
x
Reference in New Issue
Block a user