diff --git a/.gitignore b/.gitignore index 48aed118..1d09522c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,2 @@ *.sublime* -/docs/*.d.ts /target diff --git a/build.sh b/build.sh index 023e9e8a..3c80f6cd 100755 --- a/build.sh +++ b/build.sh @@ -7,16 +7,10 @@ if ! [[ $(wasm-bindgen --version) ]]; then cargo install -f wasm-bindgen-cli fi -if ! [[ -f docs/webassembly.d.ts ]]; then - curl https://raw.githubusercontent.com/01alchemist/webassembly-types/master/webassembly.d.ts > docs/webassembly.d.ts -fi - BUILD=debug # BUILD=release # Clear output from old stuff: -# rm -rf docs/*.d.ts -rm -rf docs/*.js rm -rf docs/*.wasm function build_rust @@ -28,15 +22,8 @@ function build_rust FOLDER_NAME=${PWD##*/} TARGET_NAME="emgui_wasm.wasm" wasm-bindgen "target/wasm32-unknown-unknown/$BUILD/$TARGET_NAME" \ - --out-dir docs --no-modules + --out-dir docs --no-modules --no-typescript # --no-modules-global hoboho } build_rust - -echo "Compile typescript:" -tsc - -# wait || exit $? - -# 3.4 s diff --git a/docs/emgui_wasm_bg.wasm b/docs/emgui_wasm_bg.wasm index 4aa49673..e9e901a6 100644 Binary files a/docs/emgui_wasm_bg.wasm and b/docs/emgui_wasm_bg.wasm differ diff --git a/docs/frontend.js b/docs/frontend.js deleted file mode 100644 index 9e92e013..00000000 --- a/docs/frontend.js +++ /dev/null @@ -1,86 +0,0 @@ -// we'll defer our execution until the wasm is ready to go -function wasm_loaded() { - console.log("wasm loaded"); - initialize(); -} -// here we tell bindgen the path to the wasm file so it can start -// initialization and return to us a promise when it's done -wasm_bindgen("./emgui_wasm_bg.wasm") - .then(wasm_loaded)["catch"](console.error); -// ---------------------------------------------------------------------------- -var g_webgl_painter = null; -function paint_gui(canvas, input) { - if (g_webgl_painter === null) { - g_webgl_painter = wasm_bindgen.new_webgl_painter("canvas"); - } - wasm_bindgen.paint_webgl(g_webgl_painter, JSON.stringify(input)); -} -// ---------------------------------------------------------------------------- -var g_mouse_pos = { x: -1000.0, y: -1000.0 }; -var g_mouse_down = false; -function auto_resize_canvas(canvas) { - if (true) { - canvas.setAttribute("width", window.innerWidth); - canvas.setAttribute("height", window.innerHeight); - } - else { - // TODO: this stuff - var pixels_per_point = window.devicePixelRatio || 1; - var ctx = canvas.getContext("2d"); - ctx.scale(pixels_per_point, pixels_per_point); - canvas.setAttribute("width", window.innerWidth * pixels_per_point); - canvas.setAttribute("height", window.innerHeight * pixels_per_point); - } -} -function get_input(canvas) { - return { - mouse_down: g_mouse_down, - mouse_pos: g_mouse_pos, - screen_size: { x: canvas.width, y: canvas.height } - }; -} -function mouse_pos_from_event(canvas, event) { - var rect = canvas.getBoundingClientRect(); - return { - x: event.clientX - rect.left, - y: event.clientY - rect.top - }; -} -function initialize() { - console.log("window.devicePixelRatio: " + window.devicePixelRatio); - var canvas = document.getElementById("canvas"); - auto_resize_canvas(canvas); - var repaint = function () { return paint_gui(canvas, get_input(canvas)); }; - canvas.addEventListener("mousemove", function (event) { - g_mouse_pos = mouse_pos_from_event(canvas, event); - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - canvas.addEventListener("mouseleave", function (event) { - g_mouse_pos = { x: -1000.0, y: -1000.0 }; - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - canvas.addEventListener("mousedown", function (event) { - g_mouse_pos = mouse_pos_from_event(canvas, event); - g_mouse_down = true; - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - canvas.addEventListener("mouseup", function (event) { - g_mouse_pos = mouse_pos_from_event(canvas, event); - g_mouse_down = false; - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - window.addEventListener("load", repaint); - window.addEventListener("pagehide", repaint); - window.addEventListener("pageshow", repaint); - window.addEventListener("resize", repaint); - // setInterval(repaint, 16); - repaint(); -} diff --git a/docs/frontend.ts b/docs/frontend.ts deleted file mode 100644 index 09fe4ccc..00000000 --- a/docs/frontend.ts +++ /dev/null @@ -1,128 +0,0 @@ -interface Vec2 { - x: number; - y: number; -} - -/// What the integration gives to the gui. -interface RawInput { - /// Is the button currently down? - mouse_down: boolean; - - /// Current position of the mouse in points. - mouse_pos: Vec2; - - /// Size of the screen in points. - screen_size: Vec2; -} - -// ---------------------------------------------------------------------------- - -// the `wasm_bindgen` global is set to the exports of the Rust module. Override with wasm-bindgen --no-modules-global -declare var wasm_bindgen: any; - -// we'll defer our execution until the wasm is ready to go -function wasm_loaded() { - console.log(`wasm loaded`); - initialize(); -} - -// here we tell bindgen the path to the wasm file so it can start -// initialization and return to us a promise when it's done -wasm_bindgen("./emgui_wasm_bg.wasm") - .then(wasm_loaded) - .catch(console.error); - -// ---------------------------------------------------------------------------- - -let g_webgl_painter = null; - -function paint_gui(canvas, input: RawInput) { - if (g_webgl_painter === null) { - g_webgl_painter = wasm_bindgen.new_webgl_painter("canvas"); - } - wasm_bindgen.paint_webgl(g_webgl_painter, JSON.stringify(input)); -} - -// ---------------------------------------------------------------------------- - -let g_mouse_pos = { x: -1000.0, y: -1000.0 }; -let g_mouse_down = false; - -function auto_resize_canvas(canvas) { - if (true) { - canvas.setAttribute("width", window.innerWidth); - canvas.setAttribute("height", window.innerHeight); - } else { - // TODO: this stuff - const pixels_per_point = window.devicePixelRatio || 1; - - const ctx = canvas.getContext("2d"); - ctx.scale(pixels_per_point, pixels_per_point); - - canvas.setAttribute("width", window.innerWidth * pixels_per_point); - canvas.setAttribute("height", window.innerHeight * pixels_per_point); - } -} - -function get_input(canvas): RawInput { - return { - mouse_down: g_mouse_down, - mouse_pos: g_mouse_pos, - screen_size: { x: canvas.width, y: canvas.height }, - }; -} - -function mouse_pos_from_event(canvas, event): Vec2 { - const rect = canvas.getBoundingClientRect(); - return { - x: event.clientX - rect.left, - y: event.clientY - rect.top, - }; -} - -function initialize() { - console.log(`window.devicePixelRatio: ${window.devicePixelRatio}`); - - const canvas = document.getElementById("canvas"); - auto_resize_canvas(canvas); - const repaint = () => paint_gui(canvas, get_input(canvas)); - - canvas.addEventListener("mousemove", event => { - g_mouse_pos = mouse_pos_from_event(canvas, event); - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - - canvas.addEventListener("mouseleave", event => { - g_mouse_pos = { x: -1000.0, y: -1000.0 }; - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - - canvas.addEventListener("mousedown", event => { - g_mouse_pos = mouse_pos_from_event(canvas, event); - g_mouse_down = true; - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - - canvas.addEventListener("mouseup", event => { - g_mouse_pos = mouse_pos_from_event(canvas, event); - g_mouse_down = false; - repaint(); - event.stopPropagation(); - event.preventDefault(); - }); - - window.addEventListener("load", repaint); - window.addEventListener("pagehide", repaint); - window.addEventListener("pageshow", repaint); - window.addEventListener("resize", repaint); - - // setInterval(repaint, 16); - - repaint(); -} diff --git a/docs/index.html b/docs/index.html index 27cc38ec..18f2d6b4 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1,42 +1,136 @@ - - - Emgui – A experiment in an Immediate Mode GUI written in Rust + + + Emgui – A experiment in an Immediate Mode GUI written in Rust - - - + } + body { + background: #000000; + } + + html, + body { + overflow: hidden; + } + + + + + + + function paint_gui(canvas, input) { + if (g_webgl_painter === null) { + g_webgl_painter = wasm_bindgen.new_webgl_painter("canvas"); + } + wasm_bindgen.paint_webgl(g_webgl_painter, JSON.stringify(input)); + } + // ---------------------------------------------------------------------------- + var g_mouse_pos = { x: -1000.0, y: -1000.0 }; + var g_mouse_down = false; + function auto_resize_canvas(canvas) { + // TODO: figure out why this isn't quite working. + if (true) { + canvas.setAttribute("width", window.innerWidth); + canvas.setAttribute("height", window.innerHeight); + } else { + // TODO: this stuff + var pixels_per_point = window.devicePixelRatio || 1; + canvas.setAttribute("width", window.innerWidth * pixels_per_point); + canvas.setAttribute("height", window.innerHeight * pixels_per_point); + } + } + + function get_input(canvas) { + return { + mouse_down: g_mouse_down, + mouse_pos: g_mouse_pos, + screen_size: { x: canvas.width, y: canvas.height } + }; + } + + function mouse_pos_from_event(canvas, event) { + var rect = canvas.getBoundingClientRect(); + return { + x: event.clientX - rect.left, + y: event.clientY - rect.top + }; + } + + function initialize() { + console.log("window.devicePixelRatio: " + window.devicePixelRatio); + var canvas = document.getElementById("canvas"); + var repaint = function() { + auto_resize_canvas(canvas); + paint_gui(canvas, get_input(canvas)); + }; + canvas.addEventListener("mousemove", function(event) { + g_mouse_pos = mouse_pos_from_event(canvas, event); + repaint(); + event.stopPropagation(); + event.preventDefault(); + }); + canvas.addEventListener("mouseleave", function(event) { + g_mouse_pos = { x: -1000.0, y: -1000.0 }; + repaint(); + event.stopPropagation(); + event.preventDefault(); + }); + canvas.addEventListener("mousedown", function(event) { + g_mouse_pos = mouse_pos_from_event(canvas, event); + g_mouse_down = true; + repaint(); + event.stopPropagation(); + event.preventDefault(); + }); + canvas.addEventListener("mouseup", function(event) { + g_mouse_pos = mouse_pos_from_event(canvas, event); + g_mouse_down = false; + repaint(); + event.stopPropagation(); + event.preventDefault(); + }); + window.addEventListener("load", repaint); + window.addEventListener("pagehide", repaint); + window.addEventListener("pageshow", repaint); + window.addEventListener("resize", repaint); + // setInterval(repaint, 16); + repaint(); + } + - + + diff --git a/emgui/src/font.rs b/emgui/src/font.rs index 55618ad1..eb21f0ed 100644 --- a/emgui/src/font.rs +++ b/emgui/src/font.rs @@ -5,19 +5,13 @@ use rusttype::{point, Scale}; #[derive(Clone, Copy, Debug, PartialEq)] pub struct UvRect { /// X/Y offset for nice rendering - pub offset_x: i16, + pub offset: (i16, i16), - /// Y offset for nice rendering - pub offset_y: i16, - - pub min_x: u16, - pub min_y: u16, - - /// Inclusive. - pub max_x: u16, + /// Top left corner. + pub min: (u16, u16), /// Inclusive - pub max_y: u16, + pub max: (u16, u16), } #[derive(Clone, Copy, Debug, PartialEq)] @@ -50,8 +44,10 @@ pub struct Font { impl Font { pub fn new(scale: usize) -> Font { + // TODO: figure out a way to make the wasm smaller despite including a font. // let font_data = include_bytes!("../fonts/ProggyClean.ttf"); // Use 13 for this. NOTHING ELSE. - let font_data = include_bytes!("../fonts/DejaVuSans.ttf"); // 20 works nicely for this. + // let font_data = include_bytes!("../fonts/DejaVuSans.ttf"); + let font_data = include_bytes!("../fonts/Roboto-Regular.ttf"); let font = rusttype::Font::from_bytes(font_data as &[u8]).expect("Error constructing Font"); // println!( @@ -125,12 +121,12 @@ impl Font { id: glyph.id(), advance_width: glyph.unpositioned().h_metrics().advance_width, uv: Some(UvRect { - offset_x: bb.min.x as i16, - offset_y: offset_y as i16, - min_x: cursor_x as u16, - min_y: cursor_y as u16, - max_x: (cursor_x + glyph_width - 1) as u16, - max_y: (cursor_y + glyph_height - 1) as u16, + offset: (bb.min.x as i16, offset_y as i16), + min: (cursor_x as u16, cursor_y as u16), + max: ( + (cursor_x + glyph_width - 1) as u16, + (cursor_y + glyph_height - 1) as u16, + ), }), }); @@ -250,11 +246,11 @@ impl Font { cursor_x = 0.0; } if let Some(uv) = glyph.uv { - for x in uv.min_x..=uv.max_x { - for y in uv.min_y..=uv.max_y { + for x in uv.min.0..=uv.max.0 { + for y in uv.min.1..=uv.max.1 { let pixel = self.pixel(x as u16, y as u16); - let rx = uv.offset_x + x as i16 - uv.min_x as i16; - let ry = uv.offset_y + y as i16 - uv.min_y as i16; + let rx = uv.offset.0 + x as i16 - uv.min.0 as i16; + let ry = uv.offset.1 + y as i16 - uv.min.1 as i16; let px = (cursor_x + rx as f32).round(); let py = cursor_y + ry; if 0.0 <= px && 0 <= py { diff --git a/emgui/src/painter.rs b/emgui/src/painter.rs index 0d524e1f..8f68c78c 100644 --- a/emgui/src/painter.rs +++ b/emgui/src/painter.rs @@ -349,10 +349,10 @@ impl Painter { let mut top_left = Vertex { pos: *pos + vec2( - x_offset + (glyph.offset_x as f32), - glyph.offset_y as f32, + x_offset + (glyph.offset.0 as f32), + glyph.offset.1 as f32, ), - uv: (glyph.min_x, glyph.min_y), + uv: (glyph.min.0, glyph.min.1), color: *color, }; top_left.pos.x = top_left.pos.x.round(); // Pixel-perfection. @@ -360,10 +360,10 @@ impl Painter { let bottom_right = Vertex { pos: top_left.pos + vec2( - (1 + glyph.max_x - glyph.min_x) as f32, - (1 + glyph.max_y - glyph.min_y) as f32, + (1 + glyph.max.0 - glyph.min.0) as f32, + (1 + glyph.max.1 - glyph.min.1) as f32, ), - uv: (glyph.max_x + 1, glyph.max_y + 1), + uv: (glyph.max.0 + 1, glyph.max.1 + 1), color: *color, }; frame.add_rect(top_left, bottom_right); diff --git a/emgui_wasm/src/lib.rs b/emgui_wasm/src/lib.rs index 0e9db165..71ab334d 100644 --- a/emgui_wasm/src/lib.rs +++ b/emgui_wasm/src/lib.rs @@ -3,7 +3,6 @@ extern crate lazy_static; extern crate serde_json; extern crate wasm_bindgen; -// extern crate web_sys; extern crate emgui; @@ -16,32 +15,6 @@ use wasm_bindgen::prelude::*; mod app; mod webgl; -// #[wasm_bindgen] -// pub fn show_gui(raw_input_json: &str) -> String { -// // TODO: faster interface than JSON -// let raw_input: RawInput = serde_json::from_str(raw_input_json).unwrap(); - -// lazy_static::lazy_static! { -// static ref APP: Mutex = Default::default(); -// static ref EMGUI: Mutex = Default::default(); -// } - -// let mut emgui = EMGUI.lock().unwrap(); -// emgui.new_frame(raw_input); - -// use crate::app::GuiSettings; -// APP.lock().unwrap().show_gui(&mut emgui.layout); - -// let mut style = emgui.style.clone(); -// emgui.layout.foldable("Style", |gui| { -// style.show_gui(gui); -// }); -// emgui.style = style; - -// let commands = emgui.paint(); -// serde_json::to_string(&commands).unwrap() -// } - fn font() -> Font { Font::new(20) // TODO: don't create this multiple times } diff --git a/lint.sh b/lint.sh index c6b68d02..c5111917 100755 --- a/lint.sh +++ b/lint.sh @@ -1,8 +1,5 @@ #!/bin/bash set -eu -echo "Lint and clean up typescript:" -tslint --fix docs/*.ts - echo "Cargo clippy" cargo clippy diff --git a/tsconfig.json b/tsconfig.json deleted file mode 100644 index 1683d98e..00000000 --- a/tsconfig.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "compilerOptions": { - "module": "es2015", - }, - "include": [ - "docs/**/*" - ] -} diff --git a/tslint.json b/tslint.json deleted file mode 100644 index 1bab9e3f..00000000 --- a/tslint.json +++ /dev/null @@ -1,14 +0,0 @@ -{ - "defaultSeverity": "error", - "extends": ["tslint:recommended"], - "jsRules": {}, - "rules": { - "arrow-parens": [true, "ban-single-arg-parens"], - "interface-name": [true, "never-prefix"], - "max-classes-per-file": [false], - "no-bitwise": false, - "no-console": false, - "variable-name": false - }, - "rulesDirectory": [] -}