Widgets for NTK

[aurium]

What about depending on Zebra to define interactive window elements and structure? I mean by default, as a feature.

[sidorares]

Interesting. Need to figure out how easy is to use components from Zebra without DOM.
Also canvas is very partially implemented here ntk

[RossComputerGuy]

I can integrate the widget code from my desktop environment's toolkit.

[sidorares]

@SpaceboyRoss01 what toolkit is that?

[RossComputerGuy]

Well, I finished writing a widget class. I haven't fully written it https://github.com/Ross-Technologies/RDE-Toolkit.

const EventEmitter = require("events");

function isMouseInWidget(w,ev) {
	ev.x -= w.x;
	ev.y -= w.y;
	return (ev.x >= 0 && ev.x < w.width) && (ev.y >= 0 && ev.y < w.height);
}

class Widget extends EventEmitter {
	constructor(window,opts={}) {
		super();
		this.window = window;
		this.widgets = {};
		
		this.width = opts.width || 0;
		this.height = opts.height || 0;
		this.x = opts.x || 0;
		this.y = opts.y || 0;
		this.id = opts.id || null;
		this.active = false;
		
		this.windows.on("keydown",ev => {
			if(this.active) this.emit("keydown",ev);
		});
		
		this.windows.on("keyup",ev => {
			if(this.active) this.emit("keyup",ev);
		});
		
		this.windows.on("mousedown",ev => {
			if(isMouseInWidget(this,ev)) {
				ev.x -= this.x;
				ev.y -= this.y;
				this.emit("mousedown",ev);
			}
		});
		
		this.windows.on("mouseup",ev => {
			if(isMouseInWidget(this,ev)) {
				ev.x -= this.x;
				ev.y -= this.y;
				this.emit("mouseup",ev);
			}
		});
		
		this.windows.on("mousemove",ev => {
			if(isMouseInWidget(this,ev)) {
				ev.x -= this.x;
				ev.y -= this.y;
				this.emit("mousemove",ev);
			}
		});
		
		this.windows.on("mouseover",ev => {
			if(isMouseInWidget(this,ev)) {
				ev.x -= this.x;
				ev.y -= this.y;
				this.emit("mouseover",ev);
			}
		});
		
		this.windows.on("mouseout",ev => {
			if(isMouseInWidget(this,ev)) {
				ev.x -= this.x;
				ev.y -= this.y;
				this.emit("mouseout",ev);
			}
		});
	}
	findWidgetByID(id) {
		for(var wID in this.widgets) {
			if(wID == id) return this.widgets[wID];
		}
	}
	render() {
		// Render this widget before the child widgets
		this.emit("render");
		for(var wID in this.widgets) this.widgets[wID].render();
	}
}
module.exports = Widget;

[RossComputerGuy]

In a fork I made (https://github.com/Ross-Technologies/ntk) I added widgets.

[sidorares]

thanks, I'll have a look