gui

Makefile

@@ -57,7 +57,7 @@ ifeq ($(DBG), 1)
 endif
 
 edirs += source/engine $(addprefix source/engine/, $(subengs)) source/engine/thirdparty/Nuklear
-ehead != find source/engine source/engine/sound source/engine/debug source/engine/editor -maxdepth 1 -type f -name *.h
+ehead != find source/engine source/engine/sound source/engine/debug -maxdepth 1 -type f -name *.h
 eobjects != find source/engine -type f -name '*.c' | sed -r 's|^(.*)\.c|$(objprefix)/\1.o|'  # Gets all .c files and makes .o refs
 eobjects != $(call rm,$(eobjects),sqlite pl_mpeg_extract_frames pl_mpeg_player yugine nuklear)
 

source/engine/ffi.c

@@ -1042,7 +1042,6 @@ JSValue duk_cmd(JSContext *js, JSValueConst this, int argc, JSValueConst *argv)
       str = JS_ToCString(js,argv[1]);
       return bb2js(text_bb(str, js2number(argv[2]), js2number(argv[3]), 1.0));
       break;
-    
   }
 
   if (str)

source/scripts/base.js

@@ -318,6 +318,11 @@ Object.defineProperty(Array.prototype, 'apply', {
 
 Object.defineProperty(Array.prototype, 'scale', {
   value: function(s) {
+    if (Array.isArray(s)) {
+      var c = this.slice();
+      c.forEach(function(x,i) { c[i] = x * s[i]; });
+      return c;
+    }
     return this.map(function(x) { return x*s; });
 }});
 

source/scripts/engine.js

@@ -134,6 +134,10 @@ var Color = {
   gray: [181, 181,181,255],
 };
 
+function bb2wh(bb) {
+  return [bb.r-bb.l, bb.t-bb.b];
+};
+
 var GUI = {
   text(str, pos, size, color, wrap) {
     size = size ? size : 1;
@@ -158,14 +162,86 @@ var GUI = {
     return cwh2bb([0,0], wh);
   },
 
-  column(items,pos, defn) {
+  nodrawbb: {
-    defn ??= {};
+    draw() { return cwh2bb([0,0],[0,0]); }
-    defn.padding ??= 5;
+  },
-    items.forEach(function(item) {
+
-      let bb = item(pos);
+  image_fn(defn) {
-      pos.y += bb.b;
+    var def = Object.create(this.defaults);
-      pos.y -= defn.padding*2;
+    Object.assign(def,defn);
+
+    if (!def.path) {
+      Log.warn("GUI image needs a path.");
+      return GUI.nodrawbb;
+    }
+
+    return {
+      draw(pos) {
+        var wh = cmd(64,def.path);
+        gui_img(def.path, pos, def.scale, def.angle);
+	this.bb = cwh2bb([0,0],wh);
+      }
+    };
+  },
+
+  defaults: {
+    padding:[0,0],
+    font: "fonts/LessPerfectDOSVGA.ttf",
+    font_size: 1,
+    text_align: "left",
+    scale: 1,
+    angle: 0,
+    anchor: [0,0],
+    text_shadow: {
+      pos: [0,0],
+      color: [255,255,255,255]
+    },
+    text_outline: 1, /* outline in pixels */
+    color: [255,255,255,255],
+    margin: [5,5],
+    width: 0,
+    height: 0,
+  },
+
+  text_fn(str, defn)
+  {
+    var def = Object.create(this.defaults);
+    Object.assign(def,defn);
+
+    return {
+      draw: function(cursor) {
+        var wh = bb2wh(cmd(118,str,def.font_size,def.width));
+	var pos = cursor.sub(wh.scale(def.anchor));
+        ui_text(str, pos, def.font_size, def.color, def.width);
+	this.bb = cwh2bb(pos,wh);
+	return cwh2bb(pos,wh);
+      }
+    };
+  },
+
+  button_fn(str, cb, defn) {
+    
+  },
+
+  column(defn) {
+    var def = Object.create(this.defaults);
+    Object.assign(def,defn);
+
+    if (!def.items) {
+      Log.warn("Columns needs items.");
+      return GUI.nodrawbb;
+    };
+
+    def.draw = function(pos) {
+        def.items.forEach(function(item) {
+	  item.draw(pos);
+          var wh = bb2wh(item.bb);
+          pos.y -= wh.y;
+          pos.y -= def.padding.x*2;
         });
+    };
+
+    return def;
   },
 };