Skip to content

Commit

Permalink
Create core layout for mission usage
Browse files Browse the repository at this point in the history
  • Loading branch information
Bennett-Petzold committed Mar 3, 2024
1 parent dbf98e4 commit 83d91bd
Show file tree
Hide file tree
Showing 6 changed files with 245 additions and 46 deletions.
2 changes: 2 additions & 0 deletions Cargo.lock

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 3 additions & 1 deletion Cargo.toml
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
[package]
name = "sw8s-rgui"
version = "0.1.0"
version = "0.1.1"
authors = ["Bennett Petzold <[email protected]>"]
edition = "2021"

Expand All @@ -23,4 +23,6 @@ reqwest = "0.11.24"
const_format = "0.2.32"
wry = "0.37.0"
webkit2gtk = "2.0.1"
global-hotkey = "0.4.2"
tao = "0.24.1"

2 changes: 1 addition & 1 deletion Dioxus.toml
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ watch_path = ["src", "public"]

# CSS style file

#style = ["tailwind.css"]
style = ["tailwind.css"]

# Javascript code file
script = []
Expand Down
3 changes: 2 additions & 1 deletion input.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@tailwind utilities;
html {background-color: black}
16 changes: 15 additions & 1 deletion public/tailwind.css
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@ html,
/* 6 */
-webkit-tap-highlight-color: transparent;
/* 7 */
background-color: black;
}

/*
Expand All @@ -66,6 +67,7 @@ body {
/* 1 */
line-height: inherit;
/* 2 */
background-color: black;
}

/*
Expand Down Expand Up @@ -542,4 +544,16 @@ video {
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia: ;
}
}

.flex {
display: flex;
}

.table-cell {
display: table-cell;
}

.table-row {
display: table-row;
}
264 changes: 222 additions & 42 deletions src/main.rs
Original file line number Diff line number Diff line change
Expand Up @@ -2,64 +2,244 @@

use const_format::concatcp;
use dioxus::prelude::*;
use dioxus_desktop::window;
use dioxus_desktop::wry::WebViewExtUnix;
use dioxus_desktop::{window, WindowEvent};
use log::{info, LevelFilter};
use webkit2gtk::{SettingsExt, WebViewExt};

const VIDEO_BASE: &str = "http://localhost:8888/";
const VIDEO_FRONT: &str = concatcp!(VIDEO_BASE, "mystream");
const VIDEO_BOTTOM: &str = concatcp!(VIDEO_BASE, "mystream");
const VIDEO_WIDTH_BASE: i64 = 800;
const VIDEO_HEIGHT_BASE: i64 = 600;
const VIDEO_PADDING: i64 = 10;
const VIDEO_TOTAL_WIDTH_BASE: i64 = (VIDEO_WIDTH_BASE + VIDEO_PADDING) * 2;
const SMALL_BUTTONS_MARGIN: i64 = 10;

fn main() {
// Init debug
dioxus_logger::init(LevelFilter::Info).expect("failed to init logger");

launch_desktop(app);
LaunchBuilder::desktop().launch(app);
}

fn app() -> Element {
info!("Started app");
info!("Rebuilding DOM");
let mut window_size = use_signal(|| window().inner_size());
let window_video_ratio =
f32::ceil((VIDEO_TOTAL_WIDTH_BASE as f32) / (window_size.read().width as f32)) as i64;
let video_width = VIDEO_WIDTH_BASE / window_video_ratio;
let video_height = VIDEO_HEIGHT_BASE / window_video_ratio;
let total_width = (video_width * 2) + VIDEO_PADDING;

#[cfg(target_family = "unix")]
{
let webview = window().webview.webview();
if let Some(settings) = webview.settings() {
enable_web_features(&settings);

#[cfg(target_os = "linux")]
allow_all_permissions(&webview);
}
}
// Redraw element sizes when window is resized
window().create_wry_event_handler(move |event, _| {
if let tao::event::Event::WindowEvent {
event: win_event, ..
} = event
{
if let WindowEvent::Resized(resize_event) = win_event {
// Prevent dupe triggers
if *window_size.read() != *resize_event {
info!("Resize event!");
window_size.set(*resize_event);
}
}
};
});

rsx! {
h1 { "SW8S-rgui" }
iframe { width : 320, height : 240, scrolling : false, src : VIDEO_FRONT, allow : "*" }
iframe { width : 320, height : 240, scrolling : false, src : VIDEO_BOTTOM, allow : "*" }
}
}
div {
height : "100vh",
width : "100vw",
left : "0",
top : "0",
background_color : "gray",
position : "absolute",
div {
display : "flex",
justify_content : "center",
align_items : "center",
flex_direction : "column",
height : "98%",
div {
display : "flex",
justify_content : "center",
div {
display : "flex,table-row",
"justify-content": "center",
margin : "auto",
border_spacing : VIDEO_PADDING.to_string() + "px",
div {
display : "table-cell",
"justify-content": "center",
margin : "auto",
h2 { style: "text-align: center", "Front" }
iframe {
width : video_width, height : video_height, scrolling : false, src : VIDEO_FRONT, allow : "*"
}
}
div {
display : "table-cell",
margin : "auto",
h2 { style: "text-align: center", "Bottom" }
iframe { width : video_width, height : video_height, scrolling : false, src : VIDEO_BOTTOM, allow : "*" }
}
}
}
div {
display : "flex",
text_align: "left",
border : "2px solid DarkGreen",
width : total_width.to_string() + "px",
height : "100%",
position : "relative",
background_color : "LightGray",
padding_left : "5px",
overflow_y : "auto",
flex_direction : "column-reverse",
p {
margin : "0px",

fn enable_web_features(settings: &webkit2gtk::Settings) {
info!("enabling webrtc");
settings.set_enable_webrtc(true);
settings.set_enable_media_stream(true);
settings.set_enable_mediasource(true);
settings.set_enable_media(true);
settings.set_enable_media_capabilities(true);
settings.set_enable_encrypted_media(true);
// settings.set_enable_mock_capture_devices(true);
settings.set_media_playback_requires_user_gesture(false);
settings.set_media_playback_allows_inline(true);
settings.set_media_content_types_requiring_hardware_support(Some("video/m3u8"));
}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
"Similique ut doloremque facilis in laboriosam sed voluptatum. Aut asperiores laborum voluptatum cupiditate fugiat. Veritatis autem saepe doloremque eveniet eos. Minus eum quos libero cupiditate."
br {}
br {}

#[cfg(target_os = "linux")]
fn allow_all_permissions(webview: &webkit2gtk::WebView) {
info!("giving all permissions");
use webkit2gtk::PermissionRequestExt;
// Allow all permission requests for debugging
let _ = webview.connect_permission_request(move |_, request| {
request.allow();
true
});
span {
style : "color: red",
b {
"> COMMAND OUT TO ROBOT"
}
}
br {}
"CLI output from robot"
br {}
"CLI output from robot #2"
}
}
br {}
div {
display : "flex",
justify_content: "space-between",
width : total_width.to_string() + "px",
button {
style : "font-size : 16px",
width : "150px",
margin_left : SMALL_BUTTONS_MARGIN.to_string() + "px",
margin_right : SMALL_BUTTONS_MARGIN.to_string() + "px",
onclick : move |_| {
info!("Selected Run Tests");
},
b {
"Run Tests"
}
}
button {
style : "font-size : 16px",
width : "150px",
margin_left : SMALL_BUTTONS_MARGIN.to_string() + "px",
margin_right : SMALL_BUTTONS_MARGIN.to_string() + "px",
onclick : move |_| {
info!("Selected Mission Graph");
},
b {
"Mission Graph"
}
}
button {
style : "font-size : 16px",
width : "150px",
margin_left : SMALL_BUTTONS_MARGIN.to_string() + "px",
margin_right : SMALL_BUTTONS_MARGIN.to_string() + "px",
onclick : move |_| {
info!("Selected Set Data Dir");
},
b {
"Set Data Dir"
}
}
button {
style : "font-size : 16px",
width : "150px",
margin_left : SMALL_BUTTONS_MARGIN.to_string() + "px",
margin_right : SMALL_BUTTONS_MARGIN.to_string() + "px",
onclick : move |_| {
info!("Selected PLACEHOLDER");
},
b {
"PLACEHOLDER"
}
}
button {
style : "font-size : 16px",
width : "150px",
margin_left : SMALL_BUTTONS_MARGIN.to_string() + "px",
margin_right : SMALL_BUTTONS_MARGIN.to_string() + "px",
onclick : move |_| {
info!("Selected PLACEHOLDER");
},
b {
"PLACEHOLDER"
}
}
}
br {}
div {
display : "flex",
justify_content: "space-between",
width : total_width.to_string() + "px",
button {
style : "font-size : 30px",
width : "250px",
onclick : move |_| {
info!("Selected Software ARM");
},
b {
"Software ARM"
}
}
button {
style : "font-size : 30px",
width : "250px",
onclick : move |_| {
info!("Selected Start Mission");
},
b {
"Start Mission"
}
}
button {
style : "font-size : 30px",
width : "250px",
onclick : move |_| {
info!("Selected Return/Exit");
},
b {
"Return/Exit"
}
}
}
}
}
}
}

0 comments on commit 83d91bd

Please sign in to comment.